@charset "UTF-8";

/********************************/
/* 共通設定                     */
/********************************/
/* Laravel HASK共通 */

/*****************/
/* 共通設定       */
/*****************/
.flex{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
  }
  
  /* 文字サイズ */
  .hs-tl{
    font-size:large;
  }
  .hs-ts{
    font-size:small;
  }
  /*  図の幅 */
  .hs-auto-press{
    max-width: 100%;
  }
  
  
  /*****************/
  /* 全体構成       */
  /*****************/
  body {
    margin: 0;
    display: flex;
    flex-flow: column;
    min-height: 100vh;
  }
  /*メニュー領域*/
  .header-ha-sk {
    height:55px;
  }
  /*コンテンツ領域*/
  .contents-ha-sk {
    position: relative;
    box-sizing: border-box;
    flex: 1;
  }
  /*フッター領域*/
  .footer-ha-sk{
    width: 100%;
    background: #eeeeee;
  }
  
  /*****************/
  /* メニューバー  */
  /*****************/
  .bg-ha-sk {
    /*background: linear-gradient(#2020ff, #FFFFFF);*/
    /*background: linear-gradient(#2020ff, #FFFFFFa0);position: absolute; top: 0px; left: 0px; width: 100%; height: 50px;*/
    background: linear-gradient(#28b8fa, #28b8fa);width: 100%; height: 50px;
  }
  
/*
 Bootstrap5 break points.
（Extra small） 	なし 	<576px
（Small） 	sm 	≥576px
（Medium） 	md 	≥768px
（Large） 	lg 	≥992px
（Extra large） 	xl 	≥1200px
（Extra extra large）v5.0.0-alpha1 	xxl 	≥1400px
*/
  /*PCモード*/
  /* bootstrap4 : md:768*/
  @media (min-width: 768px) {
    .hs-d-md-none {
      display:none;
    }
    .bg-nav-item-hs {
      background: none;
    }
    /*カールセル*/
    .carousel.ha-sk {
      background: #eeeeee;
      max-width :400px;
      width : 100%;
      height : 240px;
    }
    .carousel-item.ha-sk{
      background: #eeeeee;
      width : 100%;
      height : 100%;
    }
  }
  
  /*モバイルモード*/
  @media (max-width: 767px) {
    .hs-d-sm-none {
      display:none;
    }
    .bg-nav-item-hs {
      background: #eeeeee;
    }
    /*カールセル*/
    .carousel.ha-sk {
      background: #eeeeee;
      max-width :400px;
      width : 100%;
      height : 240px;
    }
    .carousel-item.ha-sk{
      background: #eeeeee;
      width : 100%;
      height : 100%;
    }
  }




  /*
  .bg-ha-sk:after {
    content: "";
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(#2020ff, #FFFFFFa0);position: absolute; top: 0px; left: 0px; width: 100%; height: 50px;
    mix-blend-mode: color;
  }
  */
  
  /*メニューアイテムホバー*/
  .nav-link.ha-sk
  {
    color: #002044;
  }
  .nav-link.ha-sk:focus,
  .nav-link.ha-sk:hover
  {
    color: #ffffff;
  }
  
  /*メニュータイトルホバー*/
  .navbar-brand.ha-sk
  {
    color: #ffffff;
  }
  .navbar-brand.ha-sk:focus,
  .navbar-brand.ha-sk:hover
  {
    color: #2600ff;
  }
  
  div.menu-bar {
    font-size:8;
    height:55px;
    background-image: url(MenuBar.png);
    background-repeat: repeat-x;
    padding: 0px;
    vertical-align: text-bottom;
  }
  
  li.menu-bar-title {
    font-size: 24px;
    color: #ffffff;
    display: inline;
    vertical-align: text-bottom;
  }
  
  ul.menu-bar {
    margin-left: -1px; /* 一番左のボーダー幅と同じ値の負のマージン */
    height:40px;
    vertical-align: text-bottom;
  }
  
  li.menu-bar {
    font-size: 18px;
    padding: 0 10px;
    display: inline;
    border-left: 1px solid #fff; /* 区切り線 */
    vertical-align: text-bottom;
  }
  
  a.menu-bar:link {
    font-size: 18px;
    color: #0000ff;
  }
  a.menu-bar:visited {
    font-size: 18px;
    color: #0000ff;
  }
  a.menu-bar:hover {
    font-size: 18px;
    color: #a0f0ff;
  }

  /*******************************/
  /* メニューバー右ドロップダウン */
  /*******************************/
  /* svg(bootstrapアイコン)の平常時*/
  .dropdown-item > svg {
    color: #3490dc;
  }
  /* svg(bootstrapアイコン)のクリック中(active時)*/
  .dropdown-item:focus > svg,.dropdown-item:active > svg{
  color: #fff;
  background-color: #3490dc;
  }
  
  /*****************/
  /* アドレス      */
  /*****************/
  address {
    display: inline;
  }
  p#mail-addr {
    display: inline;
  }
  p#tag-name {
    font-size: 24px;
  }
  
  /********************************************/
  /* 1行                                      */
  /********************************************/
  p.inline {
    display: inline;
  }
  
  /********************************************/
  /* 非表示                                   */
  /********************************************/
  p.ab {
    font-size: 0px;
    color: #ffffff;
  }
  
  /********************************************/
  /* 商品一覧                                  */
  /********************************************/
  .hs-box-border  {
    color: black;
    text-decoration: none;
    box-shadow: 2px 2px 4px;
    padding: 7px;
    width: 100%;
    height: 80px;
    margin : 3px;
    position: relative;
    z-index: 1;
    display: inline-flex;
  }
  .hs-box-border:hover {
    box-shadow: 2px 2px 4px darkturquoise;
  }
  
  .hs-box-icon {
    float: left;
    width: 64;
    padding-right: 7px;
  }
  .hs-box-text {
    float: both;
  }
  /* div全体のリンク化 */
  .hs-box-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
  }
  .hs-box-title {
    font-size: 18;
    font-weight: bold;
    text-shadow:2px 2px 2px #aaaaff;;
    padding-left: 7px;
  }
  .hs-box-description {
    font-size: 14;
    padding-left: 7px;
  }
  .hs-box-comment {
    font-size: 14;
    padding-left: 7px;
  }
  
  .hs-box-amount {
    position: absolute;
    right:7px;
    bottom:0;
    height:20px;
  }
  .hs-box-amount > p{
    font-size: 12px;
    color: red;
  }
  
  /********************************************/
  /* ヘッダー固定テーブル表示                  */
  /********************************************/  
  .sticky_table_title{
    position: -webkit-sticky;
    position: sticky;
    top: 50px; /* メニューを回避するオフセット */
    z-index: 1;
  }
  .sticky_table thead th{
    position: -webkit-sticky;
    position: sticky;
    top: 74px; /* メニューを回避するオフセット */
    z-index: 1;
  }


  /********************************************/
  /* ログ表示テーブル                          */
  /********************************************/  
  /*ペジネーションセンタリング*/
  nav > ul.pagination {
     justify-content: center;
     padding-bottom: 0px;
     margin-bottom : 0px;
  }

  /*セルの省略表示*/
  .hs-tb-fixed {
    table-layout:fixed;
  }
  .hs-cell-date {
    width: 158px;
    min-width:158px;
    max-width:200px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .hs-cell-title {
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .hs-cell-url {
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /********************************************/
  /* バー                                     */
  /********************************************/
  .hs-bar-split {
    margin: 4px 0px 12px 0px;
    height: 2px;
    width : 100%;
    background-color: skyblue;
  }
  
  .hs-bar-split-sm {
    margin: -4px 0px 8px 0px;
    height: 1px;
    width : 100%;
    background-color: lightblue;
  }

  .hs-bar-split-sm2 {
    margin: 4px 0px 8px 0px;
    height: 1px;
    width : 100%;
    background-color: lightblue;
  }  

  /********************************************/
  /* タイトル文字                             */
  /********************************************/
  .hs-h1 { margin: 1px 0px 0px 4px; font-size:2.0em; }
  .hs-h2 { margin: 1px 0px 0px 4px; font-size:1.7em; }
  .hs-h3 { margin: 1px 0px 0px 4px; font-size:1.2em; }
  .hs-h4 { margin: 1px 0px 0px 4px; font-size:1.0em; }
  .hs-h5 { margin: 1px 0px 0px 4px; font-size:0.9em; }
  .hs-h6 { margin: 1px 0px 0px 4px; font-size:0.8em; }
  .hs-h7 { margin: 1px 0px 0px 4px; font-size:0.7em; }

  

  /********************************************/
  /* サイトポリシー全般                         */
  /********************************************/
  ul.hs-type-square {
    list-style-type: square;
  }
  ul.hs-type-disc {
    list-style-type: disc;
  }
  ul.hs-type-a {
    list-style-type: lower-latin;
  }

  ul.hs-policy {
    list-style-type: square;
  }
  
  ul.hs-policy>li>ul{
    list-style-type: lower-latin;
  }

  /********************************************/
  /* オーバーレイカード表示                     */
  /********************************************/
 .hs-popup-card {
    /* position : fixed;
    inset: 0;
    margin : 50,auto,auto,auto; */
    margin : 0,0,0,0;
    padding: 0,0,0,0;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translateX(-50%)
               translateY(-50%);
    opacity: 0.8;
 }

.hs-btn-ok {
  min-width:7em;
}