/* 共通 */
h1, h2, h3, h4, h5, h6,  ol, table, tr, th, td {
    font-family: fot-rodin-pron,sans-serif;
    font-weight: 600;
    font-style: normal;
  }



  p {
      font-size: 18px;
      letter-spacing: 3px;
      line-height: 2;
      color: #333333;
    
  }

.container {
    width: 90%;
    max-width: 1280px;
    margin: auto;
    position: relative;
}

section {
    margin-bottom: 70px;
}

.h2-p {
    color: #006837;
    font-size: 16px;
    text-align: center;
    letter-spacing: 4px;
    margin-bottom: 20px;
}

h2 {
    color: #006837;
    font-size: 32px;
    letter-spacing: 8px;
    text-align: center;
    margin-bottom: 75px;
}

h3 {
    font-size: 32px;
    letter-spacing: 3px;
    padding-bottom: 30px;
    margin-bottom: 45px;
    border-bottom: solid thick #006837;
    max-width: 90%;
}

a {
    font-size: 18px;
    letter-spacing: 3px;
    line-height: 1.5;
    color: #333333;
    margin-bottom: 10px;
    display: block;

}

a:hover{
    color: #333333;
    text-decoration: none;
}

.green-btn {
    color: white;
    text-decoration: none;
    background-color: transparent;
    background-color: #006837;
    padding: 15px 80px;
    letter-spacing: 4px;
    border-radius: 2%;

}

.green-btn:hover{
    color: white;
    text-decoration: none;
}



@media screen and (max-width: 768px) {

    .container {
        width: 98%;
    }

    section {
        margin-bottom: 40px;
    }


    h2 {
        color: #006837;
        font-size: 28px;
        letter-spacing: 8px;
        text-align: center;
        margin-bottom: 45px;
    }

    h3 {
        font-size: 22px;
        letter-spacing: 3px;
        padding-bottom: 30px;
        margin-bottom: 45px;
        border-bottom: solid thick #006837;
        max-width: 100%;
        text-align: center;
    }

}



  img {
      width: 100%;
  }


/* nav */

h1 {
    font-size: 30px;
    letter-spacing: 1.8px;
    color: #006837;
    padding-top: 5px;
    padding-bottom: 10px;
}

