@charset "utf-8";

.event h2,
.event h3 {
  text-align: center;
  line-height: 1.5;
}

.event h2 {
    margin-top: 200px;
    font-size: 40px;
} 

.event h3 {
    font-size: 28px;
}

.event-title::before,
.event-title::after {
  content: "";
  display: inline-block;
  vertical-align: middle; 
  width: 50px;
  height: 2px;
  background-color: #fff;
  margin: 0 20px; 
}

.octorber::after {
  content: "";
  display: block;
  width: 450px;
  aspect-ratio: 1/0.9;
  border: 2px solid white;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-85%);
  z-index: -10;
  clip-path: polygon(0 60%, 100% 60%, 100% 100%, 0% 100%);
}

.event-wrapper {
  display: flex;
  background-color: #281354;
  width: 50%;
  margin: 0 auto;
  padding: 30px;
}

.event-img {
  width: 250px;
}

.event1,
.event2,
.event3 {
  position: relative;
}

.event1 {
    margin-top: 60px;
}

.event1::after,
.event2::after,
.event3::after {
  content: "";
  display: block;
  width: 50%;
  height: 100%;
  border: 2px solid white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  clip-path: polygon(30% 0, 100% 40%, 100% 100%, 70% 100%, 0 60%, 0 0);
}

.event2,
.event3 {
    margin-top: 20px;
}

.nomalevent-box::after {
  content: "";
  display: block;
  width: 90%;
  min-width: 1280px;
  height: 1200px;
  border: 2px solid white;
  border-radius: 50%;
  position: absolute;
  top: 920px;
  left: 50%;
  transform: translate(-50%,-58%);
  z-index: -10;
  clip-path: polygon(30% 25%, 70% 25%, 60% 0, 100% 0, 100% 100%, 0 100%, 0 0, 40% 0);
}

.specialevent-box::after {
  content: "";
  display: block;
  width: 90%;
  min-width: 1280px;
  height: 1200px;
  border: 2px solid white;
  border-radius: 50%;
  position: absolute;
  top: 1700px;
  left: 50%;
  transform: translate(-50%,-58%);
  z-index: -10;
}

.event-date {
  width: 120px;
  position: absolute;
  top: -10%;
  left: 23%;
  z-index: 2;
}

.event-text {
  margin-left: 20px;
}

.event-text h5 {
  font-size: 20px;
  font-weight: bold;
}

.event-text h4 {
    font-size: 14px;
    line-height: 1.5;
}

.event-text-p {
  margin-top: 40px;
  line-height: 1.3;
}

.event4-wrapper {
    background-color: #281354;
    width: 60%;
    margin: 0 auto;
    padding: 50px;
}

.event4-flex {
    display: flex;
    margin-top: 50px;
    justify-content: center;
}

.event4-img {
    width: 300px;
}

.event4-wrapper h4 {
    text-align: center;
    line-height: 1.5;
    font-size: 23px;
}

.event4-text {
    margin-left: 20px;
}

.event4-text h5 {
    font-size: 16px;
}

.event4-text h6 {
    font-size: 22px;
    line-height: 2;
}

.event4-text-p {
    margin-top: 40px;
    line-height: 1.5;
}

.note {
    margin-top: 55px;
    font-size: 13px;
}

.special-event {
    margin-top: 100px;
    position: relative;
    margin-bottom: 100px;
}

.special-event::after {
  content: "";
  display: block;
  width: 60%;
  height: 100%;
  border: 2px solid white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  clip-path: polygon(30% 0, 100% 40%, 100% 100%, 70% 100%, 0 60%, 0 0);
}

.event-date4 {
    width: 150px;
    position: absolute;
    top: -7%;
    left: 19%;  
    z-index: 2;
}