/***** 固定メニュー *****/

.navi ul .fixation a {
	color: #00a0e9;
	font-weight: bold;
	text-shadow: 0.1vw 0.1vw 0.1vw #f0f0f0;
	}

.navi ul .fixation a::before {
	transform-origin: center top;
	transform: scale(1, 1);
  	}

/***** 見出し文字サイズなど(格共通) *****/

h2 {
    font-size: 4vw;
    text-shadow: 0.2vw 0.2vw 0.1vw #fff;
    }

/***** メインコンテンツ *****/

main {
	width: 100vw;
	height: auto;
	margin-top: 7vw;
    margin-bottom: 10vw;
	padding: 0;
	letter-spacing: 0.2vw;
	display: flex;
	flex-direction: column;
    justify-content: center;
	align-items: center;
	}

.title {
    aspect-ratio: 3/1;
    width: 100%;
    height: auto;
    margin-bottom: 10vw;
    background: url(../image/rehabilitation_program/gakusyu.webp) no-repeat;
    background-size: contain;
    display: flex;
    justify-content: center;
    align-items: center;
    }

.title div {
    box-sizing: border-box;
    width: 90%;
    height: 70%;
    background: rgba(255,255,255,0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    }

section {
    width: 90%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    }

.active {
    margin: 10vw 0;
    border-radius: 2vw;
    box-sizing: border-box;
    padding: 3vw;
    background: rgb(255, 255, 255, 0.8);
    }

.active div {
    width: 100%;
	height: auto;
	padding: 1vw 5vw 5vw 5vw;
	box-sizing: border-box;
	border: solid 0.5vw #ffe100;
	border-radius: 2vw;
    background: url(../image/share/context_top.webp) top 13vw center no-repeat, url(../image/share/context_bottom.webp) bottom 3vw center no-repeat;
    background-size: 90% auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
    }

h3 {
    width: 65%;
    height: 10vw;
    margin: 1% 0;
    background: url(../image/share/star.webp) right / auto 100% no-repeat;
    filter: drop-shadow( 0.3vw 0.3vw 0.2vw #c0c0c0);
    font-size: 3.5vw;
	font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    }


.active div p {
    box-sizing: border-box;
    color: #fff;
    width: 90%;
    height: auto;
    margin: 7% 0;
    padding: 3% 3%;
    background: #00a0e9;
    border-radius: 2vw;
    font-size: 1.2vw;
    font-weight: bold;
    line-height: 3vw;
    text-align: center;
    }

article {
    box-sizing: border-box;
    width: 90%;
    height: auto;
    margin: 10vw 0;
    background: rgb(255, 255, 255, 0.8);
    border-radius: 2vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    }

hgroup {
    box-sizing: border-box;
    width: 90%;
    height: 20vw;
    background: url(../image/rehabilitation_program/tree.webp) bottom / auto 20% repeat-x,url(../image/rehabilitation_program/rainbow.webp) center / auto 100% no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    }

hgroup div {
    width: 50%;
    height: auto;
    padding: 1% 2%;
    background: rgba(255,255,255,0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    } 

hgroup h4 {
    box-sizing: border-box;
    width: 100%;
    height: 7vw;
    background: url(../image/rehabilitation_program/boy.webp) left no-repeat, url(../image/rehabilitation_program/girl.webp) right no-repeat;
    background-size: contain;
    font-size: 3vw;
	font-weight: bold;
    text-shadow: 0.3vw 0.3vw 0.2vw #c0c0c0;
    display: flex;
    justify-content: center;
    align-items: center;
    }

article section {
    width: 90%;
    height: auto;
    margin: 3vw 0;
    background: #fff;
    border-radius: 2vw;
    }

.wallpaper {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    padding: 2%;
    border-radius: 2vw;
    }

article section h5 {
    width: 90%;
    height: auto;
    margin: 5% 0;
    font-size: 2.5vw;
	font-weight: bold;
    }

article section h5:first-letter {
    font-size: 5vw;
    }

article section div {
    box-sizing: border-box;
    width: 90%;
    height: auto;
    padding: 2%;
    display: flex;
    flex-direction: column;
    align-items: center;
    }

article section div h6 {
    width: 100%;
    height: auto;
    margin: 2% 0;
    font-size: 1.5vw;
    font-weight: bold;
    }

article section div p {
    box-sizing: border-box;
    width: 98%;
    height: auto;
    padding: 1%;
    font-size: 1.2vw;
    line-height: 2.5vw;
    text-shadow: 0.1vw 0.1vw 0.1vw #fff;
    }

.back {
    box-sizing: border-box;
    width: 88%;
    height: auto;
    padding: 1%;
    font-size: 1.2vw;
    line-height: 2.5vw;
    text-shadow: 0.1vw 0.1vw 0.1vw #fff;
    }

.study {
    border: solid 1vw #e60012;
    }

.study h5:first-letter {
    color: #e60012;
    }

.study .wallpaper {
    background: url(../image/rehabilitation_program/lobo.webp) center right no-repeat;
    background-size: contain;
    background-size: 50% auto;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    }

.motion{
    border: solid 1vw #f39800;
    }

.motion h5:first-letter {
    color: #f39800;
    }

.motion .wallpaper {
    background: url(../image/rehabilitation_program/undo.webp) center right no-repeat;
    background-size: contain;
    background-size: 50% auto;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    }

.skill {
    border: solid 1vw #fff100;
    }

.skill h5:first-letter {
    color: #fff100;
    }

.skill .wallpaper {
    background: url(../image/rehabilitation_program/sorshyal.webp) center right no-repeat;
    background-size: contain;
    background-size: 50% auto;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    }

.music {
    border: solid 1vw #009944;
    }

.music h5:first-letter {
    color: #009944;
    }

.music .wallpaper {
    background: url(../image/rehabilitation_program/ongaku.webp) center right no-repeat;
    background-size: contain;
    background-size: 50% auto;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    }

.cooking {
    border: solid 1vw #0068B7;
    }

.cooking h5:first-letter {
    color: #0068B7;
    }

.cooking .wallpaper {
    background: url(../image/rehabilitation_program/ryouri.webp) center right no-repeat;
    background-size: contain;
    background-size: 50% auto;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    }

.art {
    border: solid 1vw #1d2088;
    }

.art h5:first-letter {
    color: #1d2088;
    }

.art .wallpaper {
    background: url(../image/rehabilitation_program/lobo.webp) center right no-repeat;
    background-size: contain;
    background-size: 50% auto;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    }

.etc {
    border: solid 1vw #920783;
    }

.etc h5:first-letter {
    color: #920783;
    }

.etc .wallpaper {
    background: url(../image/rehabilitation_program/kuruma.webp) center right no-repeat;
    background-size: contain;
    background-size: 50% auto;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    }

aside {
    width: 90%;
    height: auto;
    margin: 10vw 0;
    background: rgb(255, 255, 255, 0.8);
    border-radius: 2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    }

.day {
    width: 90%;
    border-radius: 2vw;
    background: url(../image/rehabilitation_program/irasuto.webp) top 2% center no-repeat;
    background-size: 80% auto;
    }

.curriculum {
    width: 100%;
    height: 100%;
    margin: 5vw 0;
    background: url(../image/rehabilitation_program/kokuban.webp) center / 100% 100% no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    }

.day h4 {
    margin-top: 20vw;
    font-size: 3vw;
	font-weight: bold;
    }

.curriculum h5 {
    color: #fff;
    margin-top: 5vw;
    border-bottom: double 0.5vw pink;
    font-size: 2vw;
    text-align: center;
    }

.day h6 {
    color: #fff;
    margin: 5vw 0;
    padding-left: 3.5vw;
    font-size: 2vw;
    background: url(../image/rehabilitation_program/pen.webp) left no-repeat;
    background-size: auto 80%;
    }

.inside_a, .inside_b {
    box-sizing: border-box;
    width: 80%;
    height: auto;
    border-top: solid 0.2vw #fff;
    border-bottom: solid 0.2vw #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    }

.day dl {
    color: #fff;
    box-sizing: border-box;
    width: 90%;
    height: auto;
    padding: 5% 0;
    font-size: 1.2vw;
    font-weight: bold;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    }

.day dl dt {
    width: 35%;
    height: auto;
    padding: 2% 0;
    text-align: center;
    }

.day dl dd {
    width: 65%;
    height: auto;
    padding: 2% 0;
    }

.inside_a dl {
    background: url(../image/rehabilitation_program/tori.webp) bottom 10% right 5% no-repeat;
    background-size: contain;
    background-size: 35% auto;
    }

.inside_b dl {
    background: url(../image/rehabilitation_program/hana.webp) bottom 10% right 5% no-repeat;
    background-size: contain;
    background-size: 15% auto;
    }

.curriculum p {
    width: 80%;
    height: 15vw;
    margin-bottom: 5vw;
    color: #fff;
    font-size: 1.2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    }



@media (max-width: 960px){



    /***** 見出し文字サイズなど(格共通) *****/

    h2 {
        font-size: 6vw;
        text-shadow: 0.5vw 0.5vw 0.1vw #fff;
        }

    /***** メインコンテンツ *****/

    main {
        margin-top: 0;
        }

    section {
        width: 96%;
        }

    h3 {
        width: 75%;
        background: url(../image/share/star.webp) right / 20% auto no-repeat;
        font-size: 5vw;
        }


    .active div p {
        width: 98%;
        font-size: 3vw;
        font-weight: normal;
        line-height: 5.5vw;
        text-align: left;
        }

    article {
        width: 96%;
        }

    hgroup div {
        width: 65%;
        } 

    hgroup h4 {
        font-size: 4.5vw;
        }

    article section h5 {
        font-size: 4vw;
        }

    article section h5:first-letter {
        font-size: 7vw;
        }

    article section div h6 {
        font-size: 3.5vw;
        }

    article section div p {
        font-size: 3vw;
        line-height: 5.2vw;
        }

    .back {
        font-size: 3vw;
        line-height: 5.2vw;
        }

    aside {
        width: 96%;
        }

    .day {
        width: 96%;
        }

    .curriculum {
        background: url(../image/rehabilitation_program/kokuban.webp) center / 100% 100% no-repeat;
        }

    .day h4 {
        font-size: 4.5vw;
        }

    .curriculum h5 {
        margin-top: 10vw;
        border-bottom: double 1vw pink;
        font-size: 4vw;
        }

    .day h6 {
        padding-left: 5vw;
        font-size: 3.5vw;
        }

    .inside_a, .inside_b {
        width: 88%;
        }

    .day dl {
        width: 98%;
        }

    .day dl dt {
        width: 40%;
        font-size: 3vw;
        }

    .day dl dd {
        width: 60%;
        font-size: 3vw;
        }

    .curriculum p {
        width: 85%;
        height: auto;
        margin: 5vw 0 15vw 0;
        font-size: 3vw;
        }
}