@charset "UTF-8";

/*-------------------------
__staff_list_style
-------------------------*/

#staff_list .link_nav.end,
#staff_detail .link_nav.end{margin-bottom:0;}

@media screen and (max-width:767px) {
  #staff_list .link_nav.end,
  #staff_detail .link_nav.end{padding-bottom:20vw;}
}

#staff_list .block{margin:-50px 0 0;padding:50px 0 0;}
#staff_list .block + .block{margin-top:80px;}

#staff_list .list_wrap .box{width:calc((100% - 90px)/4);margin:0 30px 40px 0;}
#staff_list .list_wrap .box a{display:flex;flex-direction:column;height:100%;}
#staff_list .list_wrap .box:nth-child(4n){margin-right:0;}
#staff_list .list_wrap .box .pic{box-sizing:border-box;border:1px solid #dac292;position:relative;}
#staff_list .list_wrap .box .pic::before{content:"";display:block;padding-top:100%;}
#staff_list .list_wrap .box .pic img{width:auto;height:auto;max-height:100%;position:absolute;top:50%;left:50%;-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}
#staff_list .list_wrap .box .txt{flex:1 0 auto;line-height:1.2;padding:15px 0;}
#staff_list .list_wrap .box .txt span{display:block;}
#staff_list .list_wrap .box .txt span + span{padding-top:8px;}
#staff_list .list_wrap .box .txt .post{font-size:1.8rem;}
#staff_list .list_wrap .box .txt .name{font-size:2.5rem;font-weight:700;}
#staff_list .list_wrap .box .more{display:block;text-align:center;padding:4px 10px 2px;color:#FFF;background-color:#5d330d;}
#staff_list .list_wrap .box .more::after{content:"\EA02";display:inline-block;font-family:'iconfont'!important;height:1em;font-size:2rem;vertical-align:top;margin:-5px -15px 0 10px;}

@media screen and (min-width:768px) {
#staff_list .list_wrap .box a .pic img,
#staff_list .list_wrap .box a .more,
#staff_list .list_wrap .box a .more::after{transition:all 0.3s;}
#staff_list .list_wrap .box a:hover .pic img{opacity:0.5;}
#staff_list .list_wrap .box a:hover .more{color:#5d330d;background-color:#f8f1e3;}
#staff_list .list_wrap .box a:hover .more::after{transform:translateX(5px);}
}

@media screen and (max-width:767px) {
#staff_list .block{margin:-20px 0 0;padding:20px 0 0;}
#staff_list .block + .block{margin-top:30px;}

#staff_list .list_wrap .box{width:calc((100% - 20px)/2);margin:0 20px 25px 0;}
#staff_list .list_wrap .box:nth-child(2n){margin-right:0;}
#staff_list .list_wrap .box .txt{padding:10px 0;}
#staff_list .list_wrap .box .txt span + span{padding-top:4px;}
#staff_list .list_wrap .box .txt .post{font-size:4vw;}
#staff_list .list_wrap .box .txt .name{font-size:5.5vw;}
}

/*-------------------------
__staff_detail_style
-------------------------*/

#staff_detail .block{padding:0 40px;}
#staff_detail .block:nth-child(odd){background-color:#FFF;}
#staff_detail .block:nth-child(even){background-color:#f8f1e3;}
#staff_detail .block .block_inner{max-width:1200px;margin:auto;}
#staff_detail .block .row{display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}

#staff_detail .profile{flex:1;text-align:left;padding:40px 40px 40px 0;}
#staff_detail .profile .post{font-size:1.8rem;}
#staff_detail .profile .staff_name{display:inline-block;font-size:4rem;font-weight:700;margin:10px 0;padding:10px 0;border-bottom:2px solid #5d330d;}
#staff_detail .profile .staff_name span{display:inline-block;font-size:50%;margin:0 0 0 20px;}
#staff_detail .profile dl{margin:30px 0 0;}
#staff_detail .profile dl dt{width:6em;text-align:center;padding:4px 8px 6px;color:#FFF;background-color:#5d330d;}
#staff_detail .profile dl dd{line-height:1.8;padding:10px 0 0;}
#staff_detail .portrait{width:580px;margin:-40px 0;box-sizing:border-box;background-color:#FFF;border:1px solid #dac292;position:relative;}
#staff_detail .portrait::before{content:"";display:block;padding-top:100%;}
#staff_detail .portrait img{width:auto;height:auto;max-height:100%;position:absolute;top:50%;left:50%;-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}

#staff_detail .block_ttl{text-align:left;margin:60px 0 0;}
#staff_detail .block_ttl span::before{margin:10px auto 20px 0;}
#staff_detail .txt{line-height:1.8;text-align:left;margin:60px 0 70px;}
#staff_detail .txt p + p{margin-top:1.5rem;}
#staff_detail .pic{margin:0 0 70px;}
#staff_detail .pic ul{display:flex;}
#staff_detail .pic ul li{width:calc((100% - 30px)/3);overflow:hidden;box-sizing:border-box;border:1px solid #EEE;position:relative;}
#staff_detail .pic ul li + li{margin-left:10px;}
#staff_detail .pic ul li::before{content:"";display:block;padding-top:75%;}
#staff_detail .pic ul li img{width:100%;height:100%;object-fit:cover;position:absolute;top:50%;left:50%;-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}
@media all and (-ms-high-contrast: none){
#staff_detail .pic ul li{box-sizing:border-box;border:1px solid #CCC;}
#staff_detail .pic ul li img{width:auto;height:auto;max-width:150%;max-height:150%;}
}

@media screen and (min-width:768px) {
#staff_detail .pic ul li a img{transition:all 0.3s;}
#staff_detail .pic ul li a:hover img{transform:translate(-50%,-50%) scale(1.2);opacity:0.5;}
}

@media screen and (max-width:767px) {
#staff_detail .block{padding:0 20px;}
#staff_detail .block .block_inner{margin:30px auto 35px;}
#staff_detail .block .row{display:block;overflow:hidden;}

#staff_detail .profile{padding:30px 0;}
#staff_detail .profile .post{font-size:4.8vw;}
#staff_detail .profile .staff_name{font-size:7.2vw;margin:5px 0 10px;padding:5px 0;}
#staff_detail .profile .staff_name span{font-size:4.8vw;}
#staff_detail .profile dl{margin:15px 0 0;}
#staff_detail .profile dl dt{}
#staff_detail .profile dl dd{padding:5px 0 0;}
#staff_detail .portrait{width:100%;margin:0 0 40px;}

#staff_detail .block_ttl{text-align:center;margin:30px 0 0;}
#staff_detail .block_ttl span::before{margin:8px auto 18px;}
#staff_detail .txt{margin:30px 0 40px;}
#staff_detail .pic{margin:0 0 35px;}
#staff_detail .pic ul{display:block;}
#staff_detail .pic ul li{width:100%;}
#staff_detail .pic ul li + li{margin:8px 0 0;}
}