.contents-banner {
  background-color: #5e5e5e;
}
.contents-block {
  padding-bottom: 2em;
  background-color: #5e5e5e;
}


.device-color-btn.color1 {
  background-color: #0A0A0E;
}
/*
.device-color-btn.color1.current {
  background-color: #0A0A0E;
}
*/
.device-color-btn.color2 {
  background-color: #778F89;
}
/*
.device-color-btn.color2.current{
  background-color: #778F89;
}
*/
.device-color-btn.color3 {
  background-color: #6879A1;
}
/*
.device-color-btn.color3.current{
  background-color: #6879A1;
}
*/



.device-color-list li {
   position: relative;
}
.device-color-btn {
  position: relative;
  overflow: hidden;
}
.device-color-btn.current::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
}
.accessories-area{
  display: block;
  max-width: 48rem;
  margin: 0 auto;
  padding: 1.5rem;
  border-radius: 0.5em;
  text-align: center;
  background-color: #fff;
  box-shadow: 0.5rem 0.5rem 1.1rem rgba(0, 0, 0, 0.16);
  }
.comment.charge{
  color: #000!important;
  margin-top: 1.5em;
}
@media screen and (min-width:640px) {
.main-text {
  font-size: 1.6rem;
}
.comment-box {
  margin: 0 2rem 1em;
}
.show-tab{
  display: block;
}
.comment.charge {
  max-width: 57rem;
  margin: 1.5em auto 0;
  width: 66%;
}
}
@media screen and (min-width:960px) {
.contents-block {
  padding-right: 5rem;
  padding-left: 5rem;
}
.comment-box {
  margin: 0;
}
.show-tab{
  display: none;
}
.comment.charge {
  max-width: 47rem;
  margin: 1.5em auto 0;
  width: auto;
}
}