@charset "utf-8";

#mainTitle{background-image:url(../images/bg_maintitle.jpg);}

.staffBox{
    overflow:hidden;
}

.staffBox li{
    width:32%;
    float:left;
    margin-bottom:2%;
    margin-right:2%;
    background-color:#f6f6f6;
}

.staffBox li.link-box:hover{opacity:0.8;}

.staffBox li.nth03{margin-right:0;}

.staffBox li > div{
    padding:20px 20px 40px;
    position:relative;
}
.staffBox li > div dl{margin-bottom:5px;}
.staffBox li > div dt{
    font-size:	1.267em;
    line-height:1.7;
}
.staffBox li > div dd{
    font-size:0.933em;
    color:#666;
    line-height:1.7;
}

.staffBox li > div > .mail{
    background:url(../../common/images/ico_mail.svg) 0 5px no-repeat;
    background-size:16px auto;
    padding-left:25px;
    word-break:break-all;
    text-decoration:underline;
    color:#C06264;
}

.staffBox li > div > .detailLink{
    display:block;
    width:25px;
    height:25px;
    position:absolute;
    bottom:0;
    right:0;
}

.staffBox.sub li{
    width:29%;
    float:left;
    margin-bottom:2%;
    margin-right:2.5%;
    background-color:#f6f6f6;
}
.staffBox.sub li > div{
    padding:20px;
}


/*detail
------------------------------------*/

.staffDetail{
    overflow:hidden;
}

.staffDetail .img{
    width:44.87%;
    float:left;    
}
.staffDetail .txt{
    width:50%;
    float:right;
    text-align:left; 
}

.staffDetail .txt .name{
    font-size:1.600em;    
}
.staffDetail .txt .name span{
    display:block;
    font-size:0.583em;
    color:#666666;
}
.staffDetail .txt .name + .info{
    margin-top:0;
    margin-bottom:5px;
    color:#666666;
    font-size:0.933em;
}

.staffDetail .txt .mail{
    background:url(../../common/images/ico_mail.svg) 0 5px no-repeat;
    background-size:16px auto;
    padding-left:25px;
    word-break:break-all;
    text-decoration:underline;
    color:#C06264;
}

.staffDetail .txt dl{
    margin-top:15px;
}
.staffDetail .txt dl dt,
.staffDetail .txt dl dd{
    font-size:0.933em;
}
.staffDetail .txt dl dd span{
    display:block;
    margin-left:1em;
}
.staffDetail .txt dl dd ul li{
    position:relative;
    padding-left:1.5em;
}
.staffDetail .txt dl dd ul li:before{
    content:"・";
    position:absolute;
    top:0;
    left:0;
}

section .archive{
    background-color:#f6f6f6;
    padding:20px 10px 20px 30px;
    text-align:left; 
}
section .archive ul li{
    display:inline-block;
    text-align:left;
    margin-right:1.5em;
}

#container .staffDetail h2{
    font-size:1.733em;
    text-align:left;
    margin-bottom:20px;
    border-bottom:none;
}


section .archive + h2,
section .history + h2,
section ol + h2,
.staffDetail .society + h2,
#container section ol + .archive,
#container section ul + .archive { margin-top:50px; }

.staffDetail h2 + h2{margin-top:80px;}

section ul.history{
    border-top:#e7e7e7 1px solid;
}

section ul.history li{
    padding:20px 0 20px 0;    
    border-bottom:#e7e7e7 1px solid;
}

section ul.history li span{
    display:block;
    font-weight:bold;
}
.staffDetail .society{
    border-top:#e7e7e7 1px solid;
    padding-top:20px;    
}


section ol{
    border-top:#e7e7e7 1px solid;
    counter-reset:num;
}
section ol li{
    padding:20px 0 20px 40px;    
    border-bottom:#e7e7e7 1px solid;
    position:relative;
}

section ol li::before{
    counter-increment:num;
    content:counter(num)" .";
    position:absolute;
    top:20px;
    left:0;
}

section ol li span.uline{text-decoration:underline;}




@media screen and (min-width : 768px) and (max-width : 1139px){
    
}


@media screen and (max-width: 767px) {
    
.staffBox li{
    width:47.1%;
    float:left;
    margin-bottom:5.8%;
    margin-right:0;
}
.staffBox li.odd{float:right !important;}

.staffBox li > div{
    padding:15px 15px 30px;
}

.staffBox.sub li{
    width:42%;
    margin-bottom:5%;
    margin-right:5%;
}

.staffBox.sub li.odd{float:left !important;}
   
   
.staffDetail .img,
.staffDetail .txt{
    width:auto;
    float:none;    
}
 .staffDetail .img{
     max-width:300px;
     margin:0 auto 30px;
 }
    
}