/*--- import -------------------------------------*/
/*------------------------------------- import ---*/
@media screen and (max-width: 750px) {
  main {
    padding-top: 24vw; } }
.mv {
  height: 90vh;
  background: url("../images/top/mv_bg.jpg") no-repeat;
  background-size: cover;
  background-position: center center; }
  .mv .bg img {
    width: 100%; }
  .mv .logo {
    position: absolute;
    top: 10px;
    left: 10px; }
    .mv .logo a {
      display: block;
      background: rgba(255, 255, 255, 0.7);
      padding: 40px; }
      .mv .logo a img {
        width: 179px; }
  .mv .txt_area {
    display: block;
    position: absolute;
    left: 315px;
    top: 0; }
    .mv .txt_area img {
      width: 238px; }

@media screen and (max-width: 1200px) {
  .mv .logo {
    position: absolute;
    top: 10px;
    left: 10px; }
    .mv .logo a {
      padding: 3.3333333333vw; }
      .mv .logo a img {
        width: 14.9166666667vw; }
  .mv .txt_area {
    left: 26.25vw; }
    .mv .txt_area img {
      width: 19.8333333333vw; } }
@media screen and (max-width: 1080px) {
  .mv .logo {
    position: absolute;
    top: 43%;
    left: 50%;
    transform: translate(-50%, -50%); }
    .mv .logo a img {
      width: 16.5740740741vw; }
  .mv .txt_area {
    left: 65.166667vw; }
    .mv .txt_area img {
      width: 22.037037037vw; } }
@media screen and (max-width: 480px) {
  .mv .logo {
    top: 63%; }
    .mv .logo a img {
      width: 23.8666666667vw; }
  .mv .txt_area {
    top: 0;
    left: 50%;
    transform: translateX(-50%); }
    .mv .txt_area img {
      width: 31.7333333333vw; } }
.news {
  background: #fff;
  padding: 4px;
  max-width: 950px;
  width: 100%;
  margin: 0 auto;
  position: absolute;
  bottom: 25px;
  left: 50%;
  transform: translateX(-50%); }
  .news ul {
    border: 3px solid #44af35;
    padding: 30px;
    padding-right: 80px; }
    .news ul li {
      display: flex;
      text-align: left; }
      .news ul li .date {
        width: 180px; }
      .news ul li .txt {
        width: calc(100% - 200px); }
  .news .more {
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%); }
    .news .more a {
      display: block;
      position: relative;
      left: 0px; }
      .news .more a img {
        width: 37px; }
      .news .more a:hover {
        transition: 0.3s;
        left: 10px; }

@media screen and (max-width: 750px) {
  .news {
    bottom: 0px;
    font-size: 14px; }
    .news ul {
      letter-spacing: 0.1rem;
      padding: 20px 30px 20px 10px; }
      .news ul li {
        display: block; }
        .news ul li .date {
          width: 100%; }
        .news ul li .txt {
          width: 100%; }
    .news .more {
      right: 10px;
      top: 55%; }
      .news .more a {
        left: 0px; }
        .news .more a img {
          width: 25px; }
        .news .more a:hover {
          left: 0px; } }
.sub_ttl {
  margin-top: 20px; }
  .sub_ttl .p1 {
    margin: 0 auto;
    position: relative;
    bottom: -32px; }
  .sub_ttl .p2 {
    position: relative;
    font-size: 36px;
    line-height: 1.3;
    letter-spacing: 0.3rem; }
  @media screen and (max-width: 750px) {
    .sub_ttl .p1 {
      bottom: -4.2666666667vw; }
    .sub_ttl .p2 {
      letter-spacing: 0.08rem;
      font-size: 24px; } }

#about .contents {
  margin-top: 40px; }
  #about .contents .sub_ttl {
    margin-top: 20px; }
    #about .contents .sub_ttl .p1 {
      width: 622px; }
    #about .contents .sub_ttl .p2 {
      color: #44af35; }
  #about .contents .txt_area {
    margin-top: 40px; }
@media screen and (max-width: 750px) {
  #about .contents {
    margin-top: 5.3333333333vw; }
    #about .contents .sub_ttl {
      margin-top: 2.6666666667vw; }
      #about .contents .sub_ttl .p1 {
        max-width: 82.9333333333vw;
        width: 100%; }
    #about .contents .txt_area {
      margin-top: 5.3333333333vw; } }

.scroll {
  margin-top: 40px;
  display: inline-block;
  border: 1px solid #44af35;
  padding: 20px;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  position: relative; }
  .scroll p {
    position: absolute;
    top: 13px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    color: #44af35;
    font-size: 12px;
    line-height: 1; }
  .scroll .images {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%); }
    .scroll .images img {
      width: 28px; }

.slider {
  margin-top: 60px; }

