@charset "utf-8";

/*------------------------------------------------------------------------------
Css name: content.css
Css info: コンテンツスタイル
------------------------------------------------------------------------------*/
/*//////////////////////////////////////////////////////// */
/* 共通-------------*/
/*//////////////////////////////////////////////////////// */
@media screen and (max-width:559px){/*スマホ用指定*/
br.pc{
    display: none;
    }
span.pc{    /* 2025.07.14 add */
    display: none;
    }
}
@media print, screen and (min-width:560px){/*PC・タブレット用指定*/
br.sp{
    display: none;
    }
span.sp{    /* 2025.07.14 add */
    display: none;
    }
}


/*スクロールフェードインアニメーションの指定*/
.scrollanime {opacity: 0;} /*一瞬表示されるのを防ぐ*/
.fade_on {
    animation-name: fade_on;
    animation-duration: 2s;
    animation-fill-mode: forwards;
}
@keyframes fade_on {
    0% {
        opacity: 0; 
        -webkit-transition: all 1s;
        -moz-transition: all 1s;
        -o-transition: all 1s;
        -ms-transition: all 1s;
        transition: all 1s;        
        }
    100% {
        opacity: 1;
        -webkit-transition: all 1s;
        -moz-transition: all 1s;
        -o-transition: all 1s;
        -ms-transition: all 1s;
        transition: all 1s;      
        transform: translate(0);
        }
}
 
/*上下の動きを指定*/
.updown {transform: translateY(-50px);}
.downup {transform: translateY(50px);}
 
/*左右の動きを指定*/
.sect02{overflow: hidden;} /*横スクロールバーを隠す*/
.slide-right {transform: translateX(50px);}
.slide-left {transform: translateX(-50px);}


/*フェードインアニメーションの指定*/
.fadeinanime{
    animation-name: fadeInAnime;
    animation-duration: 5s;
    animation-fill-mode:forwards;
    opacity:0;
    }
@keyframes fadeInAnime {
    0% {
        opacity: 0; 
        -webkit-transition: all 1s ease-in;
        -moz-transition: all 1s ease-in;
        -o-transition: all 1s ease-in;
        -ms-transition: all 1s ease-in;
        transition: all 1s ease-in;   
        }
    100% {
        opacity: 1;
        -webkit-transition: all 1s ease-in;
        -moz-transition: all 1s ease-in;
        -o-transition: all 1s ease-in;
        -ms-transition: all 1s ease-in;
        transition: all 1s ease-in;   
        }
}


/*上下ふわふわアニメーションの指定*/
.fuwaanime{
    animation-name: fuwaAnime;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-duration: 1.5s;
}
@keyframes fuwaAnime {
    0% {
        transform: translate(0,0px) scale(0.95,0.95);
    }

    100% {
        transform: translate(0,-15px) scale(1,1);

    }
}


/* tableを横スクロール */
@media screen and (max-width:959px){/*スマホ・タブレット用指定*/
.scroll{
    overflow: auto; /*tableをスクロールさせる*/
    white-space: nowrap; /*tableのセル内にある文字の折り返しを禁止*/
    }
.scroll::-webkit-scrollbar{ /*tableにスクロールバーを追加*/
    height: 5px;
    }
.scroll::-webkit-scrollbar-track{ /*tableにスクロールバーを追加*/
    background: #F1F1F1;
    }
.scroll::-webkit-scrollbar-thumb { /*tableにスクロールバーを追加*/
    background: #BCBCBC;
    }   
.scroll:before{
    content:"スクロールします▶︎";
    color:#bf0d23;
    font-size:15px;
    }
.scroll:after{
    content:"スクロールします▶︎";
    color:#bf0d23;
    font-size:15px;
    }
.scroll table{
    width:200%;
    }
}

/*//////////////////////////////////////////////////////// */
/* team ------------*/
/*//////////////////////////////////////////////////////// */

/* team-box01
 ------------------------------------------------------------*/

#team-box01 img {
    max-width: 100%;
    width: 100%;
    height: auto;
    margin: 0;
}


/*//////////////////////////////////////////////////////// */
/* about ------------*/
/*//////////////////////////////////////////////////////// */

/* team-box01
 ------------------------------------------------------------*/

#about-box01 {
    margin-bottom: 100px;
}
#about-box01 img {
    max-width: 100%;
    width: 100%;
    height: auto;
    margin: 0;
}



/*//////////////////////////////////////////////////////// */
/* home ------------*/
/*//////////////////////////////////////////////////////// */

