.page-visual-inner{
  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url("../img/page/visual-performance.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#aboutus .section-title{
  font-size:clamp(1.8rem , 2.34375vw , 3.2rem);
  margin-bottom:2em;
}
#aboutus .wrapper{
  position:relative;
  background:url("../img/performance/bg-aboutus.jpg"), linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 300px, #48B0B1 300px, #48B0B1 100%);
  background-size: 320px 320px , 100%;
  background-position: center top , left;
  background-repeat: no-repeat , no-repeat;
  padding-top:300px;
}
#aboutus .textarea{
  position:relative;
  display:flex;
  flex-direction: column;
  justify-content: center;
  max-width:750px;
  min-height:430px;
  margin:auto;
  padding:2.5% 2.5% 2.5% 10%;
}
#aboutus .textarea::before{
  content:'';
  border-bottom:2px solid #FFFFFF;
  width:5em;
  height:2px;
  margin-bottom:2em;
}
#aboutus .textarea::after{
  content:'About us';
  position:absolute;
  left:-1em;
  transform: rotate(-90deg);
  font-size: clamp(1.4rem , 2.5271vw , 2.4rem);
  font-weight:700;
  letter-spacing:0.1em;
  color:#FFFFFF;
}
#aboutus .text{
  font-size:clamp(1.6rem , 2.0833vw , 2.0rem);
  line-height:2;
  letter-spacing:0.05em;
  color:#FFFFFF;
}
@media (min-width: 1400px) {
  #aboutus .wrapper{
    position:relative;
    background:url("../img/performance/bg-aboutus.jpg"),linear-gradient(90deg, #48B0B1 0%, #48B0B1 69.62%, transparent 69.62%, transparent 100%);
    background-size: 320px 320xp , 100%;
    background-position: 80% center , left;
    background-repeat: no-repeat , no-repeat;
    padding-top:0;
  }
  #aboutus .textarea{
    width:100%;
    max-width:680px;
    background-color:transparent;
    margin-left:0;
    padding:0;
  }
  #aboutus .textarea::after{
    top: 25%;
    left: -20%;
  }
}



#result .inner{
  max-width:1000px;
}
#result .content-block{
  display:flex;
  flex-wrap:wrap;
  justify-content: space-between;
  margin-bottom:7.5%;
}
#result .content-block::after{
  content:'';
  border:1px solid #002F7C;
  margin:3.5% 0;
  order:2;
}
#result .content-item{
  width:37.58%;
  margin:auto;
}
#result .content-item:first-child{
  order:1;
}
#result .content-item:last-child{
  order:3;
}
#result .balloon{
  position: relative;
  color:#FFFFFF;
  background-color: #002F7C;
}
#result .balloon::before{
  content: '';
  position: absolute;
  display: block;
  left: 0;
  right:0;
  bottom: -15px;
  width: 0;
  height: 0;
  border-right: 10px solid transparent;
  border-top: 15px solid #002F7C;
  border-left: 10px solid transparent;
  margin:auto;
}
#result .item-title{
  font-size:clamp(1.6rem , 2.8880vw, 4.0rem);
  text-align:center;
  letter-spacing:0.1em;
  margin-bottom:25px;
}
#result .textarea{
  color:#002F7C;
  text-align:center;
}
#result .textarea img{
  margin-bottom:2.5%;
}
#result .textarea .notes{
  font-size:clamp(1.2rem , 1.5625vw , 2.0rem);
}


#reason .content-title{
  font-size:clamp(2.2rem , 2.8646vw, 4.4rem);
  color:#48B0B1;
  margin-bottom:0.5em;
}
#reason .content-block{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
}
#reason .content-item{
  width:100%;
  color:#002E7B;
  background-color:#EAEAEA;
  margin-bottom:2.46%;
  padding:1em 2em;
}
#reason .item-title{
  font-size:clamp(1.6rem , 2.88881vw, 2.7rem);
}
#reason .item-title::before{
  color:#CEC136;
}
#reason .textarea{
  padding:0 1em 1em;
}
#reason .textarea .text{
  font-size: clamp(1.4rem , 1.8229vw , 2.2rem);
}
#reason .number::before{
  content: counter(number, decimal-leading-zero) ".";
}

@media (min-width: 554px) {
  #reason .content-item{
    width:48.87%;
  }
}
@media (min-width: 768px) {
  #reason .content-item{
    padding:1em 3.5em 2em;
  }
}
@media (min-width: 1200px) {
  #reason .content-item{
    padding:1em 5em 2em;
  }
}

#history .inner{
  max-width:940px;
}
#history .timeline-item {
  display: flex;
}
#history .timeline-date {
  width: 22.5%;
  font-size:clamp(1.2rem , 1.5625vw , 2.0rem);
  text-align:center;
  padding:0 1.5em 3em 0;
}
#history .timeline-date .year{
  display:block;
}
#history .timeline-content {
  position: relative;
  width: 77.5%;
  padding: 0 0 3em 1.5em;
  border-left: 2px solid #49B1B2;
}
#history .timeline-item .timeline-content .text{
  font-size:clamp(1.2rem , 1.5625vw , 2.0rem);
}
#history .timeline-item .timeline-content::before {
  content: "";
  position: absolute;
  top: 0;
  left: calc(-8px - 1px);
  width: 16px;
  height: 16px;
  background-color: #49B1B2;
  border-radius: 8px;
}
#history .timeline-item:last-child .timeline-content {
  border-left: none;
}
#history .timeline-item:last-child .timeline-content::before {
  top: 0;
  left: -8px;
}
@media (min-width: 554px) {
  #history .timeline-date {
    text-align:right;
    margin-top:-0.5em;
  }
  #history .timeline-date .year{
    display:inline-block;
  }
  #history .timeline-date {
    width: 27.778%;
    margin-top:-0.5em;
    padding:0 2em 2.5em 0;
  }
  #history .timeline-content {
    width: 72.222%;
    padding: 0 0 2.5em 2.5em;
  }
  #history .timeline-item .timeline-content .text{
    margin-top:-0.5em;
    margin-bottom:0.5em;
  }
}