@charset "utf-8";
/* bace */
#teaching-materials {
  --edu-color: #092981;
}
#teaching-materials h2 {
  font-size: min(6vw, 36px);
  color: var(--edu-color);
}
/* component */
.cmp-accordion__title {
  cursor: pointer;
}
.cmp-accordion__panel {
  margin: 0;
}
.title {
  text-align: center;
}
.file-image {
  width: 80%;
  margin: 0 auto;
}
.inner > .cmp-container > .aem-Grid {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 100px 0;
}
.file-title {
  text-align: center;
    margin-bottom: 10px;    
}
.tag {
  margin-bottom: 10px;
}
.tag ul {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin: 0;
  padding: 0;
}
.tag li {
  background: #d1d9f0;
  padding: 0 10px;
  color: var(--edu-color);
  font-weight: bold;
}
.tag ul > li:before {
  content: none;
}
/* layout */
#nav > .aem-Grid {
    display: flex;
    justify-content: center;
}
#nav .button {
    max-width: 300px;
background-image: url(/content/dam/casio/global/calculator/scientific-calculators/essential-materials/bg01.jpg);
    padding: 10px;    
}
#nav .cmp-button {
    background: #d1d9f0;
    color: var(--edu-color);
    transition: .3 ease-out;
}
#nav .cmp-button:hover {
    opacity: .7;
}
.contents-grp > .cmp-container > .aem-Grid::before, .contents-grp > .cmp-container > .aem-Grid::after {
  display: none;
  content: none;
}
.contents-grp > .cmp-container > .aem-Grid {
  display: flex;
  gap: 20px;
}
.contents-grp > .cmp-container > .aem-Grid > .container {
  width: calc((100% - 40px)/ 3);
}
.btn-grp > .cmp-container > .aem-Grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.btn-grp > .cmp-container > .aem-Grid::before, .btn-grp > .cmp-container > .aem-Grid::after {
  display: none;
  content: none;
}
#history table td {
  padding: 10px;
}

@media (max-width: 767px) {
  .contents-grp > .cmp-container > .aem-Grid {
    display: flex;
    gap: 20px;
    flex-direction: column;
  }
  .contents-grp > .cmp-container > .aem-Grid > .container {
    width: 100%;
  }
}