@charset "utf-8";

/*------------------------------------------------
csr
------------------------------------------------*/

.main-content {
  background-image: url(../../images/csr/csr_bg.jpg);
  background-position: right bottom -10px;
  background-size: 80%;
}

@media print, screen and (min-width: 769px) {
  .main-content {
    background-position: right bottom -50px;
    background-size: auto;
  }
}

/*------------------------------------------------
csr
------------------------------------------------*/
.csr {}
.csr-subtitle {
  color: #2c4390;
  text-align: center;
  font-size: 2.2rem;
  font-family: "Noto serif JP", serif;
  margin-bottom: 25px;
}
.csr-list {}
.csr-item {
  margin-bottom: 50px;
}
.csr-item-name.title-type-tag {}
.csr-item-inner {}
.csr-item-pic-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin: 15px 0;
}
.csr-item-pic-item {
  width: calc(100% / 3 - 5px);
}
.csr-item-pic-item > img {
  width: 100%;
}
.csr-item-detail {}
.csr-item-detail-text {
  padding-bottom: 15px;
}
.csr-subitem {
  padding: 20px;
  background-color: #dceaf6;
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
}
.csr-subitem-title {
  color: #2c4390;
  font-size: 1.8rem;
  line-height: 1.6;
  text-align: center;
  padding-bottom: 10px;
}
.csr-subitem-text {}

.csr-link {
  color: #fff;
  padding: 15px;
  background-color: #3fa2db;
  display: block;
  margin: -15px auto 0;
  width: 80%;
  text-align: center;
}

@media print, screen and (min-width: 769px) {
  .csr-subtitle {
    font-size: 4rem;
    line-height: 1.8;
    margin-bottom: 50px;
  }
  .csr-item-name.title-type-tag {
    width: 500px;
    margin: auto;
  }
  .csr-item-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
    width: 100%;
    margin: 50px 0 100px;
  }
  .csr-item-pic-list {
    width: 570px;
    height: 470px;
    margin: 0;
    flex-direction: column;
    align-content: space-around;
    justify-content: space-around;
  }
  .csr-item-pic-item {
    width: 280px;
    height: 210px;
  }
  .csr-item-detail {
    width: 400px;
  }
  .csr-item-detail-text {
    padding-bottom: 35px;
    font-size: 1.9rem;
  }
  .csr-subitem-title {
    font-size: 2.4rem;
  }
  .csr-subitem-text {
    font-size: 1.75rem;
    text-align: center;
  }
  .csr-link {
    width: 60%;
    padding: 10px;
    margin: -10px -15px 0 auto;
    box-shadow: 5px 5px 0 rgba(44, 67, 144, 0.2);
  }
}
