/*-----------------------------------------------------
 サイズごとの設定 max767px まで
 ------------------------------------------------------*/

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

  /*-----------------------------------------------------
    トップ画像セクション
  ------------------------------------------------------*/
  
  /* トップ画像 */
  .top-image {
    height: 300px;
  }
  
  /* トップ画像のコンテンツ */
  .top-image-content {
    min-width: 768px;
  }
  
  /* トップ画像のメッセージ枠 */
  .top-image-message-layer-message-box {
    width: 75%;
    max-width: 380px;
    padding: 20px 15px;
    height: 4.4rem;
  }
  
  /* トップ画像のメッセージテキスト */
  .top-image-message-layer-message-box-message-text {
    font-size: 1.0rem;
    line-height: 2.2rem;
    letter-spacing: 0.1rem;
  }

  /*-----------------------------------------------------
    代表挨拶・会社概要・採用情報の表題
    ------------------------------------------------------*/

  /* 表題 */
  .summary-set {
    margin-top: 15px;
    padding-top: 14px;
  }

  /*-----------------------------------------------------
    代表挨拶セクション
    ------------------------------------------------------*/

  /* 代表挨拶 */
  .greeting {
    width: 95%;
    margin: 20px auto 0 auto;
    padding-bottom: 20px;
  }

  /* 代表取締役 */
  .president {
    margin-top: 30px;
  }

  /*-----------------------------------------------------
    会社概要セクション
    ------------------------------------------------------*/

  /* 会社概要 */
  .news-list {
    margin: 20px auto 0  auto;
    width: 98%;
  }

  /* 会社概要の */
  .profile {
    margin: 0 auto 35px auto;
  }

  /* 会社概要の項目 */
  .profile-title {
    width: 80px;
  }

  .table {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }

  .table .items {
    padding-left: 1.5rem;
    text-indent: -1rem;
  }

  /*-----------------------------------------------------
    採用情報セクション
    ------------------------------------------------------*/

  /* 代表挨拶のコンテナ */
  .reqruit-summary-set {
    margin-top: 35px;
  }

  /* 採用情報のテーブル枠 */
  .reqruit-contents {
    margin: 20px auto 45px auto;
  }

  /* テーブル */
  .reqruit-contents .table {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }

  /* 待遇のタイトル */
  .reqruit-contents .table .title {
    width: 100px;
    line-height: 1.5rem;
  }

  /* 待遇の内容 */
  .reqruit-contents .table .contents {
    line-height: 1.5rem;
    margin-bottom: 5px;
  }

  /* 待遇の内容の最後の行 */
  .reqruit-contents .table .contents.last {
    margin-bottom: 0;
  }

  /*-----------------------------------------------------
    センタービジュアル
    ------------------------------------------------------*/
  
  /* センタービジュアル */
  .center-visual {
    height: 300px;
  }
  
  /* センタービジュアルの画像 */
  .center-visual .content {
    min-width: 768px;
  }
  
  /* メッセージ */
  .center-visual-message {
    width: 100%;
  }
  
  /* メッセージの枠 */
  .center-visual-message .message-box {
    width: 85%;
    max-width: 380px;
    padding: 20px 18px;
    height: max-content;
  }
  
  /* メッセージのテキスト */
  .center-visual-message .message-text {
    font-size: 1.0rem;
    line-height: 1.8rem;
    letter-spacing: 0.1rem;
  }
}