@media screen and (min-width: 768px) {
  #main-contents {
    padding-top: 0; } }
@media screen and (max-width: 767px) {
  #main-contents {
    padding-top: 6.9230769231em; } }

.layout {
  position: relative; }
  .layout .content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5; }
  .layout .photo {
    min-height: 40em;
    position: relative;
    background-image: url("");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; }
    .layout .photo::before {
      content: "";
      display: block;
      padding-top: 58.1818181818%; }
  @media screen and (min-width: 768px) {
    .layout:not(.reverse) .content {
      left: 10.9375%; }
    .layout:not(.reverse) .photo {
      margin-right: 10.9375%;
      margin-left: 31.7708333333%; }
    .layout.reverse .content {
      right: 10.9375%;
      text-align: right; }
    .layout.reverse .photo {
      margin-left: 10.9375%;
      margin-right: 31.7708333333%; } }
  @media screen and (max-width: 1280px) {
    .layout:not(.reverse) .photo {
      margin-right: 0; }
    .layout.reverse .photo {
      margin-left: 0; } }
  @media screen and (max-width: 767px) {
    .layout {
      display: flex;
      flex-direction: column;
      width: 85.9375%;
      padding: 1.9230769231em 0; }
      .layout .content {
        order: 2;
        position: static;
        transform: none;
        margin-top: 1.9230769231em; }
      .layout .photo {
        order: 1;
        margin: 0;
        height: 15.3846153846em;
        min-height: 0; }
      .layout:not(.reverse) {
        margin-left: auto; }
      .layout.reverse {
        margin-right: auto; }
        .layout.reverse .content {
          text-align: right; } }

.layoutbase .content h3,
.layoutbase .content h4 {
  white-space: nowrap; }
.layoutbase.reverse .content {
  text-align: right; }
  .layoutbase.reverse .content h3,
  .layoutbase.reverse .content h4 {
    white-space: nowrap;
    text-align: right; }

#logobig {
  position: fixed;
  z-index: 10;
  top: 8.75em;
  left: 8.375em;
  transform: translate(-50%, -50%);
  line-height: 0;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  -moz-transition: opacity 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  filter: drop-shadow(0 0 0.5em rgba(255, 255, 255, 0.5)); }
  #logobig img {
    width: 9.008125em; }
  @media screen and (max-width: 1280px) {
    #logobig {
      display: none; } }

