@charset "utf-8";
/* CSS Document */

.btn_green{
  display: inline-block;
  text-align: center;
  padding: 1.5rem 5rem;
  color: #fff;
  background: linear-gradient(to right, #039B7F, #006A57);
  font-size: 2.0rem;
  margin-top: 4rem;
  border-radius: 5rem;
}

main{
  
}

.container{
  max-width: 120rem;
  margin: 0 auto;
}
.form .container,
.voice .container,
.participants .container,
.osusume .container,
.schedule .container,
.info .container,
.access .container,
.history .container,
.participants .container{
  padding: 8rem 2rem;
}
.info h2,
.form h2,
.voice h2,
.participants h2,
.history h2,
.access h2,
.schedule h2,
.osusume h2{
  text-align: left;
  font-size: 3.2rem;
  font-weight: 700;
}

.mv{
  width: 100%;
  background: url("../images/mv_bg.jpg") no-repeat top center/cover;
}
.mv_info{
  width: 100%;
  max-width: 52rem;
  background-image: url("../images/info_bg.png");
  background-repeat: repeat;
  padding: 7rem 3rem 5rem;
  text-align: left;
}
.mv_info h1{
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.3;
}
.mv_info h1 strong{
  font-size: 7.3rem;
  font-weight: 900;
  display: block;
}
.mv_info h1 span{
  display: inline-block;
  background-color: #000;
  padding: 0.5rem 1rem;
  color: #fff;
  fnt-size: 1.8rem;
  font-weight: 700;
  margin-right: 1rem;
}

.mv_info .txt_green{
  display: inline-block;
  background: #009B7F;
  padding: 0.5rem 2rem;
  color: #fff;
  font-size: 2.0rem;
  margin-top: 1rem;
  font-weight: 500;
}
.mv_info .mv_info_short ul{
  display: flex;
  justify-content: flex-start;
  gap: 0.5rem;
  margin-top: 2rem;
}
.mv_info .mv_info_short ul li{
  border: 4px solid #039B7F;
  color: #039B7F;
  font-size: 1.6rem;
  font-weight: 600;
  padding: 0.5rem 1rem;
}
.mv_info .mv_info_short ul li strong{
  color: #1A1A1A;
  font-size: 2.2rem;
  font-weight: 600;
  padding-left: 1rem;
}
.days{
  position: relative;
  display: flex;
  justify-content: flex-start;
  margin-top: 2rem;
  align-items: flex-end;
}
.days .date{
  position: relative;
  font-size: 6.7rem;
  font-weight: 700;
  line-height: 1;
  padding-left: 3rem;
  padding-right: 3rem;
  margin-right: 2rem;
}
.days .date span.year{
  position: absolute;
  top: 56%;
  left: -1rem;
  font-size: 2.0rem;
  transform: translateY(-50%) rotate(90deg);
  line-height: 1;
}

.days .date span.week{
  position: absolute;
  font-size: 2.2rem;
  bottom: 0.5rem;
  right: 0;
}

.days .time p{
  font-size: 1.6rem;
  font-weight: 500;
}
.days .time p strong{
  font-size: 2.0rem;
  color: #009B7F;
  padding-left: 1rem;
  font-weight: 700;
}

.reason{
  background-color: #039B7F;
}
.reason .container{
  display: flex;
  align-items: center;
}
.reason .container h2{
  background-color: #CDEAD6;
  font-size: 4.0rem;
  padding: 5rem 2rem;
  text-align: right;
  font-weight: 700;
  width: 52rem;
  line-height: 1.6;
}
.reason .container p{
  color: #fff;
  font-weight: 500;
  padding: 3rem 2rem;
  text-align: left;
  width: 50%;
  line-height: 1.8;
}

.osusume{
  background-color: #CDEAD6;
}
.osusume .container{
  background-color: #fff;
}

.osusume .osusume_list{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.osusume .osusume_list li{
  width: 48%;
  display: flex;
  margin-top: 2rem;
}
.osusume .osusume_list li .osusume_img{
  width: 48%;
}
.osusume .osusume_list li .osusume_txt{
  width: 50%;
  line-height: 1.6;
}
.osusume .osusume_list li .osusume_txt h3{
  color: #039B7F;
  font-size: 2.0rem;
  font-weight: 600;
}
.osusume .osusume_list li .osusume_txt p{
  margin-top: 2rem;
  
}
.access .btn_green,
.info .btn_green,
.osusume .btn_green{
  display: block;
  max-width: 62rem;
  margin: 6rem auto 0;
}


.schedule{
  background-color: #F6F7F7;
}
.schedule.schedule_second{
  position: relative;
  background-color: #fff;
}
.schedule.schedule_third{
  position: relative;
}
.schedule.schedule_third .container{
  background: #F6F7F7 url("../images/schedule_third_bg.png") no-repeat bottom center/100%;
}
.schedule.schedule_second::before{
  position: absolute;
  content: "";
  width: 96rem;
  height: 40.4rem;
  max-width: 50%;
  top: 0;
  left: 0;
  background: url("../images/schedule_bg01.png") no-repeat right bottom/cover;
}
.schedule.schedule_second::after{
  position: absolute;
  content: "";
  width: 96rem;
  height: 49.1rem;
  max-width: 50%;
  bottom: 0;
  right: 0;
  background: url("../images/schedule_bg02.png") no-repeat left top/cover;
}

.schedule .container{
  position: relative;
  z-index: 1;
}
.schedule.schedule_third .container{
  padding: 8rem 2rem 40rem;
}
.schedule_list{
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 6rem;
  font-size: 2.2rem;
  font-weight: 600;
}
.schedule_list span{
  background-color: #039B7F;
  color: #fff;
  font-size: 1.8rem;
  padding: 1rem 3rem;
  font-weight: 500;
  margin-right: 2rem;
}
.schedule_list span strong{
  font-size: 2.2rem;
  padding-right: 2rem;
  font-weight: 700;
}
.schedule_list::before{
  content: "";
  position: absolute;
  width: 0.2rem;
  height: 6rem;
  background-color: #039B7F;
  left: 9rem;
  bottom: -6rem;
  z-index: 2;
}

.guest_box{
  display: flex;
  justify-content: space-between;
  margin-top: 6rem;
}
.guest_box .guest_photo img{
  max-width: 52rem;
}
.guest_box .guest_photo p{
  font-size: 2rem;
  margin-top: 1rem;
  font-weight: 600;
}
.guest_box .guest_txt{
  padding-left: 3rem;
}
.guest_box .guest_txt img{
  width: 17.5rem;
}
.schedule h3{
  color: #039B7F;
  font-size: 2.2rem;
  font-weight: 700;
  margin-top: 2rem;
}
.guest_box .guest_txt p{
  margin-top: 2rem;
  line-height: 1.6;
}

.guest_box .guest_img img{
  max-width: 80rem;
}

.schedule03,
.schedule04{
  margin-top: 0;
}
.schedule_list.schedule03::before,
.schedule_list.schedule04::before,
.schedule_list.schedule05::before{
  height: 15rem;
  left: 9rem;
  bottom: auto;
  top: -15rem;
}
.schedule_list.schedule05::before{
  height: 6rem;
  top: -6rem;
}

.schedule.schedule_third .guest_box{
  margin-top: 0rem;
  margin-bottom: 3rem;
}
.schedule.schedule_third .schedule_list.schedule05{
  margin-top: 8rem;
}



.info .container .info_inn{
  max-width: 81rem;
  margin: 3rem auto;
}
.info dl{
  display: flex;
  font-size: 2.2rem;
}
.info dt{
  width: 25%;
  padding: 3rem 0 1rem;
  border-bottom: 4px solid #009B7F;
  font-weight: 600;
}
.info dd{
  width: 75%;
  padding: 3rem 0 1rem 3rem;
  border-bottom: 1px solid #1A1A1A;
}

.access{
  background-color: #F6F7F7;
}


.access_box{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 4rem;
}
.access_box .map{
  width: 48%;
}
.access_box .map iframe{
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  margin-top: 3rem;
}
.access_box h3{
  font-size: 1.8rem;
  font-weight: 500;
  border-bottom: 1px solid #1A1A1A;
  padding-bottom: 0.5rem;
}
.access_box h3 strong{
  font-size: 2.2rem;
  font-weight: 600;
  border-bottom: 4px solid #009B7F;
  padding-bottom: 0.3rem;
  padding-right: 2rem;
}
.access_box h3 span {
  padding-left: 1rem;
}
.access_box h3.second{
  margin-top: 3rem;
}
.access_box .access_info{
  margin-left: 4rem;
}
.access_box .access_info p{
  margin-top: 2rem;
  font-size: 1.6rem;
}

.history{
  background-color: #FFFEF7;
}
.history .read{
  font-size: 2.0rem;
}

.history .history_box{
  margin-top: 2rem;
}
.history .history_box h3{
  position: relative;
  font-size: 2.2rem;
  padding: 1.5rem 0;
  font-weight: 500;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.history .history_box h3::before{
  position: absolute;
  content: "";
  border-bottom: 1px solid #1A1A1A;
  width: 100%;
  height: 1px;
  left: 0;
  bottom: 0;
}
.history .history_box h3::after{
  position: absolute;
  content: "";
  border-bottom: 4px solid #009B7F;
  width: 18rem;
  height: 1px;
  left: 0;
  bottom: -2px;
}

.history .history_box .history_list{
  display: flex;
  gap: 1px;
  margin-top: 1px;
}

.history .history_box .history_list dt,
.history .history_box .history_list dd{
  width: 50%;
  padding: 1.5rem 4rem;
  background-color: #CDEAD6;
  display: flex;
  flex-direction: column;
  align-items:flex-start;
  justify-content: center;
}
.history .history_box .history_list dt{
  font-size: 1.5rem;
}
.history .history_box .history_list dt strong{
  font-size: 1.8rem;
}

.participants{
  background: #fff url("../images/participants_bg.png") no-repeat top center/cover;
}
.participants img{
  display: block;
  max-width: 98rem;
  margin: 0 auto;
}

.voice{
  background-color: #F6F7F7;
}
.voice ul{
  display: flex;
  justify-content: space-around;
  max-width: 98rem;
  margin: 3rem auto 0;
}
.voice ul li{
  width: 30%;
}


.c-header{
  padding: 0;
}
.c-nav li {
  margin: 0 1.5rem;
}
.c-header.active {
  padding: 0;
}
.c-btnGreen{
  border-radius: 0;
  color: #FFFE8D;
  background:#039B7F url("../images/icon_form.svg") no-repeat center left 2rem/3.3rem 3.1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32rem;
  height: 8rem;
  font-size: 2.0rem;
}
.c-nav a{
  padding: 2rem 0;
  transition: 0.3s;
}
.c-nav a:hover{
  color: #039B7F;
  transition: 0.3s;
}
.c-nav a:before {
  display: none;
}


.c-contact .l-container {
  border: 0;
  padding: 10.5rem 17rem;
}

.c-first {
  margin-top: 8rem;
}

.pc{
  display: block;
}
.sp{
  display: none;
}

@media screen and (max-width: 768px) {
  
  
  .form .container,
  .voice .container,
  .participants .container,
  .osusume .container,
  .schedule .container,
  .info .container,
  .access .container,
  .history .container,
  .participants .container{
    padding: 4rem 2rem;
  }
  
  .info h2,
  .form h2,
  .voice h2,
  .participants h2,
  .history h2,
  .access h2,
  .schedule h2,
  .osusume h2{
    text-align: left;
    font-size: 2.0rem;
    font-weight: 700;
  }
  
  
  .c-first {
    margin-top: 5rem;
  }
  .c-header{
    padding: 15px 0;
  }
  .c-logo {
    width: 12rem;
  }
  
  .c-contact {
    padding: 0;
  }
  .mv{
    background: url("../images/mv_bg_sp.png") no-repeat top 4rem center/contain;
  }
  .mv_info{
    width: 100%;
    background-image: none;
    padding: 0;
  }

  .mv_info h1{
    width: 100%;
    background-image: url("../images/info_bg.png");
    padding: 2rem 0;
    text-align: center;
  }

  .mv_info h1 {
    font-size: 1.6rem;
  }
  .mv_info h1 strong {
    font-size: 2.4rem;
    display: inline-block;
    margin-left: 10px;
  }
  .mv_info .mv_info_short ul{
    justify-content: center;
  }
  .mv_info .mv_info_short ul li{
    font-size: 1.3rem;
    padding: 0.5rem 1rem;
  }
  .mv_info .mv_info_short ul li strong{
    font-size: 1.6rem;
    padding-left: 0.5rem;
  }
  .days .date span.year {
    left: 0rem;
    font-size: 1.6rem;
  }
  .days .date {
    font-size: 5.0rem;
    line-height: 1;
  }
  .days .date span.week {
    font-size: 1.8rem;
  }
  .days .time p {
    font-size: 1.4rem;
    line-height: 1;
  }
  .days .time p strong {
    font-size: 1.8rem;
  }
  
  .mv_info .txt_green.sp_top{
    margin-top: 17rem;
  }
  
  .btn_green {
    display: block;
    max-width: 70% !important;
    padding: 1rem 0;
    font-size: 1.6rem;
    margin: 2rem auto;
  }
  
  .reason .container {
    flex-direction: column;
  }
  .reason .container h2 {
    font-size: 1.6rem;
    padding: 1rem 2rem ;
    text-align: left;
    width: 100%;
  }
  .reason .container p {
    padding: 2rem;
    text-align: left;
    width: 100%;
    line-height: 1.5;
    font-size: 1.4rem;
}
  
  .osusume .osusume_list {
    flex-direction: column;
  }
  .osusume .osusume_list li{
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .osusume .osusume_list li .osusume_img,
  .osusume .osusume_list li .osusume_txt{
    width: 90%;
    text-align: center;
  }
  .osusume .osusume_list li .osusume_txt{
    text-align: left;
  }
  .osusume .osusume_list li .osusume_txt h3 {
    font-size: 1.6rem;
  }
  .osusume .osusume_list li .osusume_txt p {
    font-size: 1.4rem;
    margin-top: 1rem;
  }  
  
  
  .schedule_list {
    align-items: flex-start;
    margin-top: 3rem;
    margin-bottom: 1rem;
    font-size: 1.8rem;
    flex-direction: column;
    text-align: left;
  }
  
  .schedule_list span {
    font-size: 1.8rem;
    padding: 1rem 3rem;
    width: 100%;
    text-align: left;
  }
  
  .guest_box {
    max-width: 100%;
    margin-top: 3rem;
    flex-direction: column;
  }
  .schedule_list::before {
    content: "";
    position: absolute;
    width: 0.2rem;
    height: 3rem;
    background-color: #039B7F;
    left: 3rem;
    bottom: -3rem;
    z-index: 2;
  }
  .guest_box .guest_photo img {
    max-width: 100%;
  }
  .guest_box .guest_photo p {
    font-size: 1.6rem;
  }  
  .guest_box .guest_txt {
    padding-left: 0;
    margin-top: 3rem;
  }  
  .schedule h3 {
    font-size: 1.6rem;
  }
  .schedule_list.schedule03::before, .schedule_list.schedule04::before, .schedule_list.schedule05::before {
    height: 6rem;
    left: 3rem;
    bottom: auto;
    top: -6rem;
  }
  .schedule_second .guest_box .guest_txt {
    padding-left: 0;
    margin-top: 0;
  }
  .guest_box .guest_img{
    margin-top: 3rem;
  }
  .guest_box .guest_img img {
    max-width: 100%;
  }
  .schedule.schedule_third .container {
    padding: 3rem 2rem 10rem;
  }
  
  .schedule.schedule_third .guest_box{
    margin-top: 0rem;
    margin-bottom: 0;
  }
  .schedule.schedule_third .guest_box .guest_txt{
    margin-top: 0;
  }
  .schedule.schedule_third .guest_box .guest_txt p{
    margin-top: 0;
  }
  .schedule.schedule_third .schedule_list.schedule05{
    margin-top: 3rem;
  }
  .schedule.schedule_third .schedule_list.schedule05::before{
    height: 3rem;
    top: -3rem;
  }
  .schedule.schedule_third .schedule_list.schedule04 span {
    margin-bottom: 1rem;
  }
  
  .info dl {
    font-size: 1.6rem;
  }
  
  .access_box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 4rem;
    flex-direction: column;
  }
  .access_box .map,
  .access_box .access_info{
    width: 100%;
    margin: 0;
  }
  .access_box .map{
    margin-bottom: 2rem;
  }
  .access_box h3 {
    font-size: 1.4rem;
    font-weight: 500;
    border-bottom: 1px solid #1A1A1A;
    padding-bottom: 0.5rem;
  }
  .access_box h3 strong {
    font-size: 1.8rem;
    padding-bottom: 0.3rem;
    padding-right: 0;
    display: block;
    margin-bottom: 1rem;
  }
  .access_box .access_info p {
    font-size: 1.4rem;
  }
  .access_box h3 span {
    padding-left: 0;
  }  
  
  .history .history_box .history_list {
    flex-direction: column;
  }
  .history .history_box h3 {
    font-size: 1.8rem;
    font-weight: 600;
    margin-top: 1rem;
    margin-bottom: 1rem;
  }
  .history .history_box .history_list dt,
  .history .history_box .history_list dd {
    width: 100%;
    padding: 1rem;
    flex-direction: column;
  }
  .history .history_box .history_list dt {
    font-size: 1.3rem;
  }
  .history .history_box .history_list dd {
    font-size: 1.5rem;
  }
  .history .history_box .history_list dt strong {
    font-size: 1.6rem;
  }
  .participants img {
    max-width: 100%;
  }
  .voice ul {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 98rem;
    margin: 3rem auto 0;
    flex-direction: column;
  }
  .voice ul li {
    width: 50%;
    margin-top: 4rem;
  }

  .c-contact .l-container {
    border: 0;
    padding: 0;
  }
  .c-header .c-btnGreen.c-smallSP {
    display: flex !important;
    width: 90%;
    margin: 2rem auto;
  }
  .c-header .c-btnGreen.c-smallSP:hover {
    color: #FFFE8D;
  }
  
  
  
  
  .pc{
    display: none;
  }
  .sp{
    display: block;
  }
  
  
}