@charset "UTF-8";
/* CSS Document */


body {
margin: 0;
padding: 0;
height: 100%;
font-family: sans-serif;
text-align: center;
}

/*------------*/

.top_photos {
padding: 20px;  
text-align: center; 
}

@media screen and (min-width:667px) {
img {
width: 60vw;
padding: 0;
}
}

@media screen and (max-width:666px) {
img {
width: 90vw;
margin: 0;
}
}

/*------------*/

/*.btn {
display: flex;
text-align: center;
}

.btn li{
width: 500px;
list-style-type: none;
}*/

.btn {
flex-direction: column;
padding: 0;
}
	
.btn li {
width: 100%;
}

/*------------*/

.btn-app {
margin-top: 10px;
margin-bottom: 20px;
width: 50%;
height: 80px;
background: #0D3770;
color: #ffffff;
font-size: 22px;
}

@media screen and (max-width:666px) {
.btn-app {
margin-top: 10px;
margin-bottom: 20px;
width: 80%;
height: 80px;
background: #0D3770;
color: #ffffff;
font-size: 22px;
}
}

.btn-app:hover {
 opacity: 0.7;
}

.btn-app a {
text-decoration: none;
color: #ffffff;
}

@media screen and (max-width:666px) {
.btn-app a {
 text-decoration: none;
color: #ffffff;
}
}

/*------------*/

.btn-pdf {
margin-top: 10px;
width: 50%;
height: 120px;
margin-bottom: 20px;
background: #FFE200;
color: #0D3770;
font-size: 26px;
}

@media screen and (max-width:666px) {
.btn-pdf {
margin-top: 10px;
width: 80%;
height: 80px;
margin-bottom: 20px;
background: #D34208 ;
color: #ffffff;
font-size: 22px;
}
}

.btn-pdf:hover {
 opacity: 0.7;
}

.btn-pdf a {
text-decoration: none;
color: #ffffff;
}

@media screen and (max-width:666px) {
.btn-pdf a {
 text-decoration: none;
color: #ffffff;
}
}

/*------------*/

.event {
display: flex;
margin:50px;
}

.event li{
list-style-type: none;
}

.event li img {
width: 100%;
height: auto;
}

@media screen and (max-width: 834px) {
.event {
flex-direction: column;
padding: 0;
}
	
.event li {
width: 100%;
}
}

/*------------

.event_photo{
text-align: center;
}

.event_photo img{
width: 100%;
}


パソコンで見たときは"pc"のclassがついた画像が表示される
.pc { display: block; }
.sp { display: none; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される
@media only screen and (max-width: 750px) {
    .pc { display: none; }
    .sp { display: block; }
}
/*------------*/

@media screen and (min-width:666px) {
.event_photo{
display: flex;
margin-right: 40px;
margin-left: 40px;
list-style: none;
padding: 0;
}
}

@media screen and (min-width:666px) {
.event_photo li{
display: flex;
width: 80%;
box-sizing: border-box;
margin: 10px;
}
}

@media screen and (min-width:666px) {
.event_photo img{
width: 100%;
}
}

/*------------*/

@media screen and (max-width:666px) {
.event_photo{
padding: 0;
}
}

@media screen and (max-width:666px) {
.event_photo li{
list-style: none;
}
}

@media screen and (max-width:666px) {
.event_photo img{
width: 70%;
margin: 10 0 10 0;
}
}

/*------------*/

.pdf{
margin-bottom: 100px;
}

@media screen and (max-width:666px) {
.pdf{
margin: 20px;
}
}

.pdf a{
color: #0D3770;
text-decoration-color: #0D3770;
}

.pdf a:hover {
color: orangered;
text-decoration-color: orangered;
}