@media screen and (min-width: 1281px) {
  body:not(.scrolled) header {
    background-color: transparent;
    padding-right: 2.1875em; }
    body:not(.scrolled) header .logo {
      transform: translateX(-100%); }
    body:not(.scrolled) header .rightArea .navi .business {
      background-color: #FFF;
      font-size: 1.25em; }

  body.scrolled #logobig {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.9); } }
#fv {
  position: relative;
  margin-bottom: 10.625em; }
  #fv .slider {
    line-height: 0; }
    #fv .slider .bg {
      height: 100vh;
      background-image: url("");
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover; }
      @media (min-width: 768px) {
        #fv .slider .bg {
          max-height: 85vw; } }
      @media (min-width: 768px) and (max-height: 400px) and (orientation: landscape) {
        #fv .slider .bg {
          min-height: 55.4187192118vw; } }
    #fv .slider .overlay.ol1 {
      position: absolute;
      z-index: 10;
      left: 50%;
      top: 42%;
      line-height: 0; }
      #fv .slider .overlay.ol1 .txt {
        font-size: 2em;
        line-height: 1.84375em;
        letter-spacing: 0.150em;
        color: #004714;
        text-align: center;
        text-shadow: 0 0 0.1875em #FFF, 0 0 0.375em #FFF, 0 0 0.5625em #FFF, 0 0 0.75em #FFF, 0 0 0.9375em #FFF; }
      #fv .slider .overlay.ol1 .heart {
        width: 28.125em;
        margin-top: 3.75em; }
    #fv .slider .overlay.ol2 .ol_base {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      z-index: 10; }
      #fv .slider .overlay.ol2 .ol_base .txt {
        font-size: 2em;
        line-height: 1.84375em;
        letter-spacing: 0.120em;
        color: #004714;
        text-align: center;
        text-shadow: 0 0 0.1875em #FFF, 0 0 0.375em #FFF, 0 0 0.5625em #FFF, 0 0 0.75em #FFF, 0 0 0.9375em #FFF; }
      #fv .slider .overlay.ol2 .ol_base .business {
        display: flex;
        margin-top: 1.375em; }
        #fv .slider .overlay.ol2 .ol_base .business .b_item:not(:last-child) {
          margin-right: 2.3125em; }
        #fv .slider .overlay.ol2 .ol_base .business .b_item .ci {
          display: flex;
          justify-content: center;
          align-items: center;
          height: 6.75em; }
        #fv .slider .overlay.ol2 .ol_base .business .b_item .photo {
          line-height: 0;
          width: 12.1875em;
          max-width: 100%; }
          #fv .slider .overlay.ol2 .ol_base .business .b_item .photo img {
            width: 100%; }
        #fv .slider .overlay.ol2 .ol_base .business .b_item.bi01 .ci img {
          width: 9.2345em; }
        #fv .slider .overlay.ol2 .ol_base .business .b_item.bi02 .ci img {
          width: 12.375em; }
        #fv .slider .overlay.ol2 .ol_base .business .b_item.bi03 .ci img {
          width: 13.17593125em; }
        #fv .slider .overlay.ol2 .ol_base .business .b_item.bi04 .ci img {
          width: 7.90625em; }
    #fv .slider .overlay.ol2 .heart {
      width: 25.625em;
      position: absolute;
      bottom: 0;
      left: 55%; }
    #fv .slider .overlay.ol3 .txt {
      font-size: 2em;
      line-height: 1.84375em;
      letter-spacing: 0.150em;
      color: #004714;
      text-align: center;
      text-shadow: 0 0 0.1875em #FFF, 0 0 0.375em #FFF, 0 0 0.5625em #FFF, 0 0 0.75em #FFF, 0 0 0.9375em #FFF;
      position: absolute;
      z-index: 10;
      left: 50%;
      top: 37%;
      transform: translate(-50%, -50%); }
    #fv .slider .overlay.ol3 .heart {
      width: 25.625em;
      position: absolute;
      bottom: 0;
      left: 55%; }
  @media screen and (max-width: 767px) {
    #fv {
      margin-bottom: 2.3076923077em; }
      #fv .slider .bg {
        height: 30.7692307692em; } }
    @media screen and (max-width: 767px) and (orientation: landscape) {
      #fv .slider .bg {
        height: 125vw; } }
  @media screen and (max-width: 767px) {
      #fv .slider .overlay.ol1 {
        left: auto;
        right: 4.6875%;
        top: 56.5%;
        transform: translateY(-50%); }
        #fv .slider .overlay.ol1 .txt {
          font-size: 1.0769230769em;
          line-height: 1.7142857143em; }
        #fv .slider .overlay.ol1 .heart {
          width: 12.2959769231em;
          margin-top: 1.6923076923em; }
      #fv .slider .overlay.ol2 .ol_base {
        width: 87.5%;
        padding-bottom: 5.3846153846em; }
        #fv .slider .overlay.ol2 .ol_base .txt {
          font-size: 1.0769230769em;
          line-height: 1.7142857143em;
          letter-spacing: 0.075em; }
        #fv .slider .overlay.ol2 .ol_base .business {
          flex-wrap: wrap;
          justify-content: space-between;
          margin-top: 0; }
          #fv .slider .overlay.ol2 .ol_base .business .b_item {
            width: 47.1428571429%;
            margin-top: 0.6153846154em; }
            #fv .slider .overlay.ol2 .ol_base .business .b_item:not(:last-child) {
              margin-right: 0; }
            #fv .slider .overlay.ol2 .ol_base .business .b_item .ci {
              height: 2.7692307692em; }
            #fv .slider .overlay.ol2 .ol_base .business .b_item .photo {
              width: 100%; }
            #fv .slider .overlay.ol2 .ol_base .business .b_item.bi01 .ci img {
              width: 5.0198em; }
            #fv .slider .overlay.ol2 .ol_base .business .b_item.bi02 .ci img {
              width: 7.0769230769em; }
            #fv .slider .overlay.ol2 .ol_base .business .b_item.bi03 .ci img {
              width: 8.1396076923em; }
            #fv .slider .overlay.ol2 .ol_base .business .b_item.bi04 .ci img {
              width: 4.3810538462em; }
      #fv .slider .overlay.ol2 .heart {
        width: 8.4615384615em;
        left: 50%;
        transform: translateX(-50%); }
      #fv .slider .overlay.ol3 .txt {
        font-size: 1.0769230769em;
        line-height: 1.7142857143em;
        top: 30%;
        width: 100%; }
      #fv .slider .overlay.ol3 .heart {
        width: 10em;
        left: 53.125%; }
      #fv .slider .s02 .overlay.ol1 {
        left: 4.6875%;
        right: auto;
        top: 50%; } }
  @media print {
    #fv .slider .bg {
      height: 50vh; } }

