@charset "utf-8";
/* CSS Document */

.aboutUsDna-flow .ttl-01__txt {
  font-weight: 500;
}


.aboutUsDna-flow__head {
  text-align: center;
  font-size: 18px;
  margin:0 0 10vw;
}

.aboutUsDna-flow {
    /*
  margin: -1px calc(50% - 50vw);
    padding: 16.92708vw calc(50vw - 50%) 0;
  */
    margin:0 -5vw;
    padding: 10vw 5vw 0;
    color: #fff;
    -webkit-clip-path: inset(0);
    clip-path: inset(0)
}

.aboutUsDna-flow::before {
    content: "";
    background: url(../../company/images/bg_aboutUs_dna_flow_01_sp.jpg) center/cover no-repeat;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: -100
}

.aboutUsDna-flow::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0
}

.aboutUsDna-flow__inner {
    position: relative;
    z-index: 1
}

.aboutUsDna-flow__body {
    /*margin-top: 16.40625vw*/
}

.aboutUsDna-flow__main {
    display: flex
}

.aboutUsDna-flow__sub {
    margin: 0 calc(50% - 50vw)
}

.aboutUsDna-flow__item {
    width: 100%
}

.aboutUsDna-flow__item:not(:first-child) {
    margin-left: 5.20833vw
}

.aboutUsDna-flow__item:nth-child(2) {
    flex-shrink: 0;
    width: auto;
  position: relative;
}
.aboutUsDna-flow__item:nth-child(2)::before {
  content:"";
  position: absolute;
  top:0;
  left:0;
  width:1px;
  height: 130%;
  background:#fff;
  display: block;  
}
.aboutUsDna-flow__item:nth-child(2)::after {
  content:"";
  position: absolute;
  top:0;
  right:0;
  width:1px;
  height: 130%;
  background:#fff;
  display: block;  
}

.aboutUsDna-flow-cont__head {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 12.5vw;
    font-size: 4.16667vw;
    font-weight: 500;
    line-height: 1.5;
    text-align: center
}

.aboutUsDna-flow-cont__body {
    margin-top: 8.07292vw
}

.aboutUsDna-flow-cont__item:not(:first-child) {
    margin-top: 13.80208vw
}

.aboutUsDna-flow-event__num svg {
    width: auto;
    height: 3.7vw
}

.aboutUsDna-flow-event__ttl {
    margin-top: 3.72917vw;
    font-size: 3.4vw;
    font-weight: 500;
    line-height: 1.6;
}

.aboutUsDna-flow-event__ttl::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2) * 0.5em)
}

.aboutUsDna-flow-event__ttl::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2) * 0.5em)
}

.aboutUsDna-flow-event__body {
    margin-top: 6.42708vw
}

.aboutUsDna-flow-detail__head svg {
    width: auto;
    height: 2.56458vw
}

.aboutUsDna-flow-detail__body {
    margin-top: 2.34375vw
}

.aboutUsDna-flow-detail__txt {
    font-size: 3.125vw;
    line-height: 1.66667
}

.aboutUsDna-flow-detail__txt::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.66667) * 0.5em)
}

.aboutUsDna-flow-detail__txt::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.66667) * 0.5em)
}

.aboutUsDna-flow-detail__picture {
    display: block;
    margin-top: 2.60417vw
}

.aboutUsDna-flow-desc {
    width: 9.375vw;
    height: 100%;
    padding-top: 10.57292vw
}

.aboutUsDna-flow-desc__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 74.21875vw
}

.aboutUsDna-flow-desc__item--01 {
    min-height: 65.10417vw
}

.aboutUsDna-flow-desc__item--01 .aboutUsDna-flow-desc__ttl {
    margin-top: 4.6875vw
}

.aboutUsDna-flow-desc__icon {
    border-width: 6.51042vw 4.6875vw 0 4.6875vw;
    border-style: solid;
    border-color: rgba(255,255,255,0.42) transparent transparent transparent
}

.aboutUsDna-flow-desc__ttl {
    margin-top: 13.80208vw;
    font-size: 4.16667vw;
    font-weight: 500;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl
}

.aboutUsDna-flow-future {
    position: relative
}

.aboutUsDna-flow-future::before {
    content: "";
    display: block;
    border-width: 0 50vw 62.5vw 50vw;
    border-style: solid;
    border-color: transparent transparent rgba(0,165,192,0.42) transparent
}

