section.amr01 {
  padding-bottom: 6em;
}
section.amr02 {
  padding-bottom: 4em;
}
section.amr02 .container {
  padding: 40px;
  background-color: #F9F9F9;
  border-radius: 1em;
}
section.amr02 .container > div:first-child {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-bottom: 4em;
}
section.amr02 .container > div:first-child > div {
  width: 60%;
}
section.amr02 .container > div:first-child > div h2 {
  color: #31B1B0;
}
section.amr02 .container > div:first-child > div h3 {
  font-weight: 700;
  font-size: 240%;
  position: relative;
  padding-bottom: 0.6em;
  margin-bottom: 1.2em;
}
section.amr02 .container > div:first-child > div h3::before {
  content: "";
  width: 100%;
  height: 5px;
  background-color: #D7D7D7;
  position: absolute;
  left: 0;
  bottom: 0;
}
section.amr02 .container > div:first-child > div h3::after {
  content: "";
  width: 3em;
  height: 5px;
  background-color: #31B1B0;
  position: absolute;
  left: 0;
  bottom: 0;
}
section.amr02 .container > div:first-child > div h3 + p {
  font-weight: 700;
  font-size: 150%;
  padding-bottom: 1em;
}
section.amr02 .container > div:first-child > div ul li {
  padding-left: 1.5em;
  padding-bottom: 0.8em;
  position: relative;
}
section.amr02 .container > div:first-child > div ul li::before {
  content: "";
  display: block;
  width: 1.2em;
  height: 1.2em;
  margin-right: 0.8em;
  background: url(../svgs/icon08.svg) no-repeat center center;
  background-size: contain;
  position: absolute;
  left: 0;
  top: 0.3em;
}
section.amr02 .container > div:first-child > img {
  width: 32%;
  height: auto;
}
section.amr02 .container > p.spec-btn {
  background-color: #31B1B0;
  height: 3em;
  text-align: center;
  border-radius: 0.3em;
  position: relative;
  cursor: pointer;
}
section.amr02 .container > p.spec-btn span {
  color: white;
  font-size: 115%;
  font-weight: 700;
  display: block;
  position: absolute;
  left: calc(50% - 5em);
  top: calc(50% - 1em);
}
section.amr02 .container > p.spec-btn span::after {
  content: "";
  width: 1em;
  height: 1em;
  display: inline-block;
  transform: translateY(0.2em);
  margin-left: 1em;
  background-color: white;
  transition: background-color 300ms ease;
  -webkit-mask: url(../svgs/arrow05.svg) no-repeat center center;
  mask: url(../svgs/arrow05.svg) no-repeat center center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
section.amr02 .container > p.spec-btn span.open {
  opacity: 1;
  transition: color 300ms ease, opacity 300ms ease;
}
section.amr02 .container > p.spec-btn span.close {
  opacity: 0;
  transition: opacity 300ms ease;
}
section.amr02 .container > p.spec-btn span.close::after {
  transform: translateY(0.2em) rotate(180deg);
}
section.amr02 .container > p.spec-btn.active {
  border-radius: 0.3em 0.3em 0 0;
}
section.amr02 .container > p.spec-btn.active span.open {
  opacity: 0;
  transition: opacity 300ms ease;
}
section.amr02 .container > p.spec-btn.active span.close {
  opacity: 1;
  transition: color 300ms ease, opacity 300ms ease;
}
section.amr02 .container > p.spec-btn:hover span {
  color: #EDEE00;
  transition: color 300ms ease;
}
section.amr02 .container > p.spec-btn:hover span::after {
  background-color: #EDEE00;
  transition: background-color 300ms ease;
}
section.amr02 .container > ul {
  display: none;
}
section.amr02 .container > ul li {
  display: flex;
}
section.amr02 .container > ul li:first-child span {
  background-color: #D7EDEB;
}
section.amr02 .container > ul li:first-child span:nth-child(even) {
  display: none;
}
section.amr02 .container > ul li:not(:first-child) span {
  background-color: white;
}
section.amr02 .container > ul li:not(:first-child) span:nth-child(odd) {
  display: none;
}
section.amr02 .container > ul li span {
  width: 25%;
  display: block;
  padding: 1em 0 1em 1em;
  border-left: 1px solid #EEEEEE;
  border-bottom: 1px solid #EEEEEE;
}
section.amr02 .container > ul li span br {
  display: none;
}
section.amr02 .container > ul li span:last-child {
  border-right: 1px solid #EEEEEE;
}
section.amr02 .container > ul + p {
  display: none;
}

@media screen and (max-width: 1280px) {
  section.amr02 {
    padding: 0 3% 4em 3%;
  }
}
@media screen and (max-width: 768px) {
  section.amr02 .container {
    padding: 40px 5%;
  }
  section.amr02 .container > div:first-child {
    display: block;
  }
  section.amr02 .container > div:first-child > div {
    width: 100%;
  }
  section.amr02 .container > div:first-child > img {
    width: 80%;
    height: auto;
    margin: 0 auto;
  }
  section.amr02 .container > ul li {
    display: grid;
    grid-template-columns: 30% 70%;
    grid-template-rows: auto auto auto auto;
  }
  section.amr02 .container > ul li:first-child {
    display: none;
  }
  section.amr02 .container > ul li:not(:first-child) span:nth-child(odd) {
    display: block;
    color: #31B1B0;
    grid-column: 1/2;
  }
  section.amr02 .container > ul li:not(:first-child) span:first-child {
    display: none;
  }
  section.amr02 .container > ul li span {
    width: 100%;
  }
  section.amr02 .container > ul li span br {
    display: inline;
  }
  section.amr02 .container > ul li span:nth-child(even) {
    grid-column: 2/3;
  }
  section.amr02 .container > ul li span:nth-child(2) {
    grid-column: 1/3;
    grid-row: 1/2;
    background-color: #D7EDEB;
    text-align: center;
  }
  section.amr02 .container > ul li span:nth-child(3), section.amr02 .container > ul li span:nth-child(4) {
    grid-row: 2/3;
  }
  section.amr02 .container > ul li span:nth-child(5), section.amr02 .container > ul li span:nth-child(6) {
    grid-row: 3/4;
  }
}