/* line 2, ../../import/import.scss */
* {
  font-size: 14px;
}

/* line 15, ../scss/style-archive.scss */
.commonWidth, .commonWidthLarge {
  margin: 0 auto;
}

@media only screen and (max-width: 767px) {
  /* line 21, ../scss/style-archive.scss */
  body.modal_no_scroll {
    height: 100px !important;
    overflow: hidden;
  }
}
@media print, screen and (min-width: 768px) {
  /* line 33, ../scss/style-archive.scss */
  body.modal_no_scroll {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
  }

  /* line 40, ../scss/style-archive.scss */
  .commonWidth {
    width: 1080px;
  }

  /* line 43, ../scss/style-archive.scss */
  .commonWidthLarge {
    width: 1280px;
  }
}
/* line 52, ../scss/style-archive.scss */
.interview {
  font-family: "Lato", "Noto Sans JP", sans-serif;
  letter-spacing: -0.28px !important;
}
/* line 56, ../scss/style-archive.scss */
.interview .secTopArea .topArea {
  position: relative;
}
/* line 58, ../scss/style-archive.scss */
.interview .secTopArea .topArea .backgroundImg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  height: 100%;
  left: 0;
  right: 0;
  position: relative;
  z-index: -1;
}
/* line 68, ../scss/style-archive.scss */
.interview .secTopArea .topArea .titleImg {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  z-index: 0;
}
/* line 76, ../scss/style-archive.scss */
.interview .secTopArea .topArea .titleImg .titleAnimImgArea {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0px;
  z-index: -1;
}
/* line 83, ../scss/style-archive.scss */
.interview .secTopArea .topArea .titleImg .titleAnimImgArea .maskArea {
  mask-image: url(../images/mainTitleMask.png);
  mask-position: 0% 0%;
  mask-repeat: no-repeat;
  animation-duration: 4s;
  animation-timing-function: cubic-bezier(0.18, 0.98, 0, 0.85);
  animation-iteration-count: infinite;
  animation-fill-mode: forwards;
}
/* line 92, ../scss/style-archive.scss */
.interview .secTopArea .topArea .titleImg .titleAnimImgArea .maskArea .maskImg {
  filter: invert(0%) sepia(100%) saturate(200%) hue-rotate(180deg) brightness(99%) contrast(104%);
}
/* line 99, ../scss/style-archive.scss */
.interview .secTopArea .topTextWrap {
  text-align: center;
}
/* line 101, ../scss/style-archive.scss */
.interview .secTopArea .topTextWrap .title {
  padding: 13px 0 21px;
  font-family: "Noto Serif JP", serif;
}

