@charset "UTF-8";
/* CSS Document */
.inner {
	max-width: 980px;
	width: 95%;
	display: block;
	margin: 0 auto;
}



@media all and (min-width:601px){
    .order-1 {
        order: -1;
    }
}
    

main p {
    margin-bottom: 1em;
    font-size: 1.1em;
}
main span.blue {
	color: #3fa9f5;
	margin-right: 0.5rem;
}
main #title {
	background: url("top-back.jpg") no-repeat;
	background-size: cover;
    background-position: center;
	position: relative;
	z-index: 0;
    padding: 40px 0 0;
}

.title_inner {
	margin: 0 auto;
	max-width: 1120px;
	width: 95%;
	display: block;
    
}
.title_inner　.flex > * {
    align-items: center;
    align-content: center;
}


main #title h1 img{
	display: block;
    width: 90%;
}
h2.lead {
    text-align: center;
    margin: 40px 0;
    font-weight: normal;
    font-size: 1.5rem;
    line-height: 1.7;
    
}
h2.lead strong {
    font-size: 1.7rem;
    font-weight: bold;
    color: #142F94;
}
main h4 {
    font-size: 1.1rem;
}
.menu ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.menu ul li {
    width: 23%;
    text-align: center;
    display: flex;
    align-content: center;
    font-size: 1.3rem;
   
}
.menu ul li a {
    display: block;
    background-color: #0066a9;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
    text-align: center;
    padding: 15px 10px;
    box-sizing: border-box;
    
    width: 100%;
     border-radius: 10px;
}
.menu ul li a:hover {
    opacity: 0.7;
    transition-duration: 0.3s;
}

.youtube {
	margin: 40px auto;
	width: 100%;
	max-width: 100%;
	text-align: center;
}
a.btn {
    background-color: #0066a9;
    color: #fff;
    font-weight: bold;
    font-size: 1.2rem;
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
    margin-bottom: 20px;
    border-radius: 10px;
}
main h2.h2-a {
    text-align: center;
    background-color: #CDEAFF;
    padding: 10px 200% 10px;
    font-size: 1.5rem;
    margin:50px -200% 20px;
    color: #444;
    
}
main h3.h3-a {
    font-size: 1.6rem;
    line-height: 1.7;
}
main .big {
    font-size: 1.3em;
    font-weight: bold;
    color: #0066a9;
}
main .ct h3 {
    font-size: 1.2rem;
    color: #0066a9;
}
main figure {
    text-align: center;
}

/* _/_/_/_/_/_/_/_/_/ スマホのスタイル _/_/_/_/_/_/_/_/_/ */

@media screen and (max-width: 600px) {
    main #title {
        background-image: none;
       /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#51bfff+0,f7fcff+39,f0f9ff+68,addeff+100 */
background: linear-gradient(to bottom,  #51bfff 0%,#f7fcff 39%,#f0f9ff 68%,#addeff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

    }
    main .flex h1 img {
        display: block;
        margin: 0 auto;
        width: 95%;
    }
    img.top-image {
        display: block;
        margin: 0 auto;
        width: 70%;
    }
    .menu ul li {
        width: 48%;
        margin-bottom: 1em;
        font-size: 1.15rem;
    }
	
	
	}