.common_contents {
  margin-top: 100px;
  position: relative; }
  .common_contents ul {
    display: flex; }
    .common_contents ul .images {
      width: calc(100% - 810px);
      position: relative;
      top: 265px;
      left: 100px;
      z-index: 1; }
    .common_contents ul .contents {
      position: relative;
      width: 810px;
      text-align: left;
      background: #44af35;
      color: #fff;
      padding: 40px; }
      .common_contents ul .contents .forest {
        position: absolute;
        left: 0;
        top: 140px; }
      .common_contents ul .contents .sub_ttl {
        position: relative;
        margin-top: 0px; }
        .common_contents ul .contents .sub_ttl .p1 {
          margin-left: 0;
          width: 367px; }
        .common_contents ul .contents .sub_ttl .p2 {
          color: #fff; }
      .common_contents ul .contents .txt_area {
        margin-top: 70px;
        width: 500px;
        margin-left: 120px;
        position: relative;
        z-index: 1; }
        .common_contents ul .contents .txt_area h3 {
          position: relative;
          letter-spacing: 0.3rem; }
          .common_contents ul .contents .txt_area h3:before {
            content: '';
            display: inline-block;
            width: 26px;
            height: 1px;
            background: #fff;
            top: -5px;
            margin-right: 5px;
            font-weight: bold;
            position: relative; }
        .common_contents ul .contents .txt_area .txt {
          margin-top: 20px; }
        .common_contents ul .contents .txt_area .view_more {
          margin-top: 20px; }
  .common_contents .images2 {
    text-align: right;
    position: relative;
    top: -60px;
    left: 50px;
    height: 365px; }
  .common_contents .suare1 {
    position: absolute;
    top: 155px;
    left: 0; }
  .common_contents .suare2 {
    position: absolute;
    bottom: 99px;
    right: 239px; }
  .common_contents .suare {
    width: 175px;
    height: 175px;
    background: #00b8ee; }

@media screen and (max-width: 1080px) {
  .common_contents {
    padding: 0 40px; }
    .common_contents ul {
      display: block; }
      .common_contents ul .images {
        top: auto;
        left: auto;
        width: 100%; }
      .common_contents ul .contents {
        margin: 0 auto;
        margin-top: 60px;
        max-width: 810px;
        width: 100%; }
        .common_contents ul .contents .txt_area {
          margin: 0 auto;
          margin-top: 70px;
          max-width: 500px;
          width: 100%; } }
        @media screen and (max-width: 1080px) and (max-width: 960px) {
          .common_contents ul .contents .txt_area {
            margin-left: 0; } }
@media screen and (max-width: 1080px) {
          .common_contents ul .contents .txt_area .txt {
            margin-top: 20px; }
          .common_contents ul .contents .txt_area .view_more {
            margin-top: 20px; }
    .common_contents .images2 {
      top: -110px;
      left: -2.7777777778vw; }
    .common_contents .suare1 {
      top: -3.6111111111vw;
      left: 0; }
    .common_contents .suare2 {
      bottom: 9.1666666667vw;
      right: auto;
      left: 13.8888888889vw; }
    .common_contents .suare {
      width: 175px;
      height: 175px; } }
@media screen and (max-width: 750px) {
  .common_contents {
    margin-top: 13.3333333333vw;
    padding: 0; }
    .common_contents ul .images img {
      width: 75%; }
    .common_contents ul .contents {
      margin-top: 8vw;
      padding: 10.6666666667vw 2.6666666667vw; }
      .common_contents ul .contents .forest {
        top: 117px; }
      .common_contents ul .contents .sub_ttl .p1 {
        bottom: -3.3333333333vw;
        margin-left: 0;
        width: 48.9333333333vw; }
      .common_contents ul .contents .txt_area {
        padding: 2.6666666667vw;
        margin-top: 16vw; }
        .common_contents ul .contents .txt_area h3:before {
          width: 26px;
          height: 1px;
          top: -5px;
          margin-right: 5px; }
        .common_contents ul .contents .txt_area .txt {
          margin-top: 2.6666666667vw; }
        .common_contents ul .contents .txt_area .view_more {
          margin: 0 auto;
          margin-top: 8vw; }
    .common_contents .images2 {
      display: none; }
    .common_contents .suare1 {
      top: -5.2vw;
      left: 0; }
    .common_contents .suare2 {
      bottom: -25.8vw;
      right: 0;
      left: auto; }
    .common_contents .suare {
      width: 23.3333333333vw;
      height: 23.3333333333vw; } }
@media screen and (max-width: 480px) {
  .common_contents .suare2 {
    display: none; } }
#works ul .contents .txt_area {
  margin-top: 90px; }
  @media screen and (max-width: 750px) {
    #works ul .contents .txt_area {
      margin-top: 16vw; } }

#recruit {
  margin-top: -160px;
  padding-bottom: 0px; }
  #recruit ul {
    flex-flow: row-reverse; }
    #recruit ul .images {
      left: -135px; }
      #recruit ul .images img {
        display: none; }
    #recruit ul .contents .forest {
      transform: scaleX(-1); }
    #recruit ul .contents .sub_ttl {
      top: -40px; }
      #recruit ul .contents .sub_ttl .p1 {
        width: 453px; }
    #recruit ul .contents .txt_area {
      margin-left: 0px; }

@media screen and (max-width: 1080px) {
  #recruit {
    padding-bottom: 0; }
    #recruit ul {
      flex-flow: row-reverse; }
      #recruit ul .images {
        left: 0px; }
      #recruit ul .contents .forest {
        transform: scaleX(-1); }
      #recruit ul .contents .sub_ttl {
        top: -40px; }
        #recruit ul .contents .sub_ttl .p1 {
          width: 453px; }
      #recruit ul .contents .txt_area {
        margin-left: 0px; } }
@media screen and (max-width: 750px) {
  #recruit {
    margin-top: 16vw;
    padding-bottom: 0px; }
    #recruit ul {
      flex-flow: row-reverse; }
      #recruit ul .contents .sub_ttl {
        top: -5.3333333333vw; }
        #recruit ul .contents .sub_ttl .p1 {
          width: 60.4vw; } }
@media screen and (max-width: 480px) {
  #recruit {
    margin-top: -9vw; } }
@media screen and (max-width: 750px) {
  #contact {
    margin-top: 0; } }
.map {
  height: 350px; }
  .map iframe {
    width: 100%;
    height: 100%; }