@charset "UTF-8";

/* ========================================
   @media screen and (min-width: 768px),print
======================================== */
@media screen and (min-width: 768px),print {

/* event -------------------------------------*/
#event .system-contents {
   width: min(95%, 1440px);
   padding: 0 0 7.5rem;
}
#event .system-contents.single {
   width: min(95%, 1100px);
   padding: 0 0 7.5rem;
}
#event .system-list {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 0 calc(60 / 1920 * 100vw);
}
#event .system-list li {
   display: grid;
   grid-row: span 5;
   grid-template-rows: subgrid;
}
#event .system-list li a {
   display: contents;
}
#event .system-list li .top-wrap {
   display: flex;
   justify-content: space-between;
   align-items: flex-end;
   margin-bottom: 1rem;
}
#event .system-list li .post-date .year {
   display: block;
   font-size: 16px;
   font-weight: 600;
   letter-spacing: 0.05em;
}
#event .system-list li .post-date .day {
   font-size: 24px;
   font-weight: 600;
   line-height: 1.2;
   letter-spacing: 0.05em;
}
#event .system-pic {
   height: 17.5rem;
   margin-bottom: 0.7rem;
}
#event .system-pic img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}
#event .icon {
   font-size: 12px;
   font-weight: 400;
   letter-spacing: 0.05em;
   color: #FFFFFF;
   text-align: center;
   display: inline-block;
   width: 3.625rem;
   line-height: 1.667;
}
#event .icon01 {
   background: #908672;
}
#event .icon02 {
   background: #9A9A9A;
}
#event .icon03 {
   background: #1C1C1C;
}
/* #event .system-category {
   font-size: 12px;
   font-weight: 400;
   line-height: 3.33;
   letter-spacing: 0.05em;
   display: flex;
   gap: 1.9rem;
   padding: 0 0.7rem;
} */
/* #event .system-category span {
   position: relative;
} */
/* #event .system-category span::before {
   content: "#";
   position: absolute;
   left: -0.625rem;
   top: 50%;
   transform: translateY(-50%);
   font-size: 12px;
   font-weight: 400;
   letter-spacing: 0.05em;
   color: #908672;
} */
#event .system-ttl-01 {
   font-size: 16px;
   font-weight: 600;
   line-height: 1.75;
   letter-spacing: 0.05em;
   border-bottom: 1px solid #E0E0E0;
   padding: 0 0 0.25rem;
   margin-bottom: 1rem;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
}
#event .system-date-wrap {
   position: relative;
}
#event .system-date-wrap::before {
   content: "";
   position: absolute;
   top: 0;
   left: 4.4rem;
   width: 1px;
   height: 4rem;
   background: #E0E0E0;
}

#event .system-date {
   font-size: clamp(0.625rem, 0.542rem + 0.17vw, 0.75rem);
   font-weight: 400;
   line-height: 2;
   letter-spacing: 0.05em;
}
#event .date-ttl {
   width: 5.7rem;
   display: inline-block;
}
#event .start_text {
   position: relative;
}#event .system-list {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 0 calc(60 / 1920 * 100vw);
}
#event .system-list li {
   display: grid;
   grid-row: span 5;
   grid-template-rows: subgrid;
   margin-bottom: 5.0625rem;
}
#event .system-list li a {
   display: contents;
}
#event .system-list li .top-wrap {
   display: flex;
   justify-content: space-between;
   align-items: flex-end;
   margin-bottom: 1rem;
}
#event .system-list li .post-date .year {
   display: block;
   font-size: 16px;
   font-weight: 600;
   letter-spacing: 0.05em;
}
#event .system-list li .post-date .day {
   font-size: 24px;
   font-weight: 600;
   line-height: 1.2;
   letter-spacing: 0.05em;
}
#event .system-pic {
   height: 17.5rem;
   margin-bottom: 0.7rem;
}
#event .system-pic img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}
#event .icon {
   font-size: 12px;
   font-weight: 400;
   letter-spacing: 0.05em;
   color: #FFFFFF;
   text-align: center;
   display: inline-block;
   width: 3.625rem;
   line-height: 1.667;
}
#event .icon01 {
   background: #908672;
}
#event .icon02 {
   background: #9A9A9A;
}
#event .icon03 {
   background: #1C1C1C;
}
/* #event .system-category {
   font-size: 12px;
   font-weight: 400;
   line-height: 3.33;
   letter-spacing: 0.05em;
   display: flex;
   gap: 1.9rem;
   padding: 0 0.7rem;
}
#event .system-category span {
   position: relative;
}
#event .system-category span::before {
   content: "#";
   position: absolute;
   left: -0.625rem;
   top: 50%;
   transform: translateY(-50%);
   font-size: 12px;
   font-weight: 400;
   letter-spacing: 0.05em;
   color: #908672;
} */
#event .system-ttl-01 {
   font-size: 16px;
   font-weight: 600;
   line-height: 1.75;
   letter-spacing: 0.05em;
   border-bottom: 1px solid #E0E0E0;
   padding: 0 0 0.25rem;
   margin-bottom: 1rem;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
}
#event .system-date-wrap {
   position: relative;
}
#event .system-date-wrap::before {
   content: "";
   position: absolute;
   top: 0;
   left: 4.4rem;
   width: 1px;
   height: 4rem;
   background: #E0E0E0;
}

