@charset "UTF-8";

@media screen and (min-width: 1159px){
/* 美術館について
---------------------------------------------------------*/
header .inner nav .pcMenu li:nth-child(4) > a{
	color: #69b432;
}
#aboutus{
	margin: 0 auto;
	padding: 30px 0 120px;
	width: 900px;
}
#aboutus h2{
	margin: 0 auto 25px;
	padding: 0;
	font-size: 28px;
	text-align: center;
	font-weight: bold;
	font-feature-settings: "palt";
	letter-spacing: 1px;
	display: inline-block;
	color: #251e1c;
	position: relative;
}
#aboutus h2:after {
	margin: auto;
	content: "";
	display: block;
	width: 38px;
	height: 3px;
	position: absolute;
	bottom: -25px;
	left: 0;
	right: 0;
	background-color: #251e1c;
}

#aboutus .nav{
	padding: 30px 0 30px;
	width: 100%;
	text-align: center;
}
#aboutus .nav li{
	padding: 0 15px;
	display: inline-block;
}
#aboutus .nav li a{
	padding: 15px 0;
	font-size: 14px;
	text-align: left;
	font-weight: bold;
	position: relative;
	transition: .3s;
}
#aboutus .nav li a:after {
	margin: auto;
	content: "";
	display: block;
	width: 0%;
	height: 3px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #69b432;
	transition: .3s;
}
#aboutus .nav li a:hover,
#aboutus .nav li a.active{
	color: #69b432;
	position: relative;
}
#aboutus .nav li a:hover:after,
#aboutus .nav li a.active:after {
	content: "";
	display: block;
	width: 100%;
	height: 3px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #69b432;
}

#aboutus .greet{
	margin: 0 auto;
	padding: 35px 0 65px;
	width: 100%;
}
#aboutus .greet h3{
	margin: 0 auto;
	padding: 0 0 25px;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .greet .director{
	float: right;
	width: 189px;
}
#aboutus .greet .director img{
	width: 100%;
	height: auto;
}
#aboutus .greet .director p{
	margin: 0;
	padding: 5px 0 0;
	width: 100%;
	font-size: 14px;
	line-height: 23px;
	text-align: left;
}
#aboutus .greet p{
	float: left;
	margin: 0;
	padding: 0 0 70px;
	width: 682px;
	font-size: 14px;
	line-height: 23px;
	text-align: left;
}

#aboutus .concept{
	margin: 0 auto;
	padding: 35px 0 65px;
	width: 100%;
}
#aboutus .concept h3{
	margin: 0 auto;
	padding: 0 0 60px;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .concept .logo{
	margin: 0 auto 55px;
	padding: 0;
	width: 526px;
}
#aboutus .concept .logo img{
	width: 100%;
	height: auto;
}
#aboutus .concept p{
	margin: 0 auto;
	padding: 0;
	width: 100%;
	font-size: 14px;
	line-height: 23px;
	text-align: left;
}

#aboutus .history{
	margin: 0 auto;
	padding: 35px 0 65px;
	width: 100%;
}
#aboutus .history h3{
	margin: 0 auto;
	padding: 0 0 25px;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
.his{
	width: 100%;
	border-top: 1px dotted #251e1c;
}
.his th,
.his td{
	padding: 15px 0;
	font-size: 14px;
	line-height: 23px;
	text-align: left;
	vertical-align: top;
	font-feature-settings: "palt";
	border-bottom: 1px dotted #251e1c;
}
#aboutus .history .his th{
	width: 340px;
}

#aboutus .overview{
	margin: 0 auto;
	padding: 35px 0 65px;
	width: 100%;
}
#aboutus .overview h3{
	margin: 0 auto;
	padding: 0 0 25px;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .overview .his th{
	width: 198px;
}
#aboutus .overview .his td .inTb th{
	width: 128px;
	font-weight: normal;
}
#aboutus .overview .his td .inTb th,
#aboutus .overview .his td .inTb td{
	padding: 0;
	border-bottom: none;
}

#aboutus .mae{
	margin: 0 auto;
	padding: 35px 0 65px;
	width: 100%;
}
#aboutus .mae h3{
	margin: 0 auto;
	padding: 0 0 50px;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .mae .photo{
	margin: 0 auto;
	padding: 0 0 50px;
	width: 471px;
}
#aboutus .mae .photo img{
	width: 100%;
	height: auto;
}
#aboutus .mae p{
	margin: 0 auto;
	padding: 0;
	width: 100%;
	font-size: 14px;
	line-height: 23px;
	text-align: left;
}

