@charset "utf-8";



/* section */

section {
    width:100%;
    margin: 0 auto;
    padding:0;
	display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
	background:#e5ddc4;
}

section img {max-width:100%;}

section h2 {
    width:100%;
    margin: 0 auto;
    padding:0;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
    position:relative;
    overflow:hidden;
}

section ul.lineup {
	width:100%;
	margin:0 auto 50px;
	display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
}
section ul.lineup li a {display:block; transition: .1s;}
section ul.lineup li a:hover {margin-top:-20px;}

section .lineupDetail {padding:50px 0 0; position:relative;}
section .lineupDetail span {position:absolute; top:-80px; left:0;}
section .lineupDetail img {border-radius:15px;}

@media only screen and (max-width:640px){
	
	section ul.lineup li {width:32%;}
	
	section .lineupDetail {width:96%;}
}



.kome {
    margin: 0 auto;
    padding:30px 0;
    background:#e0e7f5;
}
.kome p {
    width:90%;
    margin:0 auto;
    font-size:0.9rem;
    line-height:1.5;
    letter-spacing:0;
}

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



/* sagasu */

ul.sagasu {
    width:90%;
    margin: 60px auto 0;
    padding:50px 5%;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
    background:#fff;
}
ul.sagasu li {margin:10px 6px;}
ul.sagasu li a {
    width:100%;
    display:block;
    text-decoration:none;
}
ul.sagasu li a span {
    margin:0 auto;
    padding:15px 35px 15px 25px;
    display:block;
    color:#231815;
    font-size:1rem;
    font-weight:700;
    text-align: center;
    line-height:1;
    letter-spacing:0.1em;
    border: solid 2px #231815;
    border-bottom: solid 6px #231815;
    border-radius:50px;
    position: relative;
    background:#fff;
    transition: .2s;
}
ul.sagasu li a:hover span {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
    border-bottom: solid 2px #231815;
}

ul.sagasu li a span::before {
    content: "";
    width: 9px;
    height:9px;
    margin:auto;
    position:absolute; top:0; bottom:0; right:20px;
    vertical-align: middle;
    border-top: 2px solid #231815;
    border-right:2px solid #231815;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: .3s;
}
ul.sagasu li a span:hover::before {right:15px;}

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

    ul.sagasu {display:flex; flex-flow:row wrap; justify-content:space-between; align-content:center; align-items:center;}
    ul.sagasu li {width:49%; margin:10px 0;}
    ul.sagasu li a span {font-size:0.9rem;}
}