@charset "utf-8";

/*----------------------------------------------------
  基本のレイアウト
----------------------------------------------------*/
.pages-flexwaku{
  flex-wrap:nowrap;
}
/*----------------------------------------------------
  メインイメージ
----------------------------------------------------*/
/* logoマーク */
.s-m-logo-box {
  text-align: right;
  padding-right: 10px;
  line-height: 1;
}
.s-m-logo-box a{
  display: inline-block;
  width: 147px;
}
.s-m-logo{
  width: 100%;
}
/*----------------------------------------------------
  メインコンテンツ
----------------------------------------------------*/
.main-contents{
  background: #fff;
}
.secondpage-m-title{
  background-image: repeating-linear-gradient(to bottom, rgb(113,189,189) 0, rgb(63 127 127) 50%, rgb(63 127 127) 80%, rgb(78 147 146) 100%);
  box-shadow: 0 5px 2px #cccccc;
  width: calc(100% + 1px);
}
.se-m-title-box{
  background-size: auto auto;
  background-image: repeating-linear-gradient(-45deg, transparent, transparent 4px, rgba(129, 187, 187, 0.4) 4px, rgba(129, 187, 187, 0.4) 6px );
  height: 50px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  color: #fff;
  font-weight: normal;
  font-family: 'Noto Serif JP',"HG明朝E","ＭＳ Ｐ明朝", "ＭＳ 明朝","ヒラギノ明朝 ProN W3",sans-serif;
  padding: 4px 30px 2px;
}
.se-m-title{
  font-size: 24px;
  font-weight: 700;
}
.se-m-title-en{
  font-size: 17px;
  letter-spacing: 0.05em;
  font-weight: 400;
}
.main-b-frame{
  padding: 17px 6px 10px;
}
/* 中タイトル */
.secondary-item{
  background: #f0eded;
  font-size: 14px;
  padding: 4px 11px 0px 26px;
  position: relative;
  border:1px solid #a0a0a0;
  margin: 20px 0 10px;
}
.secondary-item::before{
  position: absolute;
  left: 10px;
  bottom: 0;
  content: "";
  display: inline-block;
  background: #b11d1d;
  width: 5px;
  height: 90%;
}
/* トップに戻るリンク */
.top-back{
  display: block;
  text-align: right;
  padding: 10px 2px 0 0;
  font-size: 13px;
}
.top-back a:hover{
  text-underline-offset: 2px;
}
/*----------------------------------------------------
  左側ナビ
----------------------------------------------------*/
.navi-back{
  height: 100%;
}
/*----------------------------------------------------
  企業情報
----------------------------------------------------*/
.company-info{
  flex-direction: column-reverse;
}
/* バナー */
.bnr{
  flex: 1 1 100%;
  margin-top: 10px;
}
/* 連絡先 */
.contact-info{
  flex: 1 1 100%;
  margin-top: 10px;
}

@media screen and (max-width: 767.98px) {
  /* デフォルト：767px以上用（タブレット用）の記述 */
  /*----------------------------------------------------
    基本のレイアウト
  ----------------------------------------------------*/
  .navi-main-flex{
    flex-direction: column-reverse;
  }
  /*----------------------------------------------------
    メインイメージ
  ----------------------------------------------------*/
  /* logoマーク */
  .second-area-logo{
    display: none;
  }
  /*----------------------------------------------------
    左側ナビ
  ----------------------------------------------------*/
  .navi{
    display: block;
    flex: 1 1 auto;
  }
  .navi-back{
    background-color:unset;
    border: none;
    margin: 0;
  }
  .navi-list-box{
    position: unset;
    left: auto;
  }
  .navi-list-box ul{
    display: none;
  }
  /*----------------------------------------------------
    企業情報
  ----------------------------------------------------*/
  .company-info{
    flex-direction:row;
    flex-wrap: wrap;
  }
  .contact-info p {
    margin-left: 10px;
  }
    /* バナー */
  .bnr{
    flex: 1 1 60%;
  }
  /* 連絡先 */
  .contact-info{
    flex: 1 1 40%;
  }
}
@media screen and (max-width: 575.98px) {
  .se-m-title-box{
    height: auto;
    padding: 6px 16px 8px;
  }
  .se-m-title{
    font-size: 18px;
  }
  .se-m-title-en {
    font-size: 14px;
  }
}