/* 座談会／同期
=========================================================================
=========================================================================*/
article {
  margin-top: 0;
}

/* Page title
-----------------------------------------------------------*/
.page_title {
  overflow: hidden;
  position: relative;
  margin-bottom: 57px;
  height: 840px;
  background: url('../images/special/discussion01/title_bg.jpg?20251019') center center no-repeat;
  background-size: cover;
}

.page_title .inner {
  position: absolute;
  bottom: 50px;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 0 15px;
}

.page_title .text {
  position: relative;
  margin: 0 auto;
  padding: 123px 15px 28px;
  max-width: 972px;
  height: fit-content;
  /*background: linear-gradient(to bottom, transparent 20%, rgba(255, 255, 255, .8) 20%);*/
  background-color: rgba(255, 255, 255, .8);
  box-shadow: 1px 1px 4px rgba(0, 0, 0, .25);
}

@media screen and (max-width:1002px) {
  .page_title .text {
    padding: calc(123 / 1002 * 100%) 15px 28px;
  }
}

/*.page_title .text h1 {
  position: relative;
  margin: 0 auto 30px;
  max-width: 732px;
  width: calc(732 / 942 * 100%);
}*/

.page_title .text h1 {
  position: absolute;
  top: calc(-80 / 290 * 100%);
  left: 0;
  right: 0;
  margin: 0 auto;
  max-width: 732px;
  width: calc(732 / 942 * 100%);
}

.page_title .text p {
  text-align: center;
}

/* Member
-----------------------------------------------------------*/
.member {
  margin: 0 auto 60px;
  max-width: 946px;
}

@media screen and (max-width:976px) {
  .member {
    padding: 0 15px 0;
  }
}

.member h2 {
  width: 280px;
}

.member .list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}

.member .list ul {
  width: calc(444 / 946 * 100%);
}

.member ul {
  display: flex;
  flex-wrap: wrap;
  gap: 50px 0;
}

.member ul:first-child {
  margin-top: 70px;
}

.member ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.member ul li picture {
  width: calc(148 / 444 * 100%);
}

.member ul li .introduction {
  width: calc(270 / 444 * 100%);
}

.member ul li .introduction img {
  margin-bottom: 20px;
}

.member ul:first-child li:nth-child(1) .introduction img {
  width: 148px;
}

.member ul:first-child li:nth-child(2) .introduction img {
  width: 151px;
}

.member ul:last-child li:nth-child(1) .introduction img {
  width: 123px;
}

.member ul:last-child li:nth-child(2) .introduction img {
  width: 123px;
}

.member ul li .introduction p {
  font-size: 14px;
  line-height: 1.57em;
}

/* Start
-----------------------------------------------------------*/
.start {
  position: relative;
  padding-bottom: 30px;
}

.start::before {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 0;
  width: 100%;
  height: 234px;
  background: url(../images/special/discussion01/talk_start_bg.png?20251019) center bottom no-repeat;
  background-size: contain;
  z-index: -1;
}

.start figure.heading {
  align-items: center;
  display: flex;
}

.start figure.heading::before,
.start figure.heading::after {
  background-color: #EAEAEA;
  content: "";
  flex-grow: 1;
  height: 1px;
}

.start figure.heading::before {
  margin-right: 30px;
}

.start figure.heading::after {
  margin-left: 30px;
}

.start figure.heading img {
  width: 331px;
}

/* Talk
-----------------------------------------------------------*/
.talk {
  margin-bottom: 100px;
}

.talk>picture {
  display: block;
}

.talk .inner {
  margin: 0 auto;
  max-width: 1082px;
}

.talk_content {
  position: relative;
  margin: -106px 0 0;
  padding: 0 90px 60px;
  width: 100%;
  background: linear-gradient(to bottom, transparent 36px, #F4F8F9 36px);
}

.talk_content h2 {
  position: relative;
  margin: 0 auto 30px;
  padding: .25em 1em;
  max-width: 802px;
  font-weight: 600;
  font-size: 35px;
  line-height: 1.45em;
  color: #FFF;
  text-align: center;
  background: linear-gradient(67.5deg, rgb(65, 136, 211), rgb(113, 178, 224));
}

.talk_content h2::before {
  content: "";
  position: absolute;
  top: -27px;
  left: 0;
  width: 85px;
  height: 27px;
  background: url(../images/special/discussion01/talk_theme.png?20251019) center bottom no-repeat;
  background-size: contain;
}

.talk_content h3 {
  margin-bottom: 60px;
  font-weight: 600;
  font-size: 26px;
  line-height: 1.5em;
  text-align: center;
}

.talk_content ul {
  display: flex;
  flex-wrap: wrap;
  gap: 48px 0;
}

.talk_content ul li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}

.talk_content ul li picture {
  width: calc(130 / 902 * 100%);
}

.talk_content ul li p {
  width: calc(720 / 902 * 100%);
}

/* Message
-----------------------------------------------------------*/
.message {
  margin-bottom: 80px;
}

.message .title {
  position: relative;
}

.message .title>picture {
  display: block;
}

.message h2 {
  position: absolute;
  top: calc(322 / 660 * 100%);
  left: 0;
  right: 0;
  margin: 0 auto;
  max-width: 947px;
  z-index: 2;
}

.message .inner {
  margin: 0 auto;
  max-width: 1082px;
}

@media screen and (max-width:1112px) {
  .message .inner {
    padding: 0 15px;
  }
}

.message .inner .message_content {
  position: relative;
  margin: -65px 0 20px;
  padding: 60px 60px;
  width: 100%;
  background-color: rgba(244, 248, 249, .82);
}

