:root {
  --box-height: 280px;
  --border-color: gray;
}
body {background-color: lightgray;}
body >  h3 {
  margin: 10px auto 5px;
}
.hosoku{
  color: gray;
  font-size: 50%;
  padding-left: 10px;
}
/* タブ　＋　アコーディオン　*/
  .tabaccordion {
    flex:1;
    display: flex;
    column-gap: 10px;
    justify-content: center;
    align-items: flex-start;
    align-items: stretch;
  }
  #tabs,#accordion {
    height: var(--box-height);
    width: 500px;
    overflow: auto;
    border: 3px solid var(--border-color) ;
    border-radius: 6px;
  }
  /* アコーディオン　*/
    #accordion {
      padding: 0 3px ;
    }
    #accordion h3 {
      padding: 0.2em;
      font-weight: normal;
    }
    #accordion h3.ui-accordion-header-active ,
    #tabs .ui-tabs-tab.ui-tabs-active a 
    {
      font-weight: bold;
      color: red ;
    }              
    #accordion> div {
      padding: 0.5em 1em;
      font-size: 70%;
    }
  /* タブ　　*/
    #tabs img {
      margin: 5px auto;
      width: 68%;
      display: block;
    }
    #tabs .ui-tabs-tab a {
      padding: 3px 8px;
      width: 80px;
      text-align: center;
    }
/* アンケートフォーム　*/
    .form-wrapper {
      display: flex;
      justify-content: center;
      align-items: flex-start;
      gap: 20px;
      margin-top: 10px;
    }
    #iform1{
      width: 640px;
      padding: 10px;
      border: 3px solid var(--border-color) ;
      border-radius: 6px;
    }
    #pdate {
      width: 120px;
    }
/* セレクト＆スライダー */
    .select-slider {
      display: flex;
      align-items: flex-start; 
      gap: 20px;
    }
    /* 左側：セレクト */
      .select-block {
        display: flex;
        flex-direction: column;
      }
      /* 右側：スライダー全体（本体＋目盛り） */
      .slider-block {
        display: flex;
        flex-direction: column; 
        align-items: center;    
        width: 200px;           
        margin-left: 40px;
      }
      /* スライダー */
      #slider {
        width: 100%;
        margin-bottom: 5px;
      }       
      /* 目盛り */
      .slider-labels {
        width: 100%;
        display: flex;
        justify-content: space-between; /* 均等 */
        font-size: 60%;
      }
/*  エラー表示 */
    .error {
      background-color: #ffcccc;
    }
    .alert {
      color: #ff0000;
      font-size: small;
    }

    /* ダイアログ */
    #dialogImg img {
      max-width: "100%";
      height: "auto"
    }