.tel-text {
    font-size: 20px;
    letter-spacing: 1.8px;
    background-color: #006837;
    color: white;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.tel-text-box a:hover {
    color: white;
}


.menu-container {
  margin: 0;
}

.menu-container .menu {
  display: flex;
  justify-content: space-between;
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu-container .menu .menu-item {
  flex: 1;
}

.menu-container .menu .menu-item a {
  background: #fff;
  border-right: none;
  color: #333;
  display: block;
  padding: 15px 0px;
  text-align: center;
  text-decoration: none;
}


.menu-item {
    border-left: 1px solid #333;
}
  .right-border {
    border-right: 1px solid #333;
  }

@media screen and (max-width: 768px) {
    h1 {
        font-size: 24px;
        text-align: center;
    }

    
 /* スマホでナビメニュー非表示    */
.menu-container {
    display: none;
}

/* スマホでナビメニューを出す場合のCSS↓ */

/* 
  .menu-container .menu {
    flex-wrap: wrap;
    width: 100%;
  }
  .menu-container .menu .menu-item {
    flex: auto;
    width: 33.33333333%;
    font-size: 14px;

  }

  .menu-container .menu .menu-item:nth-child(n + 4) a {
    border-top: none;
  }

  .right-border-sp-only{
    border-right: 1px solid #333;
}

.menu-container .menu .menu-item a {
    background: #fff;
    
    border-right: none;
    color: #333;
    display: block;
    padding: 10px 0px;
    text-align: center;
    text-decoration: none;
  }

*/

  .tel-text {
    font-size: 15px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
  } 
}



/* top */
.top {
    text-align: center;
}

.top-image {
    background-image: url(../img/1_bg-only.png);
    background-size: cover;
    margin-top: 20px;
    padding-top: 180px;
    padding-bottom: 250px;

}




.top-white-back {
    background-color: #ffffff;
opacity: 0.8;
    width: 30%;
    margin: auto;

    padding-top: 60px;
    padding-bottom: 30px;

}


@media screen and (max-width: 768px) {

    .top-image {
        background-image: url(../img/1_bg-only.png);
        background-size: cover;
        margin-top: 20px;
        padding-top: 120px;
        padding-bottom: 200px;
    
    }

    .top-white-back {
        width: 70%;
        padding-bottom: 40px;
    }

}

.headline-1 {
    color: #333333;
    font-size: 28px;
    letter-spacing: 2.7px;

    margin-bottom: 54px;

    font-family: fot-rodin-pron,sans-serif;
    font-weight: 600;
    font-style: normal;
}

.headline-2 {
    color: #006837;
    font-size: 41px;
    letter-spacing: 2.7px;
    padding-bottom: 30px;

    font-family: fot-rodin-pron,sans-serif;
    font-weight: 600;
    font-style: normal;

}

.headline-3-box {
    margin-top: 30px;
}

.headline-3 {
    color: #333333;
    font-size: 15px;
    letter-spacing: 2px;
    padding-bottom: 20px;

    font-family: fot-rodin-pron,sans-serif;
    font-weight: 600;
    font-style: normal;

}




/* about */

.about-btn-pc {
}

.about-btn-sp {
    display: none;
}


@media screen and (max-width: 768px) {



    .about-btn-pc {
        display: none;
    }
    
    .about-btn-sp {
        margin: 0 auto;
        display: block;
    }
    

}


/* news */
.news {
    background-color: #F2F2F2;
}

.topics {
    background-color: white;
    padding: 20px 40px;
    border: solid thin;
}

.topics dl {
    padding: 15px 0;
    border-bottom: 1px solid #ccc;
    }
    
    .topics dt {
    padding-bottom: 5px;
    }
    
    @media screen and (min-width: 768px) {
    .topics dt {
    clear: left;
    float: left;
    width: 10%;
    }
    .topics dd {
    margin-left: 11%;
    }
    }


    .news-btn {
        margin: 0 auto;
        display: block; 
    }


    /* SERVICE */
    .card-title {
        font-size: 24px;
        letter-spacing: 3px;
        padding-bottom: 10px;
        margin-bottom: 15px;
        border-bottom: solid #006837;
        max-width: 90%;
    }



    /* recruit */

    .recruit {
        background-image: url(../img/10.png);
        background-size: cover;
        padding-top: 40px;
        padding-bottom: 70px;
    }


    .white-back {
        background-color: rgb(255, 255, 255, 0.8);
      
        padding-top: 60px;
        padding-bottom: 70px;
        padding-left: 100px;
        padding-right: 100px;
    }


    @media screen and (max-width: 768px) {

        .white-back {
            padding-left:  10px;
            padding-right: 10px;
        }
    
    }


    /* footer */

    .logo-text {
        font-family: fot-rodin-pron,sans-serif;
        font-weight: 600;
        font-style: normal;

        font-size: 40px;
        letter-spacing: 1.8px;
        color: #006837;
        padding-top: 5px;
        padding-bottom: 10px;
    }

    .logo-text:before{
        content:"";
        display:inline-block;
        width:1em;
        height:1em;
        background:url(../img/logo.jpg) no-repeat;
        background-size:contain;
    }

    .footer-nav {
        background-color: #F2F2F2;
    }


    @media screen and (max-width: 768px) {

        .logo-text {
            text-align: center;
font-size: 30px;
        }

        .footer-logo-sub {
            text-align: center;
        }

    
    }



/* sub-page-css */

/* massage */
.massage-box {
    border-top: solid thin;
    border-bottom: solid thin;
    padding-top: 40px;
    padding-bottom: 40px;
}

.massage-text {
    font-size: 18px;
  
}

/* contents */
.contents-text {
    font-size: 18px;

}


.kaisha {
    width: 100%;
    }
    
    .kaisha th,
    .kaisha td {
    border: 1px solid #ccc;
    padding: 20px;
    }
    
    .kaisha th {
    font-weight: bold;
    background-color: #dedede; 
    }
    
    @media screen and (max-width: 767px) {
    .kaisha,
    .kaisha tr,
    .kaisha td,
    .kaisha th {display:block;}
    .kaisha th {width:auto;}
    }