#aboutus .step{
	margin: 0 auto;
	padding: 35px 0 65px;
	width: 100%;
}
#aboutus .step h3{
	margin: 0 auto;
	padding: 0 0 30px;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .step p{
	margin: 0 auto;
	padding: 0 0 30px;
	width: 100%;
	font-size: 14px;
	line-height: 23px;
	text-align: left;
}
#aboutus .step ul{
	margin: 0 auto;
	padding: 0;
	width: 100%;
}
#aboutus .step li{
	margin: 0 0 20px;
	padding: 0;
	width: 100%;
	background-color: #251e1c;
}
#aboutus .step li img{
	float: left;
	width: 351px;
	height: auto;
}
#aboutus .step li .box{
	float: right;
	padding: 30px 30px 0;
	width: 549px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#aboutus .step li .box .part{
	font-family: 'Noto Sans JP';
	padding: 0 0 15px;
	font-size: 18px;
	text-align: left;
	color: #fff;
	font-weight: bold;
}
#aboutus .step li .box .part span{
	font-size: 28px;
}
#aboutus .step li .box p{
	margin: 0;
	padding: 0 0 18px;
	width: 100%;
	font-size: 22px;
	text-align: left;
	color: #fff;
	font-weight: bold;
}
#aboutus .step li .box .bt{
	margin: 0;
	width: 224px;
}
#aboutus .step li .box .bt a{
	padding: 12px 0 12px;
	width: 100%;
	font-size: 14px;
	line-height: 100%;
	text-align: center;
	font-weight: bold;
	color: #fff;
	font-feature-settings: "palt";
	border: 2px solid #fff;
	display: inline-block;
	text-decoration: none;
	background-image: url(../images/arrow3.png);
	background-position: right 15px center;
	background-size: 23px 9px;
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#aboutus .step li .box .bt a:hover{
	color: #251e1c;
	background-color: #fff;
	background-image: url(../images/arrow2.png);
	background-position: right 10px center;
	background-size: 20px 9px;
  opacity:1;
  filter: alpha(opacity=100);
}

#aboutus .essay{
	margin: 0 auto;
	padding: 35px 0 65px;
	width: 100%;
}
#aboutus .essay h3{
	margin: 0 auto;
	padding: 0 0 30px;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .essay p{
	margin: 0 auto;
	padding: 0 0 30px;
	width: 100%;
	font-size: 14px;
	line-height: 23px;
	text-align: left;
}
#aboutus .essay .ban{
	margin: 0;
	padding: 0;
	width: 564px;
}
#aboutus .essay .ban img{
	width: 100%;
	height: auto;
}
#aboutus .essay .ban a:hover{
 opacity: 0.5;
}



}



@media screen and (max-width: 1158px){
/* 美術館について 
---------------------------------------------------------*/
#aboutus{
	margin: 0 auto;
	padding: 6vw 0 10vw;
	width: 100%;
}
#aboutus h2{
	margin: 0 auto 10vw;
	padding: 0;
	font-size: 5vw;
	text-align: center;
	font-weight: bold;
	font-feature-settings: "palt";
	letter-spacing: 1px;
	display: inline-block;
	color: #251e1c;
	position: relative;
}
#aboutus h2:after {
	margin: auto;
	content: "";
	display: block;
	width: 12vw;
	height: 3px;
	position: absolute;
	bottom: -5vw;
	left: 0;
	right: 0;
	background-color: #251e1c;
}

#aboutus .nav{
	padding: 0 0 4vw;
	width: 100%;
	text-align: center;
}
#aboutus .nav li{
	padding: 0 1vw;
	display: inline-block;
}
#aboutus .nav li a{
	padding: 2vw 0;
	font-size: 2.6vw;
	text-align: left;
	font-weight: bold;
	position: relative;
	transition: .3s;
}
#aboutus .nav li a:after {
	margin: auto;
	content: "";
	display: block;
	width: 0%;
	height: 3px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #69b432;
	transition: .3s;
}
#aboutus .nav li a:hover,
#aboutus .nav li a.active{
	color: #69b432;
	position: relative;
}
#aboutus .nav li a:hover:after,
#aboutus .nav li a.active:after {
	content: "";
	display: block;
	width: 100%;
	height: 3px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #69b432;
}

#aboutus .greet{
	margin: 0 auto;
	padding: 5vw 0 2vw;
	width: 88%;
}
#aboutus .greet h3{
	margin: 0 auto;
	padding: 0 0 5vw;
	width: 100%;
	font-size: 4vw;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .greet .director{
	float: none;
	margin: 0 auto;
	width: 100%;
	text-align: center;
}
#aboutus .greet .director img{
	margin: 0 auto;
	width: 40%;
	height: auto;
}
#aboutus .greet .director p{
	margin: 0;
	padding: 2vw 0 0;
	width: 100%;
	font-size: 3vw;
	line-height: 150%;
	text-align: center;
}
#aboutus .greet p{
	float: none;
	margin: 0;
	padding: 4vw 0 8vw;
	width: 100%;
	font-size: 3vw;
	line-height: 150%;
	text-align: left;
}

#aboutus .concept{
	margin: 0 auto;
	padding: 5vw 0 8vw;
	width: 88%;
}
#aboutus .concept h3{
	margin: 0 auto;
	padding: 0 0 8vw;
	width: 100%;
	font-size: 4vw;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .concept .logo{
	margin: 0 auto 8vw;
	padding: 0;
	width: 80%;
}
#aboutus .concept .logo img{
	width: 100%;
	height: auto;
}
#aboutus .concept p{
	margin: 0 auto;
	padding: 0;
	width: 100%;
	font-size: 3vw;
	line-height: 150%;
	text-align: left;
}

