@charset "utf-8";



/* main */

main {
    width:78%;
    margin:0 auto;
    position:relative;
}
main h2 {
    width:80%;
    max-width:650px;
    margin:-120px auto 0;
    text-align:center;
    position:relative;
    z-index:100;
}
main h2 span {
    width:100%;
    margin:40px auto 0;
    display:block;
    font-size:2rem;
    font-weight:900;
    line-height:1.8;
}
main h2 span b {
    display:block;
    font-size:3.6rem;
    font-weight:900;
}

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

    main {width:100%;}
    main h2 {width:80%; margin-top:-20px;}
    main h2 span {font-size:1.5rem;}
    main h2 span b {font-size:2.8rem;}
}



/* about */

.about {
    margin:0 auto;
    padding:80px 0;
}
.about > h3 {
    font-weight:900;
    text-align:center;
}
.about > p {
    width:100%;
    margin:0 auto 20px;
}
.about > img {margin:50px auto;}

.about ul {
    width:100%;
    margin:0 auto;
    display:flex; flex-flow:row wrap; justify-content:space-between; align-content:stretch; align-items:stretch;
}
.about ul li {
    width:32%;
    margin:50px 0 0;
    display:flex; flex-flow:row wrap; justify-content:space-between; align-content:stretch; align-items:stretch;
    position:relative;
    overflow:hidden;
}
.about ul li a {
    margin:auto;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:flex-start; align-items:flex-start;
    position:absolute; top:0; bottom:0; left:0; right:0;
    transition: .3s;
    z-index:10;
}
.about ul li a img {
    margin:0 0 10px;
    display:block;
    font-size:1.5rem;
    font-weight:700;
    line-height:1.5;
    transition: .3s;
    opacity:0;
}
.about ul li a:hover {
    opacity:1;
}
.about ul li a:hover img {
    opacity:1;
}
.about ul li span img {
    transition: .3s;
    z-index:1;
}
.about ul li:hover span img {
    filter:blur(3px);
}

@media only screen and (max-width:640px){
    
    .about {padding:50px 0 50px;}
    .about h3 {font-size:1rem;}
    .about h3 b {font-size:2rem;}
}




/* kankou */

.kankou {margin:50px auto 150px;}

.kankou h3 {
	width:100%;
	margin:0 auto 30px;
	font-size:1rem;
	text-align:center;
}
.kankou h3 span {
	display:block;
	font-family:"Oswald", sans-serif;
    font-size:3rem;
	line-height:1.5;
}
.kankou p {text-align:center;}

ul.photo {
    width:100%;
    margin:0 auto;
}
ul.photo li div {
	height:600px;
	margin-bottom:5px;
}
ul.photo li img {
	max-height:100%;
	margin:0 auto;
}
ul.photo li p {text-align:center;}

/* photo-thumbnail */
ul.photo-thumbnail {
    width:50%;
    margin:30px auto 0;
}
ul.photo-thumbnail li {
    max-height:100px;
    margin:0 10px;
    overflow: hidden;
    cursor: pointer;
    transition: .2s;
}
ul.photo-thumbnail li:hover {
    opacity: .6;
}
ul.photo-thumbnail li img {
    max-height:100px;
    margin: auto;
}

@media only screen and (max-width:640px){
	
	.kankou {margin:0 auto 80px;}
	.kankou h3 span {font-size:2rem;}
	
	ul.photo li div {
		height:220px;
		margin-bottom:0;
	}
    ul.photo-thumbnail {width:100%;}
	ul.photo-thumbnail li {margin:0 5px;}
}