@media screen and (max-width: 736px) {
  .pc {
    display: none;
  }
}

@media print, screen and (min-width: 736px) {
  .sp {
    display: none;
  }
}

.interviewCard {
  display: block;
}

@media print, screen and (min-width: 736px) {
  .interviewCard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media print, screen and (min-width: 736px) {
  .interviewCard:hover .interviewCard__visual {
    opacity: .8;
  }
}

@media (hover: hover) and (pointer: fine) {
  .interviewCard:hover .interviewCard__visual {
    opacity: .8;
  }
}

@media print, screen and (min-width: 736px) {
  .interviewCard > * {
    width: 50%;
  }
}

@media screen and (max-width: 736px) {
  .interviewCard > * {
    width: 100%;
  }
}

.interviewCard__visual {
  -webkit-transition: opacity .6s ease;
  transition: opacity .6s ease;
}

.interviewCard__body {
  position: relative;
}

@media print, screen and (min-width: 736px) {
  .interviewCard__body {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 64px;
  }
}

@media screen and (max-width: 736px) {
  .interviewCard__body {
    padding: calc(30 / 390 * 100vw) calc(20 / 390 * 100vw);
  }
}

.interviewCard__body:after {
  background-color: #ffffff;
  -webkit-clip-path: polygon(100% 50%, 0 0, 0 100%);
          clip-path: polygon(100% 50%, 0 0, 0 100%);
  content: '';
  display: block;
  position: absolute;
}

@media print, screen and (min-width: 736px) {
  .interviewCard__body:after {
    bottom: 11px;
    height: 17px;
    right: 13px;
    width: 17px;
  }
}

@media screen and (max-width: 736px) {
  .interviewCard__body:after {
    bottom: calc(9 / 390 * 100vw);
    height: calc(11 / 390 * 100vw);
    right: calc(12 / 390 * 100vw);
    width: calc(9 / 390 * 100vw);
  }
}

.interviewCard__num {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  z-index: 1;
}

@media print, screen and (min-width: 736px) {
  .interviewCard__num {
    height: 42px;
    left: -35px;
    padding-bottom: 4px;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 70px;
  }
}

@media screen and (max-width: 736px) {
  .interviewCard__num {
    height: calc(42 / 390 * 100vw);
    left: 0;
    padding-bottom: calc(4 / 390 * 100vw);
    top: calc(-8 / 390 * 100vw);
    width: calc(70 / 390 * 100vw);
  }
}

.interviewCard__num .bg {
  inset: 0;
  position: absolute;
  z-index: -1;
}

.interviewCard__num .bg .svgIcon {
  fill: #ffffff;
}

.interviewCard__num .inner {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
}

@media print, screen and (min-width: 736px) {
  .interviewCard__num .inner {
    font-size: 20px;
  }
}

@media screen and (max-width: 736px) {
  .interviewCard__num .inner {
    font-size: calc(20 / 390 * 100vw);
  }
}

.interviewCard__ttl {
  color: #ffffff;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
}

@media screen and (max-width: 736px) {
  .interviewCard__ttl {
    text-align: center;
  }
}

.interviewCard__ttl .sub {
  line-height: 1;
}

.interviewCard__ttl .sub:before {
  content: '';
  display: block;
  height: 0;
  margin-top: calc((1 - 1) * .5em);
  width: 0;
}

.interviewCard__ttl .sub:after {
  content: '';
  display: block;
  height: 0;
  margin-bottom: calc((1 - 1) * .5em);
  width: 0;
}

@media print, screen and (min-width: 736px) {
  .interviewCard__ttl .sub {
    font-size: 14px;
  }
}

@media screen and (max-width: 736px) {
  .interviewCard__ttl .sub {
    font-size: calc(14 / 390 * 100vw);
  }
}

@media print, screen and (min-width: 736px) {
  .interviewCard__ttl .sub + * {
    margin-top: 10px;
  }
}

@media screen and (max-width: 736px) {
  .interviewCard__ttl .sub + * {
    margin-top: calc(10 / 390 * 100vw);
  }
}

.interviewCard__ttl .main {
  font-size: 20px;
  line-height: 1.6;
}

.interviewCard__ttl .main:before {
  content: '';
  display: block;
  height: 0;
  margin-top: calc((1 - 1.6) * .5em);
  width: 0;
}

.interviewCard__ttl .main:after {
  content: '';
  display: block;
  height: 0;
  margin-bottom: calc((1 - 1.6) * .5em);
  width: 0;
}

@media print, screen and (min-width: 736px) {
  .interviewCard__ttl .main {
    font-size: 18px;
  }
}

@media screen and (max-width: 736px) {
  .interviewCard__ttl .main {
    font-size: calc(18 / 390 * 100vw);
  }
}

.interviewCard--pickup .interviewCard__body {
  background-color: #ffffff;
}

.interviewCard--pickup .interviewCard__num .inner {
  color: #ffffff;
}

.interviewCard--pickup .interviewCard__num .bg .svgIcon .svgInner {
  fill: #765f3d;
}

.interviewCard--pickup .interviewCard__num .bg .svgIcon .svgBg {
  fill: #ffffff;
}

.interviewCard--pickup .interviewCard__ttl {
  color: #000000;
}

.interviewCard--default .interviewCard__body {
  background: repeat-y center top / 100% auto;
  background-blend-mode: soft-light;
}

@media print, screen and (min-width: 736px) {
  .interviewCard--default:nth-child(1) .interviewCard__body {
    background-image: url("../../assets/imgs/pc/bg-texture-14@1.5x.png"), -webkit-gradient(linear, left top, left bottom, from(#dc8282));
    background-image: url("../../assets/imgs/pc/bg-texture-14@1.5x.png"), linear-gradient(#dc8282);
  }
}

@media screen and (max-width: 736px) {
  .interviewCard--default:nth-child(1) .interviewCard__body {
    background-image: url("../../assets/imgs/sp/bg-texture-14.png"), -webkit-gradient(linear, left top, left bottom, from(#dc8282));
    background-image: url("../../assets/imgs/sp/bg-texture-14.png"), linear-gradient(#dc8282);
  }
}

.interviewCard--default:nth-child(1) .interviewCard__num .bg .svgIcon .svgBg {
  fill: #dc8282;
}

.interviewCard--default:nth-child(1) .interviewCard__num .inner {
  color: #dc8282;
}

@media print, screen and (min-width: 736px) {
  .interviewCard--default:nth-child(2) .interviewCard__body {
    background-image: url("../../assets/imgs/pc/bg-texture-14@1.5x.png"), -webkit-gradient(linear, left top, left bottom, from(#74b3c2));
    background-image: url("../../assets/imgs/pc/bg-texture-14@1.5x.png"), linear-gradient(#74b3c2);
  }
}

@media screen and (max-width: 736px) {
  .interviewCard--default:nth-child(2) .interviewCard__body {
    background-image: url("../../assets/imgs/sp/bg-texture-14.png"), -webkit-gradient(linear, left top, left bottom, from(#74b3c2));
    background-image: url("../../assets/imgs/sp/bg-texture-14.png"), linear-gradient(#74b3c2);
  }
}

.interviewCard--default:nth-child(2) .interviewCard__num .bg .svgIcon .svgBg {
  fill: #74b3c2;
}

.interviewCard--default:nth-child(2) .interviewCard__num .inner {
  color: #74b3c2;
}

@media print, screen and (min-width: 736px) {
  .interviewCard--default:nth-child(3) .interviewCard__body {
    background-image: url("../../assets/imgs/pc/bg-texture-14@1.5x.png"), -webkit-gradient(linear, left top, left bottom, from(#7ebc83));
    background-image: url("../../assets/imgs/pc/bg-texture-14@1.5x.png"), linear-gradient(#7ebc83);
  }
}

@media screen and (max-width: 736px) {
  .interviewCard--default:nth-child(3) .interviewCard__body {
    background-image: url("../../assets/imgs/sp/bg-texture-14.png"), -webkit-gradient(linear, left top, left bottom, from(#7ebc83));
    background-image: url("../../assets/imgs/sp/bg-texture-14.png"), linear-gradient(#7ebc83);
  }
}

.interviewCard--default:nth-child(3) .interviewCard__num .bg .svgIcon .svgBg {
  fill: #7ebc83;
}

.interviewCard--default:nth-child(3) .interviewCard__num .inner {
  color: #7ebc83;
}

@media print, screen and (min-width: 736px) {
  .interviewSect {
    margin-inline: auto;
    width: 992px;
  }
}

.interviewSect__head {
  background-color: #eaa2ab;
  color: #ffffff;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  line-height: .7;
  text-align: center;
}

@media print, screen and (min-width: 736px) {
  .interviewSect__head {
    -webkit-clip-path: polygon(0 0, 100% 0, 98% 50%, 100% 100%, 0 100%, 2% 50%);
            clip-path: polygon(0 0, 100% 0, 98% 50%, 100% 100%, 0 100%, 2% 50%);
    font-size: 40px;
    padding: 20px 0;
  }
}

@media screen and (max-width: 736px) {
  .interviewSect__head {
    -webkit-clip-path: polygon(0 0, 100% 0, 95% 50%, 100% 100%, 0 100%, 5% 50%);
            clip-path: polygon(0 0, 100% 0, 95% 50%, 100% 100%, 0 100%, 5% 50%);
    font-size: calc(24 / 390 * 100vw);
    padding: calc(16 / 390 * 100vw) 0;
  }
}

@media print, screen and (min-width: 736px) {
  .interviewSect__head + * {
    margin-top: 60px;
  }
}

@media screen and (max-width: 736px) {
  .interviewSect__head + * {
    margin-top: calc(60 / 390 * 100vw);
  }
}

.interviewSect__cont > * {
  width: 100%;
}

@media print, screen and (min-width: 736px) {
  .interviewSect__cont > * + * {
    margin-top: 20px;
  }
}

@media screen and (max-width: 736px) {
  .interviewSect__cont > * + * {
    margin-top: 20px;
  }
}

.interviewSect--pickup .interviewSect__head {
  background-color: #ffffff;
  color: #765f3d;
}

@media print, screen and (min-width: 736px) {
  .keyVisual--pattern02 .keyVisual__body {
    padding: 200px 0;
  }
}

@media screen and (max-width: 736px) {
  .keyVisual--pattern02 .keyVisual__body {
    padding: calc(80 / 390 * 100vw) 0;
  }
}

.keyVisual--pattern02 .keyVisual__body .txt {
  text-align: center;
  line-height: 1.4;
}

.keyVisual--pattern02 .keyVisual__body .txt:before {
  content: '';
  display: block;
  height: 0;
  margin-top: calc((1 - 1.4) * .5em);
  width: 0;
}

.keyVisual--pattern02 .keyVisual__body .txt:after {
  content: '';
  display: block;
  height: 0;
  margin-bottom: calc((1 - 1.4) * .5em);
  width: 0;
}

@media print, screen and (min-width: 736px) {
  .keyVisual--pattern02 .keyVisual__body .txt {
    font-size: 40px;
  }
}

@media screen and (max-width: 736px) {
  .keyVisual--pattern02 .keyVisual__body .txt {
    font-size: calc(29 / 390 * 100vw);
    letter-spacing: 0;
  }
}

@media print, screen and (min-width: 736px) {
  .interview-list {
    padding: 100px 0;
  }
}

@media screen and (max-width: 736px) {
  .interview-list {
    padding: calc(100 / 390 * 100vw) 0;
  }
}

@media print, screen and (min-width: 736px) {
  .interview-pickup {
    padding: 60px 0;
  }
}

@media screen and (max-width: 736px) {
  .interview-pickup {
    padding: calc(60 / 390 * 100vw) 0;
  }
}