.aboutUsDna-flow-future::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    border-width: 0 43.22917vw 53.64583vw 43.22917vw;
    border-style: solid;
    border-color: transparent transparent rgba(0,165,192,1) transparent;
    transform: translateX(-50%)
}

.aboutUsDna-flow-future__inner {
    position: absolute;
    top: 26.04167vw;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1
}

.aboutUsDna-flow-future__head {
    display: flex;
    justify-content: center
}

.aboutUsDna-flow-future__head svg {
    width: auto;
    height: 6.03125vw
}

.aboutUsDna-flow-future__body {
    margin-top: 4.42708vw;
    font-size: 5.20833vw;
    font-weight: 500;
  letter-spacing: 0.4em;
  white-space: nowrap;
  line-height: 1.6;
  text-align: center;
}

.aboutUsDna-slide {
    position: relative;
    padding: 6.51042vw 0 10.41667vw;
    border-top: 4px solid #00a5c0;
    border-bottom: 4px solid #00a5c0
}

.aboutUsDna-slide__img {
    height: 52.08333vw;
  width:100%;
    -o-object-fit: cover;
    object-fit: cover
      
}

.aboutUsDna-slide__body {
    margin-top: 6.77083vw
}

.aboutUsDna-slide__ttl {
    position: relative;
    padding-right: 18.75vw;
    font-size: 4.42708vw;
    font-weight: 500;
    line-height: 1.45455;
    z-index: 0
}

.aboutUsDna-slide__ttl::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.45455) * 0.5em)
}

.aboutUsDna-slide__ttl::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.45455) * 0.5em)
}

.aboutUsDna-slide__ttl--narrow {
    padding-right: 32.8125vw
}

.aboutUsDna-slide__num {
    position: absolute;
    bottom: calc(100% - 7.03125vw);
    right: 2.34375vw;
    font-size: 0
}

.aboutUsDna-slide__num svg {
    width: auto;
    height: 15.10417vw
}

.aboutUsDna-slide__num--front {
    z-index: -1
}

.aboutUsDna-slide__num--front svg {
    opacity: 0.2;
    fill: #00a5c0
}

.aboutUsDna-slide__num--back {
    z-index: -2
}

.aboutUsDna-slide__num--back svg {
    opacity: 0.5;
    fill: #fff
}

.aboutUsDna-slide__txt {
    margin-top: 6.51042vw;
}

.aboutUsDna-slide__txt::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2) * 0.5em)
}

.aboutUsDna-slide__txt::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2) * 0.5em)
}

.aboutUsDna-episode {
    position: relative;
    margin: 0 calc(50% - 50vw);
    padding: 6.51042vw calc(50vw - 50%) 0
}

.aboutUsDna-episode--dark .bg {
    opacity: 0.25
}

.aboutUsDna-episode__head {
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
    height: 11.32812vw;
    z-index: 1
}

.aboutUsDna-episode__body {
    position: relative;
    margin: 0 calc(50% - 50vw);
    padding: 13.02083vw calc(50vw - 50%);
    z-index: 0
}

.aboutUsDna-episode__item {
    position: relative
}

.aboutUsDna-episode__item:not(:first-child) {
    margin-top: 6.51042vw;
    padding-top: 6.51042vw;
    border-top: 1px solid #aaa
}

.aboutUsDna-global {
    background: #000;
    position: relative;
    margin: 0 calc(50% - 50vw);
    padding: 19.53125vw calc(50vw - 50%) 0;
    color: #fff
}

.aboutUsDna-global__inner {
    position: relative;
    z-index: 1
}

.aboutUsDna-global__body:not(:first-child) {
    margin-top: 26.04167vw
}

.aboutUsDna-global__foot {
    margin-top: 13.80208vw
}

.aboutUsDna-products__body {
    position: relative;
    margin: 10.41667vw calc(50% - 50vw) 0;
    padding: 0 calc(50vw - 50%)
}

.aboutUsDna-products__item {
    width: 76.25%
}

.aboutUsDna-products__item:nth-child(2) {
    margin-left: auto;
    margin-right: auto
}

.aboutUsDna-products__item:nth-child(3) {
    margin-left: auto
}

.aboutUsDna-products__item:not(:first-child) {
    margin-top: 6.51042vw
}

.aboutUsDna-products__bg {
    position: absolute;
    top: 0;
    right: 0;
    width: 21.61458vw
}

.aboutUsDna-product__img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.aboutUsDna-product__body {
    padding: 6.51042vw;
    border-bottom: 1px solid #fff;
    border-left: 4px solid #00a5c0;
    border-right: 1px solid #fff
}

