body {
  background: #fff;
  padding: 0;
  margin: 0;
  font-family: sans-serif;
}

.main60th {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding: 125px 0 0 0;
  background-color: #fff;
}
@media screen and (max-width: 1920px) {
  .main60th {
    padding: calc((125 / 1920) * 100vw) 0 0 0;
  }
}
@media screen and (max-width: 768px) {
  .main60th {
    padding: 100px 0 0 0;
  }
}

.main60th-history {
  position: relative;
  max-width: 1350px;
  width: 1350px;
  margin: 100px auto 340px;
}
@media screen and (max-width: 1920px) {
  .main60th-history {
    width: calc((1350 / 1920) * 100vw);
    margin: calc((100 / 1920) * 100vw) auto calc((340 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .main60th-history {
    margin: calc((85 / 750) * 100vw) auto calc((63 / 750) * 100vw);
    padding: 0 calc((60 / 750) * 100vw);
    height: calc((500 / 750) * 100vw);
  }
}

.main60th-history h3 {
  position: relative;
  margin: 0 0 53px;
}
@media screen and (max-width: 1920px) {
  .main60th-history h3 {
    margin: 0 0 calc((53 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .main60th-history h3 {
    text-align: center;
    margin: 0 0 calc((73 / 750) * 100vw);
  }
}

.main60th-history h3 .title {
  max-width: calc(902px / 2);
  width: calc(902px / 2);
}
@media screen and (max-width: 1920px) {
  .main60th-history h3 .title {
    max-width: calc(902px / 2);
    width: calc(((902 / 2) / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .main60th-history h3 .title {
    width: calc((200 / 750) * 100vw);
  }
}

.main60th-history .lead {
  position: absolute;
  top: 0;
  right: 0;
}
@media screen and (max-width: 768px) {
  .main60th-history .lead {
    position: relative;
    text-align: center;
  }
}

.main60th-history .lead img {
  max-width: calc(1200px / 2);
  width: calc(1200px / 2);
}
@media screen and (max-width: 1920px) {
  .main60th-history .lead img {
    max-width: calc(1200px / 2);
    width: calc(((1200 / 2) / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .main60th-history .lead img {
    width: calc((429 / 750) * 100vw);
  }
}

/* center-line-box */
.center-line-box {
  position: relative;
  max-width: 1210px;
  width: calc((1210 / 1920) * 100vw);
  margin: 0 auto;
  height: 9220px; /* 高さは必要に応じて調整 */
  height: calc((9220 / 1920) * 100vw); /* 高さは必要に応じて調整 */
  background-color: #fff; /* 背景色は任意 */
}
@media screen and (max-width: 768px) {
  .center-line-box {
    width: calc((530 / 750) * 100vw);
    height: auto;
  }
}

.center-line-box::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 6px;
  background-color: black;
  transform: translateX(-50%);
}
@media screen and (max-width: 1920px) {
  .center-line-box::before {
    width: calc((6 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .center-line-box::before {
    background-color: #fff;
  }
}

/* left-card */

.left-card {
  width: 50%;
  position: absolute;
}
@media screen and (max-width: 768px) {
  .left-card {
    width: 100%;
    position: relative;
    margin: 0 0 calc((160 / 750) * 100vw);
  }
}

.left-card h3 {
  text-align: right;
  position: relative;
  padding: 0 85px 0 0;
  margin: 0 0 35px;
}
@media screen and (max-width: 1920px) {
  .left-card h3 {
    padding: 0 calc((85 / 1920) * 100vw) 0 0;
    margin: 0 0 calc((35 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .left-card h3 {
    padding: 0;
  }
}

.left-card h3 .h3-inner {
  text-align: right;
  position: relative;
  border-bottom: 13px solid #d7be54;
}
@media screen and (max-width: 1920px) {
  .left-card h3 .h3-inner {
    border-bottom: calc((13 / 1920) * 100vw) solid #d7be54;
  }
}
@media screen and (max-width: 768px) {
  .left-card h3 .h3-inner {
    text-align: center;
    border-bottom: calc((13 / 750) * 100vw) solid #d7be54;
    padding: 0 0 calc((27 / 750) * 100vw);
  }
}

.left-card h3 .year {
  max-width: calc(380px / 2);
  width: calc(380px / 2);
  margin: 0 0 27px;
}
@media screen and (max-width: 1920px) {
  .left-card h3 .year {
    max-width: calc(380px / 2);
    width: calc(((380 / 2) / 1920) * 100vw);
    margin: 0 0 calc((27 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .left-card h3 .year {
    width: calc((160 / 750) * 100vw);
    margin: 0 0 calc((30 / 750) * 100vw);
  }
}

.left-card h3 .year-jp {
  max-width: calc(380px / 2);
  width: calc(380px / 2);
  margin: 0 0 29px;
}
@media screen and (max-width: 1920px) {
  .left-card h3 .year-jp {
    max-width: calc(380px / 2);
    width: calc(((380 / 2) / 1920) * 100vw);
    margin: 0 0 calc((29 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .left-card h3 .year-jp {
    width: calc((260 / 750) * 100vw);
    width: calc((215 / 750) * 100vw);
    margin: 0;
  }
}

.left-card .circle {
  position: relative;
  top: -70px;
}
@media screen and (max-width: 1920px) {
  .left-card .circle {
    top: calc((-70 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .left-card .circle {
    display: none;
  }
}

.left-card .circle .circle-img {
  position: absolute;
  right: -16px;
  max-width: calc(64px / 2);
  width: calc(64px / 2);
  top: 12px;
}
@media screen and (max-width: 1920px) {
  .left-card .circle .circle-img {
    right: calc((-16 / 1920) * 100vw);
    width: calc(((64 / 2) / 1920) * 100vw);
    top: calc((12 / 1920) * 100vw);
  }
}

.left-card .card-contents {
  padding: 0 82px 0 0;
}
@media screen and (max-width: 1920px) {
  .left-card .card-contents {
    padding: 0 calc((82 / 1920) * 100vw) 0 0;
  }
}
@media screen and (max-width: 768px) {
  .left-card .card-contents {
    padding: 0;
  }
}

.left-card .card-contents h4 {
  font-size: 30px;
  margin: 0 0 33px;
  line-height: 1.4;
}
@media screen and (max-width: 1920px) {
  .left-card .card-contents h4 {
    font-size: calc((30 / 1920) * 100vw);
    margin: 0 0 calc((33 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .left-card .card-contents h4 {
    font-size: calc((32 / 750) * 100vw);
    margin: 0 0 calc((25 / 750) * 100vw);
  }
}

.left-card .card-contents p {
  font-size: 22px;
  margin: 0 0 45px;
  line-height: 1.45;
}
@media screen and (max-width: 1920px) {
  .left-card .card-contents p {
    font-size: calc((22 / 1920) * 100vw);
    margin: 0 0 calc((45 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .left-card .card-contents p {
    font-size: calc((25 / 750) * 100vw);
    line-height: 1.5;
    margin: 0 0 calc((43 / 750) * 100vw);
  }
}

.left-card .card-contents .card-image img {
  max-width: calc(1032px / 2);
  width: calc(1032px / 2);
}
@media screen and (max-width: 1920px) {
  .left-card .card-contents .card-image img {
    width: calc(((1032 / 2) / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .left-card .card-contents .card-image img {
    width: 100%;
  }
}

/* right-card */

.right-card {
  width: 50%;
  position: absolute;
  right: 0;
}
@media screen and (max-width: 768px) {
  .right-card {
    width: 100%;
    position: relative;
    margin: 0 0 calc((100 / 750) * 100vw);
  }
}

.right-card h3 {
  text-align: left;
  position: relative;
  padding: 0 0 0 85px;
  margin: 0 0 35px;
}
@media screen and (max-width: 1920px) {
  .right-card h3 {
    padding: 0 0 0 calc((85 / 1920) * 100vw);
    margin: 0 0 calc((35 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .right-card h3 {
    padding: 0;
  }
}

.right-card h3 .h3-inner {
  text-align: left;
  position: relative;
  border-bottom: 13px solid #d7be54;
}
@media screen and (max-width: 1920px) {
  .right-card h3 .h3-inner {
    border-bottom: calc((13 / 1920) * 100vw) solid #d7be54;
  }
}
@media screen and (max-width: 768px) {
  .right-card h3 .h3-inner {
    text-align: center;
    border-bottom: calc((13 / 750) * 100vw) solid #d7be54;
    padding: 0 0 calc((25 / 750) * 100vw);
  }
}

.right-card h3 .year {
  max-width: calc(380px / 2);
  width: calc(((380 / 2) / 1920) * 100vw);
  margin: 0 0 calc((27 / 1920) * 100vw);
}
@media screen and (max-width: 1920px) {
  .right-card h3 .year {
    width: calc(((380 / 2) / 1920) * 100vw);
    margin: 0 0 calc((27 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .right-card h3 .year {
    width: calc((160 / 750) * 100vw);
    margin: 0 0 calc((25 / 750) * 100vw);
  }
}

.right-card h3 .year-jp {
  max-width: calc(380px / 2);
  width: calc(((380 / 2) / 1920) * 100vw);
  margin: 0 0 calc((29 / 1920) * 100vw);
}
@media screen and (max-width: 1920px) {
  .right-card h3 .year-jp {
    width: calc(((380 / 2) / 1920) * 100vw);
    margin: 0 0 calc((29 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .right-card h3 .year-jp {
    width: calc((215 / 750) * 100vw);
    margin: 0;
  }
}

.right-card .circle {
  position: relative;
  top: -70px;
}
@media screen and (max-width: 1920px) {
  .right-card .circle {
    top: calc((-70 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .right-card .circle {
    display: none;
  }
}

.right-card .circle .circle-img {
  position: absolute;
  left: -16px;
  max-width: calc(64px / 2);
  width: calc(64px / 2);
  top: 12px;
}
@media screen and (max-width: 1920px) {
  .right-card .circle .circle-img {
    left: calc((-16 / 1920) * 100vw);
    width: calc(((64 / 2) / 1920) * 100vw);
    top: calc((12 / 1920) * 100vw);
  }
}

.right-card .card-contents {
  padding: 0 0 0 82px;
}
@media screen and (max-width: 1920px) {
  .right-card .card-contents {
    padding: 0 0 0 calc((82 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .right-card .card-contents {
    padding: 0;
  }
}

.right-card .card-contents h4 {
  font-size: 30px;
  margin: 0 0 33px;
  line-height: 1.4;
}
@media screen and (max-width: 1920px) {
  .right-card .card-contents h4 {
    font-size: calc((30 / 1920) * 100vw);
    margin: 0 0 calc((33 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .right-card .card-contents h4 {
    font-size: calc((32 / 750) * 100vw);
    margin: 0 0 calc((25 / 750) * 100vw);
  }
}

.right-card .card-contents p {
  font-size: 22px;
  line-height: 1.45;
  margin: 0 0 45px;
}
@media screen and (max-width: 1920px) {
  .right-card .card-contents p {
    font-size: calc((22 / 1920) * 100vw);
    margin: 0 0 calc((45 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .right-card .card-contents p {
    font-size: calc((25 / 750) * 100vw);
    line-height: 1.5;
    margin: 0 0 calc((43 / 750) * 100vw);
  }
}

.right-card .card-contents .card-image img {
  max-width: calc(1032px / 2);
  width: calc(1032px / 2);
}
@media screen and (max-width: 1920px) {
  .right-card .card-contents .card-image img {
    width: calc(((1032 / 2) / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .right-card .card-contents .card-image img {
    width: 100%;
  }
}

/* 位置 */
.card1925 {
  top: -185px;
  top: calc((-185 / 1920) * 100vw);
}
@media screen and (max-width: 1920px) {
  .card1925 {
    top: calc((-185 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1925 {
    top: auto;
  }
}

.card1934 {
  top: 408px;
}
@media screen and (max-width: 1920px) {
  .card1934 {
    top: calc((408 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1934 {
    top: auto;
  }
}

.card1962 {
  top: 1200px;
}
@media screen and (max-width: 1920px) {
  .card1962 {
    top: calc((1200 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1962 {
    top: auto;
  }
}

.card1965 {
  top: 1765px;
}
@media screen and (max-width: 1920px) {
  .card1965 {
    top: calc((1765 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1965 {
    top: auto;
  }
}

.card1967 {
  top: 2420px;
}
@media screen and (max-width: 1920px) {
  .card1967 {
    top: calc((2420 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1967 {
    top: auto;
  }
}

.card1970 {
  top: 2795px;
}
@media screen and (max-width: 1920px) {
  .card1970 {
    top: calc((2795 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1970 {
    top: auto;
  }
}

.card1972 {
  top: 3573px;
}
@media screen and (max-width: 1920px) {
  .card1972 {
    top: calc((3573 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1972 {
    top: auto;
  }
}

.card1982 {
  top: 4126px;
}
@media screen and (max-width: 1920px) {
  .card1982 {
    top: calc((4126 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1982 {
    top: auto;
  }
}

.card1984 {
  top: 4817px;
}
@media screen and (max-width: 1920px) {
  .card1984 {
    top: calc((4817 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1984 {
    top: auto;
  }
}

.card1991 {
  top: 5478px;
}
@media screen and (max-width: 1920px) {
  .card1991 {
    top: calc((5478 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1991 {
    top: auto;
  }
}

.card1993 {
  top: 5941px;
}
@media screen and (max-width: 1920px) {
  .card1993 {
    top: calc((5941 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card1993 {
    top: auto;
  }
}

.card2013 {
  top: 6476px;
}
@media screen and (max-width: 1920px) {
  .card2013 {
    top: calc((6476 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card2013 {
    top: auto;
  }
}

.card2018 {
  top: 7212px;
}
@media screen and (max-width: 1920px) {
  .card2018 {
    top: calc((7212 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card2018 {
    top: auto;
  }
}

.card2020 {
  top: 7743px;
}
@media screen and (max-width: 1920px) {
  .card2020 {
    top: calc((7743 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card2020 {
    top: auto;
  }
}

.card2024 {
  top: 8295px;
}
@media screen and (max-width: 1920px) {
  .card2024 {
    top: calc((8295 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card2024 {
    top: auto;
  }
}

.card2025 {
  top: 9034px;
}
@media screen and (max-width: 1920px) {
  .card2025 {
    top: calc((9034 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .card2025 {
    top: auto;
  }
}

/* デコレーションパーツ */
.deco-p-01 {
  position: absolute;
  max-width: calc(660px / 2);
  width: calc(((660 / 2) / 1920) * 100vw);
  top: 122px;
  right: 51px;
}
@media screen and (max-width: 1920px) {
  .deco-p-01 {
    top: calc((122 / 1920) * 100vw);
    right: calc((51 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-01 {
    display: none;
  }
}

.deco-p-02 {
  position: absolute;
  max-width: calc(920px / 2);
  width: calc(((920 / 2) / 1920) * 100vw);
  top: 1042px;
  right: 39px;
}
@media screen and (max-width: 1920px) {
  .deco-p-02 {
    top: calc((1042 / 1920) * 100vw);
    right: calc((39 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-02 {
    display: none;
  }
}

.deco-p-03 {
  position: absolute;
  max-width: calc(800px / 2);
  width: calc(((800 / 2) / 1920) * 100vw);
  top: 1466px;
  right: 15px;
}
@media screen and (max-width: 1920px) {
  .deco-p-03 {
    top: calc((1466 / 1920) * 100vw);
    right: calc((15 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-03 {
    display: none;
  }
}

.deco-p-04 {
  position: absolute;
  max-width: calc(800px / 2);
  width: calc(((800 / 2) / 1920) * 100vw);
  top: 2382px;
  right: 56px;
}
@media screen and (max-width: 1920px) {
  .deco-p-04 {
    top: calc((2382 / 1920) * 100vw);
    right: calc((56 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-04 {
    display: none;
  }
}

.deco-p-05 {
  position: absolute;
  max-width: calc(320px / 2);
  width: calc(((320 / 2) / 1920) * 100vw);
  top: 3399px;
  left: 327px;
}
@media screen and (max-width: 1920px) {
  .deco-p-05 {
    top: calc((3399 / 1920) * 100vw);
    left: calc((327 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-05 {
    display: none;
  }
}

.deco-p-06 {
  position: absolute;
  max-width: calc(860px / 2);
  width: calc(((860 / 2) / 1920) * 100vw);
  top: 3808px;
  right: 53px;
}
@media screen and (max-width: 1920px) {
  .deco-p-06 {
    top: calc((3808 / 1920) * 100vw);
    right: calc((53 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-06 {
    display: none;
  }
}

.deco-p-07 {
  position: absolute;
  max-width: 404px;
  width: calc((404 / 1920) * 100vw);
  top: 4624px;
  left: 0px;
}
@media screen and (max-width: 1920px) {
  .deco-p-07 {
    top: calc((4624 / 1920) * 100vw);
    left: calc((0 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-07 {
    display: none;
  }
}

.deco-p-08 {
  position: absolute;
  max-width: calc(540px / 2);
  width: calc(((540 / 2) / 1920) * 100vw);
  top: 5234px;
  right: 0px;
}
@media screen and (max-width: 1920px) {
  .deco-p-08 {
    top: calc((5234 / 1920) * 100vw);
    right: calc((0 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-08 {
    display: none;
  }
}

.deco-p-09 {
  position: absolute;
  max-width: calc(660px / 2);
  width: calc(((660 / 2) / 1920) * 100vw);
  top: 6278px;
  right: 51px;
}
@media screen and (max-width: 1920px) {
  .deco-p-09 {
    top: calc((6278 / 1920) * 100vw);
    right: calc((51 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-09 {
    display: none;
  }
}

.deco-p-10 {
  position: absolute;
  max-width: calc(320px / 2);
  width: calc(((320 / 2) / 1920) * 100vw);
  top: 7031px;
  left: 63px;
}
@media screen and (max-width: 1920px) {
  .deco-p-10 {
    top: calc((7031 / 1920) * 100vw);
    left: calc((63 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-10 {
    display: none;
  }
}

.deco-p-11 {
  position: absolute;
  max-width: calc(920px / 2);
  width: calc(((920 / 2) / 1920) * 100vw);
  top: 8409px;
  right: 56px;
}
@media screen and (max-width: 1920px) {
  .deco-p-11 {
    top: calc((8409 / 1920) * 100vw);
    right: calc((56 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-11 {
    display: none;
  }
}

.deco-p-12 {
  position: absolute;
  max-width: calc(800px / 2);
  width: calc(((800 / 2) / 1920) * 100vw);
  top: 8834px;
  right: 33px;
}
@media screen and (max-width: 1920px) {
  .deco-p-12 {
    top: calc((8834 / 1920) * 100vw);
    right: calc((33 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .deco-p-12 {
    display: none;
  }
}

/* history-back */

.main60th-history-back {
  text-align: center;
  padding: 344px 0 100px;
}
@media screen and (max-width: 1920px) {
  .main60th-history-back {
    text-align: center;
    padding: calc((344 / 1920) * 100vw) 0 calc((100 / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .main60th-history-back {
    padding: calc((100 / 750) * 100vw) 0 calc((110 / 750) * 100vw);
  }
}

.main60th-history-back a img {
  max-width: calc(260px / 2);
  width: calc(260px / 2);
}
@media screen and (max-width: 1920px) {
  .main60th-history-back a img {
    width: calc(((260 / 2) / 1920) * 100vw);
  }
}
@media screen and (max-width: 768px) {
  .main60th-history-back a img {
    width: calc(((260 / 2) / 750) * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .sp-none {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  .pc-none {
    display: none !important;
  }
}