#aboutus .history{
	margin: 0 auto;
	padding: 5vw 0 8vw;
	width: 88%;
}
#aboutus .history h3{
	margin: 0 auto;
	padding: 0 0 5vw;
	width: 100%;
	font-size: 4vw;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
.his{
	width: 100%;
	border-top: 1px dotted #251e1c;
}
.his th,
.his td{
	padding: 0 0 2.2vw;
	font-size: 3vw;
	line-height: 150%;
	text-align: left;
	vertical-align: top;
	font-feature-settings: "palt";
	border-bottom: 1px dotted #251e1c;
	width: 100%;
	display: block;
}
#aboutus .history .his th{
	padding: 2.2vw 0 0;
	width: 100%;
	border-bottom: none;
}

#aboutus .overview{
	margin: 0 auto;
	padding: 5vw 0 12vw;
	width: 88%;
}
#aboutus .overview h3{
	margin: 0 auto;
	padding: 0 0 5vw;
	width: 100%;
	font-size: 4vw;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .overview .his th{
	padding: 2.2vw 0 0;
	width: 100%;
	border-bottom: none;
}
#aboutus .overview .his td .inTb{
	width: 100%;
}
#aboutus .overview .his td .inTb th{
	width: 30%;
	font-weight: normal;
}
#aboutus .overview .his td .inTb th,
#aboutus .overview .his td .inTb td{
	padding: 0;
	border-bottom: none;
	display: table-cell;
}
#aboutus .overview .his td .inTb td{
	width: 70%;
}

#aboutus .mae{
	margin: 0 auto;
	padding: 5vw 0 8vw;
	width: 88%;
}
#aboutus .mae h3{
	margin: 0 auto;
	padding: 0 0 6vw;
	width: 100%;
	font-size: 4vw;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .mae .photo{
	margin: 0 auto;
	padding: 0 0 5vw;
	width: 76%;
}
#aboutus .mae .photo img{
	width: 100%;
	height: auto;
}
#aboutus .mae p{
	margin: 0 auto;
	padding: 0;
	width: 100%;
	font-size: 3vw;
	line-height: 150%;
	text-align: left;
}

#aboutus .step{
	margin: 0 auto;
	padding: 5vw 0 5vw;
	width: 88%;
}
#aboutus .step h3{
	margin: 0 auto;
	padding: 0 0 4vw;
	width: 100%;
	font-size: 4vw;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .step p{
	margin: 0 auto;
	padding: 0 0 5vw;
	width: 100%;
	font-size: 14px;
	line-height: 23px;
	text-align: left;
}
#aboutus .step ul{
	margin: 0 auto;
	padding: 0;
	width: 100%;
}
#aboutus .step li{
	margin: 0 0 5vw;
	padding: 0;
	width: 100%;
	background-color: #251e1c;
}
#aboutus .step li img{
	float: none;
	width: 100%;
	height: auto;
}
#aboutus .step li .box{
	float: none;
	padding: 5vw 0 5.5vw;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	text-align: center;
}
#aboutus .step li .box .part{
	font-family: 'Noto Sans JP';
	padding: 0 0 2.5vw;
	font-size: 3vw;
	text-align: center;
	color: #fff;
	font-weight: bold;
}
#aboutus .step li .box .part span{
	font-size: 4vw;
}
#aboutus .step li .box p{
	margin: 0;
	padding: 0 0 3vw;
	width: 100%;
	font-size: 4vw;
	text-align: center;
	color: #fff;
	font-weight: bold;
}
#aboutus .step li .box .bt{
	margin: 0 auto;
	width: 50%;
}
#aboutus .step li .box .bt a{
	padding: 2vw 0 2vw;
	width: 100%;
	font-size: 3vw;
	line-height: 100%;
	text-align: center;
	font-weight: bold;
	color: #fff;
	font-feature-settings: "palt";
	border: 2px solid #fff;
	display: inline-block;
	text-decoration: none;
	background-image: url(../images/arrow3.png);
	background-position: right 15px center;
	background-size: 23px 9px;
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#aboutus .step li .box .bt a:hover{
	color: #251e1c;
	background-color: #fff;
	background-image: url(../images/arrow2.png);
	background-position: right 10px center;
	background-size: 20px 9px;
  opacity:1;
  filter: alpha(opacity=100);
}

#aboutus .essay{
	margin: 0 auto;
	padding: 5vw 0 5vw;
	width: 88%;
}
#aboutus .essay h3{
	margin: 0 auto;
	padding: 0 0 5vw;
	width: 100%;
	font-size: 4vw;
	font-weight: bold;
	color: #69b432;
	text-align: left;
}
#aboutus .essay p{
	margin: 0 auto;
	padding: 0 0 4vw;
	width: 100%;
	font-size: 3vw;
	line-height: 150%;
	text-align: left;
}
#aboutus .essay .ban{
	margin: 0;
	padding: 0;
	width: 100%;
}
#aboutus .essay .ban img{
	width: 100%;
	height: auto;
}
#aboutus .essay .ban a:hover{
 opacity: 0.5;
}


}