@charset "utf-8";
/** 下部固定バートップ要素 */
/** 固定処理など */
.bottom_bar_box {
    bottom: 0;
    box-sizing: border-box;
    display: flex;
    height: 50px;
    justify-content: center; /* 中央寄せしてコンテンツと同位置にそろえる */
    left: 0;
    max-width: 100vw;
    padding-bottom: constant(safe-area-inset-bottom); /* for iOS11.1 */
    padding-bottom: env(safe-area-inset-bottom);
    position: fixed;
    width: 100%;
    z-index: 90;
    font: normal 14px/24px YuGothic,sans-serif;
}
/* メニューと位置を揃えるため、flexをひとつ入れる */
.bottom_bar_inner_box {
    display: flex;
    height: 100%;
    width: 100%;

}
/* 各要素をflexで整列する */
.bottom_bar_box ul {
    margin: 0;
    padding: 0;
    display: flex;
    height: 100%;
    width: calc(100% - 40px);
    box-sizing: border-box;
    justify-content: ceenter;
}
/* 要素の表示調整(共通) */
.bottom_bar_box li {
    /* background-color: #333333B3; */
    background-color: rgba(38, 93, 95, 0.8);;
    box-sizing: border-box;
    flex: 1 1 auto;
    height: 100%;
    padding: 8px 0;
    list-style: none;
 }
.bottom_bar_box li:hover {
    cursor: pointer;
}
 /** リンク領域を要素全体に広げる */
 .bottom_bar_box a {
    align-items: center;
    color: #fff;
    display: flex;
    justify-content: center;
    height: 100%;
    width: 100%;
    text-decoration: none;
    box-sizing: border-box;
    position: relative;
 }
.bottom_bar_box li:not(:last-of-type) a::after {
  content: "";
  display: inline-block;
  border-right: 1px solid #fff;
  height: 30px;
  justify-self: end;
  position: absolute;
  right: 0px;
}
 /* 遷移後もリンク文字列の色が変わらないように固定 */
 .bottom_bar_box a:visited {
     color: #fff;
 }

/* トップへボタン */
.bottom_bar_totop_button_box {
  background-color: #fff;
  border: none;
  box-sizing: border-box;
  color: #265D5F;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 40px;
  font-weight: bold;
}
.bottom_bar_totop_button_box:hover {
    cursor: pointer;
}

.bottom_bar_totop_button {
  height: 24px;
}
.bottom_bar_totop_button::before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
border: 2px solid;
border-color: #265D5F transparent transparent #265D5F;
transform: rotate(45deg);
box-sizing: border-box;
margin-top: 10px;
}

.bottom_bar_margin {
  margin-bottom: 50px;
}

/*===============================================
●PC用（700px以上）
===============================================*/
@media screen and (min-width:700px){
.bottom_bar_inner_box {
    max-width: 1000px;
  }
/* 要素の表示調整(共通) */
  .bottom_bar_box li {
    font-size: 20px;
 }
.bottom_bar_totop_button_box {
  width: 100px;
}
}