/*Base*/
@charset "UTF-8";

/*max-width: 1024px*/
@media only screen and (max-width: 1024px) {


.swiper-slide-active .s-fade-text {
  animation: slideTextFade 3.75s ease 0s 1 normal;
}


.homecontents h1{
 	width:95%;
	}

.top-lead{
	text-align:left;
	line-height:34px;
	font-size:1.0em;
	margin:40px 0 0px;
	width:95%;
	}

.theme-image{
	margin-left:50px;
	margin-right:70px;
	margin-bottom:230px;
	margin-top:30px;
	}
	
}

/*max-width: 1024px*/

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

.swiper-container{
      padding-top:1px;
    }
 
#home-contentswide{
	width:100%;
	margin:0 auto;
	margin-bottom:20px;
	}
.homecontents h1{
 	width:95%;
	}
	
.container {
	min-width:100%;
}
.topinformaiton h1{
 	width:95%;
	 font-size:1.3em;
}
.topinformaiton .news{
 	width:100%;
	}
	
.top-lead{
	line-height:32px;
	width:85%;
	margin:30px auto;
	text-align:justify;
	}
.theme-image img{
	width:70%;
	height:auto;
	}
.theme-image{
	text-align:center;
	margin-right:90px;
	margin-bottom:40px;
	}


.s-fade-text {
	top: 45%;
	left: 0;
	font-size: 1.1em;
}

.s-fade-text p{
	margin-top:18%;
	font-size: 0.4em;
	letter-spacing:1px;
	font-weight:normal;
	line-height:38px;
  }
.swiper-pagination{
	position: absolute;
	top:94%;
    }

.homecontents .home_artist{
	width:90%;
	text-align:center;
	margin:0 auto;
}

.homecontents .home_artist img{
	width:150px;
	height:auto;
	}
	
.homecontents .home_artist ul li{
	display:inline-block;
	width:150px;
	margin:30px 60px 30px 10px;
	}
	

.homecontents .home_artist p{
	margin-top:20px;
	}
	
.annualdetail{
	margin:0px auto;
	background:#f6f6f6;
	height:auto;
	min-height:330px;
	padding:10px 0 30px;
}

.annualdetail h3{
	font-weight:normal;
	font-size:1.2em;
}

.annualdetailtext{
 	width:95%;
}
	
.annualdetailtext ul li{
	width:98%;}

.map-contents{
 	width:100%;
	 }
	
.map-contents .map-text{
	margin-bottom:40px;
	}
}



/* mobile  */
@media screen and (max-width: 640px) {
.swiper-container{
      margin-top:0px;
    }
.swiper-container{
      padding-top:0px;
      margin-bottom:0px;
    }
.slide-img img{
	display:block;
	width: 100%;
	height:40vh;
	object-fit: cover;
}
.slide-img2 img{
	display:none;
}


.s-fade-text {
	top: 45%;
	font-size: .85em;
	letter-spacing:3px;
	line-height:22px;
}
.s-fade-text p{
	margin-top:20%;
	font-size: .5em;
	letter-spacing:0px;
	font-weight:normal;
	line-height:8px;
	opacity:0.9;
}
.swiper-pagination{
	position: absolute;
	top:92%;
    }
.swiper-pagination-bullet {
	width: 4px;
	height: 4px;
}
#home-contentswide{
	width:98%;
	margin:0 auto;
	margin-bottom:20px;
	}
.homecontents h1{
	width:98%;
	font-size:1.1em;
	padding:0px;
}

.top-lead{
	padding:0 10px;
	margin-bottom:30px;
	}

.theme-image{
	text-align:center;
	margin-top:10px;
	margin-right:30px;
	margin-bottom:20px;
	}

.theme-image img{
	width:60%;
	}
	
.top_youtube {
	position: relative;
	height: 0;
	padding: 30px 0 56.25%;
	overflow: hidden;
}
.top_youtube iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.topinformaiton{
	min-height:180px;
	}
.topinformaiton h1{
 	margin:5px auto;
	font-size:1.1em;
	}

.topinformaiton .news{
 	margin:10px auto;
	 padding-left:10px;
	width: 96%;
	}
.topinformaiton .day{
	padding:2px 4px;
	margin:5px 5px 0px 0px;
	width:110px;
	font-size:.9em;
	}

.homecontents .home_artist img{
	width:90px;
	height:auto;
	}
	
.homecontents .home_artist ul li{
	display:inline-block;
	width:90px;
	margin:10px 60px 0px 10px;
	}



.annualdetail{
	margin:0px auto;
	padding:20px 0 30px;
}
.annualdetail h3{
	font-size:.82em;
}

.annualdetailtext{
	margin-left:-25px;
 	width:100%;
}
.annualdetailtext ul li{
	width:100%;}
.annualdetailtext .attention{
	margin:10px 0 20px 40px;
	}
	
.map-contents{
 	width:98%;
	 }
	 
.map-contents .map-detail{
	padding:0px;
 	width:98%;
	}
.map-contents .museum-map{
	display:inline-block;
	width:90%;
	margin-left:0px;
	}
.map-contents .map-text ul li{
	width:98%;
	margin-left:-20px;}
.map-contents .museum-map img{
	width:80%;
	height:80%;
	margin-left:30px;
	}


}
  
/* mobile  */
@media screen and (max-width: 400px) {
.homecontents .home_artist ul{
	width:100%;
	margin-left:-25px;
}

.homecontents .home_artist img{
	width:70px;
	height:auto;
	}
	
.homecontents .home_artist ul li{
	display:inline-block;
	width:80px;
	margin:10px 40px 0px 10px;
	}

}
