@charset "UTF-8";

.caseStudy-list {
  border-bottom: 1px solid #d8dade;
  padding-bottom: 28px;
}

.caseStudy-list:before,
.caseStudy-list:after {
  content: " ";
  display: table;
}

.caseStudy-list:after {
  clear: both;
}

.caseStudy-list .caseStudy-img {
  float: left;
  margin: 0 auto;
  overflow: hidden;
  width: 120px;
  height: 120px;
  border-radius: 50%;
}

.caseStudy-list .caseStudy-body {
  float: right;
  width: calc(100% - 140px);
}

.caseStudy-list .caseStudy-body .caseStudy-tit {
  font-size: 28.8px;
  font-size: 1.8rem;
  line-height: 1.6;
}

.caseStudy-list .caseStudy-body .caseStudy-name {
  margin-top: 8px;
  font-weight: bold;
  line-height: 1.4;
  color: #333;
  font-size: 25.6px;
  font-size: 1.6rem;
}

a .caseStudy-tit {
  text-decoration: underline;
}

.caseStudy-heading1 {
  padding-bottom: 14px;
  border-bottom-style: solid;
  border-bottom-color: #d8dade;
  border-bottom-width: 3px;
}

.caseStudy-heading1 h1 {
  font-size: 57.6px;
  font-size: 3.6rem;
  line-height: 1.4;
}

.caseStudy-heading2 h2 {
  font-size: 44.8px;
  font-size: 2.8rem;
  line-height: 1.4;
}

.caseStudy-detail {
  border-top: 1px solid #d8dade;
  border-bottom: 1px solid #d8dade;
  padding: 40px 0;
}

.caseStudy-heading1 + div > .caseStudy-detail {
  border-top: none;
  padding-top: 0;
}

.caseStudy-detail .caseStudy-img {
  float: left;
  overflow: hidden;
  width: 120px;
  height: 120px;
  border-radius: 50%;
}

.caseStudy-detail .caseStudy-voice {
  float: right;
  width: calc(100% - 144px);
}

.caseStudy-detail .caseStudy-voice .icon {
  float: left;
  max-width: 100px;
  margin-top: 5px;
}

.caseStudy-detail .caseStudy-voice .icon p {
  padding: 8px 12px;
  background-color: #003399;
  color: #fff;
  line-height: 1;
  font-weight: bold;
  font-size: 19.2px;
  font-size: 1.2rem;
  border-radius: 3px;
}

.caseStudy-detail .caseStudy-voice .lead {
  color: #003399;
  font-size: 35.2px;
  font-size: 2.2rem;
  font-weight: bold;
}

.caseStudy-detail .caseStudy-voice .name {
  margin-top: 14px;
}

.caseStudy-detail .caseStudy-companyInfo {
  float: right;
  width: calc(100% - 144px);
  border-top: 1px solid #d8dade;
  margin-top: 20px;
  padding-top: 25px;
}

.caseStudy-detail .caseStudy-companyInfo .name {
  font-weight: bold;
  font-size: 28.8px;
  font-size: 1.8rem;
}

.caseStudy-detail .caseStudy-companyInfo dl {
  margin-top: 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.caseStudy-detail .caseStudy-companyInfo dl dt {
  width: 90px;
  position: relative;
}

.caseStudy-detail .caseStudy-companyInfo dl dt:after {
  content: "：";
  position: absolute;
  right: 0;
}

.caseStudy-detail .caseStudy-companyInfo dl dd {
  width: calc(100% - 90px);
}

@media screen and (min-width: 737px) {
  a:hover .caseStudy-tit {
    text-decoration: none;
  }

  .caseStudy-detail .caseStudy-voice .lead {
    float: right;
    line-height: 1.6;
    width: calc(100% - 110px);
  }
}

@media screen and (min-width: 872px) {
  .caseStudy-container {
    width: 872px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 736px) {
  .caseStudy-list {
    padding-top: 4px;
    padding-bottom: 14px;
  }

  .caseStudy-list .caseStudy-img {
    width: 90px;
    height: 90px;
  }

  .caseStudy-list .caseStudy-img img {
    width: 100%;
    height: 100%;
  }

  .caseStudy-list .caseStudy-body {
    width: calc(100% - 104px);
  }

  .caseStudy-list .caseStudy-body .caseStudy-name {
    font-size: 1.4rem;
  }

  .caseStudy-heading1 {
    padding-top: 14px;
    padding-bottom: 7px;
    border-bottom-width: 4px;
  }

  .caseStudy-heading1 h1 {
    font-size: 2.7rem;
  }

  .caseStudy-heading2 h2 {
    font-size: 2.1rem;
  }

  .caseStudy-detail {
    padding: 25px 0;
  }

  .caseStudy-detail .caseStudy-img {
    width: 90px;
    height: 90px;
  }

  .caseStudy-detail .caseStudy-img img {
    width: 100%;
    height: 100%;
  }

  .caseStudy-detail .caseStudy-voice {
    width: calc(100% - 114px);
  }

  .caseStudy-detail .caseStudy-voice .icon {
    display: inline-block;
    float: none;
    max-width: none;
    margin-top: 0;
  }

  .caseStudy-detail .caseStudy-voice .icon p {
    font-size: 1.0rem;
  }

  .caseStudy-detail .caseStudy-voice .lead {
    font-size: 1.8rem;
    line-height: 1.5;
    margin-top: 7px;
  }

  .caseStudy-detail .caseStudy-companyInfo {
    clear: both;
    width: 100%;
  }

  .caseStudy-detail .caseStudy-companyInfo .name {
    font-size: 1.5rem;
  }

  .caseStudy-detail .caseStudy-companyInfo dl dt {
    width: 80px;
  }

  .caseStudy-detail .caseStudy-companyInfo dl dd {
    width: calc(100% - 80px);
  }
}

@media screen and (max-width: 736px) and (min-width: 737px) {
  .caseStudy-list .caseStudy-img img {
    -webkit-transition: background .5s ease;
    transition: background .5s ease;
  }
}