/* Scss Document */
.psdr {
  /* global navigation
  ============================*/
  /* page anchor navigation
  ============================*/
  /* category page navigation
  ============================*/ }
  /* .psdr #psdrBreadcrumbs {
    margin-right: auto;
    padding-right: 2.1428571429vw; }
    @media screen and (max-width: 767px) {
      .psdr #psdrBreadcrumbs {
        width: 100%;
        padding: 2vw 4vw; } }
    .psdr #psdrBreadcrumbs ul {
      display: flex;
      flex-wrap: wrap; }
    .psdr #psdrBreadcrumbs li {
      position: relative;
      font-size: clamp(1rem, 1.25vw, 1.4rem);
      line-height: 1.5; }
      @media screen and (max-width: 767px) {
        .psdr #psdrBreadcrumbs li {
          font-size: clamp(1rem, 2.8985vw, 1.2rem); } }
      .psdr #psdrBreadcrumbs li:not(:last-child) {
        margin-right: 1.2857142857vw;
        padding-right: 1.4285714286vw; }
        @media screen and (max-width: 767px) {
          .psdr #psdrBreadcrumbs li:not(:last-child) {
            padding-right: 2.1333333333vw; } }
        .psdr #psdrBreadcrumbs li:not(:last-child)::after {
          content: "";
          display: inline-block;
          width: 0.5em;
          height: 0.5em;
          border-top: 0.1rem solid #111;
          border-right: 0.1rem solid #111;
          transform: rotate(45deg);
          position: absolute;
          right: 0;
          top: 0.45em; }
          @media screen and (max-width: 767px) {
            .psdr #psdrBreadcrumbs li:not(:last-child)::after {
              top: 0.58em; } }
    .psdr #psdrBreadcrumbs a {
      color: #0063cc; } */
  .psdr #psdrTypeNav ul {
    display: flex; 
    justify-content: center;
  }
  .psdr #psdrTypeNav li {
    /* width: 9.6428571429vw; */
    width: 150px;
    font-size: clamp(1rem, 1.428vw, 1.6rem); }
    @media screen and (max-width: 767px) {
      .psdr #psdrTypeNav li {
        width: 43.3333333333vw;
        font-size: clamp(1rem, 3.3816vw, 1.4rem); } }
  .psdr #psdrTypeNav a {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: 60px;
    font-weight: 700;
    line-height: 1.25; }
    @media screen and (max-width: 767px) {
      .psdr #psdrTypeNav a {
        flex-direction: row;
        height: 13.3333333333vw; } }
    .psdr #psdrTypeNav a:focus {
      outline-offset: -0.2rem; }
  .psdr #psdrTypeNav .psdr__type__new-graduate a {
    background-color: #0063cc;
    color: #fff; }
  .psdr #psdrTypeNav .psdr__type__career a {
    background-color: #000e4e;
    color: #fff; }
  .psdr #psdrNav {
    position: relative;
    /**************************\
      Demo Animation Style
    \**************************/ }
    .psdr #psdrNav #psdrNavTrigger,
    .psdr #psdrNav .modal__btn {
      position: relative;
      /* width: 9.6428571429vw; */
      width: 170px;
      height: 60px;
      padding: 0 0.7142857143vw 0 3.5714285714vw;
      font-family: 'Roboto', sans-serif;
      font-size: clamp(1rem, 1.5625vw, 1.6rem);
      font-weight: 500;
      letter-spacing: 0.1rem;
      line-height: 1.15;
      text-align: center;
      -webkit-appearance: none; }
      @media screen and (max-width: 767px) {
        .psdr #psdrNav #psdrNavTrigger,
        .psdr #psdrNav .modal__btn {
          width: 13.3333333333vw;
          height: 13.3333333333vw;
          font-size: 1rem;
          padding: 5.3333333333vw 0 0; } }
      .psdr #psdrNav #psdrNavTrigger:focus,
      .psdr #psdrNav .modal__btn:focus {
        outline-offset: -0.2rem; }
      .psdr #psdrNav #psdrNavTrigger::before, .psdr #psdrNav #psdrNavTrigger::after,
      .psdr #psdrNav .modal__btn::before,
      .psdr #psdrNav .modal__btn::after {
        content: "";
        display: block;
        position: absolute;
        left: 1.4285714286vw;
        width: 2vw;
        height: 0.2rem;
        background: #111;
        transition: opacity 0.7s cubic-bezier(0, 0, 0.58, 1), transform 0.7s cubic-bezier(0.455, 0.03, 0.515, 0.955); }
        @media screen and (max-width: 767px) {
          .psdr #psdrNav #psdrNavTrigger::before, .psdr #psdrNav #psdrNavTrigger::after,
          .psdr #psdrNav .modal__btn::before,
          .psdr #psdrNav .modal__btn::after {
            left: 3.7333333333vw;
            width: 5.3333333333vw; } }
      .psdr #psdrNav #psdrNavTrigger::before,
      .psdr #psdrNav .modal__btn::before {
        top: 2.4rem; }
        @media screen and (max-width: 767px) {
          .psdr #psdrNav #psdrNavTrigger::before,
          .psdr #psdrNav .modal__btn::before {
            top: 2.6666666667vw; } }
      .psdr #psdrNav #psdrNavTrigger::after,
      .psdr #psdrNav .modal__btn::after {
        top: 3.6rem;
        width: 1.4285714286vw; }
        @media screen and (max-width: 767px) {
          .psdr #psdrNav #psdrNavTrigger::after,
          .psdr #psdrNav .modal__btn::after {
            top: 4.8vw;
            width: 3.7333333333vw; } }
      .psdr.ipad #psdrNav .modal__btn {
        margin-top: 1.4285714286vw; }
    .psdr #psdrNav .modal__btn {
      position: absolute;
      right: 0;
      top: 0;
      border-radius: 0;
      background-color: #fff;
      color: #111; }
      .psdr #psdrNav .modal__btn::before {
        top: 3rem;
        width: 1.4285714286vw;
        transform: rotate(45deg); }
        @media screen and (max-width: 767px) {
          .psdr #psdrNav .modal__btn::before {
            left: 4.5333333333vw;
            top: 3.7333333333vw;
            width: 3.7333333333vw; } }
      .psdr #psdrNav .modal__btn::after {
        top: 3rem;
        width: 1.4285714286vw;
        transform: rotate(-45deg); }
        @media screen and (max-width: 767px) {
          .psdr #psdrNav .modal__btn::after {
            left: 4.5333333333vw;
            top: 3.7333333333vw;
            width: 3.7333333333vw; } }
      .psdr #psdrNav .modal__btn:focus, .psdr #psdrNav .modal__btn:hover {
        -webkit-transform: scale(1);
        transform: scale(1); }
    .psdr #psdrNav .modal {
      display: none; }
      .psdr #psdrNav .modal.is-open {
        display: block; }
    .psdr #psdrNav .modal__overlay {
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background: rgba(0, 0, 0, 0.2);
      z-index: 10000;
      justify-content: center;
      align-items: flex-start; }
    .psdr #psdrNav .modal__container {
      width: 100%;
      max-width: 100%;
      /*height: calc(100vh - 12.2rem);*/
      min-height: 100vh;
      padding: 6rem 0;
      border-radius: 0;
      background-color: #f2f2f2;
      /*background: transparent*/ }
      @media screen and (max-width: 767px) {
        .psdr #psdrNav .modal__container {
          height: 100%;
          max-height: none;
          min-height: -webkit-fill-available;
          padding: 10.6666666667vw 4vw; } }
    .psdr #psdrNav .micromodal-slide .modal__container,
    .psdr #psdrNav .micromodal-slide .modal__overlay {
      will-change: transform; }
