/* ================================
  company
  MB→PC min-width:768px
================================ */

#company .ellipsis {
display: inline;
}

/* -------------------------------- 
  会社案内 スタッフ紹介 共通
-------------------------------- */
#company .mainExplanation{
text-align:center;
padding:60px 50px;
}
#company .mainExplanation h2{
color:#e50012;
border-bottom: 2px dotted #e50012;
padding: 0 5px 15px;
font-size:32px;
}
#company .mainExplanation p{
text-align:center;
padding-top:25px;
}
#company .displayPc {
display:block;
}
#company .displaySp {
display:none;
}

@media screen and (max-width: 768px) {
  #company .displayPc{
  display:none;
  }
  #company .displaySp{
  display:block;
  }
}


/* -------------------------------- 
  会社案内
-------------------------------- */
#company .pkTxt {
position: absolute;
display: inline-block;
margin: 0 0 0 -10px;
padding: 0.3em 1em 0.3em 0.8em;
border-radius: 0 100vh 100vh 0;
background: #e50012;
color:#fff;
-webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, .2);box-shadow: 1px 2px 5px rgba(0, 0, 0, .2);
}

#company .pkTxt:before {
position: absolute;
bottom: -10px;
left: 0;
width: 0;
height: 0;
content: '';
border-top: 10px solid #333;
border-left: 10px solid transparent;
}
#company .companyAbout{
background:#f5f3e9;
padding:30px 5% 0 0;
position:relative;
margin: 50px 0;
}
#company .companyAbout p{
padding:60px 0 30px 5%;
width:65%;
}
#company .companyAbout p span{
display:block;
}
#company .companyAbout img{
position:absolute;
right:0;
bottom:0;
margin-right:15px;
max-width:240px;
}
#company .companyAbout strong{
color:#e50012;
font-size:30px;
font-style:italic;
display:block;
padding-top:15px;
}
@media all and (-ms-high-contrast: none) {
#company .companyAbout strong{
font-style:normal;
}
}


#company #honsya{
overflow:hidden;
padding-bottom:8rem;
}
#company .overview{
width: 48%;
float:left;
}
#company .overview dl:first-child {
border-top:1px dotted #000;	
}
#company iframe {
margin-top:3rem;
border:1px solid #ccc !important;
}


#company .overview dl {
overflow:hidden;
background:#f5f3e9;
border-bottom:1px dotted #000;
text-align:left;
margin:0;
}
#company .overview dt{
padding: 15px 0 15px 5%;
width:115px;
float:left;
}
#company .overview dd {
margin-left:115px;
padding: 15px 0 15px 5%;
background:#fff;
}
#company .overviewImg{
width: 48%;
float:right;
}
#company .overviewImg img{
width:100%;
}
#company .overview h3{
font-size:27px;
padding-bottom:15px;
border-bottom:1px dotted #000;	
}

#company .businessContent ul,
#company .license ul{
overflow:hidden;
list-style: none;
list-style-position: inside;
padding: 10px 0 0;
}
#company .businessContent ul li,
#company .license ul li{
padding-left: 1em;
text-indent: -1em;
}
#company .businessContent ul li::before,
#company .license ul li::before{
content: '●';
color:#e50012;
font-size: 1.5em;
padding: 0 8px 0 0;
}

#company .license .grLeft{
overflow:hidden;
}
#company .license .grLeft{
float:left;
width:48%;
}
#company .license .grRight{
float:right;
width:48%;
}

