@charset "utf-8";
#staff {
	/*position: relative;*/
	margin: 0 auto 40px;
	width: 1100px;
}
}
#staff ul{
	position: absolute;
    left: 52%;
    transform: translateX(-50%);
    width: max-content;
}
#staff li {
    width: 240px;
    float: left;
    margin-right: 45px;
    padding-bottom: 25px;
}
#staff li a {
    display: block;
}
#staff li a.active {
    opacity: 0.6;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
}
#staff li:nth-child(4n) {
    margin-right: 0px;
}
#staff li:nth-child(4n+1) {
    clear: both;
}
#staff li .thumb img {
    margin-bottom: 10px;
}
#staff li .name_en {
    color: #ffffff;
    font-size: 1.6rem;
	margin: -40px 0 0 10px;
	font-family: 'Barlow', sans-serif;
	text-shadow: 0 0 3px rgba(66, 66, 66, 0.8);
}
#staff li .name_ja {
    font-size: 1.4rem;
    color: #000;
	text-align: right;
	margin: 25px 0 0 0;
}
.pic_area {
    width: 100%;
    padding-top: 25px;
}


.pic_area {
	opacity: 0;

	
}

.pic_area.on {
	opacity: 1;
	
}
.pic_area dl {
    position: absolute;
    width: 1100px;
    padding-left: 0px;
    margin: 0 auto;
    left: 0px;
    right: 0px;
    background-color: #FFFFFF;
}
.pic_area dt {
    width: 600px;
    float: left;
}
.pic_area dd {
    width: 460px;
    float: right;
    padding-bottom: 40px;
}
.pic_area dd h2 {
    font-size: 20px;
    font-size: 2.0rem;
    color: #000000;
    /*margin-bottom: 50px;*/
	margin: 15px 0 35px 0;
}
.pic_area dd h2 span {
    font-size: 29px;
    display: block;
}
.pic_area dd h3 {
    color: #064583;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.3;
    margin-bottom: 5px;
}
.pic_area dd h3:before {
    content: "▼";
    display: inline-block;
    vertical-align: middle;
    margin: 0px 3px 3px 0px;
}
.pic_area dd .txt {
    font-size: 14px;
    font-size: 1.4rem;
    margin-top: 0px;
    margin-left: 0px;
    margin-bottom: 15px;
}
.pic_area dd .txt:last-child {
    margin-bottom: 0px;
}
.pic_area .close_btn {
    position: absolute;
    right: 0px;
    bottom: 0px;
}

@media (max-width: 1102px) {
#staff ul{
/*    width: fit-content;*/
	width: 380px;
}
#staff li {
    width: 46.5%;
    margin-right: 3%;
    margin-bottom: 1%;
    padding-bottom: 1%;
}
#staff li a {
}
#staff li a.active {
    opacity: 1;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
}
#staff li:nth-child(4n) {
}
#staff li:nth-child(4n+1) {
}
#staff li .thumb img {
    margin-bottom: 1%;
}
#staff li .name_en {
    font-size: 1.6rem;
}
#staff li .name_ja {
    padding-bottom: 3%;
}
.pic_area {
    padding-top: 3%;
}
	
	
.pic_area.on {
    padding-bottom: 12%;

	}
	
.pic_area dl {
 	margin:0 2.5%;
   width: 95%;
}
.pic_area dt {
    width: auto;
    float: none;
}
.pic_area dd {
    width: auto;
    float: none;
}
.pic_area dd h2 {
    font-size: 2.0rem;
    margin-bottom: 3%;
    padding-top: 1%;
}
.pic_area dd h2 span {
    font-size: 2rem;
}
.pic_area dd h3 {
    margin-bottom: 1%;
}
.pic_area dd h3:before {
}
.pic_area dd .txt {
    margin-bottom: 1%;
}
.pic_area dd .txt:last-child {
}
.pic_area .close_btn {
}
}






@media (max-width: 767px) {
.pic_area.on {
    padding-bottom: 0;
	}	
	
	.pic_area dd {
     padding-bottom: 0; 
}

	
}