@charset "utf-8";
.year { background: #e3eaf8; }
.year .tt_box { padding: 50px 15px; text-align: center; background: #99a8c7; }
    .year .title { padding: 0 0 20px 0; font-size: 3em; font-weight: 800; line-height: 1em; color: #000075; }

.year .tabnav { display: flex; justify-content: center; }
    .year .tabnav > div { position: relative;  }
    .year .tabnav p { position: relative; width: 200px; height: 50px; line-height: 50px; font-size: 1.2em; padding: 0 10px; border: 1px solid #000075; background: var(--white); cursor: pointer; }
    .year .tabnav p:before { content: ""; position: absolute; top: 0; right: 0; width: 50px; height: 50px; background: url(../../img/common/location_bg.png) no-repeat; background-position: center -65px; }

    .year .tabnav p.on:before { transform: rotate(180deg); }

    .year .tabnav ul { display: none; position:absolute; top: 50px; width: 200px; border: 1px solid var(--BK-EE); }
    .year .tabnav ul li a { display: block; padding: 10px; color: var(--black); background: var(--white); }
    .year .tabnav ul.on { display: block; }

.year .tabcontent { padding: 50px 0 100px 0; color: #000075; }
    .year .box h3 { padding: 0 0 40px 0; text-align: center; font-size: 2em; font-weight: 800; }
    .year .box img { width: auto; }
@media (max-width:991px) {
    .year .tabcontent { padding: 25px 0 50px 0; }
    .year .tt_box { padding: 25px 15px; text-align: center; background: #99a8c7; }
    .year .box h3 { padding: 0 0 20px 0; }
}

.year .box01 + .box01 { margin-top: 40px; }
    .year .box01 th { width: 200px; vertical-align: top; padding: 20px 10px; font-weight: 700; border-bottom: 1px solid #8EA3FF; }
    .year .box01 td { vertical-align: top; padding: 20px 30px; line-height: 1.7em; text-align: center; border-bottom: 1px solid #8EA3FF; }
@media (max-width:991px) {
    .year .box01 th { width: 80px; padding: 10px; }
    .year .box01 td { padding: 10px; }
}

.year .box02 { padding: 60px 0 0 0; }
    .year .box02 h3 { display: none; padding: 0 0 20px 0; text-align: center; font-weight: 600; }
    .year .box02 ul { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 20px;  }
    .year .box02 ul + ul { margin-top: 20px; }
    .year .box02 li { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 200px; height: 200px; border-radius: 20px; background: var(--white); overflow: hidden; }
    .year .box02 li img { width: auto; }
    .year .box02 li span { display: block; padding: 0 0 15px 0; font-size:1.1em; line-height: 1.2em; text-align: center; color: #283278; }
    .year .box02 li em { display: block; font-size: 0.7em; line-height: 1em; }
    .year .box02 li p { font-size: 1.3em; line-height: 1em; font-weight: 700; color: #283278; }
@media (max-width:991px) {
    .year .box02 ul { gap: 10px; }
    .year .box02 ul + ul { margin-top: 10px; }
    .year .box02 li { width: calc(50% - 10px); }
}

.year .box03 { padding: 60px 0; }
    .year .box03 ul { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 20px;  }
    .year .box03 li { width: calc(25% - 15px); }

.year .box04 { padding: 60px 0 0 0; text-align: center; }
    .year .box04 img { width: auto; }