.message .inner .message_content ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  gap: 46px 0;
}

.message .inner .message_content ul li {
  display: flex;
  flex-direction: column;
  width: calc(468 / 962 * 100%);
}

.message .inner .message_content ul li figure {
  display: flex;
  flex-direction: column;
  flex: 1;
  text-align: center;
}

.message .inner .message_content ul li img {
  margin: 0 auto;
  width: calc(370 / 468 * 100%);
  border-radius: 50%;
}

.message .inner .message_content ul li figcaption {
  flex: 1;
  display: flex;
  align-items: center;
  position: relative;
  margin-top: -25px;
  padding: 15px 34px;
  color: #FFF;
  text-align: left;
  background: linear-gradient(67.5deg, rgb(29, 80, 162), rgb(81, 193, 192));
}

.message .inner span {
  display: block;
  margin-left: auto;
  width: 72px;
}

/* Banner
-----------------------------------------------------------*/
.banner {
  padding: 70px 15px;
  background: linear-gradient(#E5EDF9, #FFF);
}

.banner a {
  display: block;
  margin: 0 auto;
  max-width: 924px;
  transition: 0.6s;
}

@media(hover: hover) {
  .banner a:hover {
    transform: scale(1.025, 1.025);
    opacity: .9;
  }
}

/*  スマホ（767px以下）
=========================================================================
=========================================================================*/
@media screen and (max-width:767px) {
  article {
    margin-top: 58px;
  }

  /* Page title
  -----------------------------------------------------------*/
  .page_title {
    margin-bottom: 70px;
    height: auto;
  }

  .page_title .inner {
    bottom: 0;
  }

  .page_title .text {
    position: relative;
    margin: 0 auto;
    padding: 80px 15px 28px;
    /*padding: calc(100 / 767 * 100%) 15px 28px;*/
    /*max-width: 972px;*/
  }

  .page_title .text h1 {
    top: -40px;
    max-width: 342px;
    width: 100%;
    width: calc(342 / 360 * 100%);
  }

  .page_title .text p {
    line-height: 1.4em;
  }

  /* Member
  -----------------------------------------------------------*/
  .member {
    margin: 0 auto 100px;
  }

  .member h2 {
    margin-bottom: 15px;
    width: 206px;
  }

  .member .list {
    gap: 20px 0;
  }

  .member .list ul {
    width: 100%;
  }

  .member ul {
    gap: 20px 0;
  }

  .member ul:first-child {
    margin-top: 0;
  }

  .member ul li picture {
    width: calc(100 / 357 * 100%);
  }

  .member ul li .introduction {
    width: calc(237 / 357 * 100%);
  }

  .member ul li .introduction img {
    margin-bottom: 10px;
  }

  .member ul:first-child li:nth-child(1) .introduction img {
    width: 148px;
    width: calc(148px * 0.7);
  }

  .member ul:first-child li:nth-child(2) .introduction img {
    width: 151px;
    width: calc(151px * 0.7);
  }

  .member ul:last-child li:nth-child(1) .introduction img {
    width: 123px;
    width: calc(123px * 0.7);
  }

  .member ul:last-child li:nth-child(2) .introduction img {
    width: 123px;
    width: calc(123px * 0.7);
  }

  .member ul li .introduction p {
    font-size: 11px;
    line-height: 1.57em;
  }

  /* Start
  -----------------------------------------------------------*/
  .start {
    padding-bottom: 20px;
  }

  .start::before {
    bottom: 36px;
    height: 90px;
  }

  .start figure.heading::before {
    margin-right: 15px;
  }

  .start figure.heading::after {
    margin-left: 15px;
  }

  .start figure.heading img {
    width: 270px;
  }

  /* Talk
  -----------------------------------------------------------*/
  .talk {
    margin-bottom: 70px;
  }

  .talk_content {
    margin: -15px 0 0;
    padding: 0 15px 60px;
    background: linear-gradient(to bottom, transparent 15px, #F4F8F9 15px);
  }

  .talk_content h2 {
    margin: 0 auto 17px;
    padding: .25em 1em;
    font-size: 20px;
  }

  .talk_content h2::before {
    top: -19px;
    width: 59px;
    height: 19px;
  }

  .talk_content h3 {
    margin-bottom: 35px;
    font-size: 19px;
  }

  .talk_content ul {
    gap: 42px 0;
  }

  .talk_content ul li picture {
    width: calc(62 / 360 * 100%);
  }

  .talk_content ul li p {
    width: calc(280 / 360 * 100%);
  }

  /* Message
  -----------------------------------------------------------*/
  .message h2 {
    top: calc(165 / 280 * 100%);
    max-width: 336px;
  }

  .message .inner .message_content {
    margin: -15px 0 20px;
    padding: 55px 8px;
    background-color: rgba(244, 248, 249, 1);
  }

  .message .inner .message_content ul {
    gap: 40px 0;
  }

  .message .inner .message_content ul li {
    width: 100%;
  }

  .message .inner .message_content ul li img {
    max-width: 265px;
    width: calc(265 / 360 * 100%);
    border-radius: 50%;
  }

  .message .inner .message_content ul li figcaption {
    padding: 28px 20px;
  }

  .message .inner span {
    width: 58px;
  }

  /* Banner
  -----------------------------------------------------------*/
  .banner {
    padding: 60px 15px;
  }

  .banner a {
    max-width: 352px;
  }

}

/*  スマホ（480px以下）
=========================================================================
=========================================================================*/
@media screen and (max-width:480px) {


}