#event .system-date {
   font-size: clamp(0.625rem, 0.542rem + 0.17vw, 0.75rem);
   font-weight: 400;
   line-height: 2;
   letter-spacing: 0.05em;
}
#event .date-ttl {
   width: 5.7rem;
   display: inline-block;
}
#event .start_text {
   position: relative;
}

}



/* ========================================
   @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {

/* event -------------------------------------*/
#event .system-contents {
   padding: 0 0 19.3236714976vw;
}
#event .system-list {
   display: grid;
   grid-template-columns: 1fr;
   gap: 9.55vw;
   width: 82.129vw;
   margin-inline: auto;
   padding: 0 0 19vw;
}
#event .system-list li {border-bottom: 0.2vw solid #9A9A9A;padding: 0 0 2.2vw;}
#event .system-list li a {
   display: contents;
}
#event .system-list li .top-wrap {
   display: flex;
   justify-content: space-between;
   align-items: flex-end;
   margin-bottom: 2vw;
}
#event .system-list li .post-date .year {
   display: block;
   font-size:3.865vw;
   font-weight: 600;
   letter-spacing: 0.05em;
}
#event .system-list li .post-date .day {
   font-size:5.797vw;
   font-weight: 600;
   line-height: 1.2;
   letter-spacing: 0.05em;
}
#event .system-pic {
   height: 52.66vw;
   margin-bottom: 2.7vw;
}
#event .system-pic img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}
#event .icon {
   font-size:2.898vw;
   font-weight: 400;
   letter-spacing: 0.05em;
   color: #FFFFFF;
   text-align: center;
   display: inline-block;
   width: 14.1vw;
   line-height: 1;
   padding: 1vw 0;
}
#event .icon01 {
   background: #908672;
}
#event .icon02 {
   background: #9A9A9A;
}
#event .icon03 {
   background: #1C1C1C;
}
/* #event .system-category {
   font-size:2.898vw;
   font-weight: 400;
   line-height: 2.9;
   letter-spacing: 0.05em;
   display: flex;
   gap: 4.8vw;
   padding: 0 2vw;
}
#event .system-category span {
   position: relative;
}
#event .system-category span::before {
   content: "#";
   position: absolute;
   left: -1.9vw;
   top: 50%;
   transform: translateY(-50%);
   font-size:2.898vw;
   font-weight: 400;
   letter-spacing: 0.05em;
   color: #908672;
} */
#event .system-ttl-01 {
   font-size:3.623vw;
   font-weight: 600;
   line-height: 1.733333;
   letter-spacing: 0.05em;
   padding: 0 0 0.5vw;
   margin-bottom: 1.5vw;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
}
#event .system-date-wrap {
   position: relative;
}
#event .system-date-wrap::before {
   content: "";
   position: absolute;
   top: 0.2vw;
   left: 17vw;
   width: 0.2vw;
   height: 15.5vw;
   background: #E0E0E0;
}

#event .system-date {
   font-size:2.898vw;
   font-weight: 400;
   line-height: 2;
   letter-spacing: 0.05em;
}
#event .date-ttl {
   width: 22vw;
   display: inline-block;
}
#event .start_text {
   position: relative;
}
#event .sp-btn {font-size: 2.898vw;font-weight: 400;line-height: 1.25;letter-spacing: 0.05em;color: #9A9A9A;text-align: right;}


#event .form-box-inner .formttl_en{text-align: center;}
#event .form-Box .list{padding: 0px 3vw 5vw 3vw;}

}