#whats {
  margin-bottom: 10.625em; }
  #whats .layout .photo::before {
    padding-top: 84.3137254902%; }
  @media screen and (min-width: 768px) {
    #whats .layout .photo {
      min-height: 53.75em;
      margin-left: 35.9375%; } }
  #whats .layout .content h3 {
    margin-bottom: 2.5em; }
  #whats .layout .content h4 {
    font-size: 2.375em;
    line-height: 1.5789473684em;
    margin-bottom: 0.7894736842em; }
  #whats .layout .content .txt01 {
    line-height: 2.375em;
    width: 23.875em;
    max-width: 100%;
    margin-bottom: 2.5em; }
  #whats .heart {
    width: 20em;
    position: absolute;
    z-index: 5;
    bottom: 3.25em;
    right: 7.03125%; }
  @media screen and (max-width: 1280px) {
    #whats .layoutbase {
      padding-right: 0; } }
  @media screen and (max-width: 767px) {
    #whats {
      margin-bottom: 2.3076923077em;
      padding-top: 1.9230769231em; }
      #whats h3 {
        margin-left: 14.0625%;
        margin-bottom: 0; }
      #whats .layout .content h4 {
        font-size: 1.3076923077em;
        line-height: 1.7058823529em; }
      #whats .layout .content .txt01 {
        line-height: 1.7692307692em;
        width: 18.8461538462em;
        margin-bottom: 1.9230769231em; }
      #whats .layout .photo {
        height: 18.1538461538em; } }

#business {
  margin-bottom: 10.625em; }
  #business .icon {
    width: 30.1663em;
    position: absolute;
    z-index: 5;
    top: -4.875em;
    left: 2.3958333333%; }
  #business h3 {
    text-align: right; }
  #business h4 {
    text-align: center;
    margin-top: -0.625em;
    margin-bottom: 2.5em; }
  #business .businessline {
    display: flex;
    flex-flow: wrap;
    justify-content: center; }
    #business .businessline .bl_item {
      display: flex;
      flex-direction: column;
      width: 47%; }
      #business .businessline .bl_item:nth-child(n + 3) {
        margin-top: 6.25em; }
      #business .businessline .bl_item:nth-child(1) {
        margin-right: 6%; }
      #business .businessline .bl_item .photo {
        background-image: url("");
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 25em;
        overflow: hidden; }
      #business .businessline .bl_item .info {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        width: 34.6875em;
        max-width: 100%;
        margin: auto; }
        #business .businessline .bl_item .info .ci {
          display: flex;
          align-items: center;
          justify-content: center;
          height: 7.1875em;
          margin-top: 0.625em; }
        #business .businessline .bl_item .info .descript {
          margin-bottom: 2.625em; }
        #business .businessline .bl_item .info .btn1 {
          margin-top: auto;
          width: 100%; }
    #business .businessline .bl01 .info .ci img {
      width: 13.25em; }
    #business .businessline .bl02 .info .ci img {
      width: 18.48715em; }
    #business .businessline .bl03 .info .ci img {
      width: 20.92593125em; }
    #business .businessline .bl04 .info .ci img {
      width: 11.8125em; }
  @media screen and (max-width: 1130px) {
    #business .icon.pc {
      display: none; } }
  @media screen and (max-width: 767px) {
    #business {
      margin-bottom: 2.3076923077em; }
      #business .wrapper {
        padding-top: 1.9230769231em;
        padding-bottom: 1.9230769231em;
        padding-right: 14.0625%;
        padding-left: 0; }
      #business .icon.sp {
        left: 0;
        width: 6.2641em;
        top: 5.9230769231em; }
      #business h4 {
        text-align: right;
        letter-spacing: 0;
        font-size: 1.1538461538em;
        line-height: 1.9333333333em; }
      #business .businessline {
        display: block; }
        #business .businessline .bl_item {
          width: 100%; }
          #business .businessline .bl_item:nth-child(n + 3) {
            margin-top: 0; }
          #business .businessline .bl_item:not(:last-child) {
            margin-bottom: 3.4615384615em; }
          #business .businessline .bl_item .photo {
            height: 12em; }
          #business .businessline .bl_item .info {
            padding-left: 10.9090909091%; }
            #business .businessline .bl_item .info .ci {
              display: block;
              text-align: right;
              height: auto;
              margin-top: 1.9230769231em;
              margin-bottom: 0.9230769231em; }
            #business .businessline .bl_item .info .descript {
              margin-bottom: 1.5384615385em; }
            #business .businessline .bl_item .info .btn1 {
              width: 11.5384615385em;
              margin-left: auto; }
        #business .businessline .bl01 .info .ci img {
          width: 9.8461538462em; }
        #business .businessline .bl02 .info .ci img {
          width: 14.7692307692em; }
        #business .businessline .bl03 .info .ci img {
          width: 16.9088384615em; }
        #business .businessline .bl04 .info .ci img {
          width: 9.5169538462em; } }

