@charset "utf-8";
.detail-container{
  width: 100%;
  padding-top: calc(20rem / 40);
  background-color: #fff;
}
.detail-banner{
  position: relative;
}
.detail-banner-image{
  width: 100%;
}
.detail-content{
  position: absolute;
  /*width: 35%;*/
  width: 58%;
  left: 14%;
  top: 1.0rem;
}
.detail-content-title{
  font-size: 1.25rem;
  color: #0C0C0C;
  line-height: 1.5rem;
}
.detail-list{
  margin-top: 1rem;
}
.detail-item{
  display: flex;
  align-items: flex-start;
}
.detail-item-red{
  font-size: 0.5rem;
  color: rgba(192, 25, 32, 1);
}
.detail-item-text{
  font-weight: 400;
  font-size: 0.5rem;
  color: #434343;
  line-height: 1.0rem;
}
.detail-desc{
  margin-top: 1.7rem;
  width: 75%;
}
.detail-desc-item:not(:first-child){
  margin-top: .1rem;
}
.detail-desc-item-title{
  position: relative;
  font-weight: 500;
  font-size: 0.6rem;
  color: #0C0C0C;
  line-height: 0.6rem;
  padding: 0.25rem 0;
}
.detail-desc-item-title::after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  width: 1.2rem;
  height: 2px;
  background-color: rgba(192, 25, 32, 1);
}
.detail-desc-item-text{
  font-weight: 400;
  font-size: 0.4rem;
  color: #8F8F8F;
  line-height: 0.6rem;
  margin-top: 0.5rem;
}
@media screen and (max-width: 1400px) {
  .detail-content {
    /*top: 2.0rem;*/
	 top: .2rem;
  }
  .detail-desc, .detail-list {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 1000px) {
  .detail-content{
    position: initial;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .detail-content-title{
    padding: 0 10%;
    text-align: center;
  }
  .detail-list{
    margin-bottom: 0.4rem;
    padding: 0 10%;
  }
  .detail-desc{
    margin-bottom: 0.4rem;
  }
}

@media screen and (max-width: 500px) {
  .detail-content{
    margin-top: 2rem;
  }
  .detail-content-title{
    font-size: 1rem;
  }
}