@charset "utf-8";

@media only screen and (max-width:1280px) {}
@media only screen and (max-width:768px) {}
@media only screen and (max-width:480px) {}

figure {
  position: relative;
}

.cap {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 10px;
  color: #fff;
  font-size: 10px;
  line-height: 1;
  text-align: right;
  text-shadow: 
  0px 0px 1px #000, 
  0 0 5px #000, 
  0 0 10px #000, 
  0 0 15px #000, 
  0 0 20px #000, 
  0 0 30px #000, 
  0 0 40px #000;
  z-index: 3;
}

/*---------------------------------------------------------------

 commonKeyvisual

--------------------------------------------------------------- */
.mainvisual  {
  position: relative;
  background-image: url(../images/special01/kv.jpg);
  width: 100%;
  height: 680px;
  background-position: center;
  background-size: cover;
}
.mv_cap {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 10px;
  color: #fff;
  font-size: 10px;
  line-height: 1;
  text-align: right;
  text-shadow: 
  0px 0px 1px #000, 
  0 0 5px #000, 
  0 0 10px #000, 
  0 0 15px #000, 
  0 0 20px #000, 
  0 0 30px #000, 
  0 0 40px #000;
  z-index: 3;
}
.mv_title_area {
  position: absolute;
  width: 100%;
  max-width: 1200px;
  bottom: 70px;
  left: 50%;
  transform: translateX(-50%);
}
.mv_title {
  font-size: 46px;
  padding-left: 20px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  color: #fff;
  text-shadow: 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3);
}
.mv_lead {
  margin-top: 20px;
  font-size: 24px;
  padding-left: 20px;
  letter-spacing: 0.1em;
  color: #fff;
  text-shadow: 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3), 
  0px 0px 10px rgba(0, 0, 0, 0.3);
}

@media only screen and (max-width:768px) {
  .mainvisual  {
    background-image: url(../images/special01/kv_sp.jpg);
    height: 480px;
  }
  .mv_title_area {
    bottom: 70px;
    left: 50%;
    transform: translateX(-50%);
  }
  .mv_title {
    font-size: clamp(3.2rem, 2.2rem + 3.125vw, 4.6rem);
    padding-left: 10px;
  }
  .mv_lead {
    margin-top: 14px;
    font-size: clamp(1.6rem, 1.029rem + 1.786vw, 2.4rem);
    letter-spacing: 0.05em;
    padding-left: 10px;
  }
}

/* section
================================================ */
.inner {
  position: relative;
  max-width: 1320px;
  margin: auto;
  padding: 0 80px;
  z-index: 2;
}
.contents_top_title {
  width: 60px;
}
.flex_contents {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.flex_body {
  width: 45%;
}
.flex_img {
  width: 50%;
}
.contents_title_wrap {
  display: flex;
  align-items: center;
}
.icon_logo {
  width: 100px;
}
.contents_title_body {
  margin-left: 16px;
}
.contents_title {
  font-size: 16px;
  letter-spacing: 0.05em;
  border-bottom: 1px solid #3b3b41;
}
.contents_title_ja {
  margin-top: 4px;
  font-size: 16px;
  letter-spacing: 0.05em;
}
.flex_body_title {
  font-size: 24px;
  font-size: clamp(1.6rem, 0.735rem + 1.125vw, 2.4rem);
  letter-spacing: 0.06em;
  line-height: 1.6;
  margin-top: 34px;
}
.flex_body_text {
  font-size: clamp(1.2rem, 0.767rem + 0.563vw, 1.6rem);
  letter-spacing: 0.1em;
  line-height: 2;
  margin-top: 30px;
}
.flex_img_cap {
  font-size: 12px;
  margin-top: 4px;
  text-align: right;
}

@media only screen and (max-width:768px) {
  .inner {
    padding: 0 20px;
  }
  .contents_top_title {
    width: 60px;
  }
  .flex_contents {
    flex-direction: column;
  }
  .flex_body {
    width: 100%;
  }
  .flex_img {
    margin-top: 20px;
    width: 100%;
  }
  .contents_title_wrap {
    display: flex;
  }
  .icon_logo {
    width: 68px;
  }
  .contents_title_body {
    margin-left: 16px;
  }
  .contents_title {
    font-size: 16px;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #3b3b41;
  }
  .contents_title_ja {
    margin-top: 4px;
    font-size: 16px;
    letter-spacing: 0.05em;
  }
  .flex_body_title {
    font-size: clamp(1.7rem, 1.057rem + 2.009vw, 2.6rem);
    margin-top: 26px;
  }
  .flex_body_text {
    font-size: clamp(1.4rem, 1.257rem + 0.446vw, 1.6rem);
    letter-spacing: 0.05em;
    line-height: 1.6;
    margin-top: 22px;
  }
  .flex_img_cap {
    font-size: 10px;
  }
}

/* concept
================================================ */
.concept {
  padding: 80px 20px;
}
.title_en {
  text-align: center;
  font-size: 16px;
  letter-spacing: 0.15em;
}
.concept_title {
  max-width: 400px;
  margin: 40px auto 0;
}
.concept_lead {
  font-size: 20px;
  text-align: center;
  margin-top: 40px;
  line-height: 1.8;
}

@media only screen and (max-width:768px) {
  .concept {
    padding: 60px 20px;
  }
  .concept_title {
    max-width: clamp(26rem, 16rem + 31.25vw, 40rem);
    margin: 20px auto 0;
  }
  .concept_lead {
    font-size: clamp(1.5rem, 0.857rem + 2.009vw, 2.4rem);
    text-align: center;
    margin-top: 26px;
  }
}

/* central
================================================ */
.central_top {
  position: relative;
  padding: 80px 0;
  background-image: url(../images/special01/central_bg.jpg);
  background-position: center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
}
.central_bottom {
  position: relative;
  background-color: #f0f0f0;
  padding: 100px 0;
}
.central_bottom::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 900px;
  top: 0;
  left: 0;
  background-image: url(../images/special01/central_bg2.png);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
}
.central_wide_img {
  position: relative;
  max-width: 1000px;
  margin: 60px auto 0;
}