@media print, screen and (min-width: 768px) {
  /* line 112, ../scss/style-archive.scss */
  .text1 {
    letter-spacing: -0.2px;
    font-size: 16px;
    padding-top: 3px;
  }

  /* line 117, ../scss/style-archive.scss */
  .text2 {
    font-size: 18px;
    line-height: 20px;
    padding-top: 5px;
    padding-bottom: 4px;
    letter-spacing: 0.2px;
  }

  /* line 124, ../scss/style-archive.scss */
  .text3 {
    letter-spacing: -0.4px;
    font-size: 14px;
  }

  /* line 129, ../scss/style-archive.scss */
  .secTopArea .topArea {
    height: 560px;
  }
  /* line 131, ../scss/style-archive.scss */
  .secTopArea .topArea .backgroundImg {
    background-image: url(../images/interview_bk.jpg);
  }
  /* line 134, ../scss/style-archive.scss */
  .secTopArea .topArea .titleImg {
    bottom: -43px;
    width: fit-content;
  }
  /* line 137, ../scss/style-archive.scss */
  .secTopArea .topArea .titleImg .maskArea {
    mask-size: 20%;
    animation-name: titleFlash;
  }
  /* line 143, ../scss/style-archive.scss */
  .secTopArea .topTextWrap {
    padding: 85px 0 114px;
  }
  /* line 145, ../scss/style-archive.scss */
  .secTopArea .topTextWrap .title {
    font-size: 20px;
  }

  @keyframes titleFlash {
    0% {
      mask-position: -10% 0%;
    }
    100% {
      mask-position: 130% 0%;
    }
  }
}
@media only screen and (max-width: 767px) {
  /* line 161, ../scss/style-archive.scss */
  .text1 {
    font-size: 13px;
  }

  /* line 164, ../scss/style-archive.scss */
  .text2 {
    padding-top: 5px;
    font-size: 14px;
    line-height: 20px;
  }

  /* line 169, ../scss/style-archive.scss */
  .text3 {
    font-size: 11px;
    line-height: 170%;
  }

  /* line 177, ../scss/style-archive.scss */
  .secTopArea .topArea .titleImg {
    bottom: -6%;
    width: 90%;
  }
  /* line 180, ../scss/style-archive.scss */
  .secTopArea .topArea .titleImg .maskArea {
    animation-name: titleFlash;
    mask-size: 20%;
  }
  /* line 186, ../scss/style-archive.scss */
  .secTopArea .topTextWrap {
    padding: 40px 0 60px;
  }
  /* line 188, ../scss/style-archive.scss */
  .secTopArea .topTextWrap .title {
    font-size: 16px;
  }
  /* line 191, ../scss/style-archive.scss */
  .secTopArea .topTextWrap .subText {
    text-align: left;
  }

  @keyframes titleFlash {
    0% {
      mask-position: -10% 0%;
    }
    100% {
      mask-position: 130% 0%;
    }
  }
}
/* line 208, ../scss/style-archive.scss */
.secFilter {
  display: flex;
  padding: 28px 40px 32px;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  background: rgba(218, 223, 248, 0.4);
  margin-inline: auto;
}
/* line 216, ../scss/style-archive.scss */
.secFilter .secFilterTitle {
  font-weight: 500;
  line-height: 1.6;
  text-align: center;
  width: fit-content;
  padding-bottom: 12px;
  position: relative;
}
/* line 223, ../scss/style-archive.scss */
.secFilter .secFilterTitle::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  width: 40px;
  height: 2px;
  background: #C50025;
}
/* line 234, ../scss/style-archive.scss */
.secFilter .secFilterCont {
  display: flex;
  align-items: center;
  gap: 12px 24px;
}
/* line 238, ../scss/style-archive.scss */
.secFilter .secFilterCont .secFilterContBtn {
  font-weight: 500;
  line-height: 1;
  width: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 8px;
  border: 1px solid #acaeae;
  background: #fff;
  cursor: pointer;
}
/* line 250, ../scss/style-archive.scss */
.secFilter .secFilterCont .secFilterContBtn.active {
  color: #fff;
  background: #1b2020;
}