/* 共通 */
@media screen and (max-width:959px){/*スマホ・タブレット用指定*/

.home-box {
    box-sizing: border-box;
    padding:0 0;
    margin:0;
    position: relative;
    }
    .home-box-in {
        width:100%;
        box-sizing: border-box;
        padding:0 5%;
        margin:0;
        position:relative;
    }
}
@media print, screen and (min-width:960px){/*PC用指定*/

.home-box {
    box-sizing: border-box;
    padding:0 0;
    margin:0;
    position: relative;
    }
    .home-box-in {
        max-width:1280px;
        width:100%;
        box-sizing: border-box;
        padding:0 0;
        margin:0 auto;
        position: relative;
    }
}
@media print, screen and (min-width:960px){/*PC用指定*/

.home-box {
    box-sizing: border-box;
    padding:0 0;
    margin:0;
    position: relative;
    }
    .home-box-in {
        max-width:1280px;
        width:100%;
        box-sizing: border-box;
        padding:0 0;
        margin:0 auto;
        position: relative;
    }
}
@media print, screen and (min-width:960px){/*PC用指定*/

.home-box {
    box-sizing: border-box;
    padding:0 0;
    margin:0;
    position: relative;
    }
    .home-box-in {
        max-width:1280px;
        width:100%;
        box-sizing: border-box;
        padding:0 0;
        margin:0 auto;
        position: relative;
    }
}

/* home-box01
 ------------------------------------------------------------*/
#home-box01 .box-sec01 a {
    display: block;
    }
    #home-box01 .box-sec01 img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }
#home-box01 a:hover {
    opacity: 0.7;
    -ms-filter:"alpha(opacity=70)";
    -moz-opacity: 0.7;
}


/* home-box02
 ------------------------------------------------------------*/
 #home-box02 .box-sec01 {
    margin-top: 90px;
 }
#home-box02 .box-sec01 a {
    display: block;
    margin: 90px 0 0;
    }
    #home-box02 .box-sec01 img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }
#home-box02 a:hover {
    opacity: 0.7;
    -ms-filter:"alpha(opacity=70)";
    -moz-opacity: 0.7;
}


/* home-box03
 ------------------------------------------------------------*/
 #home-box03 .box-sec01 {
    margin-top: 90px;
 }
#home-box03 .box-sec01 a {
    display: block;
    margin: 90px 0 0;
    }
    #home-box03 .box-sec01 img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }
#home-box03 a:hover {
    opacity: 0.7;
    -ms-filter:"alpha(opacity=70)";
    -moz-opacity: 0.7;
}


/* home-box04
 ------------------------------------------------------------*/
 #home-box04 .box-sec01 {
    margin-top: 90px;
 }
#home-box04 .box-sec01 a {
    display: block;
    margin: 90px 0 0;
    }
    #home-box04 .box-sec01 img {
        max-width: 100%;
        width: 100%;
        height: auto;
    }
#home-box04 a:hover {
    opacity: 0.7;
    -ms-filter:"alpha(opacity=70)";
    -moz-opacity: 0.7;
}



/* home-box03
 ------------------------------------------------------------*/
 #home-box06 {
    background: #39aa99;
    padding: 70px 0;
 }
#home-box06 .box-sec01 ul,
#home-box06 .box-sec01 ul li {
    display: flex;
    justify-content: center;
}
    #home-box06 img {
        max-width: 80%;
        width: 200px;
        height: auto;
    }
#home-box06 .box-sec01 a:hover {
    opacity: 0.7;
    -ms-filter:"alpha(opacity=70)";
    -moz-opacity: 0.7;
}



/* home-box05 Information
 ------------------------------------------------------------*/
#home-box05 .content-box {
    padding: 48px 140px 100px;
    }
    #home-box05 .content-box .img-s1 {
        width: 345px;
        height: auto;
        margin: 0 0 54px;
    }
    #home-box05 .content-box a {
        text-decoration: none;
        color: #595757;
    }

