#header{
height:auto;
background-color: rgb(255 255 255 / 0.7);
}
#header .wrap{
display:flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
max-width:1400px;
width:100%;
}

#header .wrap #link a{
border-radius: 10px;
line-height: 1;
padding: 2rem 1.7rem 2rem 2rem;
font-weight: bold;
font-size: 1.5rem;
display: inline-block;
color:#ffffff;
background-image: linear-gradient(90deg, #548235 0%, #339966 100%);
}


#main{
background:url(../images/ws/main_bg.jpg) no-repeat center center / cover;
padding:150px 0 50px 0;
text-align:center;
}
#title{
}






.ws{
width: 1400px;
margin:100px auto;
}
.ws_box{
display: grid;
grid-template-columns: 1fr 2fr 1fr;
position: relative;
border-top: 1px solid #D2D2D2;
border-bottom: 1px solid #D2D2D2;
margin: 0px auto;
width: 100%;
}
.ws_box01{
border-right: 1px solid #D2D2D2;
padding: 15px 30px;
text-align: center;
}
.bl{
border-left: 1px solid #D2D2D2;
}
.ws_box02{
border-right: 1px solid #D2D2D2;
padding: 15px 30px;
text-align: center;
}

.ws_ti{
  line-height: 1.4;
  display: flex;
  font-size:22px;
  text-align:center;
  font-weight:bold;
  height:80px;
  justify-content: center;
  align-items: center;
}



.ws_box01 .ws_img{
width:300px;
font-size: 16px;
text-align:center;
margin-bottom:20px;
}
.ws_box02 .ws_img{
display:flex;
flex-wrap: wrap;
justify-content: space-between;
margin-bottom:20px;
}

.ws_img_left , .ws_img_right{
width:300px;
font-size: 14px;
line-height:16px;
text-align:center;
}
.txt_red{
color:#ff0000;
font-weight:bold;
}


.ws_link{
display:flex;
flex-wrap: wrap;
justify-content: space-between;
}
.ws_box02 .ws_link{
justify-content: center;
}
.ws_link .chirashi , .ws_link .print , .ws_link .youtube{
width:145px;
margin-bottom:10px;
}
.ws_link_left{
width:50%;
}
.ws_link_center{
width:50%;

}
.ws_link_youtube{
font-size:14px;
display:flex;
flex-wrap: wrap;
width:100%;
justify-content: center;
}
.ws_link_youtube .youtube{
text-align: -webkit-center;
width: auto;
}
.ws_link_youtube .youtube_right{
margin-right:20px;
}

.ws_link_youtube .youtube a{
width:145px;
display: block;
}
.txt_youtube{
font-size:12px;
text-align:center;
}



.ws_link_left .chirashi , .ws_link_left .print , .ws_link_left .youtube{
width:145px;
margin-bottom:10px;
}
.ws_link_center .chirashi , .ws_link_center .print , .ws_link_center .youtube{
width:145px;
margin-bottom:10px;
}
.ws_link_right .chirashi , .ws_link_right .print , .ws_link_right .youtube{
width:145px;
    display: flex;
    margin-bottom:10px;
}
.ws_link_right .youtube a{
width:54%;
margin-right:10px;
display: inline-block;
}








.contact{
text-align: center;
padding: 70px 0;
background-image: linear-gradient(90deg, #548235 0%, #339966 100%);
width:100%;
}
.contact p{
text-align:center;
color:#ffffff;
display:inline-block;
font-weight: bold;
font-size:24px;
}

.contact a{
font-size: 28px;
display: block;
margin: 0px auto;
width: 50%;
border: 3px solid #ffffff;
padding: 30px 50px;
background-color: rgba(255, 255, 255, 0.5);
color:#ffffff;
font-weight: bold;
margin-top: 30px;
box-shadow: 0 0px 20px 0 rgba(0, 0, 0, .5);
}

#footer{
padding:0;
}





/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
SP
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 640px) {

    #header .wrap #logo{
        width:40%;
    }
    #header .wrap #link{
        width:40%;
        margin:1vh 0;
    }
    #header .wrap #link a{
        font-size: 2.7vw;
        padding: 1vh 2vw;
    }
    
    
    #main{
        padding:10vh 0 5vh 0;
        width:100%;
    }
    #main #title{
        width:100%;
    }
    #main #title img{
        width:100%;
    }

    
    .ws{
        width:90%;
        margin:5vh auto;
    }
    .ws_box{
        display:block;
    }
    
    .ws_box01{
        border: 1px solid #D2D2D2;
        padding:4vh 8vw;
    }
    .ws_box02{
        border: 1px solid #D2D2D2;
        padding:4vh 8vw;
    }
    
    .ws_ti{
        font-size:4vw;
        height:auto;
        margin-bottom:2vh;
    }
    
    .ws_box01 .ws_img{
        width:100%;
        font-size: 3.4vw;
        margin-bottom:2vh;
    }
    .ws_box02 .ws_img{
        margin-bottom:2vh;
    }
    .ws_img_left , .ws_img_right{
        width:100%;
        font-size: 3vw;
        margin-bottom:2vh;
    }
    
    .ws_link_youtube .youtube_right{
            margin-right: 10px;
    }
    
    
    .contact{
        padding: 5vh 0;
    }
    .contact p{
        font-size:4vw;
    }
    .contact a{
        font-size:4vw;
        width: 90%;
        padding: 2vh 4vw;
        margin-top: 3vh;
    }
    

}