body {
background-image:url(kabe-diary.gif);
    text-align:center;
    margin:0 0 0 0;
    padding: 0 0 0 0;
}

.ContentsFrame {
    background-image:url(kabe-health.gif);
    max-width:930px;
    margin-left:auto;
    margin-right:auto;
    text-align:left;
}




body {
  font-size: 14px;
  color: #666;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

li {
  line-height: 1.3;
}


p {
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

nav {
  
  width: auto;
}

.main-menu-list {
  width: 100%;
  display: flex;
}

.main-menu {
  margin: 0 2px;
  height: min-content;
  width: calc(100% / 4);
  text-align: center;
  background-color: #b0c4de;
  cursor: pointer;
}

.fa-angle-down {
  padding-left: 5px;
  cursor: pointer;
}

.category {
  padding: 0;
}
 

.category > li {
  background-color: #e0ffff;
  font-size: 0.8em;
}

.category li span {
  position: relative;
  cursor: pointer;
}

.fa-minus {
  padding-left: 0;
}

.category li span::after {
  position: absolute;
  top: calc(0.25em * 1.1);
  left: calc(50% - 0.1em);
  width: 0.2em;
  height: 0.875em;
  content: "";
  background-color: #8fbc8f;
  tr border-radius: 0.1em;
ansition: 0.3s ease-in-out;
 
}

.close::after {
  transform: rotate(90deg);
}


.item-list > li {
  background-color:  #e0ffff;
width:max-content;
}






.ac-box{
width: 85%;
margin: 25px auto 4px;
}

.ac-box label{
max-width: 200px;
font-size: 14px;
font-weight: bold;
text-align: center;
background: #2F4F4F;
margin: auto;
line-height: 30px;
position: relative;
display: block;
height: 28px;
border-radius: 8px;
cursor: pointer;
color: #fff;
transition: all 0.5s;
}

.ac-box label:hover{
background: rgba( 240, 86, 137, 0.55 );
-webkit-transition: all .3s;
transition: all .3s;
}

.ac-box input{
display: none;
}

.ac-box label:after{
color: #fff;
font-family:"FontAwesome";
content:"\f078";
}

.ac-box input:checked ~ label::after {
color: #fff;
font-family:"FontAwesome";
content:" \f077";
}

.ac-box div{
height: 0px;
padding: 0px;
overflow: hidden;
opacity: 0;
transition: 0.5s;
}

.ac-box input:checked ~ div{
height: auto;
padding: 5px;
background: #EEEEEE;
opacity: 1;
}


.ac-box div p{
color: #777;
line-height: 22px;
font-size: 14px;
padding: 20px;
text-align: justify;
}
.ac-small p{
margin-bottom: 0px;
}




.table-full-width {
    width: 85%;
}






.fixed-header {
  position: sticky; /* ヘッダーを固定する */
  top: 0; /* 画面の上部に固定 */
  width: 100%; /* 画面の幅いっぱいに広げる */
background-image:url(kabe-top1.png); /* 背景色を設定 */
  color: white; /* テキストの色を設定 */
  padding: 10px; /* 内側の余白を設定 */
  z-index: 50; /* ヘッダーを他の要素の上に表示 */
}




@media  (max-width: 768px) {
   body {
    font-size: 2vw;
  }


img {
    max-width: 100%;
    height: auto;
}


contents{
  img{
    max-width:18vw;
}
}


img {
    max-width: 30%;
    height: auto;
}