@charset "utf-8";

.lead-text {
  line-height: 1.6;
}
.lead-text__heading {
  color: #666;
  font-size: 1.8rem;
}
@media only screen and (min-width: 768px) {
  .lead-text__heading {
    font-size: 2.8rem;
  }
}
.lead-text__text {
  font-size: 1.3rem;
}
.lead-text__heading +.lead-text__text,
.lead-text__text +.lead-text__text,
.lead-text__note +.lead-text__text {
  margin-top: 30px;
}
.lead-text__text strong {
  font-size: 1.5rem;
}
@media only screen and (min-width: 768px) {
  .lead-text__text {
    font-size: 1.7rem;
    line-height: 2;
  }
  .lead-text__heading +.lead-text__text,
  .lead-text__text +.lead-text__text {
    margin-top: 50px;
  }
  .lead-text__text strong {
    font-weight: normal; 
    font-size: 2.8rem;
    font-family: GothamMedium, sans-serif;
  }
}
.ci-inner--980 .lead-text__text {
  font-size: 1.5rem;
}
@media only screen and (min-width: 768px) {
  .ci-inner--980 .lead-text__text {
    font-size: 2rem;
  }
}
.lead-text__note {
  font-size: 1.2rem;
}
.lead-text__text +.lead-text__note {
  margin-top: 30px;
}
@media only screen and (min-width: 768px) {
  .lead-text__note {
    font-size: 1.4rem;
  }
}
.lead-text__text +.lead-text__img,
.lead-text__note +.lead-text__img {
  margin-top: 80px;
}

.page__title {
  text-align: center;
}
.page__title .lead-text__heading {
  padding: 30px 0;
}
@media only screen and (min-width: 768px) {
  .page__title .lead-text__heading {
    padding: 106px 0; 
    font-weight: normal;
    font-size: 3.6rem;
    font-family: GothamBold, sans-serif;
  }
}

.article-list__item:nth-of-type(n+2) {
  margin-top: 30px;
}
.article-list__item a {
  display: block;
  text-decoration: none;
  background: #fff;
}
.article-list__detail {
  padding: 20px;
}
.article-list__type {
  font-size: 1.4rem;
  font-family: GothamBold, sans-serif;
  margin: 0 0 10px;
}
.article-list__title {
  font-size: 1.4rem;
  line-height: 1.4;
  font-weight: bold;
}
.article-list__text {
  font-size: 1.2rem;
  line-height: 1.4;
  margin: 10px 0 0;
}
.article-list__date {
  color: #999;
  font-family: GothamMedium, sans-serif;
  font-size: 1.2rem;
  margin: 10px 0 0;
}
.article-list__btn {
  margin: 30px 0 0;
}
.article-list__btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 34px;
  max-width: 84px;
  font-family: GothamMedium, sans-serif;
  font-size: 1.0rem;
  text-decoration: none;
  text-align: center;
  padding: 5px;
  margin: 0 auto;
  border: 1px solid #666;
  border-radius: 25px;
}
@media only screen and (min-width: 768px) {
  .article-list__item:nth-of-type(n+2) {
    margin-top: 50px;
  }
  .article-list__content {
    display: flex;
  }
  .article-list__img {
    width: 36.7347%;
  }
  .article-list__detail {
    display: flex;
    flex-direction: column;
    width: 63.2653%;
    padding: 4% 7%;
  }
  .article-list__type {
    font-size: 1.8rem;
    margin: 0 0 15px;
  }
  .article-list__title {
    font-size: 1.8rem;
    min-height: 2.8em;
  }
  .article-list__text {
    font-size: 1.4rem;
    margin: 10px 0;
  }
  .article-list__date {
    font-size: 1.4rem;
    margin: auto 0 0;
  }
  .article-list__btn {
    margin: 40px 0 0;
  }
  .article-list__btn a {
    height: 40px;
    max-width: 110px;
    font-size: 1.4rem;
  }
}

.article-detail__mainvisual img {
  width: 100%;
}

.article-detail__inner {
  /*max-width: 750px;*/
  margin: 0 auto;
}

.article-detail__header {
  text-align: center;
  margin: 0 0 50px;
}
.article-detail__type {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 58px;
  max-width: 100px;
  color: #fff;
  font-size: 1.4rem;
  font-family: GothamBold, sans-serif;
  background: #999;
  margin: 0 auto;
}
.article-detail__heading {
  font-size: 2.0rem;
  font-weight: bold;
  line-height: 1.4;
  margin: 30px 0 0;
}
.article-detail__date {
  color: #999;
  font-family: GothamMedium, sans-serif;
  font-size: 1.4rem;
  margin: 20px 0 0;
}
.article-detail__credit {
  color: #999;
  font-family: GothamMedium, sans-serif;
  font-size: 1.2rem;
  margin: 15px 0 0;
}
@media only screen and (min-width: 768px) {
  .article-detail__type {
    font-size: 2.4rem;
    height: 92px;
    min-width: 156px;
  }
  .article-detail__heading {
    font-size: 4.0rem;
    margin: 40px 0 0;
  }
  .article-detail__date {
    font-size: 1.7rem;
    margin: 30px 0 0;
  }
  .article-detail__credit {
    margin: 20px 0 0;
  }
}

