.dx {
  background-image: url(http://119.245.146.109/app-def/S-102/wp/wp-content/themes/sunrally-wp/img/dx/dx_image_pc.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
  left: 0px;
  top: 0px;
  padding-top: 40%;
  height: 100%!important;
}


section{
  margin-bottom: 3rem;
}

picture {
    display: block;
    margin-bottom: 1.2rem;
    text-align: center;
}

#dxStrategy picture img {
    width: 100%;
}

picture img {
    width: 70%;
}

picture img[src$=".svg"] {
    max-width: 660px;
    padding-top: 1rem;
    padding-bottom: 1.6rem;
}

#dxVision p {
    line-height: 2.4;
    padding: 0 2% 3rem;
}


.dxSecInner {
    margin: 0 2%;
    color: #555;
    border-bottom: 1px solid;
}


h3.dxSecTitle {
    color: #f56a57;
    font-size: clamp(1.25rem, 0.121rem + 2.35vw, 2rem);
    font-weight: 600;
    margin-bottom: 1.2rem;
}


h3.dxSecTitle {
  position: relative;
  width: fit-content;
}

h3.dxSecTitle:not(#topMessage *):after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  content: '';
  border-radius: 3px;
  /*background-image: -webkit-gradient(linear, left top, right top, from(#fa709a), to(#fee140));
  background-image: -webkit-linear-gradient(left, #fa709a 0%, #fee140 100%);*/
  background-image: linear-gradient(to right, #fa709a 0%, #fee140 100%);
}



.dxSecInner h4 {
    font-size: clamp(1.125rem, 0.749rem + 0.78vw, 1.375rem);
    font-weight: 500;
}

.dxSecInner p, .dxList li {
    font-size: clamp(0.844rem, 0.609rem + 0.49vw, 1rem);
    line-height: 1.6;
}


#dxEnvironment .dxList li::before {
  content: "\2981";
  margin-right: 5px;
  font-size: 1.2em;
}

.dxList {
    margin-bottom: 3rem;
}


.dxList li{
  padding: 0 2%;
  margin-bottom: 0.6rem;
}


#dxStrategy .dxList li{
  margin-bottom: 1rem;
}


.dxList li span {
    text-align: right;
    display: block;
    font-size: 0.75rem;
    color: #222;
}


#topMessage .dxSecTitle {
    font-size:  clamp(1.75rem, 0.809rem + 1.96vw, 2.375rem);
    font-style: italic;
    background: linear-gradient(to right, #fa709a 0%, #fee140 100%) no-repeat 0 100% / 100% 20%;
    width: fit-content;
    color: #f56a57;
    padding: 0 8px 10px 0;
    text-shadow: -2px 2px 0 #FFEAE5, 2px 2px 0 #FFEAE5;
}

#topMessage .dxSecTitle::before {
  content: attr(data-jp);
  display: block;
  color: #555;
  font-size: 1rem;
  font-weight: 500;
}

#topMessage .dxSecInner {
    padding: 2rem;
    background: #FFEAE5;
    border-bottom: none;
}

.dxSecInnerFlex {
    display: flex;
    margin-bottom: 3rem;
    gap: 1rem;
}

.dxSecInnerFlex:after {
    content: none;
}

.dxSecInnerTxt {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.dxSecInnerTxt h4 {
    font-size: clamp(1.438rem, 0.967rem + 0.98vw, 1.75rem);
}

.visionCatch span, .dxSecInnerTxt h4 span {
  display: inline-block;
}


.visionCatch {
  font-size: clamp(1.313rem, 1.03rem + 0.59vw, 1.5rem)!important;
  font-weight: 600 !important;

}

.firstRow {
  margin-right: -10px;

}

.secondRow {
  margin-left: 10px;

}

.dxSecInnerTxt p {
    font-size: clamp(0.938rem, 0.608rem + 0.68vw, 1.156rem);
    line-height: 1.8;
}


.dxSecInnerImg img {
    width: 100%;
}

.pName {
    font-weight: 500;
    font-size: clamp(1.125rem, 0.937rem + 0.39vw, 1.25rem)!important;
}

.pName {
  display: flex;
  align-items: baseline;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.pName .position {
  flex-shrink: 1;
}

.pName .name {
  flex-shrink: 0;
  white-space: nowrap;
}

.position {
  font-size: clamp(1rem, 0.812rem + 0.39vw, 1.125rem)!important;
}

@media screen and (max-width:768px) {
  #cocont {
    padding-top: 50px;
}

  .dx {
    background-image: url(http://119.245.146.109/app-def/S-102/wp/wp-content/themes/sunrally-wp/img/dx/dx_image_sp.jpg);
    padding-top: 150%;
  }


  .dxSecInner {
      margin: 0 5%;
  }

  .dxSecInner h4 {
      font-size: clamp(1rem, 0.881rem + 0.51vw, 1.125rem);
  }


  .visionCatch {
      font-size: clamp(1.188rem, 1.068rem + 0.51vw, 1.313rem) !important;
      line-height: 1.2;
  }


  h3.dxSecTitle {
      font-size: clamp(1.375rem, 1.017rem + 1.53vw, 1.75rem);
      padding-bottom: 0.8rem;
  }


  #topMessage .dxSecTitle::before {
      margin-bottom: 0.5rem;
  }

  picture img {
      width: 100%;
  }

  .dxSecInnerFlex {
    flex-direction: column;
    align-items: center;
  }

  .dxSecInnerTxt {
    flex-direction: column;
    width: 100%;
    order: 1;
  }

  .dxSecInnerTxt h4 {
    order: 1;
  }

  .dxSecInnerTxt p.pName {
    order: 2;
    margin-bottom: 1rem;
  }

  .dxSecInnerTxt > p:not([class]) {
    order: 3;
  }

  .dxSecInnerImg {
    order: 2;
    width: 100%;
    text-align: center;
  }

  .dxSecInnerImg img {
    width: 70%;
    height: auto;
  }

  #topMessage h4 {
      font-size: clamp(1.2rem, 0.818rem + 1.63vw, 1.6rem);
      line-height: 1.5;
  }

  .pName .position {
    font-size: clamp(0.844rem, 0.695rem + 0.64vw, 1rem)!important;
  }

  .pName .name {
    font-size: clamp(1.125rem, 0.916rem + 0.89vw, 1.344rem)!important;
  }

}