@media only screen and (max-width:768px) {
  .central_top {
    position: relative;
    padding: 40px 0;
    background-image: url(../images/special01/central_bg_sp.jpg);
  }
  .central_bottom {
    position: relative;
    background-color: transparent;
    padding: 50px 0;
  }
  .central_bottom::after {
    height: 600px;
    background-image: url(../images/special01/central_bg2_sp.png);
    background-position: top center;
  }
  .central_wide_img {
    margin: 20px auto 0;
  }
}

/* academic
================================================ */
.academic_top {
  position: relative;
  padding: 100px 0;
  background-image: url(../images/special01/academic_bg.jpg);
  background-position: center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
}
.academic_bottom {
  position: relative;
  background-image: url(../images/special01/academic_bg2.jpg);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 100px 0;
}

@media only screen and (max-width:768px) {
  .academic_top {
    padding: 40px 0;
  }
  .academic_bottom {
    padding: 50px 0;
  }
}

/* access
================================================ */
.access_top {
  position: relative;
  padding: 100px 0;
  background-image: url(../images/special01/access_bg.jpg);
  background-position: center  bottom;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
}
.access_bottom {
  position: relative;
  background-image: url(../images/special01/access_bg2.jpg);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 60px 0;
}

@media only screen and (max-width:768px) {
  .access_top {
    padding: 40px 0;
    background-image: url(../images/special01/access_bg_sp.jpg);
  }
  .access_bottom {
    padding: 40px 0;
  }
}

/* landscape
================================================ */
.landscape_top {
  position: relative;
  padding: 100px 0;
  background-image: url(../images/special01/landscape_bg.jpg);
  background-position: center  bottom;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
}
.landscape_bottom {
  position: relative;
  padding: 60px 0 100px;
}
.landscape_bottom::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 900px;
  top: 0;
  left: 0;
  background-image: url(../images/special01/landscape_bg2.png);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
}
.landscape_wide_img {

  margin: 60px auto 0;
}
.landscape .flex_contents {
  align-items: flex-end;
}
.landscape .flex_body {
  width: 55%;
}
.landscape .flex_img {
  width: 40%;
}

@media only screen and (max-width:768px) {
  .landscape_top {
    padding: 40px 0;
  }
  .landscape_bottom {
    padding: 40px 0 40px;
  }
  .landscape_wide_img {
    margin: 30px auto 0;
  }
  .landscape .flex_body {
    width: 100%;
  }
  .landscape .flex_img {
    width: 100%;
  }
}

/* future
================================================ */
.future_top {
  position: relative;
  padding: 100px 0;
  background-image: url(../images/special01/future_bg.jpg);
  background-position: center  bottom;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
}
.future_bottom {
  position: relative;
  background-image: url(../images/special01/future_bg2.jpg);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 80px 0;
}
.future .flex_contents {
  align-items: flex-end;
  justify-content: left;
}
.future .flex_img {
  width: 40%;
}

@media only screen and (max-width:768px) {
  .future_top {
    padding: 40px 0;
  }
  .future_bottom {
    padding: 40px 0;
  }
  .future .flex_img {
    width: 100%;
    max-width: 400px;
    margin: 30px auto;
  }
}

/* bottom_contents
================================================ */
.bottom_contents {
  position: relative;
  background-image: url(../images/special01/bottom_bg.jpg);
  background-size: cover;
  background-position: center ;
  height: 1200px;
}
.bottom_title_area {
  position: absolute;
  width: 100%;
  max-width: 1200px;
  top: 80px;
  top: 8%;
  left: 50%;
  transform: translateX(-50%);
}
.bottom_lead {
  text-align: center;
  font-size: clamp(2rem, 1.567rem + 0.563vw, 2.4rem);
  line-height: 2;
  letter-spacing: 0.05em;
}
.bottom_title {
  max-width: 400px;
  margin: 60px auto 0;
}

@media only screen and (max-width:768px) {
  .bottom_contents {
    background-image: url(../images/special01/bottom_bg_sp.jpg);
    height: clamp(75rem, 67.857rem + 22.321vw, 85rem);
  }
  .bottom_title_area {
    width: 95%;
    top: 4%;
  }
  .bottom_lead {
    font-size: clamp(1.6rem, 1.314rem + 0.893vw, 2rem);
    line-height: 1.7;
  }
  .bottom_title {
    max-width: 260px;
    margin: 10px auto 0;
  }
}