.aboutUsDna-product__ttl {
    font-size: 4.42708vw;
    font-weight: 500
}

.aboutUsDna-product__txt {
    margin-top: 6.51042vw
}

.aboutUsDna-product__note {
    margin-top: 4.16667vw;
    font-size: 3.125vw;
    line-height: 2;
    color: #888
}

.aboutUsDna-product__note::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2) * 0.5em)
}

.aboutUsDna-product__note::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2) * 0.5em)
}

.aboutUsDna-strength__head {
    position: relative;
    padding-bottom: 16.92708vw
}

.aboutUsDna-strength__bg {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 65.49479vw;
    opacity: 0.2;
    z-index: -1
}

.aboutUsDna-strength__body {
    margin-top: 16.92708vw
}

.aboutUsDna-strength__foot {
    margin-top: 19.53125vw
}

.aboutUsDna-strength__note {
    margin-top: 10.41667vw;
    color: #aaa
}

.aboutUsDna-voice {
    background: #000;
    margin: 0 calc(50% - 50vw);
    padding: 19.53125vw calc(50vw - 50%);
    color: #fff
}



@media screen and (min-width: 768px) {
  
  
  
  
    .aboutUsDna-flow {
        background: url(../../company/images/bg_aboutUs_dna_flow_01_pc.jpg) center/cover no-repeat;
       /* padding: clamp(50px, calc( 50px + 50 * (100vw - 768px) / 512), 100px) calc(50vw - 50%)*/
      margin: 0 calc(50% - 50vw);
        padding: clamp(50px, calc( 50px + 50 * (100vw - 768px) / 512), 100px) calc(50vw - 50%) clamp(75px, calc( 75px + 75 * (100vw - 768px) / 512), 150px)

    }

    .aboutUsDna-flow::before {
        content: none
    }
  
.aboutUsDna-flow__head {
  
  font-size: 36px;
  margin:0 0 40px
}
  
  

    .aboutUsDna-flow__body {
        position: relative;
      /*
        margin: clamp(22px, calc( 22px + 22 * (100vw - 768px) / 512), 44px) calc(50% - 50vw) 0
      */
    }

    .aboutUsDna-flow__main {
        display: block;
        width: 85.1875%;
        /*padding-left: 3.90625%*/
    }

    .aboutUsDna-flow__sub {
        position: absolute;
        top: 50%;
        left: 77.1875%;
        margin: 0;
        transform: translateY(-50%)
    }

    .aboutUsDna-flow__item {
        width: auto
    }

    .aboutUsDna-flow__item:not(:first-child) {
        margin: clamp(20px, calc( 20px + 20 * (100vw - 768px) / 512), 40px) 0 0 0
    }

    .aboutUsDna-flow__item:nth-child(2) {
        padding:0 50px 0 0;
        font-size: clamp(12px, calc( 12px + 4 * (100vw - 768px) / 512), 16px)
    }
  .aboutUsDna-flow__item:nth-child(2)::before {
    top:0;
    left:50%;
    width:120vw;
    height: 1px;
    transform: translateX(-50%);
  }
  .aboutUsDna-flow__item:nth-child(2)::after {
    top:inherit;
    right: inherit;
    left:50%;
    bottom:0;
    width:120vw;
    height: 1px;
    transform: translateX(-50%);
  }

    .aboutUsDna-flow-cont {
        display: flex
    }

    .aboutUsDna-flow-cont__head {
        flex-shrink: 0;
        width: 20px;
        height: auto;
      writing-mode: vertical-rl;
        font-size: clamp(12px, calc( 12px + 4 * (100vw - 768px) / 512), 16px);
      position: relative;
    }
  
  .aboutUsDna-flow-cont__head .denko {
    position: absolute;
    top:10px;
    left:0;
    white-space: nowrap;
    letter-spacing: 1.7em
  }
  .aboutUsDna-flow-cont__head .mat {
    position: absolute;
    top:10px;
    left:0;
    white-space: nowrap;
  }

    .aboutUsDna-flow-cont__body {
        display: flex;
        width: 100%;
        margin: 0 0 0 40px
    }

    .aboutUsDna-flow-cont__item {
        flex-shrink: 0;
        width: 34.78261%
    }

    .aboutUsDna-flow-cont__item:last-child {
        flex-shrink: 1;
        width: 100%
    }

    .aboutUsDna-flow-cont__item:last-child .aboutUsDna-flow-event__body {
        padding: 0
    }

    .aboutUsDna-flow-cont__item:not(:first-child) {
        margin: 0 0 0 clamp(4px, calc( 4px + 4 * (100vw - 768px) / 512), 8px)
    }

    .aboutUsDna-flow-event__year {
        display: flex;
        align-items: center
    }

    .aboutUsDna-flow-event__num {
        flex-shrink: 0
    }

    .aboutUsDna-flow-event__num svg {
        height: 12.7px;
    }

    .aboutUsDna-flow-event__line {
        background: #fff;
        position: relative;
        width: 100%;
        height: 1px;
        margin-left: clamp(7px, calc( 7px + 7 * (100vw - 768px) / 512), 14px)
    }

    .aboutUsDna-flow-event__line::before,.aboutUsDna-flow-event__line::after {
        content: "";
        background: #fff;
        position: absolute;
        top: 50%;
        width: clamp(3.5px, calc( 3.5px + 3.5 * (100vw - 768px) / 512), 7px);
        height: clamp(3.5px, calc( 3.5px + 3.5 * (100vw - 768px) / 512), 7px);
        border-radius: 100%;
        transform: translateY(-50%)
    }

    .aboutUsDna-flow-event__line::before {
        left: 0
    }

    .aboutUsDna-flow-event__line::after {
        right: 0
    }

    .aboutUsDna-flow-event__ttl {
        margin-top: 0px;
        font-size: 14px;
    }

    .aboutUsDna-flow-event__body {
        margin-top: 20px;
        font-size: 14px;
    }
  
  .aboutUsDna-flow-detail {
    padding-right:40px;
  }

    .aboutUsDna-flow-detail__head svg {
        height: 10.1px;
    }

    .aboutUsDna-flow-detail__body {
        display: flex;
        justify-content: space-between;
        margin-top:0;
    }

    .aboutUsDna-flow-detail__txt {
        font-size: 14px;
      letter-spacing: 0
    }

    .aboutUsDna-flow-detail__picture {
        flex-shrink: 0;
        width: clamp(38px, calc( 38px + 38 * (100vw - 768px) / 512), 76px);
        margin: 0 0 0 clamp(6px, calc( 6px + 6 * (100vw - 768px) / 512), 12px)
    }

    .aboutUsDna-flow-desc {
        display: flex;
        width: 96%;
        height: auto;
        padding: 0
    }

    .aboutUsDna-flow-desc__item {
        flex-shrink: 0;
        flex-direction: row;
        min-height: auto
    }

    .aboutUsDna-flow-desc__item:not(:first-child) {
        padding-left: clamp(4px, calc( 4px + 4 * (100vw - 768px) / 512), 8px);
        box-sizing: content-box
    }

    .aboutUsDna-flow-desc__item--01 {
        width: 33.67347%
    }

    .aboutUsDna-flow-desc__item--01 .aboutUsDna-flow-desc__ttl {
        margin: 0 0 0 clamp(7px, calc( 7px + 7 * (100vw - 768px) / 512), 14px)
    }

    .aboutUsDna-flow-desc__item--02 {
        width: 32.65306%
    }

    .aboutUsDna-flow-desc__item--03 {
        flex-shrink: 1;
        width: 100%
    }

    .aboutUsDna-flow-desc__icon {
        flex-shrink: 0;
        border-width: clamp(10.5px, calc( 10.5px + 10.5 * (100vw - 768px) / 512), 21px) 0 clamp(10.5px, calc( 10.5px + 10.5 * (100vw - 768px) / 512), 21px) clamp(14px, calc( 14px + 14 * (100vw - 768px) / 512), 28px);
        border-color: transparent transparent transparent rgba(255,255,255,0.42)
    }

    .aboutUsDna-flow-desc__ttl {
        margin: 0 0 0 clamp(5px, calc( 5px + 5 * (100vw - 768px) / 512), 10px);
        font-size: clamp(12px, calc( 12px + 6 * (100vw - 768px) / 512), 18px);
        -webkit-writing-mode: initial;
        -ms-writing-mode: initial;
        writing-mode: initial
    }

    .aboutUsDna-flow-future::before {
        border-width: 44.26562vw 54.8125vw 44.26562vw 0;
        border-color: transparent rgba(0,165,192,0.42) transparent transparent
    }

    .aboutUsDna-flow-future::after {
        top: 50%;
        bottom: auto;
        left: clamp(28px, calc( 28px + 28 * (100vw - 768px) / 512), 56px);
        border-width: 44.26562vw 54.8125vw 44.26562vw 0;
        border-color: transparent rgba(0,165,192,1) transparent transparent;
        transform: translateY(-50%)
    }

    .aboutUsDna-flow-future__inner {
        top: 50%;
        left: 120px;
        transform: translateY(-50%);
      text-align: center;
    }

    .aboutUsDna-flow-future__head {
        display: block;
    }

    .aboutUsDna-flow-future__head svg {
        height: clamp(11px, calc( 11px + 11 * (100vw - 768px) / 512), 22px)
    }

    .aboutUsDna-flow-future__body {
        margin: 5px 0 0;
        font-size: clamp(16px, calc( 16px + 4 * (100vw - 768px) / 512), 20px);
      letter-spacing: 0.5em;
      
    }

    .aboutUsDna-slide {
        display: flex;
        flex-direction: column;
        height: 100%;
        padding: 0;
        border: none
    }

    .aboutUsDna-slide__head {
        flex-shrink: 0
    }

    .aboutUsDna-slide__img {
        height: auto
    }

    .aboutUsDna-slide__body {
        height: 100%;
        margin: 0;
        padding: clamp(15px, calc( 15px + 15 * (100vw - 768px) / 512), 30px) 0 0 0;
    }

    .aboutUsDna-slide__ttl {
        padding: 0;
        font-size: clamp(16px, calc( 16px + 6 * (100vw - 768px) / 512), 22px)
    }

    .aboutUsDna-slide__num {
        display: none;
        bottom: calc(100% - clamp(16px, calc( 16px + 6 * (100vw - 768px) / 512), 22px));
        right: 0
    }

    .aboutUsDna-slide__num svg {
        height: clamp(28px, calc( 28px + 28 * (100vw - 768px) / 512), 56px)
    }

    .aboutUsDna-slide__num--md {
        display: block
    }

    .aboutUsDna-slide__txt {
        margin-top: clamp(10px, calc( 10px + 10 * (100vw - 768px) / 512), 20px);
        font-size: clamp(12px, calc( 12px + 4 * (100vw - 768px) / 512), 16px)
    }

    .aboutUsDna-episode {
        margin: 0;
        padding: 0
    }

    .aboutUsDna-episode__head {
        top: clamp(-44px, calc( -22px + -22 * (100vw - 768px) / 512), -22px);
        right: clamp(-44px, calc( -22px + -22 * (100vw - 768px) / 512), -22px);
        height: clamp(40px, calc( 40px + 40 * (100vw - 768px) / 512), 80px)
    }

    .aboutUsDna-episode__body {
        display: flex;
        flex-flow: wrap;
        margin: 0 calc(50% - 50vw) 0 0;
        padding: clamp(36px, calc( 36px + 36 * (100vw - 768px) / 512), 72px) calc(50vw - 50%) clamp(36px, calc( 36px + 36 * (100vw - 768px) / 512), 72px) clamp(44px, calc( 44px + 44 * (100vw - 768px) / 512), 88px)
    }

    .aboutUsDna-episode__item {
        width: 50%
    }

    .aboutUsDna-episode__item:not(:first-child) {
        margin: 0;
        padding: 0;
        border: none
    }

    .aboutUsDna-episode__item:nth-child(2n-1) .aboutUsDna-episode__txt {
        padding: 0 clamp(28px, calc( 28px + 28 * (100vw - 768px) / 512), 56px) 0 clamp(10px, calc( 10px + 10 * (100vw - 768px) / 512), 20px)
    }

    .aboutUsDna-episode__item:nth-child(2n) {
        border-left: 1px solid #aaa
    }

    .aboutUsDna-episode__item:nth-child(2n) .aboutUsDna-episode__txt {
        padding: 0 clamp(10px, calc( 10px + 10 * (100vw - 768px) / 512), 20px) 0 clamp(28px, calc( 28px + 28 * (100vw - 768px) / 512), 56px)
    }

    .aboutUsDna-episode__item:nth-child(n+3) {
        margin-top: clamp(30px, calc( 30px + 30 * (100vw - 768px) / 512), 60px)
    }

    .aboutUsDna-episode__item:nth-child(n+3)::before {
        content: "";
        position: absolute;
        top: clamp(-30px, calc( -15px + -15 * (100vw - 768px) / 512), -15px);
        width: calc(100% - clamp(9px, calc( 9px + 9 * (100vw - 768px) / 512), 18px));
        border-top: 1px solid #aaa
    }

    .aboutUsDna-episode__item:nth-child(n+3):nth-child(2n-1)::before {
        left: 0
    }

    .aboutUsDna-episode__item:nth-child(n+3):nth-child(2n)::before {
        right: 0
    }

    .aboutUsDna-global {
        padding: clamp(53px, calc( 53px + 53 * (100vw - 768px) / 512), 106px) calc(50vw - 50%) 0
    }

    .aboutUsDna-global__body:not(:first-child) {
        margin-top: clamp(122px, calc( 122px + 122 * (100vw - 768px) / 512), 244px)
    }

    .aboutUsDna-global__foot {
        margin-top: clamp(70px, calc( 70px + 70 * (100vw - 768px) / 512), 140px)
    }

    .aboutUsDna-products__body {
        margin: clamp(30px, calc( 30px + 30 * (100vw - 768px) / 512), 60px) 0 0;
        padding: 0
    }

    .aboutUsDna-products__item {
        display: flex;
        width: 77.34375%
    }

    .aboutUsDna-products__item:not(:first-child) {
        margin-top: clamp(25px, calc( 25px + 25 * (100vw - 768px) / 512), 50px)
    }

    .aboutUsDna-products__bg {
        width: clamp(63px, calc( 63px + 63 * (100vw - 768px) / 512), 126px)
    }

    .aboutUsDna-product__head {
        flex-shrink: 0;
        width: 44.44444%
    }

    .aboutUsDna-product__body {
        width: 100%;
        padding: clamp(25px, calc( 25px + 25 * (100vw - 768px) / 512), 50px);
        border-top: 4px solid #00a5c0;
        border-left: none
    }

    .aboutUsDna-product__ttl {
        font-size: clamp(15px, calc( 15px + 15 * (100vw - 768px) / 512), 30px)
    }

    .aboutUsDna-product__txt {
        margin-top: clamp(15px, calc( 15px + 15 * (100vw - 768px) / 512), 30px)
    }

    .aboutUsDna-product__note {
        margin-top: clamp(12px, calc( 12px + 12 * (100vw - 768px) / 512), 24px);
        font-size: clamp(12px, calc( 12px + 2 * (100vw - 768px) / 512), 14px);
        line-height: 2.25
    }

    .aboutUsDna-product__note::before {
        margin-top: calc((1 - 2.25) * 0.5em)
    }

    .aboutUsDna-product__note::after {
        margin-bottom: calc((1 - 2.25) * 0.5em)
    }

    .aboutUsDna-strength__head {
        padding: 0 clamp(176px, calc( 176px + 176 * (100vw - 768px) / 512), 352px) 0 0
    }

    .aboutUsDna-strength__bg {
        right: clamp(-48px, calc( -24px + -24 * (100vw - 768px) / 512), -24px);
        width: clamp(190.5px, calc( 190.5px + 190.5 * (100vw - 768px) / 512), 381px);
        opacity: 0.5
    }

    .aboutUsDna-strength__foot {
        margin-top: clamp(75px, calc( 75px + 75 * (100vw - 768px) / 512), 150px)
    }

    .aboutUsDna-strength__note {
        margin-top: clamp(30px, calc( 30px + 30 * (100vw - 768px) / 512), 60px);
        text-align: right
    }

    .aboutUsDna-voice {
        padding: clamp(60px, calc( 60px + 60 * (100vw - 768px) / 512), 120px) calc(50vw - 50%) clamp(75px, calc( 75px + 75 * (100vw - 768px) / 512), 150px)
    }
  
}



@media screen and (min-width: 768px) and (max-width:1200px) {

    .aboutUsDna-flow  {
        padding: clamp(50px, calc( 50px + 50 * (100vw - 768px) / 512), 100px) 178px clamp(75px, calc( 75px + 75 * (100vw - 768px) / 512), 150px);
        margin:0 -178px;
    }
}


@media screen and (min-width: 768px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 768px) and (min-resolution: 2dppx) {

    .aboutUsDna-flow {
        background: url(../../company/images/bg_aboutUs_dna_flow_01_pc@2x.jpg) center/cover no-repeat
    }
}


@media screen and (min-width: 1280px) {

    .aboutUsDna-flow {
        background: url(../../company/images/bg_aboutUs_dna_flow_01_pc@2x.jpg) center/cover no-repeat
    }
}