#topmessage {
  margin-bottom: 10.625em; }
  #topmessage h4 {
    margin-bottom: 2.34375em; }
  #topmessage .icon {
    width: 22.8125em;
    position: absolute;
    z-index: 5;
    bottom: -4.0625em;
    right: 5.2083333333%; }
  @media screen and (max-width: 767px) {
    #topmessage {
      margin-bottom: 2.3076923077em; }
      #topmessage h4 {
        margin-bottom: 0; }
      #topmessage .morebtn {
        margin-top: 1.6923076923em; }
      #topmessage .icon {
        width: 10.6649076923em;
        bottom: auto;
        top: 10em;
        right: 1.1538461538em; } }

#company_sdgs {
  margin-bottom: 10.625em; }
  #company_sdgs h4 {
    margin-bottom: 2.34375em; }
  #company_sdgs .icon {
    width: 11.5em;
    position: absolute;
    z-index: 5;
    bottom: -9.6875em;
    left: 10.4166666667%;
    transform: translateX(-50%); }
  @media screen and (max-width: 767px) {
    #company_sdgs {
      margin-bottom: 7.3076923077em; }
      #company_sdgs h4 {
        margin-bottom: 0; }
      #company_sdgs .morebtn {
        margin-top: 1.6923076923em; }
      #company_sdgs .icon {
        width: 4.4176923077em;
        left: 1.1538461538em;
        bottom: -0.6153846154em;
        transform: none; } }