@media screen and (max-width:959px){/*スマホ・タブレット用指定*/
    #home-box05 .content-box .lis-s1{
        margin:15px 10% 0 10%;
        }
        #home-box05 .content-box .lis-s1,  
        #home-box05 .content-box .lis-s1 dt{
            box-sizing: border-box;
            padding:0 0 5px 0;
            font-family: 'Noto Sans JP', sans-serif;
            font-weight:400;
            font-size: clamp(14px, 1.6vw, 16px);
            line-height:30px;
            text-align:left;
            border-bottom: ;
            color:#595757;
            position:relative;
            border-bottom: 20px;
            }
            #home-box05 .content-box .lis-s1 dt span.new{
                width:40px;
                height:40px;
                border-radius:50%;
                font-family: 'Noto Sans JP', sans-serif;
                font-weight:400;
                font-size: clamp(14px, 1.4vw, 14px);
                text-align:center;
                color:#ffffff;
                letter-spacing: 1px;
                background:#4fb21d;
                margin:0 10px 0 0;
                display:inline-flex;
                flex-flow: row nowrap;
                align-items:center;
                justify-content:center;
                border-bottom: 2px solid #39aa99;
                }
            #home-box05 .content-box .lis-s1 dt span.s0,
            #home-box05 .content-box .lis-s1 dt span.s1,
            #home-box05 .content-box .lis-s1 dt span.s2,
            #home-box05 .content-box .lis-s1 dt span.s3,
            #home-box05 .content-box .lis-s1 dt span.s4,
            #home-box05 .content-box .lis-s1 dt span.s5,
            #home-box05 .content-box .lis-s1 dt span.s6,
            #home-box05 .content-box .lis-s1 dt span.s7{
                display: inline-block;
                box-sizing: border-box;
                width:115px;
                height:25px;
                font-family: 'Noto Sans JP', sans-serif;
                font-weight:400;
                font-size: clamp(13px, 1.5vw, 15px);
                line-height: 25px;
                text-align:center;
                color:#ffffff;
                margin:0 0 0 15px;
                }
        #home-box05 .content-box .lis-s1 dd{
            padding:0 0 20px 0;
            font-family: 'Noto Sans JP', sans-serif;
            font-weight:400;
            font-size: clamp(14px, 1.6vw, 16px);
            line-height:30px;
            text-align:left;
            color:#231815;
            position: relative;
            z-index: 1;
            border-bottom: 2px solid #333;
            }
            #home-box05 .content-box .lis-s1 dd a{
                }
            #home-box05 .content-box .lis-s1 dd a:hover{
                text-decoration:underline;
                }
}
@media print, screen and (min-width:960px){/*PC用指定*/
    #home-box05 .content-box .lis-s1{
        max-width:1000px;
        margin:15px auto 30px auto;
        position: relative;
        z-index: 1;
        }
        #home-box05 .content-box .lis-s1 dt{
            clear:left;
            float:left;
            width:295px;
            box-sizing: border-box;
            padding:15px 0 15px 55px;
            font-family: 'Noto Sans JP', sans-serif;
            font-weight:400;
            font-size: clamp(14px, 1.6vw, 16px);
            line-height:30px;
            text-align:left;
            color:#595757;
            position:relative;
            border-bottom: 2px solid #39aa99;
            }
            #home-box05 .content-box .lis-s1 dt span.new{
                position:absolute;
                left:0;
                top:0;
                bottom:0;
                width:40px;
                height:40px;
                border-radius:50%;
                font-family: 'Noto Sans JP', sans-serif;
                font-weight:400;
                font-size: clamp(14px, 1.4vw, 14px);
                text-align:center;
                color:#ffffff;
                letter-spacing: 1px;
                background:#4fb21d;
                margin:auto;
                display: flex;
                flex-flow: row nowrap;
                align-items:center;
                justify-content:center;
                }
            #home-box05 .content-box .lis-s1 dt span.s0,
            #home-box05 .content-box .lis-s1 dt span.s1,
            #home-box05 .content-box .lis-s1 dt span.s2,
            #home-box05 .content-box .lis-s1 dt span.s3,
            #home-box05 .content-box .lis-s1 dt span.s4,
            #home-box05 .content-box .lis-s1 dt span.s5,
            #home-box05 .content-box .lis-s1 dt span.s6,
            #home-box05 .content-box .lis-s1 dt span.s7{
                display: inline-block;
                box-sizing: border-box;
                width:125px;
                height:30px;
                font-family: 'Noto Sans JP', sans-serif;
                font-weight:400;
                font-size: clamp(13px, 1.5vw, 15px);
                line-height: 30px;
                text-align:center;
                color:#ffffff;
                margin:0 0 0 15px;
                }
        #home-box05 .content-box .lis-s1 dd{
            padding:15px 0 15px 295px;
            font-family: 'Noto Sans JP', sans-serif;
            font-weight:400;
            font-size: clamp(14px, 1.6vw, 16px);
            line-height:32px;
            text-align:left;
            border-bottom: 2px solid #cccccc;
            }
            #home-box05 .content-box .lis-s1 dd a{
                text-decoration:none;
                }
            #home-box05 .content-box .lis-s1 dd a:hover{
                text-decoration:underline;
                }
}
                #home-box05 .content-box .lis-s1 dt span.s0{    /*重要*/
                    background:#bb2244;
                    }
                #home-box05 .content-box .lis-s1 dt span.s2{    /*ニュース*/
                    background:#79cea5;
                    }
                #home-box05 .content-box .lis-s1 dt span.s3{    /*ワークショップ*/
                    background:#2e8dc6;
                    }
                #home-box05 .content-box .lis-s1 dt span.s4{    /*募集のお知らせ*/
                    background:#ff8b86;
                    }
                #home-box05 .content-box .lis-s1 dt span.s5{    /*活動実績*/
                    background:#c791d6;
                    }
                #home-box05 .content-box .lis-s1 dt span.s6{    /*見学会・説明会*/
                    background:#e4902f;
                    }
                #home-box05 .content-box .lis-s1 dt span.s7{    /*研究・発表*/
                    background:#00bfff;
                    }