.article-detail__body {
  margin: 40px 0;
}
.the_content {
  font-size: 1.3rem;
  line-height: 1.6;
  margin: 20px 0;
}
.the_content.type-lead-text {
  font-size: 1.4rem;
  font-weight: bold;
}
.the_content.type-notes {
  font-size: 1.2rem;
}
.the_content h1,
.the_content h2 {
  /*max-width: 750px;*/
  font-size: 1.4rem;
  font-weight: bold;
  margin: 2em auto;
}
.the_content h1 {
  text-align: center;
}
.the_content p, .p_block { /* 2020.05.01 p_block追加 */
  /*max-width: 750px;*/
  margin: 1.6em auto;
}
.the_content img {
  display: block;
  margin: 40px 0;
}
.the_content img + strong {
  display: block;
  margin: -30px 0 40px 0;
  text-align: center;
  font-size: 1.2rem;
  font-weight: normal;
}
@media only screen and (min-width: 768px) {
  .article-detail__body {
    margin: 50px 0 90px;
  }
  .the_content {
    font-size: 1.5rem;
    margin: 40px 0;
  }
  .the_content.type-lead-text {
    font-size: 2.2rem;
    margin: 50px 0 60px;
  }
  .the_content.type-notes {
    font-size: 1.3rem;
  }
  .the_content h1,
  .the_content h2 {
    font-size: 2.2rem;
  }
  .the_content img {
    margin: 80px 0;
  }
  .the_content img + strong {
    margin: -60px 0 80px 0;
  }
}

.article-detail__footer {
  margin: 40px 0;
}
@media only screen and (min-width: 768px) {
  .article-detail__footer {
    margin: 80px 0;
  }
}

.article-following {
  background: #fafafa;
  padding: 45px 25px;
  margin: 30px 0;
}
.article-following__btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50px;
  max-width: 220px;
  color: #448BDE;
  font-size: 1.3rem;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  padding: 5px;
  margin: 0 auto;
  border: 3px solid;
  border-radius: 25px;
}
.article-following__text {
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.6;
  margin: 30px 0 0;
}
@media only screen and (min-width: 768px) {
  .article-following {
    padding: 40px 55px;
    margin: 40px 0;
  }
  .article-following__btn a {
    max-width: 300px;
    font-size: 1.5rem;
  }
  .article-following__text {
    font-size: 2.0rem;
  }
}

.article-tag {
  margin: 30px 0;
}
.article-tag__heading {
  color: #999;
  font-family: GothamMedium, sans-serif;
  font-size: 1.7rem;
  margin: 0 0 10px;
}
.article-tag__items {
  display: flex;
  flex-wrap: wrap;
}
.article-tag__item {
  color: #448BDE;
  font-size: 1.5rem;
  line-height: 1.6;
  margin: 0 1em 0 0;
}
.article-tag__item a {
  text-decoration: none;
}
.article-tag__item a:hover {
  text-decoration: underline;
}
@media only screen and (min-width: 768px) {
  .article-tag {
    margin: 40px 0;
  }
}

.article-share {
  text-align: center;
  background: #fafafa;
  padding: 30px 10px 40px;
  margin: 30px 0;
}
.article-share__heading {
  font-size: 1.4rem;
  margin: 0 0 20px;
}
.article-share__items {
  display: flex;
  justify-content: center;
}
.article-share__item {
  margin: 0 10px;
}
.article-share__item a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  background: #ddd;
  border-radius: 50%;
}
.article-share__item svg {
  width: 30px;
  height: 30px;
  fill: #fff;
}
.article-share__item.type-facebook a {
  background: #3C5A96;
}
.article-share__item.type-twitter a {
  background: #36ABDF;
}
.article-share__item.type-line a {
  background: #00B900;
}
@media only screen and (min-width: 768px) {
  .article-share {
    padding: 30px 55px;
    margin: 40px 0;
  }
}

.responsive-iframe {
  position: relative;
  z-index: 1;
}
.responsive-iframe:before {
  content: '';
  display: block;
  padding-top: 56.25%;
}
.responsive-iframe iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}