#news {
  margin-bottom: 10.625em;
  position: relative; }
  #news .base {
    width: 60em;
    max-width: 100%;
    margin: auto;
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
    position: relative;
    z-index: 5; }
    #news .base h3 {
      width: 100%;
      margin-bottom: 4.875em;
      position: relative;
      z-index: 5; }
    #news .base .news {
      width: 48.9583333333%;
      position: relative;
      z-index: 5; }
      #news .base .news .list {
        border-top: 1px solid #004714;
        position: relative; }
        #news .base .news .list::after {
          content: "";
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background-color: rgba(255, 255, 255, 0.8);
          z-index: -1;
          filter: blur(0.5em); }
        #news .base .news .list li {
          display: block;
          border-bottom: 1px solid #004714;
          padding: 1.25em; }
          #news .base .news .list li .title {
            font-size: 0.8888888889em; }
      #news .base .news .morebtn {
        margin-top: 2.8125em; }
        #news .base .news .morebtn .btn1 {
          width: 100%; }
    #news .base .twitter {
      width: 41.6666666667%;
      position: relative;
      z-index: 5; }
      #news .base .twitter .tw_icon {
        position: absolute;
        width: 3.229925em;
        left: 50%;
        top: -3.3125em;
        transform: translate(-50%, -50%); }
      #news .base .twitter .tw_wrapper {
        border: 1px solid #004714;
        background-color: #FFF;
        position: relative;
        padding: 0.75em 1.875em; }
        #news .base .twitter .tw_wrapper:not(:last-child) {
          margin-bottom: 2.6875em; }
        #news .base .twitter .tw_wrapper .tw_base {
          height: 29.625em; }
          #news .base .twitter .tw_wrapper .tw_base .inner {
            width: 100%;
            height: 100%;
            overflow-y: scroll; }
          #news .base .twitter .tw_wrapper .tw_base iframe {
            width: 100% !important;
            /*height: 100% !important;*/ }
          #news .base .twitter .tw_wrapper .tw_base a {
            -webkit-transition: opacity 0.3s;
            -moz-transition: opacity 0.3s;
            transition: opacity 0.3s; }
            #news .base .twitter .tw_wrapper .tw_base a:active, #news .base .twitter .tw_wrapper .tw_base a:hover {
              filter: alpha(opacity=60);
              -webkit-opacity: 0.6;
              -moz-opacity: 0.6;
              opacity: 0.6; }
  #news .bgicons {
    position: absolute;
    height: 100%;
    width: 100%;
    min-width: 120em;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 0; }
  #news .icon {
    position: absolute; }
    #news .icon.i01 {
      width: 40.71875em;
      top: -4.375em;
      right: 0; }
    #news .icon.i02 {
      width: 24.6875em;
      top: 50%;
      left: 2.34375%;
      transform: translateY(-50%); }
    #news .icon.i03 {
      width: 13.25em;
      bottom: -2.8125em;
      right: 12.5%;
      transform: translateX(50%); }
  @media screen and (max-width: 1540px) {
    #news .icon.i03 {
      opacity: 0; } }
  @media screen and (min-width: 768px) {
    #news .wrapper {
      padding: 0 10.9375%; } }
  @media screen and (max-width: 767px) {
    #news {
      padding: 1.9230769231em 0;
      margin-bottom: 2.9230769231em; }
      #news .wrapper {
        padding: 0; }
      #news .base {
        position: static;
        display: block;
        width: auto;
        margin-left: 14.0625%;
        margin-right: 9.375%; }
        #news .base h3 {
          margin-bottom: 1.9230769231em; }
        #news .base .news {
          width: 100%; }
          #news .base .news .list li {
            padding-left: 0;
            padding-right: 0; }
            #news .base .news .list li:nth-child(n+4) {
              display: none; }
          #news .base .news .morebtn .btn1 {
            width: 11.5384615385em; }
        #news .base .twitter {
          width: 100%;
          margin-top: 10em; }
          #news .base .twitter .tw_icon {
            width: 2.5555384615em;
            top: -2.8461538462em; }
          #news .base .twitter .tw_wrapper {
            padding: 0.6923076923em 1.3846153846em; }
            #news .base .twitter .tw_wrapper .tw_base {
              height: 29.625em; }
            #news .base .twitter .tw_wrapper:not(:last-child) {
              margin-bottom: 2.3076923077em; }
      #news .icon.i01 {
        width: 15.3846153846em;
        top: -3.8461538462em; }
      #news .icon.i02 {
        width: 10.3076923077em;
        top: auto;
        left: 4.6875%;
        transform: translateY(1em); }
      #news .icon.i03 {
        opacity: 1;
        width: 6.5em;
        bottom: auto;
        right: 20.3125%;
        transform: translate(50%, -35%); } }

#recruitinfo .layout .photo {
  margin-left: 0;
  margin-right: 30.2083333333%;
  position: relative;
  overflow: hidden; }
  #recruitinfo .layout .photo::before {
    content: "";
    display: block;
    padding-top: 54.1791044776%; }
  @media screen and (min-width: 768px) {
    #recruitinfo .layout .photo {
      min-height: 45.3125em; } }
  #recruitinfo .layout .photo > div {
    background-image: url("");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    width: 50%;
    height: 50%; }
    #recruitinfo .layout .photo > div:nth-child(1) {
      top: 0;
      left: 0; }
    #recruitinfo .layout .photo > div:nth-child(2) {
      top: 0;
      right: 0; }
    #recruitinfo .layout .photo > div:nth-child(3) {
      bottom: 0;
      left: 0; }
    #recruitinfo .layout .photo > div:nth-child(4) {
      bottom: 0;
      right: 0; }
#recruitinfo .btns {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 31.875em;
  flex-direction: row-reverse; }
  #recruitinfo .btns .btn1 {
    width: 47.0588235294%;
    min-width: 0;
    font-size: 1.125em;
    letter-spacing: 0.050em;
    height: 3.3333333333em; }
    #recruitinfo .btns .btn1:nth-child(n+3) {
      margin-top: 2.1875em; }
@media screen and (max-width: 1280px) {
  #recruitinfo .photo > div {
    height: 30vw; } }
@media screen and (max-width: 767px) {
  #recruitinfo .layout .photo {
    margin-right: 0;
    height: 16.9230769231em; }
    #recruitinfo .layout .photo > div {
      height: 34.375vw; }
  #recruitinfo .layout .content h4 {
    margin-top: 0; }
  #recruitinfo .btns {
    width: 89.0909090909%;
    margin-left: auto; }
    #recruitinfo .btns .btn1 {
      font-size: 1em;
      letter-spacing: 0;
      width: 45.7142857143%;
      height: 3.0769230769em; }
      #recruitinfo .btns .btn1:nth-child(n+3) {
        margin-top: 1.3846153846em; } }
