@charset "UTF-8";
/*******　仕事　*******/
.department {
  width: 100%;
  overflow-x: hidden; }
  .department .keyvisual {
    width: 100vw;
    aspect-ratio: 390 / 400;
    background-image: url("../../job/img/department_kv_sp.jpg");
    background-position: top center;
    background-size: 100% auto;
    background-repeat: no-repeat; }
    @media only screen and (min-width: 769px) {
      .department .keyvisual {
        width: 100%;
        aspect-ratio: 1920 / 998;
        background-image: url("../../job/img/department_kv_pc.jpg"); } }
  .department .keyvisual-inner {
    width: 100vw;
    padding-top: calc(115 / 390 * 100vw); }
    @media only screen and (min-width: 769px) {
      .department .keyvisual-inner {
        width: 100%;
        padding-top: calc(375 / 1920 * 100vw); } }
  .department .keyvisual-inner-logo {
    width: calc(330 / 390 * 100vw);
    margin: 0 auto; }
    @media only screen and (min-width: 769px) {
      .department .keyvisual-inner-logo {
        width: calc(858 / 1920 * 100vw); } }
  .department .keyvisual-inner-lead {
    width: calc(370 / 390 * 100vw);
    margin: calc(35 / 390 * 100vw) auto 0;
    font-size: calc(14 / 390 * 100vw);
    font-weight: 600;
    line-height: 1.7;
    text-align: center; }
    @media only screen and (min-width: 769px) {
      .department .keyvisual-inner-lead {
        width: calc(858 / 1920 * 100vw);
        margin: calc(95 / 1920 * 100vw) auto 0;
        font-size: calc(35 / 1920 * 100vw);
        line-height: 1.65;
        filter: drop-shadow(0 0 5px #FFF) drop-shadow(0 0 3px #FFF) drop-shadow(0 0 5px #FFF); } }
  .department .outline {
    width: 100%;
    position: relative;
    padding: calc(47 / 390 * 100vw) 0 calc(240 / 390 * 100vw); }
    @media only screen and (min-width: 769px) {
      .department .outline {
        margin: calc(0 / 1080 * 100vw) auto 0;
        padding: calc(125 / 1080 * 100vw) 0 calc(293 / 1080 * 100vw); } }
    @media only screen and (min-width: 1080px) {
      .department .outline {
        margin: 0px auto 0;
        padding: 125px 0 293px; } }
    @media only screen and (min-width: 1981px) {
      .department .outline {
        margin: 0px auto 0; } }
  .department .page-title {
    position: absolute;
    background: #FFF;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    width: calc(340 / 390 * 100vw);
    height: calc(62 / 390 * 100vw);
    margin: auto;
    top: calc(-60 / 390 * 100vw);
    left: 0;
    right: 0; }
    @media only screen and (min-width: 769px) {
      .department .page-title {
        width: calc(960 / 1080 * 100vw);
        height: calc(110 / 1080 * 100vw);
        top: calc(-60 /1080 * 100vw); } }
    @media only screen and (min-width: 1080px) {
      .department .page-title {
        width: 960px;
        height: 110px;
        top: -60px; } }
  .department .outline-inner {
    width: calc(300 / 390 * 100vw);
    margin: 0 auto; }
    @media only screen and (min-width: 769px) {
      .department .outline-inner {
        width: calc(780 / 1080 * 100vw); } }
    @media only screen and (min-width: 1080px) {
      .department .outline-inner {
        width: 780px; } }
  .department .outline_twoblock {
    margin: calc(0 / 390 * 100vw) auto 0; }
    @media only screen and (min-width: 769px) {
      .department .outline_twoblock {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin: calc(0 / 1080 * 100vw) auto 0; } }
    @media only screen and (min-width: 1080px) {
      .department .outline_twoblock {
        margin: 0px auto 0; } }
    .department .outline_twoblock .outline-textarea {
      width: 100%;
      margin: calc(0 / 390 * 100vw) auto 0; }
      @media only screen and (min-width: 769px) {
        .department .outline_twoblock .outline-textarea {
          width: calc(410 / 1080 * 100vw);
          margin: calc(0 / 1080 * 100vw); } }
      @media only screen and (min-width: 1080px) {
        .department .outline_twoblock .outline-textarea {
          width: 410px;
          margin: 0px; } }
      .department .outline_twoblock .outline-textarea p {
        font-size: calc(14 / 390 * 100vw);
        line-height: 1.7em; }
        @media only screen and (min-width: 769px) {
          .department .outline_twoblock .outline-textarea p {
            font-size: calc(16 / 1080 * 100vw);
            line-height: 2em; } }
        @media only screen and (min-width: 1080px) {
          .department .outline_twoblock .outline-textarea p {
            font-size: 16px; } }
      .department .outline_twoblock .outline-textarea p + p {
        margin-top: 1.5em; }
    .department .outline_twoblock .outline-ph {
      width: 100%;
      margin: calc(25 / 390 * 100vw) auto 0; }
      @media only screen and (min-width: 769px) {
        .department .outline_twoblock .outline-ph {
          width: calc(300 / 1080 * 100vw);
          margin: calc(0 / 1080 * 100vw); } }
      @media only screen and (min-width: 1080px) {
        .department .outline_twoblock .outline-ph {
          width: 300px;
          margin: 0px; } }
  .department .block01 {
    position: relative;
    z-index: 50;
    width: 100vw;
    background-image: url("../../job/img/bg_pink_sp.png"), linear-gradient(transparent, transparent 50%, #df6a86 50% 100%);
    background-size: 100% auto;
    background-position: top center;
    background-repeat: no-repeat;
    margin: calc(-170 / 390 * 100vw) auto 0;
    padding: 0 0 calc(75 / 390 * 100vw); }
    @media only screen and (min-width: 769px) {
      .department .block01 {
        background-image: url("../../job/img/bg_pink_pc.png"), linear-gradient(transparent, transparent 50%, #df6a86 50% 100%);
        width: 100%;
        margin: calc(-210 / 1080 * 100vw) auto 0;
        padding: 0 0 calc(125 / 1080 * 100vw); } }
    @media only screen and (min-width: 1080px) {
      .department .block01 {
        background-size: auto auto;
        background-repeat: repeat-x;
        margin: -210px auto 0;
        padding: 0 0 calc(125 / 1080 * 100vw); } }
  .department .block01-inner {
    margin: 0 auto; }
    @media only screen and (min-width: 769px) {
      .department .block01-inner {
        width: 100%; } }
  .department .department-list {
    width: calc(350 / 390 * 100vw);
    margin: calc(30 / 390 * 100vw) auto 0; }
    @media only screen and (min-width: 769px) {
      .department .department-list {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        width: calc(960 / 1080 * 100vw);
        margin: calc(46 / 1080 * 100vw) auto 0; } }
    @media only screen and (min-width: 1080px) {
      .department .department-list {
        width: 960px;
        margin: 46px auto 0; } }
    .department .department-list li {
      background: #FFF;
      width: calc(350 / 390 * 100vw);
      margin-bottom: calc(30 / 390 * 100vw);
      padding: calc(12 / 390 * 100vw) calc(12 / 390 * 100vw) calc(15 / 390 * 100vw) calc(12 / 390 * 100vw); }
      @media only screen and (min-width: 769px) {
        .department .department-list li {
          width: calc(464 / 1080 * 100vw);
          margin-bottom: calc(32 / 1080 * 100vw);
          padding: calc(15 / 1080 * 100vw) calc(15 / 1080 * 100vw) calc(18 / 1080 * 100vw) calc(15 / 1080 * 100vw); } }
      @media only screen and (min-width: 1080px) {
        .department .department-list li {
          width: 464px;
          margin-bottom: 32px;
          padding: 15px 15px 18px 15px; } }
      .department .department-list li .department-tiarea {
        width: 100%; }
        .department .department-list li .department-tiarea .icon {
          width: calc(185 / 390 * 100vw);
          margin: 0 auto; }
          @media only screen and (min-width: 769px) {
            .department .department-list li .department-tiarea .icon {
              width: calc(259 / 1080 * 100vw); } }
          @media only screen and (min-width: 1080px) {
            .department .department-list li .department-tiarea .icon {
              width: 259px; } }
        .department .department-list li .department-tiarea .textarea p {
          text-align: center;
          font-size: calc(15 / 390 * 100vw);
          font-weight: 500;
          margin-top: 0.7em; }
          @media only screen and (min-width: 769px) {
            .department .department-list li .department-tiarea .textarea p {
              font-size: calc(20 / 1080 * 100vw); } }
          @media only screen and (min-width: 1080px) {
            .department .department-list li .department-tiarea .textarea p {
              font-size: 20px; } }
      .department .department-list li .department-textarea p {
        font-size: calc(10 / 390 * 100vw);
        line-height: 1.75em;
        margin-top: 1.2em; }
        @media only screen and (min-width: 769px) {
          .department .department-list li .department-textarea p {
            font-size: calc(13 / 1080 * 100vw);
            line-height: 1.75em; } }
        @media only screen and (min-width: 1080px) {
          .department .department-list li .department-textarea p {
            font-size: 13px; } }
      .department .department-list li .department-textarea .section {
        color: #df6a86;
        font-weight: 500;
        height: 3em;
        margin-top: 0.8em;
        line-height: 1.5em; }
      .department .department-list li .relation_ti {
        border-top: 1px solid #df6a86;
        border-bottom: 1px solid #df6a86;
        padding: 0.3em;
        font-size: calc(10 / 390 * 100vw);
        text-align: center;
        color: #df6a86;
        margin: 1.5em 0 1em; }
        @media only screen and (min-width: 769px) {
          .department .department-list li .relation_ti {
            font-size: calc(13 / 1080 * 100vw); } }
        @media only screen and (min-width: 1080px) {
          .department .department-list li .relation_ti {
            font-size: 13px; } }
  .department .department_note {
    text-align: center;
    color: #FFF;
    font-size: calc(10 / 390 * 100vw);
    line-height: 1.75em;
    margin-top: 1.2em; }
    @media only screen and (min-width: 769px) {
      .department .department_note {
        font-size: calc(13 / 1080 * 100vw);
        line-height: 1.75em; } }
    @media only screen and (min-width: 1080px) {
      .department .department_note {
        font-size: 13px; } }
  .department .block01-inner-btn {
    margin: calc(36 / 390 * 100vw) auto 0; }
    @media only screen and (min-width: 769px) {
      .department .block01-inner-btn {
        margin: calc(90 / 1080 * 100vw) auto 0; } }
    @media only screen and (min-width: 1080px) {
      .department .block01-inner-btn {
        margin: 90px auto 0; } }
