@charset "UTF-8";
/* Scss Document */
@import url("/shse/ehc/css/base.css");
/*共通設定-------------------------------------------------------------------------------------------------------------------------------------*/
/*メイン*/
#m_top {
  width: 100%;
  margin: 0; }
  #m_top h1 {
    background-image: url("/shse/ehc/img/project/top_img01.jpg");
    background-repeat: repeat-x;
    background-position: center;
    background-size: cover;
    color: #fff;
    font-size: 225%;
    text-align: center;
    padding: 3em 0; }

#student, #project {
  margin: 3em auto 0; }
  #student h2, #project h2 {
    font-size: 187%;
    color: #00a2b1;
    text-align: center; }
  #student ul, #project ul {
    width: 100%;
    margin: 2em 0 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    #student ul li, #project ul li {
      width: 48%;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      border-bottom: 1px dotted #999;
      margin: 2em 0 3em;/*20240316 2em 0 0*/ }
      #student ul li figure, #project ul li figure {
        width: 25%;
        margin: 0 0 1em; }
        #student ul li figure img, #project ul li figure img {
          height: 9.5em;
          object-fit: cover; }
      #student ul li dl, #project ul li dl {
        width: 73%;
        position: relative;
        padding: 0 0 5em; }
        #student ul li dl dt, #project ul li dl dt {
          font-size: 156%;
          font-weight: bold;
          border-left: 5px solid #00a2b1;
          padding: 0 0 0 10px; }
          #student ul li dl dt span, #project ul li dl dt span {
            font-size: 70%;
            vertical-align: middle; }
        #student ul li dl dd, #project ul li dl dd {
          margin: 0.5em 0 0; }
          #student ul li dl dd table th, #project ul li dl dd table th {
            /*width: 120px;20201006*/
            /*width: 90px;20201006*/
            width: 130px;
            color: #00a2b1;
            padding: 0.1em 0;
            vertical-align: top; }
          #student ul li dl dd table td, #project ul li dl dd table td {
            width: auto;
            padding: 0.1em 0; }
          #student ul li dl dd p, #project ul li dl dd p {
            position: absolute;
            bottom: 1.5em;
            right: 0; }
            #student ul li dl dd p a, #project ul li dl dd p a {
              background-color: #83c7e0;
              color: #fff;
              text-decoration: none;
              font-weight: bold;
              text-align: center;
              display: block;
              width: 180px;
              padding: 0.25em 10px;
              border-radius: 6px;
              transition: all 0.2s linear; }
              #student ul li dl dd p a:hover, #student ul li dl dd p a:active, #project ul li dl dd p a:hover, #project ul li dl dd p a:active {
                text-decoration: none;
                color: #fff;
                background-color: #9FD4E7; }

#project {
  margin: 6em auto 0; }

.


#student {
  margin: 3em auto 0; }
  #student h2 {
    color: #006b2f; }
  #student ul li dl dt {
    border-left: 5px solid #006b2f; }
  #student ul li dl dd {
    margin: 0.5em 0 0; }
    #student ul li dl dd table th {
      color: #006b2f; }
    #student ul li dl dd p a {
      background-color: #5EB45E; }
      #student ul li dl dd p a:hover, #student ul li dl dd p a:active {
        background-color: #7DC27D; }

#r_bottom {
  margin: 4em auto 0; }
  #r_bottom #sns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; }
    #r_bottom #sns li {
      width: 66px;
      margin: 0 2%; }

/*共通設定ここまで-------------------------------------------------------------------------------------------------------------------------------------*/
/* pc */
@media screen and (min-width: 1300px) {
  /*メイン*/
  #student, #project, #r_bottom {
    width: 1280px; } }
/* tablet以下共通 ------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 1299px) {
  /*メイン*/
  #student, #project, #r_bottom {
    width: 90%; } }
/* tablet以下共通ここまで ------------------------------------------------------------------------------------------*/
/* tablet1 */
@media only screen and (min-width: 1024px) and (max-width: 1299px) {
  /*メイン*/
  #m_top h2 {
    width: 46%; }

  #info #news {
    width: 48%; }
    #info #news dl {
      padding: 1.15em 2%; }

  #info ul {
    width: 44%; } }
/* tablet2  */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  /*メイン*/
  #student ul li, #project ul li {
    width: 48%;
    flex-direction: column; }
    #student ul li figure, #project ul li figure {
      width: 60%;
      margin: 0 auto 1em; }
      #student ul li figure img, #project ul li figure img {
        height: 14em; }
    #student ul li dl, #project ul li dl {
      width: 100%; }
      #student ul li dl dd, #project ul li dl dd {
        margin: 0.5em 0 0; }
        #student ul li dl dd table th, #project ul li dl dd table th {
          display: block;
          width: 100%; }
        #student ul li dl dd table td, #project ul li dl dd table td {
          display: block;
          width: 100%; } }
/* tablet3  */
@media only screen and (max-width: 767px) {
  /*メイン*/
  #m_top {
    margin: 0; }
    #m_top h1 {
      text-align: center;
      padding: 2em 0;
      font-size: 180%; }

  #student ul, #project ul {
    flex-direction: column; }
    #student ul li, #project ul li {
      width: 100%;
      flex-direction: column; }
      #student ul li figure, #project ul li figure {
        width: 60%;
        margin: 0 auto 1em; }
        #student ul li figure img, #project ul li figure img {
          height: 14em; }
      #student ul li dl, #project ul li dl {
        width: 100%; }
        #student ul li dl dd, #project ul li dl dd {
          margin: 0.5em 0 0; }
          #student ul li dl dd table th, #project ul li dl dd table th {
            display: block;
            width: 100%; }
          #student ul li dl dd table td, #project ul li dl dd table td {
            display: block;
            width: 100%; }

  #r_bottom {
    margin: 3em auto 0; } }
/* smartPhone1 */
@media only screen and (max-width: 499px) {
  /*メイン*/ }