@media screen and (max-width:959px){/*スマホ・タブレット用指定*/
    #home-box05 .content-box .btn-s1{
        max-width:250px;
        margin:50 auto 40;
        position: relative;
        z-index: 1;
        }
        #home-box05 .content-box .btn-s1 a{
            max-width:250px;
            width:100%;
            height:60px;
            box-sizing: border-box;
            background: linear-gradient(to right,#5e8d38, #00592f);
            border-radius: 30px;
            font-family: 'Noto Sans JP', sans-serif;
            font-weight:700;
            font-size: clamp(14px, 1.6vw, 16px);
            color:#ffffff;
            text-align: center;
            line-height: 1;
            text-decoration: none;
            display: flex;
            flex-flow: row nowrap;
            align-items:center;
            justify-content:center;
            position:relative;
            }
        #home-box05 .content-box .btn-s1 a::before {
            content: "";
            position: absolute;
            top:0;
            bottom:0;
            right: 25px;
            width: 12px;
            height: 12px;
            border-top: 1px solid #ffffff;
            border-right: 1px solid #ffffff;
            transform: translateX(0) rotate(45deg);
            margin:auto;
            }
        #home-box05 .content-box .btn-s1 a:hover{
            opacity: 0.7;
            -ms-filter:"alpha(opacity=70)";
            -moz-opacity: 0.7;
            }
}
@media print, screen and (min-width:960px){/*PC用指定*/
    #home-box05 .content-box .btn-s1{
        max-width:250px;
        margin:0 auto;
        position: relative;
        z-index: 1;
        }
        #home-box05 .content-box .btn-s1 a{
            max-width:250px;
            width:100%;
            height:60px;
            box-sizing: border-box;
            background: linear-gradient(to right,#5e8d38, #00592f);
            border-radius: 30px;
            font-family: 'Noto Sans JP', sans-serif;
            font-weight:700;
            font-size: clamp(14px, 1.6vw, 16px);
            color:#ffffff;
            text-align: center;
            line-height: 1;
            text-decoration: none;
            display: flex;
            flex-flow: row nowrap;
            align-items:center;
            justify-content:center;
            position:relative;
            }
        #home-box05 .content-box .btn-s1 a::before {
            content: "";
            position: absolute;
            top:0;
            bottom:0;
            right: 25px;
            width: 12px;
            height: 12px;
            border-top: 1px solid #ffffff;
            border-right: 1px solid #ffffff;
            transform: translateX(0) rotate(45deg);
            margin:auto;
            }
        #home-box05 .content-box .btn-s1 a:hover{
            opacity: 0.7;
            -ms-filter:"alpha(opacity=70)";
            -moz-opacity: 0.7;
            }

@media screen and (max-width:559px){/*スマホ用指定*/  
#footer .box-s1{    
    margin:0 0 30px 0;
    }
    #footer .box-s1 div{
        margin:0;
        }
    #footer .box-s1 div:nth-child(1){
        margin:0 0 30px 0;
        }
}
@media print, screen and (min-width:560px){/*PC・タブレット用指定*/
#footer .box-s1{    
    display: flex;
    flex-flow: row nowrap;
    align-items:stretch;
    justify-content:space-between;
    margin:0 0 30px -20px;
    }
    #footer .box-s1 div{
        margin:0 0 0 20px;
        }
}