@keyframes mmfadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
@keyframes mmfadeOut {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }
@keyframes mmslideIn {
  from {
    transform: translateY(15%); }
  to {
    transform: translateY(0); } }
@keyframes mmslideOut {
  from {
    transform: translateY(0); }
  to {
    transform: translateY(-10%); } }
    .psdr #psdrNav .micromodal-slide[aria-hidden="false"] .modal__overlay {
      animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1); }
    .psdr #psdrNav .micromodal-slide[aria-hidden="false"] .modal__container {
      animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1); }
    .psdr #psdrNav .micromodal-slide[aria-hidden="true"] .modal__overlay {
      animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1); }
    .psdr #psdrNav .micromodal-slide[aria-hidden="true"] .modal__container {
      animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1); }
    .psdr #psdrNav .psdr__nav__main {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      max-width: 99.6rem;
      margin: 0 auto;
      padding: 0 1rem;
      line-height: 2; }
      @media screen and (max-width: 767px) {
        .psdr #psdrNav .psdr__nav__main {
          flex-direction: column;
          width: 100%; } }
      .psdr #psdrNav .psdr__nav__main .psdr__nav__column {
        width: 23%; }
        @media screen and (max-width: 767px) {
          .psdr #psdrNav .psdr__nav__main .psdr__nav__column {
            width: 100%; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column:first-child {
          width: 38%; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column:first-child {
              width: 100%; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column:nth-child(2) {
          width: 30%; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column:nth-child(2) {
              width: 100%; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column ul {
          margin-top: 4.6106557377%; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column ul {
              margin-top: 2.6666666667vw; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column li {
          margin-top: 3.0737704918%;
          font-size: clamp(1rem, 1.3392vw, 1.5rem); }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column li {
              margin-top: 1.3333333333vw;
              font-size: clamp(1rem, 3.6231vw, 1.5rem); } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column a {
          position: relative;
          padding-left: 1.5em;
          color: #111; }
          .psdr #psdrNav .psdr__nav__main .psdr__nav__column a::before {
            position: absolute;
            top: 0.8em;
            left: 0;
            content: "";
            display: inline-block;
            width: 0.5em;
            height: 0.5em;
            border-top: 0.2rem solid #111;
            border-right: 0.2rem solid #111;
            transform: rotate(45deg); }
            @media screen and (max-width: 767px) {
              .psdr #psdrNav .psdr__nav__main .psdr__nav__column a::before {
                top: 0.7em; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column .psdr__navi__item_primary {
          margin: 3.0737704918% 0 0;
          padding-bottom: 2.0491803279%;
          border-bottom: 0.1rem solid #ccc;
          font-size: clamp(1.4rem, 1.6071vw, 1.8rem);
          font-weight: 700; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column .psdr__navi__item_primary {
              margin-top: 5.3333333333vw;
              padding-bottom: 1.3333333333vw;
              font-size: clamp(1.3rem, 4.1062vw, 1.7rem); } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column .psdr__nav__special {
          margin-top: 15.368852459%; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column .psdr__nav__special {
              margin-top: 8.6666666667vw; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column .psdr__nav__project-story {
          margin-top: 30.737704918%; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column .psdr__nav__project-story {
              margin-top: 10.6666666667vw; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column .psdr__nav__recruit {
          margin-top: 30.737704918%; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column .psdr__nav__recruit {
              margin-top: 10.6666666667vw; } }
      .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns {
        width: 100%;
        margin-top: 8.1967213115%; }
        @media screen and (max-width: 767px) {
          .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns {
            margin-top: 13.3333333333vw; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns__list {
          display: flex;
          justify-content: center; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns__list {
              flex-direction: column;
              align-items: center; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns li {
          width: 29.0983606557%;
          max-width: 28.4rem;
          margin: 0 3.0737704918%; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns li {
              width: 69.3333333333vw;
              font-size: clamp(1.3rem, 4.1062vw, 1.7rem); }
              .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns li + li {
                margin-top: 5.3333333333vw; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns a {
          width: 100%;
          padding: 8.1967213115%;
          color: #fff;
          text-align: center; }
          @media screen and (max-width: 767px) {
            .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns a {
              padding: 4vw; } }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns .psdr__nav__new-graduate a {
          background-color: #0063cc; }
        .psdr #psdrNav .psdr__nav__main .psdr__nav__column__btns .psdr__nav__career a {
          background-color: #000e4e; }
  .psdr .psdr__anchornav {
    margin-bottom: 6.1475409836%; }
    .psdr .psdr__anchornav ul {
      display: flex;
      justify-content: center; }
    .psdr .psdr__anchornav li {
      width: 20.4918032787%;
      margin: 0 3.0737704918%; }
      .psdr .psdr__anchornav li.psdr__manytxt {
        width: 28.6885245902%; }
    @media screen and (max-width: 767px) {
      .psdr .psdr__anchornav {
        margin-bottom: 10.6666666667vw; }
        .psdr .psdr__anchornav ul {
          flex-wrap: wrap;
          justify-content: space-between; }
        .psdr .psdr__anchornav li {
          width: 42.6666666667vw;
          margin: 4vw 0 0; }
          .psdr .psdr__anchornav li:nth-child(-n + 2) {
            margin-top: 0; }
          .psdr .psdr__anchornav li.psdr__manytxt {
            width: 42.6666666667vw; } }
    .psdr .psdr__anchornav a {
      position: relative;
      width: 100%;
      padding-bottom: 0.5rem;
      color: #111;
      font-weight: 700;
      text-align: center; }
      .psdr .psdr__anchornav a::after {
        content: "";
        display: block;
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 0.1rem;
        background-color: #000e4e; }
      .psdr .psdr__anchornav a span {
        display: block;
        padding: 0 2.5rem 0 0.5rem; }
        .psdr .psdr__anchornav a span::before {
          content: "";
          display: inline-block;
          width: 0.5em;
          height: 0.5em;
          border-top: 0.2rem solid #fff;
          border-right: 0.2rem solid #fff;
          transform: rotate(135deg);
          position: absolute;
          right: 0.6rem;
          top: 0.7em;
          z-index: 1;
          transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1), transform 0.7s cubic-bezier(0.23, 1, 0.32, 1), top 0.7s cubic-bezier(0.23, 1, 0.32, 1), right 0.7s cubic-bezier(0.23, 1, 0.32, 1), bottom 0.7s cubic-bezier(0.23, 1, 0.32, 1), left 0.7s cubic-bezier(0.23, 1, 0.32, 1), border 0.7s cubic-bezier(0.23, 1, 0.32, 1), background 0.7s cubic-bezier(0.23, 1, 0.32, 1), color 0.7s cubic-bezier(0.23, 1, 0.32, 1), text-shadow 0.7s cubic-bezier(0.23, 1, 0.32, 1), filter 0.7s cubic-bezier(0.23, 1, 0.32, 1); }
        .psdr .psdr__anchornav a span::after {
          content: "";
          position: absolute;
          right: 0;
          top: 0.4em;
          width: 2.1rem;
          height: 2.1rem;
          border-radius: 50%;
          background-color: #00b7f1;
          z-index: -1;
          transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1), transform 0.7s cubic-bezier(0.23, 1, 0.32, 1), top 0.7s cubic-bezier(0.23, 1, 0.32, 1), right 0.7s cubic-bezier(0.23, 1, 0.32, 1), bottom 0.7s cubic-bezier(0.23, 1, 0.32, 1), left 0.7s cubic-bezier(0.23, 1, 0.32, 1), border 0.7s cubic-bezier(0.23, 1, 0.32, 1), background 0.7s cubic-bezier(0.23, 1, 0.32, 1), color 0.7s cubic-bezier(0.23, 1, 0.32, 1), text-shadow 0.7s cubic-bezier(0.23, 1, 0.32, 1), filter 0.7s cubic-bezier(0.23, 1, 0.32, 1); }
      @media screen and (hover: hover) {
        .psdr .psdr__anchornav a:hover {
          color: #0063cc;
          opacity: 1; }
          .psdr .psdr__anchornav a:hover span::before,
          .psdr .psdr__anchornav a:hover span::after {
            transform: translateY(0.5rem) rotate(135deg); } }
      @media screen and (min-width: 768px) {
        .psdr .psdr__anchornav a {
          font-size: clamp(1.2rem, 1.0714vw, 1.5rem); } }
      @media screen and (max-width: 767px) {
        .psdr .psdr__anchornav a span {
          padding: 0 2rem 0 0; }
          .psdr .psdr__anchornav a span::before {
            right: 0.4rem;
            top: 0.7em; }
          .psdr .psdr__anchornav a span::after {
            right: 0;
            top: 0.45em;
            width: 1.6rem;
            height: 1.6rem; } }
  .psdr .psdr__category__pagenation {
    margin-top: 7.1721311475%;
    padding-bottom: 7.1721311475%; }
    @media screen and (max-width: 767px) {
      .psdr .psdr__category__pagenation {
        margin-top: 10.6666666667vw;
        padding-bottom: 10.6666666667vw; } }
    .psdr .psdr__category__pagenation .psdr__inner {
      border: solid 1px #ccc;
      display: flex;
      height: 103px; }
      @media screen and (max-width: 767px) {
        .psdr .psdr__category__pagenation .psdr__inner {
          flex-wrap: wrap;
          height: auto; } }
    .psdr .psdr__category__pagenation a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 100%;
      background-color: #fff;
      color: #111;
      text-align: center; }
      .psdr .psdr__category__pagenation a.psdr__noevent {
        pointer-events: none;
        color: #999;
        cursor: default; }
      @media screen and (hover: hover) {
        .psdr .psdr__category__pagenation a:not(.psdr__noevent):hover {
          background-color: #0063cc;
          color: #fff; } }
    .psdr .psdr__category__pagenation__list {
      border-left: solid 1px #ccc;
      border-right: solid 1px #ccc;
      width: 52.868852459%; }
      .psdr .psdr__category__pagenation__list span::before {
        position: relative;
        top: 0.2rem;
        margin-right: 1em;
        content: "";
        display: inline-block;
        width: 16px;
        height: 16px;
        background: url("/psd/recruit/common/img/category__nav__icon.png") no-repeat;
        background-size: contain; }
      @media screen and (max-width: 767px) {
        .psdr .psdr__category__pagenation__list {
          order: 3;
          width: 100%;
          height: 16vw;
          border-top: solid 1px #ccc;
          border-left: none;
          border-right: none; }
          .psdr .psdr__category__pagenation__list span::before {
            margin-right: 4vw; } }
    .psdr .psdr__category__pagenation__back {
      width: 30.9426229508%;
      height: 100%; }
      .psdr .psdr__category__pagenation__back span::before {
        position: relative;
        top: -0.2rem;
        margin-right: 2em;
        content: "";
        display: inline-block;
        width: 0.5em;
        height: 0.5em;
        border-top: 0.2rem solid #ccc;
        border-right: 0.2rem solid #ccc;
        transform: rotate(-135deg); }
      @media screen and (max-width: 767px) {
        .psdr .psdr__category__pagenation__back {
          order: 1;
          width: 50%;
          height: 16vw;
          border-right: solid 1px #ccc; }
          .psdr .psdr__category__pagenation__back span::before {
            margin-right: 4vw; } }
    .psdr .psdr__category__pagenation__next {
      width: 30.9426229508%;
      height: 100%; }
      .psdr .psdr__category__pagenation__next span::after {
        position: relative;
        top: -0.2rem;
        margin-left: 2em;
        content: "";
        display: inline-block;
        width: 0.5em;
        height: 0.5em;
        border-top: 0.2rem solid #ccc;
        border-right: 0.2rem solid #ccc;
        transform: rotate(45deg); }
      @media screen and (max-width: 767px) {
        .psdr .psdr__category__pagenation__next {
          order: 2;
          width: 50%;
          height: 16vw; }
          .psdr .psdr__category__pagenation__next span::after {
            margin-left: 4vw; } }