#company .groupCompany .grBox{
background:#f5f3e9;
padding:20px 3% 20px 0;
overflow:hidden;
margin-bottom:25px;
}
#company .groupCompany .grBox .grLeft{
float:left;
width:65%;
}
#company .groupCompany .grBox .grLeft dt{
border-bottom:1px dotted #000;
padding:0 5% 20px 5%;
position:relative;
}
#company .groupCompany .grBox .grLeft dt span{
position:absolute;
left:230px;
top:85px;
}
#company .groupCompany .grBox .grLeft dd{
padding:20px 5%;
}
#company .groupCompany .grBox .grReft{
float:right;
width: 33%;
max-width:320px;
}
#company .groupCompany .grBox .grReft .btn {
width:100%;
margin:0;
font-size: 14px;
}
#company .groupCompany .grBox .grReft img {
margin-bottom:20px;
width:100%;
max-width: 320px;
}
#company .license {
overflow:hidden;
}

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

  #company .companyAbout {
  margin: 2rem 0;
  }
  #company .companyAbout img {
  width:40%;
  max-width:200px;
  margin-right:0;
  }
  #company .companyAbout p {
  width:100%;
  }
  #company .companyAbout p span {
  width:60%;
  }
  #company .companyAbout p strong {
  font-size:20px;
  }
  #company .mainExplanation h2 {
  font-size: 1.4rem;
  }
  #company .mainExplanation {
  text-align:left;
  padding: 2rem 0;
  }
  #company .mainExplanation p {
  text-align:left;
  }
  #company .overview {
  width:100%;
  float:none;
  }
  #company .overviewImg{
  width:100%;
  float:none;
  padding-top:1.5rem;
  }
  #company .overviewImg ul{
  padding:0;
  }
  #company iframe{
  margin-top: 1.2rem;
  height: 260px;
  }

  #company #honsya {
  padding-bottom: 3rem;
  }
  #company .license .grLeft,
  #company .license .grRight {
  float:none;
  width:100%;
  }
  #company .groupCompany .grBox .grLeft {
  float:none;
  width:100%;
  }
  #company .groupCompany .grBox {
  padding:0 0 20px 0;
  }
  #company .groupCompany .grBox .grLeft dt{
  padding:0 5% 10px 5%;
  text-align:center;
  }
  #company .groupCompany .grBox .grReft{
  float:none;
  width: 100%;
  padding: 0 5%;
  max-width: 768px;
  text-align: center;
  margin-top: -20px;
  }
  #company .overview h3 {
  font-size: 1.4rem;
  }

  #company .groupCompany .grBox .grLeft dt span {
  position: static;
  display: block;
  }
}


/* -------------------------------- 
  スタッフ紹介
-------------------------------- */
.staffIntroduction{
overflow: hidden;
}

.staff{
background: #f5f3e9;
width: 31%;
margin: 0 1.1% 30px;
float: left;
padding-bottom: 20px;
}
.staff img {
width: 100%;
}
.staff .stTitle{
border-bottom: 1px dotted #000;
overflow: hidden;
}

.staff h3{
padding: 20px 5% 15px;
font-size:1rem;
}
.staff h3 strong{
display:block;
font-size:1.5rem;
margin-top:5px;
}
.staff p{
padding: 20px 5% 15px;
}
.staff .qualification{
background:#fff;
margin: 0 5%;
overflow: hidden;
}

.staff ul {
overflow:hidden;
list-style: none;
list-style-position: inside;
padding-bottom:10px;
}
.staff ul li {
padding-left: 1em;
text-indent: -1em;
font-size: 0.8em;
margin-bottom:0;
}

.staff ul li::before {
content: '●';
color:#e50012;
font-size: 1.7em;
padding:0 8px 0 0;
margin-top:-40px;
}

@media screen and (max-width: 960px) {/*調整*/
  .staff{
  background:#f5f3e9;
  width:48%;
  margin: 0 1% 30px 1%;
  float:left;
  padding-bottom:20px;
  }
}

@media screen and (max-width: 768px) {
  .staff ul li::before{
  font-size: 1.2em;
  }
}
@media screen and (max-width: 600px) {/*調整*/
  .staff {
  background:#f5f3e9;
  width: 100%;
  margin: 0 0 20px 0;
  float:left;
  padding-bottom:20px;
  }
  .staff img{
  width:48%;
  float:left;
  }
  .staff .stTitle{
  position:relative;
  }
  .staff h3{
  position:absolute;
  top: 50%;
  left: 0%;
  transform: translateY(-50%);
  padding: 0 0 0 55%;
  }
  .staff h3 strong{
  font-size:1.3rem;
  }
}