@media screen and (min-width: 768px) {
  /* line 258, ../scss/style-archive.scss */
  .secFilter {
    margin-bottom: 160px;
  }
  /* line 260, ../scss/style-archive.scss */
  .secFilter .secFilterTitle {
    font-size: 18px;
  }
  /* line 264, ../scss/style-archive.scss */
  .secFilter .secFilterCont .secFilterContBtn {
    font-size: 18px;
    padding: 18px;
  }
}
@media only screen and (max-width: 767px) {
  /* line 273, ../scss/style-archive.scss */
  .secFilter {
    width: 90%;
    margin-bottom: 80px;
  }
  /* line 276, ../scss/style-archive.scss */
  .secFilter .secFilterTitle {
    font-size: 16px;
  }
  /* line 279, ../scss/style-archive.scss */
  .secFilter .secFilterCont {
    flex-direction: column;
  }
  /* line 281, ../scss/style-archive.scss */
  .secFilter .secFilterCont .secFilterContBtn {
    font-size: 15px;
    padding: 14px;
  }
}
/* line 291, ../scss/style-archive.scss */
.pickup .pickupList {
  display: flex;
  flex-direction: column;
  align-items: center;
}
/* line 297, ../scss/style-archive.scss */
.pickup .flexBox .pickupNum {
  z-index: 2;
  border-radius: 50%;
  background: #000;
}
/* line 302, ../scss/style-archive.scss */
.pickup .flexBox .pickupNum .text {
  font-size: 14px;
  color: #fff;
  text-align: center;
}
/* line 306, ../scss/style-archive.scss */
.pickup .flexBox .pickupNum .text .border {
  margin: 0 auto;
  background: transparent linear-gradient(90deg, var(--unnamed-color-ff8551) 1%, var(--unnamed-color-f6bebc) 27%, #C2C7D3 34%, #8FD1EA 41%, #6FD7F9 47%, var(--unnamed-color-63daff) 50%, #5AD3FD 51%, #29ACF2 62%, #0B94EC 70%, var(--unnamed-color-008cea) 75%, #067FED 78%, #175DF7 87%, #2149FC 95%, #2542FF 100%) 0% 0% no-repeat padding-box;
  background: transparent linear-gradient(90deg, #FF8551 1%, #F6BEBC 27%, #C2C7D3 34%, #8FD1EA 41%, #6FD7F9 47%, #63DAFF 50%, #5AD3FD 51%, #29ACF2 62%, #0B94EC 70%, #008CEA 75%, #067FED 78%, #175DF7 87%, #2149FC 95%, #2542FF 100%) 0% 0% no-repeat padding-box;
}
/* line 313, ../scss/style-archive.scss */
.pickup .flexBox .background {
  background: transparent linear-gradient(233deg, #ABD1E866 0%, #ABD1E899 0%, #BABAE633 61%, #FF843433 100%) 0% 0% no-repeat padding-box;
  position: absolute;
  z-index: 0;
}
/* line 320, ../scss/style-archive.scss */
.pickup .textWrap .viewBtnWrap {
  cursor: pointer;
  background: #000;
  color: #fff;
}
/* line 324, ../scss/style-archive.scss */
.pickup .textWrap .viewBtnWrap .viewBtn {
  background: url(../../shared/images/arrow_WhileRight01.svg) right 6% center no-repeat;
  background-size: 15px;
  font-weight: 300;
}

/* line 334, ../scss/style-archive.scss */
.slideBg, .slideBg2 {
  position: relative;
  width: fit-content;
  height: auto;
  overflow: hidden;
}

/* line 340, ../scss/style-archive.scss */
.slideBg.active::after {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  background: #DADFF8;
  width: 100%;
  height: 100%;
  z-index: -1;
  transform: translateX(-100%);
  animation-name: boxSlide;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  transform: translateX(-100%);
}

/* line 356, ../scss/style-archive.scss */
.slideBg2.active::after {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  background: #DADFF8;
  width: 100%;
  height: 100%;
  z-index: -1;
  transform: translateX(-100%);
  animation-name: boxSlide;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  transform: translateX(-100%);
}

/* line 371, ../scss/style-archive.scss */
.slideBg p span {
  opacity: 0;
  font-family: "Noto Serif JP", serif;
  font-weight: 400;
  line-height: 170%;
}

/* line 377, ../scss/style-archive.scss */
.slideBg2 p span {
  opacity: 0;
  font-family: "Noto Serif JP", serif;
  font-weight: 400;
  line-height: 170%;
  font-feature-settings: "halt";
}

@keyframes boxSlide {
  0% {
    transform: translate(-100%, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}
@media print, screen and (max-width: 1280px) {
  /* line 395, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .textWrap .text {
    padding-right: 50px;
  }
}
@media print, screen and (min-width: 768px) {
  /* line 403, ../scss/style-archive.scss */
  .interview .pickup .pickupList {
    gap: 160px;
  }
  /* line 411, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexLeft .pickupNum {
    right: -17px;
    top: -22px;
  }
  /* line 416, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight {
    padding-left: 30px;
    position: relative;
  }
  /* line 419, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .slideWrap {
    left: -83px;
  }
  /* line 421, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .slideWrap .slideBg {
    letter-spacing: -0.9px;
  }
  /* line 423, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .slideWrap .slideBg:nth-child(1) {
    padding: 9px 23px 7px 20px;
  }
  /* line 426, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .slideWrap .slideBg:nth-child(2) {
    margin-top: -12px;
    padding: 2px 0 13px 20px;
  }
  /* line 433, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .textWrap .text {
    padding-bottom: 49px;
  }
  /* line 437, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .caption {
    padding-left: 44px;
  }
  /* line 444, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox {
    flex-direction: row-reverse;
  }
  /* line 446, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight {
    padding-left: 0;
  }
  /* line 449, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .slideWrap .slideBg2 {
    margin-left: 100px;
    padding-left: 20px;
    padding-right: 22px;
    letter-spacing: -0.9px;
  }
  /* line 454, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .slideWrap .slideBg2:nth-child(1) {
    padding: 9px 23px 7px 20px;
  }
  /* line 457, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .slideWrap .slideBg2:nth-child(2) {
    margin-top: -12px;
    padding: 2px 0 13px 20px;
  }
  /* line 463, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .textWrap {
    padding-left: 100px;
  }
  /* line 465, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .textWrap .text {
    padding-bottom: 42px;
  }
  /* line 471, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexLeft .pickupNum {
    left: -23px;
    top: -12px;
  }
  /* line 475, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexLeft .background {
    left: 17px;
  }
  /* line 478, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexLeft .imgWrap {
    text-align: right;
  }
  /* line 485, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .text {
    padding-top: 174px;
    padding-bottom: 49px;
    font-size: 14px;
    line-height: 24px;
    padding-right: 26px;
  }
  /* line 492, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .NumberArea {
    padding-left: 72px;
  }
  /* line 495, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .caption {
    padding-left: 25px;
  }
  /* line 497, ../scss/style-archive.scss */
  .interview .pickup .secondArea .flexBox .flexRight .caption .text2 {
    padding-top: 8px;
  }
  /* line 505, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox, .interview .pickup .secondArea .flexBox {
    display: flex;
    justify-content: center;
  }
  /* line 508, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexLeft, .interview .pickup .secondArea .flexBox .flexLeft {
    position: relative;
    z-index: 0;
    width: 100%;
  }
  /* line 512, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexLeft .pickupNum, .interview .pickup .secondArea .flexBox .flexLeft .pickupNum {
    position: absolute;
    width: 90px;
    height: 90px;
  }
  /* line 516, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexLeft .pickupNum .text, .interview .pickup .secondArea .flexBox .flexLeft .pickupNum .text {
    padding-top: 16px;
    font-size: 14px;
  }
  /* line 519, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexLeft .pickupNum .text .border, .interview .pickup .secondArea .flexBox .flexLeft .pickupNum .text .border {
    width: 55px;
    height: 2px;
  }
  /* line 525, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexLeft .background, .interview .pickup .secondArea .flexBox .flexLeft .background {
    width: 716px;
    height: 530px;
    top: 20px;
  }
  /* line 530, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexLeft img, .interview .pickup .secondArea .flexBox .flexLeft img {
    position: relative;
    z-index: 1;
  }
  /* line 535, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight, .interview .pickup .secondArea .flexBox .flexRight {
    width: 75%;
  }
  /* line 537, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .caption, .interview .pickup .secondArea .flexBox .flexRight .caption {
    padding-top: 31px;
  }
  /* line 540, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .NumberArea, .interview .pickup .secondArea .flexBox .flexRight .NumberArea {
    margin-top: -27px;
    display: flex;
    justify-content: flex-start;
    padding-bottom: 50px;
  }
  /* line 546, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .slideWrap, .interview .pickup .secondArea .flexBox .flexRight .slideWrap {
    position: absolute;
    z-index: 2;
  }
  /* line 550, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .slideWrap .slideBg span, .interview .pickup .firstArea .flexBox .flexRight .slideWrap .slideBg2 span, .interview .pickup .secondArea .flexBox .flexRight .slideWrap .slideBg span, .interview .pickup .secondArea .flexBox .flexRight .slideWrap .slideBg2 span {
    font-size: 34px;
  }
  /* line 555, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .text, .interview .pickup .secondArea .flexBox .flexRight .text {
    padding-top: 174px;
    padding-bottom: 49px;
    font-size: 14px;
    line-height: 24px;
  }
  /* line 561, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .arrow, .interview .pickup .secondArea .flexBox .flexRight .arrow {
    position: relative;
    display: inline-block;
    padding: 0 0 0 16px;
    color: #fff;
    vertical-align: middle;
    text-decoration: none;
  }
  /* line 572, ../scss/style-archive.scss */
  .interview .pickup .viewBtnWrap {
    padding: 15px;
    width: 220px;
    height: 65px;
    display: inline-block;
  }
  /* line 577, ../scss/style-archive.scss */
  .interview .pickup .viewBtnWrap .viewBtn {
    font-size: 18px;
    padding-left: 15px;
    line-height: 35px;
  }
}
@media only screen and (max-width: 767px) {
  /* line 590, ../scss/style-archive.scss */
  .interview .pickup .pickupList {
    gap: 80px;
  }
  /* line 594, ../scss/style-archive.scss */
  .interview .pickup .firstArea .flexBox .flexRight .textWrap .text {
    padding: 30px 0;
  }
  /* line 599, ../scss/style-archive.scss */
  .interview .pickup .secondArea .imgWrap {
    text-align: right;
  }
  /* line 602, ../scss/style-archive.scss */
  .interview .pickup .secondArea .background {
    right: 0;
  }
  /* line 607, ../scss/style-archive.scss */
  .interview .pickup .flexBox .pickupNum {
    width: min(16vw, 60px);
    height: min(16vw, 60px);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  /* line 614, ../scss/style-archive.scss */
  .interview .pickup .flexBox .pickupNum .text {
    font-size: 10px;
  }
  /* line 617, ../scss/style-archive.scss */
  .interview .pickup .flexBox .pickupNum .text .border {
    width: 38px;
    height: 2px;
  }
  /* line 623, ../scss/style-archive.scss */
  .interview .pickup .flexBox .imgWrap {
    position: relative;
  }
  /* line 625, ../scss/style-archive.scss */
  .interview .pickup .flexBox .imgWrap .background {
    top: 15px;
    width: 97%;
    height: 99%;
    z-index: -1;
  }
  /* line 631, ../scss/style-archive.scss */
  .interview .pickup .flexBox .imgWrap img {
    width: 94%;
    height: 94%;
  }
  /* line 636, ../scss/style-archive.scss */
  .interview .pickup .flexBox .flexRight {
    padding-left: 0px;
    position: relative;
  }
  /* line 639, ../scss/style-archive.scss */
  .interview .pickup .flexBox .flexRight .slideWrap {
    padding-top: 30px;
  }
  /* line 641, ../scss/style-archive.scss */
  .interview .pickup .flexBox .flexRight .slideWrap .slideBg, .interview .pickup .flexBox .flexRight .slideWrap .slideBg2 {
    padding: 2px 15px;
    padding-right: 20px;
  }
  /* line 644, ../scss/style-archive.scss */
  .interview .pickup .flexBox .flexRight .slideWrap .slideBg p span, .interview .pickup .flexBox .flexRight .slideWrap .slideBg2 p span {
    font-size: min(5.5vw, 23px);
  }
  /* line 649, ../scss/style-archive.scss */
  .interview .pickup .flexBox .flexRight .textWrap {
    margin: 0 auto;
    width: 90%;
  }
  /* line 652, ../scss/style-archive.scss */
  .interview .pickup .flexBox .flexRight .textWrap .text {
    font-size: 14px;
    padding: 30px 0;
  }
  /* line 656, ../scss/style-archive.scss */
  .interview .pickup .flexBox .flexRight .textWrap .viewBtnWrap {
    padding: 8px;
    width: 185px;
    height: 54px;
    display: inline-block;
  }
  /* line 661, ../scss/style-archive.scss */
  .interview .pickup .flexBox .flexRight .textWrap .viewBtnWrap .viewBtn {
    padding-top: 3px;
    font-size: 15px;
    padding-left: 10px;
  }
  /* line 669, ../scss/style-archive.scss */
  .interview .pickup .flexBox .NumberArea {
    display: flex;
    margin-top: -4px;
    padding-left: 20px;
  }
  /* line 673, ../scss/style-archive.scss */
  .interview .pickup .flexBox .NumberArea .num {
    padding-left: 10px;
  }
  /* line 675, ../scss/style-archive.scss */
  .interview .pickup .flexBox .NumberArea .num .img1 {
    width: min(34.66vw, 114px);
    height: min(26.4vw, 87px);
  }
  /* line 679, ../scss/style-archive.scss */
  .interview .pickup .flexBox .NumberArea .num .img2 {
    width: min(38.13vw, 125px);
    height: min(26.4vw, 87px);
  }
  /* line 684, ../scss/style-archive.scss */
  .interview .pickup .flexBox .NumberArea .caption {
    margin-top: -6px;
    padding-top: 0px;
    padding-left: 15px;
  }
}
/* line 696, ../scss/style-archive.scss */
ul {
  padding-left: 0;
}

/* line 699, ../scss/style-archive.scss */
li {
  list-style: none;
}

/* line 705, ../scss/style-archive.scss */
.otherList .otherWrap ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 160px 48px;
  margin: 0 auto;
}
/* line 711, ../scss/style-archive.scss */
.otherList .otherWrap ul li.otherCard {
  position: relative;
}
/* line 713, ../scss/style-archive.scss */
.otherList .otherWrap ul li.otherCard .otherCardLink {
  display: block;
  transition: opacity 0.3s;
}
@media (hover: hover) and (pointer: fine) {
  /* line 717, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardLink:hover {
    opacity: 0.6;
  }
}
/* line 722, ../scss/style-archive.scss */
.otherList .otherWrap ul li.otherCard .otherCardNum {
  position: absolute;
  z-index: +1;
}
/* line 726, ../scss/style-archive.scss */
.otherList .otherWrap ul li.otherCard .otherCardThumb {
  position: relative;
  padding-bottom: 1em;
  margin-bottom: 16px;
}
/* line 731, ../scss/style-archive.scss */
.otherList .otherWrap ul li.otherCard .otherCardThumb .otherCardTitle {
  position: absolute;
  bottom: 0;
  left: 0;
}
/* line 736, ../scss/style-archive.scss */
.otherList .otherWrap ul li.otherCard .otherCardThumb .otherCardTitle span {
  white-space: nowrap;
  background: #DADFF8;
  width: fit-content;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-feature-settings: "halt";
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  display: inline;
}
/* line 749, ../scss/style-archive.scss */
.otherList .otherWrap ul li.otherCard .otherCardDetail {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

@media print, screen and (min-width: 768px) {
  /* line 760, ../scss/style-archive.scss */
  .otherList {
    padding-top: 156px;
    margin-bottom: 120px;
  }
  /* line 764, ../scss/style-archive.scss */
  .otherList .otherWrap ul {
    grid-template-columns: repeat(4, 1fr);
  }
  /* line 770, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardNum {
    width: 102px;
    height: auto;
    top: -60px;
    left: -10px;
  }
  /* line 778, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardThumb .otherCardTitle span {
    font-size: 18px;
    line-height: 1.6;
    padding: 8px 16px;
    letter-spacing: -0.7px;
    font-feature-settings: "halt";
  }
  /* line 788, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardDetail .otherCardDetailPos {
    font-size: 16px;
    line-height: 2;
  }
  /* line 792, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardDetail .otherCardDetailName {
    font-size: 18px;
    line-height: 1;
  }
  /* line 796, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardDetail .otherCardDetailData {
    font-size: 14px;
    line-height: 1.8;
  }
}
@media only screen and (max-width: 767px) {
  /* line 807, ../scss/style-archive.scss */
  .otherList {
    padding-top: 80px;
    margin-bottom: 100px;
  }
  /* line 811, ../scss/style-archive.scss */
  .otherList .otherWrap ul {
    grid-template-columns: repeat(2, 1fr);
    gap: 100px 20px;
  }
  /* line 815, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardNum {
    width: 60px;
    height: auto;
    top: -30px;
    left: -10px;
  }
  /* line 821, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardThumb {
    padding-bottom: 3em;
  }
  /* line 824, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardThumb .otherCardTitle span {
    font-size: 14px;
    line-height: 1.6;
    padding: 6px 10px;
    letter-spacing: -0.7px;
  }
  /* line 832, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardDetail {
    gap: 6px;
  }
  /* line 834, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardDetail .otherCardDetailPos {
    font-size: 13px;
    line-height: 2;
  }
  /* line 838, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardDetail .otherCardDetailName {
    font-size: 18px;
    line-height: 1;
  }
  /* line 842, ../scss/style-archive.scss */
  .otherList .otherWrap ul li.otherCard .otherCardDetail .otherCardDetailData {
    font-size: 13px;
    line-height: 1.6;
  }
}

/*# sourceMappingURL=style-archive.css.map */