@charset "utf-8";
html {font-size: 20px; background-color: #D8D2CB;}
head{font-size: 1rem; padding: 2.5rem 0 0;}

.title {text-align: center;}
.title h1{text-align: center; font-family: 'Noto Sans'; font-weight: 600;font-size: 2rem;color:#544D48;}
.title_sort {justify-content: center; display: flex;}
.title_sort h2 {padding-left: 1rem;padding-right: 1rem; text-align: center; font-family: 'Noto Sans'; font-weight: 600;font-size: 1rem;color:#544D48;}
.gallary { display:flex;}
.title_sort a:link{color: #544D48;}
.title_sort a:vlink{color: #544D48;}
.title_sort a:hover{color:#544D48;transform:scale(1.1);}
.title_sort a:active {color:#A39789;}

.exhibition_sort {height: auto;padding-left: 1rem; padding-right: 1rem; margin-bottom: 1rem; align-content: center; position: relative;}
.exhibition_sort h2{ padding-left: 2rem; font-family: 'Noto Sans'; font-weight: 600;font-size: 1.25rem;color:#544D48;}
div .gal_e{height: 17rem; margin:.25rem; margin-bottom: 2.5rem; border: 1px solid #ccc; justify-content: space-between;float:left;}
div.gal_e img {width: auto;height:95% ;}
div.text {text-align: center;padding: .5rem; font-family: 'Noto Sans'; font-weight: 500;font-size: .8rem;color:#544D48;}
div.gal_e:hover {opacity: 0.5;}

@media (max-width: 800px){
.title h1{text-align: center; font-family: 'Noto Sans'; font-weight: 600;font-size: 2rem;color:#544D48;}
.title_sort{margin-left: .5rem; margin-right: .5rem;}
.title_sort h2 { padding-left: .25rem; text-align: center; font-family: 'Noto Sans'; font-weight: 600;font-size: .8rem;color:#544D48;}
.gallary { display:flex;}
.title_sort a:link{color: #544D48;}
.title_sort a:vlink{color: #544D48;}
.title_sort a:hover{color:#544D48;transform:scale(1.1);}
.title_sort a:active {color:#A39789;}

.exhibition_sort {width: auto; height: 70%;padding-left: 1rem; padding-right: 1rem; margin-bottom: .2rem; align-content: center; position: relative;}
.exhibition_sort h2{ padding-left: 2rem; font-family: 'Noto Sans'; font-weight: 600;font-size: 1.25rem;color:#544D48;}
div .gal_e{width: auto; margin:.25rem; margin-bottom: .2rem; border: 1px solid #ccc; justify-content: space-between;float:left;}
div.gal_e img {width: auto;height:70% ;}
div.text {width: auto; text-align: center;padding: .2rem; font-family: 'Noto Sans'; font-weight: 500;font-size: .8rem;color:#544D48;}
div.gal_e:hover {opacity: 0.5;}
	}
@media (max-width: 400px){
.title h1{text-align: center; font-family: 'Noto Sans'; font-weight: 600;font-size: 1.3rem;color:#544D48;}
.title_sort{width: 80%; position: relative; justify-content: space-between;}
.title_sort h2 { padding-left:2%;padding-right: 2%; text-align: center; font-family: 'Noto Sans'; font-weight: 600;font-size: .5rem;color:#544D48;}
.gallary { display:block;margin-top: 2rem;}

.exhibition_sort {width: 100%; height: auto;padding-left: .1rem; padding-right: .1rem; margin-bottom: 1.5rem; align-content: center; position: relative;}
.exhibition_sort h2{width:100%; margin-bottom: -.2rem; padding-left: .1rem; font-family: 'Noto Sans'; font-weight: 600;font-size: 1rem;color:#544D48;}
div .gal_e{ height:auto; display: block;margin:.25rem; margin-bottom: .5rem; border: 1px solid #ccc; justify-content: space-between;float:left;}
div.gal_e img {width:100%;height:auto; position: relative;}
div.text {width: auto; text-align: center; padding-bottom: 1rem; font-family: 'Noto Sans'; font-weight: 500;font-size: .8rem;color:#544D48;}
div.gal_e:hover {opacity: 0.5;}	
}
