/**
* --------------------------------
* Company CSS
* --------------------------------
*/
.company.about .title-area {
  padding-top: 120px;
  text-align: center; }
  .company.about .title-area .tit {
    font-family: "Poppins";
    font-size: 72px;
    font-weight: 600;
    line-height: 92px;
    color: #111111; }
  .company.about .title-area .tit-sub {
    margin-top: 0;
    font-family: "Poppins";
    font-size: 72px;
    font-weight: 600;
    line-height: 92px;
    background: linear-gradient(90deg, #10B1FF 20%, #0B50F2 40%, #000 90%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; }
.company.about .link-area {
  margin-top: 60px;
  text-align: center; }
  .company.about .link-area a {
    display: inline-block;
    padding: 0 24px;
    font-size: 24px;
    font-weight: 500;
    line-height: 36px;
    position: relative; }
    .company.about .link-area a::before {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      margin: 8px 0 0;
      width: 1px;
      height: 20px;
      background-color: #D4D4D4;
      vertical-align: top; }
    .company.about .link-area a:first-of-type::before {
      display: none; }
    .company.about .link-area a.active {
      color: #0B50F2;
      font-weight: 700; }
.company.about.dn#contents {
  padding-bottom: 0; }
.company.about.dn .subvisual-area {
  height: 740px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_dn_visual.jpg") center bottom no-repeat; }
  .company.about.dn .subvisual-area .inner {
    text-align: center;
    font-family: "Poppins";
    font-size: 28px;
    font-weight: 600;
    line-height: 40px; }
    .company.about.dn .subvisual-area .inner strong {
      display: block;
      padding-top: 16px;
      font-size: 72px;
      font-weight: 600;
      line-height: 92px; }
.company.about.dn .industry-area {
  margin-top: 120px;
  text-align: center; }
  .company.about.dn .industry-area .tit {
    opacity: 0;
    transform: translateY(50px);
    transition: all .4s ease-in-out; }
  .company.about.dn .industry-area .step {
    margin-top: 60px;
    display: flex;
    justify-content: space-between; }
    .company.about.dn .industry-area .step p {
      padding-bottom: 12px;
      width: 50%;
      font-weight: 700;
      line-height: 24px;
      text-align: center;
      opacity: 0;
      transform: translateX(-200px);
      transition: all .4s ease-in-out .2s;
      position: relative; }
      .company.about.dn .industry-area .step p:nth-of-type(2) {
        transition-delay: 0.6s; }
      .company.about.dn .industry-area .step p::before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: calc(100% - 15px);
        height: 2px;
        background-color: #111111;
        vertical-align: top; }
      .company.about.dn .industry-area .step p::before {
        top: auto;
        bottom: 0; }
      .company.about.dn .industry-area .step p::after {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
        display: inline-block;
        background-position: -100px -100px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
      .company.about.dn .industry-area .step p::after {
        top: 11px;
        left: auto;
        right: -9px;
        transform: translate(0, 0);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png"); }
  .company.about.dn .industry-area ol {
    display: flex;
    align-items: center;
    justify-content: center; }
  .company.about.dn .industry-area li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    margin-top: 50px;
    margin-left: -85px;
    padding: 0 80px;
    width: 380px;
    height: 380px;
    vertical-align: top;
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 380px;
    background: linear-gradient(270deg, #0BBBF2 0%, rgba(11, 131, 242, 0.6) 100%);
    box-shadow: 14px 14px 40px 0px rgba(187, 203, 242, 0.2);
    opacity: 0;
    transform: translateX(-50px);
    transition: all .4s ease-in-out .2s; }
    .company.about.dn .industry-area li::after {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
      display: inline-block;
      background-position: -350px -200px;
      background-repeat: no-repeat;
      content: '';
      width: 50px;
      height: 50px; }
    .company.about.dn .industry-area li::after {
      left: auto;
      right: 15px;
      transform: translate(0, -50%); }
    .company.about.dn .industry-area li strong {
      display: block;
      font-size: 28px;
      line-height: 44px;
      font-weight: 700; }
    .company.about.dn .industry-area li p {
      margin-top: 16px;
      font-size: 20px;
      line-height: 32px;
      font-weight: 400; }
    .company.about.dn .industry-area li:first-of-type {
      z-index: 4;
      margin-left: 0; }
    .company.about.dn .industry-area li:nth-of-type(2) {
      z-index: 3;
      transition-delay: .4s;
      background: linear-gradient(270deg, #1A9FFF 0%, #0089EC 0.01%, rgba(7, 159, 244, 0.8) 100%);
      box-shadow: 14px 14px 40px 0px rgba(187, 203, 242, 0.2); }
    .company.about.dn .industry-area li:nth-of-type(3) {
      z-index: 2;
      transition-delay: .6s;
      background: linear-gradient(270deg, #5789FF 0%, rgba(63, 175, 255, 0.9) 100%);
      box-shadow: 14px 14px 40px 0px rgba(187, 203, 242, 0.2); }
    .company.about.dn .industry-area li:nth-of-type(4) {
      z-index: 1;
      transition-delay: .8s;
      background: linear-gradient(270deg, #0B50F2 0.01%, rgba(32, 97, 250, 0.6) 100%);
      box-shadow: 14px 14px 40px 0px rgba(187, 203, 242, 0.2); }
      .company.about.dn .industry-area li:nth-of-type(4)::after {
        display: none; }
  .company.about.dn .industry-area.active .tit {
    opacity: 1;
    transform: translateY(0); }
  .company.about.dn .industry-area.active .step p {
    opacity: 1;
    transform: translateX(0); }
  .company.about.dn .industry-area.active li {
    opacity: 1;
    transform: translateX(0); }
    .company.about.dn .industry-area.active li:first-of-type {
      opacity: 0.699999988079071; }
    .company.about.dn .industry-area.active li:nth-of-type(2) {
      opacity: 0.800000011920929; }
    .company.about.dn .industry-area.active li:nth-of-type(3) {
      opacity: 0.8999999761581421; }
    .company.about.dn .industry-area.active li:nth-of-type(4) {
      opacity: 0.9399999976158142; }
.company.about.dn .crafts-area {
  margin-top: 120px;
  background-color: #F8F8F8; }
  .company.about.dn .crafts-area .inner {
    padding: 120px 0 32px;
    position: relative; }
    .company.about.dn .crafts-area .inner::before {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      width: 2px;
      height: 100%;
      background-color: #D4D4D4;
      vertical-align: top; }
    .company.about.dn .crafts-area .inner::before {
      left: 659px; }
  .company.about.dn .crafts-area .tit {
    position: absolute;
    top: 120px;
    left: 0;
    opacity: 0;
    transform: translateX(50px);
    transition: all .4s ease-in-out; }
  .company.about.dn .crafts-area ol {
    padding: 2px 0 0 550px; }
  .company.about.dn .crafts-area li {
    padding: 0 0 88px 200px;
    opacity: 0;
    transform: translateY(100px);
    transition: all .4s ease-in-out .2s;
    position: relative; }
    .company.about.dn .crafts-area li:nth-of-type(2) {
      transition-delay: .4s; }
    .company.about.dn .crafts-area li:nth-of-type(3) {
      transition-delay: .6s; }
    .company.about.dn .crafts-area li:nth-of-type(4) {
      transition-delay: .8s; }
    .company.about.dn .crafts-area li::before {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      width: 20px;
      height: 20px;
      background-color: #0B50F2;
      vertical-align: top; }
    .company.about.dn .crafts-area li::before {
      top: 18px;
      left: 100px;
      border-radius: 50%; }
    .company.about.dn .crafts-area li em {
      position: absolute;
      top: 0;
      left: 0;
      color: #0B50F2;
      font-family: "Poppins";
      font-size: 48px;
      font-weight: 600;
      line-height: 56px; }
    .company.about.dn .crafts-area li strong {
      padding-top: 5px;
      display: block;
      font-size: 28px;
      font-weight: 700;
      line-height: 40px; }
    .company.about.dn .crafts-area li p {
      margin-top: 24px;
      font-size: 16px;
      font-weight: 500;
      line-height: 24px; }
  .company.about.dn .crafts-area.active .tit {
    opacity: 1;
    transform: translateX(0); }
  .company.about.dn .crafts-area.active li {
    opacity: 1;
    transform: translateY(0); }
.company.about.dn .role-area {
  position: relative;
  height: 632px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_dn_role.jpg") center top no-repeat;
  overflow: hidden;
  transform: scale(0.6);
  transition: transform .6s ease-in-out; }
  .company.about.dn .role-area .video {
    position: relative;
    position: absolute;
    top: 0;
    left: calc((100% - 1920px) / 2);
    width: 1920px;
    height: 632px;
    overflow: hidden;
    opacity: 0;
    transition: opacity .6s ease-in-out .6s; }
    .company.about.dn .role-area .video::after {
      position: absolute;
      top: 0;
      left: auto;
      right: 0;
      content: '';
      width: 100%;
      height: 100%;
      background-color: #111111;
      vertical-align: top; }
    .company.about.dn .role-area .video::after {
      opacity: .3; }
    .company.about.dn .role-area .video video {
      width: 100%; }
  .company.about.dn .role-area .inner {
    padding: 228px 0 0 545px; }
  .company.about.dn .role-area .tit {
    position: absolute;
    top: 120px;
    left: 0;
    color: #FFFFFF;
    font-family: "Poppins";
    font-size: 64px;
    font-weight: 600;
    line-height: 76px;
    opacity: 0;
    transform: translateX(50px);
    transition: all .4s ease-in-out .4s; }
  .company.about.dn .role-area strong {
    display: block;
    color: #FFFFFF;
    font-size: 28px;
    font-weight: 700;
    line-height: 40px;
    opacity: 0;
    transform: translateX(50px);
    transition: all .4s ease-in-out .6s; }
  .company.about.dn .role-area p {
    margin-top: 20px;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
    opacity: 0;
    transform: translateX(50px);
    transition: all .4s ease-in-out .8s; }
  .company.about.dn .role-area.active {
    transform: scale(1); }
    .company.about.dn .role-area.active .video {
      opacity: 1; }
    .company.about.dn .role-area.active .tit {
      opacity: 1;
      transform: translateX(0); }
    .company.about.dn .role-area.active strong {
      opacity: 1;
      transform: translateX(0); }
    .company.about.dn .role-area.active p {
      opacity: 1;
      transform: translateX(0); }
.company.about.dn .business-area {
  padding-top: 120px; }
  .company.about.dn .business-area .tit {
    text-align: center;
    opacity: 0;
    transform: translateY(50px);
    transition: all .4s ease-in-out; }
  .company.about.dn .business-area .tabs.slide {
    padding-top: 60px;
    opacity: 0;
    transform: translateY(50px);
    transition: all .4s ease-in-out .2s; }
    .company.about.dn .business-area .tabs.slide .swiper::before {
      display: none; }
    .company.about.dn .business-area .tabs.slide .swiper .swiper-wrapper {
      justify-content: center; }
    .company.about.dn .business-area .tabs.slide .swiper .swiper-slide a {
      margin: 0 8px;
      padding: 8px 20px;
      color: #444444;
      font-weight: 500;
      line-height: 24px;
      background-color: #F4F4F4;
      border: 1px solid #D4D4D4;
      border-radius: 90px; }
      .company.about.dn .business-area .tabs.slide .swiper .swiper-slide a.active {
        color: #FFFFFF;
        font-weight: 700;
        border: 0;
        background-color: #0B50F2; }
  .company.about.dn .business-area .list > ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: -28px; }
    .company.about.dn .business-area .list > ul > li {
      margin-top: 28px;
      width: 408px; }
      .company.about.dn .business-area .list > ul > li .flip-box {
        width: 100%;
        height: 340px;
        perspective: 1000px; }
        .company.about.dn .business-area .list > ul > li .flip-box .flip {
          position: relative;
          width: 100%;
          height: 100%;
          transform-style: preserve-3d;
          transform: rotateY(0deg);
          transition: .5s; }
        .company.about.dn .business-area .list > ul > li .flip-box.active .flip {
          transform: rotateY(-180deg); }
        .company.about.dn .business-area .list > ul > li .flip-box .front,
        .company.about.dn .business-area .list > ul > li .flip-box .back {
          position: absolute;
          width: 100%;
          height: 100%;
          backface-visibility: hidden; }
        .company.about.dn .business-area .list > ul > li .flip-box .front .btn-more {
          position: absolute;
          top: 32px;
          left: auto;
          right: 24px;
          z-index: 1; }
          .company.about.dn .business-area .list > ul > li .flip-box .front .btn-more::after {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
            display: inline-block;
            background-position: 0 -150px;
            background-repeat: no-repeat;
            content: '';
            width: 50px;
            height: 50px; }
          .company.about.dn .business-area .list > ul > li .flip-box .front .btn-more::after {
            z-index: 4; }
          .company.about.dn .business-area .list > ul > li .flip-box .front .btn-more .icon-ripple {
            width: 32px;
            height: 32px; }
            .company.about.dn .business-area .list > ul > li .flip-box .front .btn-more .icon-ripple::before {
              width: 44px;
              height: 44px; }
        .company.about.dn .business-area .list > ul > li .flip-box .front figure {
          position: relative; }
          .company.about.dn .business-area .list > ul > li .flip-box .front figure::before {
            position: absolute;
            top: 0;
            left: 0;
            content: '';
            width: 100%;
            height: 100%;
            background: linear-gradient(210deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.3) 55.33%, rgba(11, 80, 242, 0.4) 100%); }
        .company.about.dn .business-area .list > ul > li .flip-box .front .info {
          position: absolute;
          top: auto;
          left: 32px;
          right: 32px;
          bottom: 32px;
          color: #FFFFFF; }
          .company.about.dn .business-area .list > ul > li .flip-box .front .info p {
            margin-top: 12px;
            line-height: 24px;
            font-weight: 500; }
        .company.about.dn .business-area .list > ul > li .flip-box .back {
          background-color: #1142B6;
          transform: rotateY(180deg); }
          .company.about.dn .business-area .list > ul > li .flip-box .back .btn-close {
            position: absolute;
            top: 28px;
            left: auto;
            right: 28px;
            width: 32px;
            height: 32px;
            border-radius: 32px;
            background-color: #0B50F2; }
            .company.about.dn .business-area .list > ul > li .flip-box .back .btn-close::after {
              position: absolute;
              top: 50%;
              left: 50%;
              transform: translate(-50%, -50%);
              background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
              display: inline-block;
              background-position: -50px -150px;
              background-repeat: no-repeat;
              content: '';
              width: 50px;
              height: 50px; }
          .company.about.dn .business-area .list > ul > li .flip-box .back .info {
            padding: 32px;
            height: 100%;
            color: #FFFFFF;
            background: linear-gradient(210deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.25) 55.33%, rgba(11, 80, 242, 0.4) 100%); }
            .company.about.dn .business-area .list > ul > li .flip-box .back .info > strong {
              line-height: 32px;
              font-size: 24px; }
            .company.about.dn .business-area .list > ul > li .flip-box .back .info > ul {
              margin-top: 36px;
              display: flex; }
              .company.about.dn .business-area .list > ul > li .flip-box .back .info > ul > li + li {
                margin-left: 40px; }
              .company.about.dn .business-area .list > ul > li .flip-box .back .info > ul > li strong {
                line-height: 28px;
                font-size: 18px; }
                .company.about.dn .business-area .list > ul > li .flip-box .back .info > ul > li strong + ul {
                  margin-top: 10px; }
              .company.about.dn .business-area .list > ul > li .flip-box .back .info > ul > li ul li {
                line-height: 32px;
                color: #D4D4D4; }
  .company.about.dn .business-area #tabArea .list > ul li {
    width: 626px; }
  .company.about.dn .business-area .tab-contents {
    margin-top: 60px; }
    .company.about.dn .business-area .tab-contents .list > ul > li {
      opacity: 0;
      transform: translateY(50px);
      transition: all .4s ease-in-out .5s; }
      .company.about.dn .business-area .tab-contents .list > ul > li:nth-of-type(2) {
        transition-delay: .6s; }
      .company.about.dn .business-area .tab-contents .list > ul > li:nth-of-type(3) {
        transition-delay: .7s; }
      .company.about.dn .business-area .tab-contents .list > ul > li:nth-of-type(4) {
        transition-delay: .8s; }
      .company.about.dn .business-area .tab-contents .list > ul > li:nth-of-type(5) {
        transition-delay: .9s; }
      .company.about.dn .business-area .tab-contents .list > ul > li:nth-of-type(6) {
        transition-delay: 1s; }
  .company.about.dn .business-area.active .tit {
    opacity: 1;
    transform: translateY(0); }
  .company.about.dn .business-area.active .tabs.slide {
    opacity: 1;
    transform: translateY(0); }
  .company.about.dn .business-area.active .tab-contents .list > ul > li {
    opacity: 1;
    transform: translateY(0); }
.company.about.dn .network-area {
  margin-top: 120px; }
  .company.about.dn .network-area h3.tit {
    text-align: center;
    font-family: "Poppins";
    font-weight: 600;
    line-height: 56px;
    opacity: 0;
    transform: translateY(50px);
    transition: all .4s ease-in-out; }
    .company.about.dn .network-area h3.tit p {
      padding-top: 20px;
      font-family: "Pretendard";
      font-size: 20px;
      font-weight: 500;
      line-height: 32px; }
  .company.about.dn .network-area .networkmap {
    margin-top: 60px;
    padding: 80px 0;
    background-color: rgba(11, 80, 242, 0.17); }
    .company.about.dn .network-area .networkmap .inner {
      height: 632px;
      background: url("https://www.dn-solutions.com/resources/w/images/company/about_dn_network.png") center top no-repeat; }
    .company.about.dn .network-area .networkmap .icon-ripple {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      font-size: 13px;
      font-weight: 600; }
      .company.about.dn .network-area .networkmap .icon-ripple em {
        color: #FFFFFF;
        font-family: "Poppins";
        z-index: 5; }
      .company.about.dn .network-area .networkmap .icon-ripple::before {
        width: 160%;
        height: 160%; }
      .company.about.dn .network-area .networkmap .icon-ripple::after {
        width: 233%;
        height: 233%; }
    .company.about.dn .network-area .networkmap span {
      display: inline-block;
      margin-left: 32px;
      padding: 6px 12px;
      color: #FFFFFF;
      font-family: "Poppins";
      font-size: 13px;
      font-weight: 600;
      line-height: 18px;
      border-radius: 50px;
      background-color: #0B50F2;
      position: relative; }
      .company.about.dn .network-area .networkmap span::before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: 32px;
        height: 2px;
        background-color: #0B50F2;
        vertical-align: top; }
      .company.about.dn .network-area .networkmap span::before {
        top: 14px;
        left: -32px; }
    .company.about.dn .network-area .networkmap ul {
      position: relative; }
    .company.about.dn .network-area .networkmap li {
      position: absolute;
      top: 0;
      left: 0;
      display: flex;
      align-items: center;
      opacity: 0;
      transform: scale(0.5);
      transition: all .4s ease-in-out; }
      .company.about.dn .network-area .networkmap li:nth-of-type(1) {
        top: 236px;
        left: 195px;
        transition-delay: .6s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(1) .icon-ripple {
          width: 34px;
          height: 34px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(1) .icon-ripple::before {
            animation-delay: 1.5s; }
          .company.about.dn .network-area .networkmap li:nth-of-type(1) .icon-ripple::after {
            animation-delay: 1.5s; }
      .company.about.dn .network-area .networkmap li:nth-of-type(2) {
        top: 447px;
        left: 386px;
        transition-delay: .2s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(2) .icon-ripple {
          width: 25px;
          height: 25px; }
        .company.about.dn .network-area .networkmap li:nth-of-type(2) span {
          margin-left: 24px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(2) span::before {
            left: -24px;
            width: 24px; }
      .company.about.dn .network-area .networkmap li:nth-of-type(3) {
        top: 146px;
        left: 693px;
        transition-delay: .8s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(3) .icon-ripple {
          width: 43px;
          height: 43px;
          font-size: 28px;
          font-weight: 500; }
          .company.about.dn .network-area .networkmap li:nth-of-type(3) .icon-ripple::before {
            animation-delay: .7s; }
          .company.about.dn .network-area .networkmap li:nth-of-type(3) .icon-ripple::after {
            animation-delay: .7s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(3) span {
          margin-left: 44px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(3) span::before {
            left: -44px;
            width: 44px; }
      .company.about.dn .network-area .networkmap li:nth-of-type(4) {
        top: 263px;
        left: 742px;
        transition-delay: .3s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(4) .icon-ripple {
          width: 21px;
          height: 21px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(4) .icon-ripple::before {
            animation-delay: .1s; }
          .company.about.dn .network-area .networkmap li:nth-of-type(4) .icon-ripple::after {
            animation-delay: .1s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(4) span {
          margin-left: 24px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(4) span::before {
            left: -24px;
            width: 24px; }
      .company.about.dn .network-area .networkmap li:nth-of-type(5) {
        top: 315px;
        left: 581px;
        transition-delay: .2s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(5) .icon-ripple {
          width: 21px;
          height: 21px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(5) .icon-ripple::before {
            animation-delay: .6s; }
          .company.about.dn .network-area .networkmap li:nth-of-type(5) .icon-ripple::after {
            animation-delay: .6s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(5) span {
          margin-left: 24px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(5) span::before {
            left: -24px;
            width: 24px; }
      .company.about.dn .network-area .networkmap li:nth-of-type(6) {
        top: 445px;
        left: 681px;
        transition-delay: .5s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(6) .icon-ripple {
          width: 21px;
          height: 21px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(6) .icon-ripple::before {
            animation-delay: 1.2s; }
          .company.about.dn .network-area .networkmap li:nth-of-type(6) .icon-ripple::after {
            animation-delay: 1.2s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(6) span {
          margin-left: 24px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(6) span::before {
            left: -24px;
            width: 24px; }
      .company.about.dn .network-area .networkmap li:nth-of-type(7) {
        top: 133px;
        left: 930px;
        transition-delay: .7s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(7) .icon-ripple {
          width: 51px;
          height: 51px;
          font-size: 28px;
          font-weight: 500; }
          .company.about.dn .network-area .networkmap li:nth-of-type(7) .icon-ripple::before {
            animation-delay: .3s; }
          .company.about.dn .network-area .networkmap li:nth-of-type(7) .icon-ripple::after {
            animation-delay: .3s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(7) span {
          margin-left: 54px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(7) span::before {
            left: -54px;
            width: 54px; }
      .company.about.dn .network-area .networkmap li:nth-of-type(8) {
        top: 242px;
        left: 1020px;
        transition-delay: .9s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(8) .icon-ripple {
          width: 43px;
          height: 43px;
          font-size: 28px;
          font-weight: 500; }
          .company.about.dn .network-area .networkmap li:nth-of-type(8) .icon-ripple::before {
            animation-delay: 1.2s; }
          .company.about.dn .network-area .networkmap li:nth-of-type(8) .icon-ripple::after {
            animation-delay: 1.2s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(8) span {
          margin-left: 44px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(8) span::before {
            left: -44px;
            width: 44px; }
      .company.about.dn .network-area .networkmap li:nth-of-type(9) {
        top: 352px;
        left: 965px;
        transition-delay: .4s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(9) .icon-ripple {
          width: 34px;
          height: 34px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(9) .icon-ripple::before {
            animation-delay: .8s; }
          .company.about.dn .network-area .networkmap li:nth-of-type(9) .icon-ripple::after {
            animation-delay: .8s; }
      .company.about.dn .network-area .networkmap li:nth-of-type(10) {
        top: 480px;
        left: 1056px;
        transition-delay: .1s; }
        .company.about.dn .network-area .networkmap li:nth-of-type(10) .icon-ripple {
          width: 21px;
          height: 21px; }
        .company.about.dn .network-area .networkmap li:nth-of-type(10) span {
          margin-left: 24px; }
          .company.about.dn .network-area .networkmap li:nth-of-type(10) span::before {
            left: -24px;
            width: 24px; }
  .company.about.dn .network-area .networktxt {
    padding: 30px 0;
    background-color: rgba(11, 80, 242, 0.079); }
    .company.about.dn .network-area .networktxt .inner {
      position: relative; }
      .company.about.dn .network-area .networktxt .inner > ul {
        display: flex; }
        .company.about.dn .network-area .networktxt .inner > ul > li {
          display: flex;
          padding: 10px 0 5px;
          width: 50%; }
      .company.about.dn .network-area .networktxt .inner::before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: 2px;
        height: 140px;
        background-color: #0B50F2;
        vertical-align: top; }
      .company.about.dn .network-area .networktxt .inner::before {
        left: 50%;
        opacity: 0.079; }
    .company.about.dn .network-area .networktxt .tit {
      padding-left: 100px;
      width: 220px;
      line-height: 32px;
      font-family: "Pretendard";
      font-weight: 700;
      text-align: center; }
    .company.about.dn .network-area .networktxt .guidetxt {
      margin: 5px 0; }
  .company.about.dn .network-area.active .tit {
    opacity: 1;
    transform: translateY(0); }
  .company.about.dn .network-area.active .networkmap li {
    opacity: 1;
    transform: scale(1); }
.company.about.dn .pr-area {
  margin-top: 120px; }
  .company.about.dn .pr-area .tit {
    text-align: center; }
    .company.about.dn .pr-area .tit p {
      margin-top: 20px;
      font-size: 20px;
      font-weight: 500;
      line-height: 32px; }
  .company.about.dn .pr-area .video {
    margin-top: 60px; }
    .company.about.dn .pr-area .video a {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 694px;
      text-align: center;
      background-color: #010002; }
      .company.about.dn .pr-area .video a::after {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
        display: inline-block;
        background-position: 0 -50px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
      .company.about.dn .pr-area .video a::after {
        width: 60px;
        height: 60px; }
.company.about.dn .brochure-area {
  margin-top: 120px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 200px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_dn_brochure.jpg") center top no-repeat; }
  .company.about.dn .brochure-area .tit {
    padding-left: 170px;
    color: #FFFFFF; }
    .company.about.dn .brochure-area .tit::before {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
      display: inline-block;
      background-position: 0 0;
      background-repeat: no-repeat;
      content: '';
      width: 50px;
      height: 50px; }
    .company.about.dn .brochure-area .tit::before {
      top: 70px;
      left: 80px;
      transform: translate(0, 0);
      height: 56px;
      background-image: url("https://www.dn-solutions.com/resources/w/images/company/company.png"); }
    .company.about.dn .brochure-area .tit p {
      margin-top: 16px;
      font-size: 18px;
      font-weight: 500;
      line-height: 26px; }
  .company.about.dn .brochure-area .btn-download {
    margin-right: 80px;
    padding: 0 45px 0 59px;
    height: 56px;
    font-size: 16px;
    font-weight: 700;
    line-height: 52px;
    color: #FFFFFF;
    border: 2px solid #FFFFFF;
    border-radius: 39px;
    background-color: transparent; }
    .company.about.dn .brochure-area .btn-download .icon-download::after {
      margin-top: 2px;
      background-position: -200px -200px; }
.company.about.dn .ourproducts-area {
  margin-top: 120px;
  padding: 120px 0;
  height: 1800px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_dn_ourproducts_bg.jpg") center top no-repeat;
  overflow: hidden; }
  .company.about.dn .ourproducts-area h3.tit {
    color: #FFFFFF;
    font-family: "Poppins";
    font-size: 64px;
    font-weight: 600;
    line-height: 76px;
    text-align: center;
    opacity: 0;
    transform: translateY(50px);
    transition: all .4s ease-in-out; }
    .company.about.dn .ourproducts-area h3.tit p {
      margin-top: 24px;
      font-family: "Pretendard";
      font-size: 20px;
      font-weight: 500;
      line-height: 32px; }
  .company.about.dn .ourproducts-area .list {
    position: relative;
    margin-top: 80px;
    opacity: 0;
    transform: translateX(200px);
    transition: all .8s ease-in-out .2s; }
    .company.about.dn .ourproducts-area .list:first-of-type {
      margin-top: 60px; }
  .company.about.dn .ourproducts-area h4.tit {
    font-size: 36px;
    line-height: 56px;
    color: #FFFFFF; }
  .company.about.dn .ourproducts-area .btn-view {
    position: absolute;
    top: 0;
    left: auto;
    right: 0;
    width: 200px;
    height: 56px;
    line-height: 56px;
    font-weight: 700;
    color: #FFFFFF;
    border-radius: 39px;
    border-color: #D4D4D4;
    background-color: transparent; }
  .company.about.dn .ourproducts-area .outside-swiper {
    margin-top: 40px; }
    .company.about.dn .ourproducts-area .outside-swiper .list-thumb ul li {
      margin-left: 28px; }
      .company.about.dn .ourproducts-area .outside-swiper .list-thumb ul li:first-of-type {
        margin-left: 0; }
      .company.about.dn .ourproducts-area .outside-swiper .list-thumb ul li a figure {
        border: 0;
        border: 1px solid rgba(255, 255, 255, 0.12);
        height: 408px; }
      .company.about.dn .ourproducts-area .outside-swiper .list-thumb ul li a .info {
        margin-top: 24px; }
        .company.about.dn .ourproducts-area .outside-swiper .list-thumb ul li a .info .tit {
          height: auto;
          overflow: auto;
          font-size: 24px;
          font-weight: 700;
          color: #FFFFFF;
          line-height: 36px; }
        .company.about.dn .ourproducts-area .outside-swiper .list-thumb ul li a .info p {
          margin-top: 12px;
          font-size: 14px;
          font-weight: 400;
          line-height: 20px;
          color: #FFFFFF; }
  .company.about.dn .ourproducts-area.active h3.tit {
    opacity: 1;
    transform: translateY(0); }
  .company.about.dn .ourproducts-area.active .list {
    opacity: 1;
    transform: translateX(0); }
.company.about.whyus#contents {
  padding-bottom: 0; }
.company.about.whyus .subvisual-area {
  height: 480px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_whyus_visual.jpg") center top no-repeat; }
  .company.about.whyus .subvisual-area .inner {
    color: #FFFFFF;
    font-size: 28px;
    font-weight: 500;
    line-height: 44px; }
    .company.about.whyus .subvisual-area .inner strong {
      padding-bottom: 40px;
      display: block;
      font-size: 64px;
      font-weight: 700;
      line-height: 80px; }
.company.about.whyus .customer-area {
  margin-top: 120px; }
  .company.about.whyus .customer-area .tit {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 64px;
    font-weight: 700;
    line-height: 80px;
    opacity: 0;
    transform: translateX(-50px);
    transition: all .4s ease-in-out; }
  .company.about.whyus .customer-area p {
    padding: 0 0 0 545px;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    opacity: 0;
    transform: translateX(50px);
    transition: all .4s ease-in-out; }
    .company.about.whyus .customer-area p > strong {
      display: block;
      padding-bottom: 24px;
      font-weight: 700; }
  .company.about.whyus .customer-area ul {
    margin-top: 120px;
    display: flex; }
  .company.about.whyus .customer-area li {
    position: relative;
    margin-left: 38px;
    padding: 160px 40px 38px 40px;
    width: 398px;
    border: 1px solid #D4D4D4;
    opacity: 0;
    transform: translateY(50px);
    transition: all .4s ease-in-out .2s; }
    .company.about.whyus .customer-area li:first-of-type {
      margin-left: 0; }
    .company.about.whyus .customer-area li::before {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
      display: inline-block;
      background-position: -50px 0;
      background-repeat: no-repeat;
      content: '';
      width: 50px;
      height: 50px; }
    .company.about.whyus .customer-area li::before {
      top: 40px;
      left: 40px;
      transform: translate(0, 0);
      width: 60px;
      height: 60px;
      background-image: url("https://www.dn-solutions.com/resources/w/images/company/company.png"); }
    .company.about.whyus .customer-area li:nth-of-type(2) {
      transition-delay: .4s; }
      .company.about.whyus .customer-area li:nth-of-type(2)::before {
        background-position: -150px 0; }
    .company.about.whyus .customer-area li:nth-of-type(3) {
      transition-delay: .6s; }
      .company.about.whyus .customer-area li:nth-of-type(3)::before {
        width: 55px;
        background-position: -250px 0; }
    .company.about.whyus .customer-area li small {
      display: block;
      color: #0B50F2;
      font-size: 18px;
      font-weight: 500;
      line-height: 26px; }
    .company.about.whyus .customer-area li strong {
      margin-top: 8px;
      display: block;
      font-size: 32px;
      font-weight: 700;
      line-height: 48px; }
  .company.about.whyus .customer-area.active .tit {
    opacity: 1;
    transform: translateX(0); }
  .company.about.whyus .customer-area.active p {
    opacity: 1;
    transform: translateX(0); }
  .company.about.whyus .customer-area.active li {
    opacity: 1;
    transform: translateY(0); }
.company.about.whyus .lineup-area {
  margin-top: 120px;
  padding: 80px 0;
  background-color: #F8F8F8;
  overflow: hidden; }
  .company.about.whyus .lineup-area .propic-swiper {
    width: 1408px;
    opacity: 0;
    transform: translateY(100px);
    transition: all .4s ease-in-out; }
    .company.about.whyus .lineup-area .propic-swiper .swiper-slide {
      min-height: 764px; }
    .company.about.whyus .lineup-area .propic-swiper .info small {
      margin-top: 60px;
      display: block;
      font-family: "Poppins";
      font-size: 28px;
      font-weight: 500;
      line-height: 40px; }
    .company.about.whyus .lineup-area .propic-swiper .info strong {
      display: block;
      margin-top: 24px;
      font-size: 48px;
      font-weight: 700;
      line-height: 60px; }
    .company.about.whyus .lineup-area .propic-swiper .info p {
      margin-top: 40px;
      width: 440px;
      font-size: 18px;
      font-weight: 400;
      line-height: 26px; }
    .company.about.whyus .lineup-area .propic-swiper figure {
      position: absolute;
      top: 0;
      left: auto;
      right: 0;
      background-color: #F8F8F8; }
      .company.about.whyus .lineup-area .propic-swiper figure img {
        mix-blend-mode: multiply; }
    .company.about.whyus .lineup-area .propic-swiper .swiper-button-prev {
      top: 362px;
      left: 0;
      width: 40px;
      height: 40px;
      border: 1px solid #D4D4D4; }
      .company.about.whyus .lineup-area .propic-swiper .swiper-button-prev::after {
        background-position: -400px -100px; }
    .company.about.whyus .lineup-area .propic-swiper .swiper-button-next {
      top: 362px;
      right: auto;
      left: 64px;
      width: 40px;
      height: 40px;
      border: 1px solid #D4D4D4; }
      .company.about.whyus .lineup-area .propic-swiper .swiper-button-next::after {
        background-position: -400px -100px; }
  .company.about.whyus .lineup-area.active .propic-swiper {
    opacity: 1;
    transform: translateX(0); }
.company.about.whyus .history-area {
  padding: 120px 0; }
  .company.about.whyus .history-area .tit {
    font-size: 40px;
    font-weight: 700;
    line-height: 60px;
    opacity: 0;
    transform: translateX(50px);
    transition: all .4s ease-in-out; }
  .company.about.whyus .history-area .history-swiper {
    margin-top: 32px; }
    .company.about.whyus .history-area .history-swiper .swiper-wrapper {
      display: flex; }
    .company.about.whyus .history-area .history-swiper .swiper-slide {
      margin-left: 28px;
      width: 299px;
      height: 400px;
      opacity: 0;
      transform: translateY(100px);
      transition: all .6s ease-in-out .2s; }
      .company.about.whyus .history-area .history-swiper .swiper-slide:nth-of-type(1) {
        margin-left: 0; }
        .company.about.whyus .history-area .history-swiper .swiper-slide:nth-of-type(1) .info {
          background-image: url("https://www.dn-solutions.com/resources/w/images/company/about_whyus_history1.png"); }
      .company.about.whyus .history-area .history-swiper .swiper-slide:nth-of-type(2) {
        transition-delay: .3s; }
        .company.about.whyus .history-area .history-swiper .swiper-slide:nth-of-type(2) .info {
          background-image: url("https://www.dn-solutions.com/resources/w/images/company/about_whyus_history2.png"); }
      .company.about.whyus .history-area .history-swiper .swiper-slide:nth-of-type(3) {
        transition-delay: .4s; }
        .company.about.whyus .history-area .history-swiper .swiper-slide:nth-of-type(3) .info {
          background-image: url("https://www.dn-solutions.com/resources/w/images/company/about_whyus_history3.png"); }
      .company.about.whyus .history-area .history-swiper .swiper-slide:nth-of-type(4) {
        transition-delay: .5s; }
        .company.about.whyus .history-area .history-swiper .swiper-slide:nth-of-type(4) .info {
          background-image: url("https://www.dn-solutions.com/resources/w/images/company/about_whyus_history4.png"); }
      .company.about.whyus .history-area .history-swiper .swiper-slide .info {
        padding: 32px 20px 0 28px;
        height: 100%;
        background: #F8F8F8 url("https://www.dn-solutions.com/resources/w/images/company/about_whyus_history1.png") 100% 100% no-repeat; }
      .company.about.whyus .history-area .history-swiper .swiper-slide em {
        color: #0B50F2;
        font-size: 16px;
        font-weight: 700;
        line-height: 24px; }
      .company.about.whyus .history-area .history-swiper .swiper-slide strong {
        display: block;
        margin-top: 12px;
        font-size: 16px;
        font-weight: 500;
        line-height: 24px; }
      .company.about.whyus .history-area .history-swiper .swiper-slide small {
        display: block;
        margin-top: 8px;
        color: #767676;
        font-size: 14px;
        font-weight: 400;
        line-height: 20px; }
  .company.about.whyus .history-area.active .tit {
    opacity: 1;
    transform: translateX(0); }
  .company.about.whyus .history-area.active .history-swiper .swiper-slide {
    opacity: 1;
    transform: translateY(0); }
.company.about.whyus .trust-area {
  height: 200px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_whyus_trust.jpg") center top no-repeat;
  opacity: 0;
  transform: translateY(50px);
  transition: all .4s ease-in-out; }
  .company.about.whyus .trust-area .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 200px; }
  .company.about.whyus .trust-area .tit {
    color: #FFFFFF; }
    .company.about.whyus .trust-area .tit p {
      margin-top: 16px;
      font-size: 16px;
      font-weight: 400;
      line-height: 24px; }
  .company.about.whyus .trust-area .btn-view {
    width: 200px; }
  .company.about.whyus .trust-area.active {
    opacity: 1;
    transform: translateY(0); }
.company.about.whyus .customerproduct-area {
  padding: 120px 0;
  overflow: hidden; }
  .company.about.whyus .customerproduct-area .inner {
    padding-top: 40px;
    height: 408px; }
  .company.about.whyus .customerproduct-area h3.tit {
    font-size: 40px;
    opacity: 0;
    transform: translateX(-50px);
    transition: all .4s ease-in-out; }
  .company.about.whyus .customerproduct-area .btns-swiper {
    display: inline-flex;
    justify-content: space-between;
    margin-top: 156px;
    width: 104px; }
    .company.about.whyus .customerproduct-area .btns-swiper .swiper-button-prev,
    .company.about.whyus .customerproduct-area .btns-swiper .swiper-button-next {
      position: relative;
      left: auto;
      right: auto;
      width: 40px;
      height: 40px;
      border: 1px solid #D9D9D9; }
      .company.about.whyus .customerproduct-area .btns-swiper .swiper-button-prev::after,
      .company.about.whyus .customerproduct-area .btns-swiper .swiper-button-next::after {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
        display: inline-block;
        background-position: -400px -100px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
    .company.about.whyus .customerproduct-area .btns-swiper .swiper-button-prev::after {
      transform: translate(-50%, -50%) rotate(180deg); }
  .company.about.whyus .customerproduct-area .customerproduct-swiper {
    position: absolute;
    top: 0;
    left: 543px;
    width: calc((100vw - 1280px) / 2 + 735px);
    overflow: hidden;
    opacity: 0;
    transform: translateX(100px);
    transition: all .6s ease-in-out; }
    .company.about.whyus .customerproduct-area .customerproduct-swiper .swiper-slide a figure {
      padding: 45px 0;
      height: 320px; }
      .company.about.whyus .customerproduct-area .customerproduct-swiper .swiper-slide a figure img {
        width: 100%;
        max-width: 100%;
        height: auto; }
      .company.about.whyus .customerproduct-area .customerproduct-swiper .swiper-slide a figure .btn-detail {
        position: absolute;
        top: auto;
        left: 50%;
        right: auto;
        bottom: 32px;
        width: 124px;
        transform: translateX(-50%); }
    .company.about.whyus .customerproduct-area .customerproduct-swiper .swiper-slide .info {
      margin-top: 16px;
      padding: 0 10px; }
      .company.about.whyus .customerproduct-area .customerproduct-swiper .swiper-slide .info .tit {
        height: 88px;
        line-height: 44px;
        color: #111111;
        font-size: 28px;
        font-weight: 700; }
  .company.about.whyus .customerproduct-area.active h3.tit {
    opacity: 1;
    transform: translateX(0); }
  .company.about.whyus .customerproduct-area.active .customerproduct-swiper {
    opacity: 1;
    transform: translateX(0); }
.company.about.whyus .action-area {
  height: 722px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_whyus_action.jpg") center top no-repeat; }
  .company.about.whyus .action-area .inner {
    padding-top: 120px; }
  .company.about.whyus .action-area .tit {
    color: #FFFFFF;
    font-size: 40px;
    opacity: 0;
    transform: translateY(50px);
    transition: all .4s ease-in-out; }
    .company.about.whyus .action-area .tit p {
      margin-top: 8px;
      font-size: 24px;
      font-weight: 400;
      line-height: 36px; }
  .company.about.whyus .action-area ol {
    margin-top: 100px;
    display: flex; }
    .company.about.whyus .action-area ol li {
      position: relative;
      padding: 108px 38px 0 0;
      width: 260px;
      color: #FFFFFF;
      opacity: 0;
      transform: translateX(-50px);
      transition: all .6s ease-in-out .2s; }
      .company.about.whyus .action-area ol li::before {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
        display: inline-block;
        background-position: 0 -100px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
      .company.about.whyus .action-area ol li::before {
        top: 0;
        left: 0;
        transform: translate(0, 0);
        width: 60px;
        height: 60px;
        background-image: url("https://www.dn-solutions.com/resources/w/images/company/company.png"); }
      .company.about.whyus .action-area ol li::after {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
        display: inline-block;
        background-position: 0 -200px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
      .company.about.whyus .action-area ol li::after {
        top: 26px;
        left: 96px;
        transform: translate(0, 0);
        width: 121px;
        height: 10px;
        background-image: url("https://www.dn-solutions.com/resources/w/images/company/company.png"); }
      .company.about.whyus .action-area ol li:nth-of-type(2) {
        transition-delay: .3s; }
        .company.about.whyus .action-area ol li:nth-of-type(2)::before {
          background-position: -100px -100px; }
      .company.about.whyus .action-area ol li:nth-of-type(3) {
        transition-delay: .4s; }
        .company.about.whyus .action-area ol li:nth-of-type(3)::before {
          background-position: -200px -100px; }
      .company.about.whyus .action-area ol li:nth-of-type(4) {
        transition-delay: .5s; }
        .company.about.whyus .action-area ol li:nth-of-type(4)::before {
          background-position: -300px -100px; }
      .company.about.whyus .action-area ol li:nth-of-type(5) {
        transition-delay: .6s; }
        .company.about.whyus .action-area ol li:nth-of-type(5)::before {
          background-position: -400px -100px; }
      .company.about.whyus .action-area ol li:last-child::after {
        display: none; }
      .company.about.whyus .action-area ol li em {
        display: block;
        font-size: 24px;
        font-weight: 700;
        line-height: 36px; }
      .company.about.whyus .action-area ol li strong {
        display: block;
        margin-top: 12px;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px; }
  .company.about.whyus .action-area.active .tit {
    opacity: 1;
    transform: translateY(0); }
  .company.about.whyus .action-area.active ol li {
    opacity: 1;
    transform: translateX(0); }
.company.about.whydn#contents {
  padding-bottom: 0; }
.company.about.whydn .subvisual-area {
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_whydn_visual.jpg") center top no-repeat; }
  .company.about.whydn .subvisual-area .inner {
    line-height: 40px;
    color: #FFFFFF;
    font-size: 28px;
    font-weight: 700;
    text-align: center; }
    .company.about.whydn .subvisual-area .inner strong {
      display: block;
      padding-bottom: 20px;
      line-height: 120px;
      font-size: 100px;
      font-weight: 700; }
.company.about.whydn .industry-area {
  margin-top: 120px; }
  .company.about.whydn .industry-area .tit {
    font-size: 48px;
    font-weight: 700;
    line-height: 60px;
    text-align: center;
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out; }
  .company.about.whydn .industry-area .txt-sub {
    margin-top: 20px;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
    text-align: center;
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out; }
  .company.about.whydn .industry-area ul {
    margin-top: 60px;
    display: flex; }
  .company.about.whydn .industry-area li {
    margin-left: -80px;
    width: 380px;
    opacity: 0;
    transform: translate(-50px, 0);
    transition: all .6s ease-in-out;
    position: relative;
    position: relative; }
    .company.about.whydn .industry-area li strong {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 380px;
      height: 380px;
      color: #FFFFFF;
      font-size: 24px;
      font-weight: 700;
      line-height: 36px;
      background-color: rgba(11, 80, 242, 0.9);
      box-shadow: 14px 14px 40px 0px rgba(187, 203, 242, 0.2);
      border-radius: 380px;
      text-align: center; }
    .company.about.whydn .industry-area li p {
      padding: 24px 58px 0;
      font-size: 16px;
      font-weight: 500;
      line-height: 24px;
      text-align: center; }
    .company.about.whydn .industry-area li::before {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      width: 2px;
      height: 18px;
      background-color: #FFFFFF;
      vertical-align: top; }
    .company.about.whydn .industry-area li::before {
      top: 175px;
      left: 33px;
      transform: translate(0, 0); }
    .company.about.whydn .industry-area li::after {
      position: absolute;
      top: 0;
      left: auto;
      right: 0;
      content: '';
      width: 18px;
      height: 2px;
      background-color: #FFFFFF;
      vertical-align: top; }
    .company.about.whydn .industry-area li::after {
      top: 183px;
      left: 25px;
      transform: translate(0, 0); }
    .company.about.whydn .industry-area li:first-of-type {
      margin-left: 0; }
      .company.about.whydn .industry-area li:first-of-type::before, .company.about.whydn .industry-area li:first-of-type::after {
        display: none; }
    .company.about.whydn .industry-area li:nth-of-type(2n) strong {
      background-color: rgba(17, 66, 182, 0.9); }
    .company.about.whydn .industry-area li:nth-of-type(1) {
      transition-delay: .3s; }
    .company.about.whydn .industry-area li:nth-of-type(2) {
      transition-delay: .5s; }
    .company.about.whydn .industry-area li:nth-of-type(3) {
      transition-delay: .7s; }
    .company.about.whydn .industry-area li:nth-of-type(4) {
      transition-delay: .9s; }
  .company.about.whydn .industry-area.active .tit, .company.about.whydn .industry-area.active .txt-sub, .company.about.whydn .industry-area.active li {
    opacity: 1;
    transform: translate(0, 0); }
.company.about.whydn .pr-area {
  margin-top: 120px; }
  .company.about.whydn .pr-area .video {
    opacity: 0;
    transform: translate(0, 100px) scale(0.6);
    transition: all .6s ease-in-out; }
    .company.about.whydn .pr-area .video a {
      position: relative;
      display: block; }
      .company.about.whydn .pr-area .video a::after {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
        display: inline-block;
        background-position: 0 -50px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
      .company.about.whydn .pr-area .video a::after {
        width: 60px;
        height: 60px; }
  .company.about.whydn .pr-area.active .video {
    opacity: 1;
    transform: translate(0, 0) scale(1); }
.company.about.whydn .dnshop-area {
  margin-top: 120px;
  height: 768px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_whydn_shop.jpg") center top no-repeat; }
  .company.about.whydn .dnshop-area .inner {
    padding: 120px 0 0 654px; }
  .company.about.whydn .dnshop-area .tit {
    font-size: 48px;
    font-weight: 700;
    line-height: 60px;
    color: #0B50F2;
    opacity: 0;
    transform: translate(50px, 0);
    transition: all .6s ease-in-out; }
    .company.about.whydn .dnshop-area .tit em {
      color: #111111; }
  .company.about.whydn .dnshop-area strong {
    padding-top: 20px;
    display: block;
    font-size: 24px;
    font-weight: 500;
    line-height: 36px;
    opacity: 0;
    transform: translate(50px, 0);
    transition: all .6s ease-in-out .2s; }
  .company.about.whydn .dnshop-area p {
    padding-top: 32px;
    font-size: 16px;
    line-height: 24px;
    opacity: 0;
    transform: translate(50px, 0);
    transition: all .6s ease-in-out .3s; }
  .company.about.whydn .dnshop-area ol {
    margin-top: 20px;
    opacity: 0;
    transform: translate(50px, 0);
    transition: all .6s ease-in-out .4s; }
  .company.about.whydn .dnshop-area li {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px; }
  .company.about.whydn .dnshop-area.active .tit, .company.about.whydn .dnshop-area.active strong, .company.about.whydn .dnshop-area.active p, .company.about.whydn .dnshop-area.active ol {
    opacity: 1;
    transform: translate(0, 0); }
.company.about.whydn .meet-area {
  margin-top: 120px; }
  .company.about.whydn .meet-area .tit {
    font-size: 48px;
    font-weight: 700;
    line-height: 60px;
    text-align: center;
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .6s ease-in-out; }
  .company.about.whydn .meet-area .txt-sub {
    margin-top: 20px;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
    text-align: center;
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .6s ease-in-out; }
  .company.about.whydn .meet-area .shop-swiper .swiper-wrapper {
    flex-wrap: wrap; }
    .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide {
      position: relative;
      margin: 60px 0 0 28px;
      width: 408px;
      opacity: 0;
      transform: translate(0, 100px);
      transition: all .6s ease-in-out .2s; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide figure figcaption {
        margin-top: 24px;
        font-size: 16px;
        font-weight: 500;
        line-height: 24px; }
        .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide figure figcaption strong {
          display: block;
          font-size: 24px;
          line-height: 32px;
          font-weight: 700;
          padding-bottom: 12px; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide figure .cover {
        position: absolute;
        top: 0;
        left: 0;
        padding: 40px;
        height: 408px;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 39.44%, rgba(11, 80, 242, 0.55) 90.2%);
        opacity: 0;
        transition: opacity .4s ease-in-out; }
        .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide figure .cover p {
          text-align: left;
          color: #FFFFFF;
          font-size: 14px;
          font-weight: 400;
          line-height: 20px; }
          .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide figure .cover p strong {
            display: block;
            padding-bottom: 24px;
            font-size: 16px;
            font-weight: 700;
            line-height: 24px; }
        .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide figure .cover .btn {
          position: absolute;
          bottom: 40px; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide:nth-of-type(3n+1) {
        margin-left: 0; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide:hover .cover {
        opacity: 1; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide:nth-of-type(1) {
        transition-delay: .3s; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide:nth-of-type(2) {
        transition-delay: .4s; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide:nth-of-type(3) {
        transition-delay: .5s; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide:nth-of-type(4) {
        transition-delay: .6s; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide:nth-of-type(5) {
        transition-delay: .7s; }
      .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide:nth-of-type(6) {
        transition-delay: .8s; }
  .company.about.whydn .meet-area.active .tit, .company.about.whydn .meet-area.active .txt-sub, .company.about.whydn .meet-area.active .shop-swiper .swiper-wrapper .swiper-slide {
    opacity: 1;
    transform: translate(0, 0); }
.company.about.whydn .story-area {
  margin-top: 120px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_whydn_story.jpg") center top no-repeat; }
  .company.about.whydn .story-area .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 200px; }
  .company.about.whydn .story-area .tit {
    color: #FFFFFF;
    font-size: 28px;
    font-weight: 700;
    line-height: 40px; }
  .company.about.whydn .story-area .btn-view {
    padding-left: 40px;
    padding-right: 40px; }
.company.about.history .infotxt-area {
  padding: 100px 0 8px; }
  .company.about.history .infotxt-area p {
    text-align: center;
    font-size: 32px;
    font-weight: 700;
    line-height: 48px; }
.company.about.history .tabs.slide {
  position: sticky;
  top: 80px;
  padding-top: 0;
  background-color: #FFFFFF;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease-in-out; }
  .company.about.history .tabs.slide .swiper {
    max-width: 100%; }
  .company.about.history .tabs.slide .swiper-wrapper {
    justify-content: center; }
  .company.about.history .tabs.slide .swiper-slide {
    padding: 0 40px; }
    .company.about.history .tabs.slide .swiper-slide a {
      line-height: 72px; }
      .company.about.history .tabs.slide .swiper-slide a.active {
        border: 0;
        font-weight: 500; }
  .company.about.history .tabs.slide.active {
    opacity: 1;
    visibility: visible; }
.company.about.history .historycont-area .pic-area {
  position: absolute;
  top: 0;
  left: -320px;
  width: 880px;
  height: 100%; }
.company.about.history .historycont-area .pic {
  position: sticky;
  top: 152px;
  width: 880px;
  height: 960px; }
  .company.about.history .historycont-area .pic > div {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: all .4s ease-in-out; }
    .company.about.history .historycont-area .pic > div:first-of-type {
      opacity: 1; }
    .company.about.history .historycont-area .pic > div.active {
      opacity: 1; }
  .company.about.history .historycont-area .pic figcaption {
    position: absolute;
    top: 0;
    right: 0;
    width: 680px;
    height: 680px;
    padding: 80px 40px 0 366px;
    color: #FFFFFF;
    font-size: 32px;
    font-weight: 500;
    line-height: 48px;
    background: linear-gradient(225deg, rgba(11, 80, 242, 0.8) 15%, transparent 55%); }
    .company.about.history .historycont-area .pic figcaption strong {
      padding: 0 0 18px 0;
      display: block;
      color: #FFFFFF;
      font-size: 40px;
      font-weight: 700;
      line-height: 60px; }
      .company.about.history .historycont-area .pic figcaption strong::before {
        display: none; }
.company.about.history .historycont-area .inner {
  padding: 0 0 120px 0;
  position: relative; }
  .company.about.history .historycont-area .inner::before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 1px;
    height: auto;
    background-color: #EEEEEE;
    vertical-align: top; }
  .company.about.history .historycont-area .inner::before {
    top: 70px;
    left: 641px;
    bottom: 140px; }
  .company.about.history .historycont-area .inner .line {
    position: absolute;
    top: 70px;
    left: 641px;
    width: 1px;
    height: 0;
    max-height: calc(100% - 210px);
    background-color: #0B50F2; }
  .company.about.history .historycont-area .inner strong {
    position: relative;
    display: block;
    padding: 0 0 64px;
    font-size: 40px;
    font-weight: 700;
    line-height: 60px;
    position: relative; }
    .company.about.history .historycont-area .inner strong::before {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      width: 21px;
      height: 21px;
      background-color: #D4D4D4;
      vertical-align: top; }
    .company.about.history .historycont-area .inner strong:before {
      top: 19px;
      left: -76px;
      background-color: #FFFFFF;
      border: 5px solid #D4D4D4;
      border-radius: 50%;
      transition: all .2s ease-in-out; }
  .company.about.history .historycont-area .inner em {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 20px;
    font-weight: 700; }
  .company.about.history .historycont-area .inner > ul {
    position: relative; }
    .company.about.history .historycont-area .inner > ul > li {
      padding: 0 0 120px 707px; }
      .company.about.history .historycont-area .inner > ul > li.active strong::before {
        border-color: #0B50F2; }
      .company.about.history .historycont-area .inner > ul > li:first-of-type strong {
        padding-top: 47px; }
        .company.about.history .historycont-area .inner > ul > li:first-of-type strong::before {
          top: 66px; }
      .company.about.history .historycont-area .inner > ul > li:last-of-type {
        padding-bottom: 0; }
        .company.about.history .historycont-area .inner > ul > li:last-of-type > ul > li:last-of-type {
          position: relative; }
          .company.about.history .historycont-area .inner > ul > li:last-of-type > ul > li:last-of-type::after {
            position: absolute;
            top: 0;
            left: auto;
            right: 0;
            content: '';
            width: 10px;
            height: 50%;
            background-color: #FFFFFF;
            vertical-align: top; }
          .company.about.history .historycont-area .inner > ul > li:last-of-type > ul > li:last-of-type:after {
            top: 85px;
            left: -71px; }
      .company.about.history .historycont-area .inner > ul > li > ul > li {
        position: relative;
        padding: 0 0 64px 112px;
        font-size: 20px;
        font-weight: 400;
        line-height: 32px;
        position: relative; }
        .company.about.history .historycont-area .inner > ul > li > ul > li::before {
          position: absolute;
          top: 0;
          left: 0;
          content: '';
          width: 11px;
          height: 11px;
          background-color: #D4D4D4;
          vertical-align: top; }
        .company.about.history .historycont-area .inner > ul > li > ul > li:before {
          top: 10px;
          left: -71px;
          background-color: #D4D4D4;
          border-radius: 50%;
          transition: all .4s ease-in-out; }
        .company.about.history .historycont-area .inner > ul > li > ul > li.active::before {
          background-color: #0B50F2; }
        .company.about.history .historycont-area .inner > ul > li > ul > li:last-of-type {
          padding-bottom: 0; }
.company.about.ci#contents {
  padding-bottom: 0; }
.company.about.ci .subvisual-area {
  background-image: url("https://www.dn-solutions.com/resources/w/images/company/about_ci_visual.jpg"); }
  .company.about.ci .subvisual-area .inner p {
    font-size: 32px;
    color: #FFFFFF;
    line-height: 48px;
    font-weight: 500; }
.company.about.ci .sidedetail-area .scont h3 {
  width: 330px;
  font-size: 40px;
  line-height: 60px; }
.company.about.ci .sidedetail-area .scont p {
  font-size: 20px;
  line-height: 32px; }
.company.about.ci .sidedetail-area .scont figcaption {
  margin-top: 28px; }
.company.about.ci .sidedetail-area .scont + .scont {
  margin-top: 120px;
  padding-top: 120px; }
.company.about.ci .sidedetail-area.logoArea figure span img {
  border: 1px solid #d9d9d9; }
.company.about.ci .sidedetail-area.logoArea .logo figure, .company.about.ci .sidedetail-area.logoArea .brand .figArea {
  width: 950px;
  display: flex;
  flex-wrap: wrap; }
.company.about.ci .sidedetail-area.logoArea .logo figure span:nth-child(2), .company.about.ci .sidedetail-area.logoArea .brand .figArea figure:nth-child(2) {
  margin-left: auto; }
.company.about.ci .sidedetail-area.logoArea .logo figcaption {
  width: 100%; }
.company.about.ci .sidedetail-area.logoArea .brand .figArea figure {
  width: 455px; }
.company.about.ci .sidedetail-area.filmArea .scont {
  flex-wrap: wrap; }
  .company.about.ci .sidedetail-area.filmArea .scont .txt {
    width: 950px; }
    .company.about.ci .sidedetail-area.filmArea .scont .txt p + p {
      margin-top: 32px; }
  .company.about.ci .sidedetail-area.filmArea .scont .video {
    width: 100%;
    margin-top: 40px;
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateY(50px);
    order: 3; }
  .company.about.ci .sidedetail-area.filmArea .scont.active .video {
    opacity: 1;
    transform: translate(0, 0);
    transition-delay: 0.6s; }
.company.enotice .btn-download {
  margin: 0;
  padding-left: 14px;
  width: auto; }
  .company.enotice .btn-download + .btn-download {
    margin-left: 12px; }
.company.enotice .list-area {
  margin-top: 0;
  padding-top: 0;
  border-top: 0; }
  .company.enotice .list-area .table {
    margin-top: 20px; }
    .company.enotice .list-area .table colgroup {
      display: table-column-group; }
      .company.enotice .list-area .table colgroup col:nth-child(1) {
        width: auto; }
      .company.enotice .list-area .table colgroup col:nth-child(2), .company.enotice .list-area .table colgroup col:nth-child(3) {
        width: 244px; }
    .company.enotice .list-area .table td {
      line-height: 48px; }
    .company.enotice .list-area .table .title {
      display: block;
      line-height: 24px;
      font-weight: 500;
      text-align: left; }
    .company.enotice .list-area .table .date {
      color: #767676; }
    .company.enotice .list-area .table .btns {
      margin-top: 0; }
.company.enotice .list-detail {
  margin-top: 68px; }
.company.esg .subvisual-area {
  height: 480px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/esg_subvisual.jpg") center center no-repeat; }
  .company.esg .subvisual-area .inner p {
    font-size: 32px;
    font-weight: 500;
    line-height: 48px; }
.company.esg .tabs.slide {
  padding-top: 64px; }
  .company.esg .tabs.slide .swiper-slide a {
    margin-right: 72px; }
  .company.esg .tabs.slide .swiper-slide:last-of-type a {
    margin-right: 0; }
.company.esg .ethical-area section {
  margin-top: 80px; }
  .company.esg .ethical-area section:first-of-type {
    margin-top: 60px; }
  .company.esg .ethical-area section:nth-of-type(2n) {
    background-color: #F8F8F8; }
    .company.esg .ethical-area section:nth-of-type(2n) .inner {
      padding: 80px 0; }
      .company.esg .ethical-area section:nth-of-type(2n) .inner .tit {
        top: 80px; }
  .company.esg .ethical-area section:last-of-type {
    background-color: #FFFFFF; }
    .company.esg .ethical-area section:last-of-type .inner {
      padding: 60px 0 0;
      border-top: 1px solid #D4D4D4; }
  .company.esg .ethical-area section .tit {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 36px;
    line-height: 48px;
    opacity: 0;
    transform: translateX(100px);
    transition: all .4s ease-in-out; }
  .company.esg .ethical-area section .guidetxt {
    padding-left: 380px;
    opacity: 0;
    transform: translateX(-100px);
    transition: all .4s ease-in-out; }
    .company.esg .ethical-area section .guidetxt ul li {
      color: #444444;
      font-size: 18px;
      font-weight: 500;
      line-height: 26px; }
  .company.esg .ethical-area section img {
    margin-top: 40px;
    opacity: 0;
    transform: translateY(200px);
    transition: all .6s ease-in-out .2s; }
  .company.esg .ethical-area section p {
    color: #767676;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    opacity: 0;
    transform: translateY(100px);
    transition: all .4s ease-in-out; }
    .company.esg .ethical-area section p strong {
      padding-bottom: 24px;
      display: block;
      color: #111111;
      font-size: 24px;
      font-weight: 500;
      line-height: 36px; }
  .company.esg .ethical-area section.active .tit {
    opacity: 1;
    transform: translateX(0); }
  .company.esg .ethical-area section.active .guidetxt {
    opacity: 1;
    transform: translateX(0); }
  .company.esg .ethical-area section.active img {
    opacity: 1;
    transform: translateY(0); }
  .company.esg .ethical-area section.active p {
    opacity: 1;
    transform: translateY(0); }
.company.esg .practice-area li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 52px 32px 52px 0;
  border-bottom: 1px solid #D4D4D4; }
.company.esg .practice-area strong {
  width: 352px;
  font-size: 28px;
  font-weight: 700;
  line-height: 40px; }
.company.esg .practice-area p {
  width: 600px;
  color: #767676;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px; }
.company.csm .subvisual-area {
  height: 480px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/csm_esg_visual.jpg") center bottom no-repeat; }
  .company.csm .subvisual-area .inner p {
    font-size: 32px;
    font-weight: 500;
    line-height: 48px; }
.company.csm .tabs.slide {
  position: sticky;
  top: 80px;
  margin-top: 64px;
  padding-top: 0;
  background-color: #FFFFFF;
  z-index: 1; }
  .company.csm .tabs.slide .swiper-slide a {
    margin-right: 72px; }
  .company.csm .tabs.slide .swiper-slide:last-of-type a {
    margin-right: 0; }
.company.csm h3.tit {
  margin-top: 60px;
  font-size: 48px;
  font-weight: 700;
  line-height: 60px; }
.company.csm.esg .subvisual-area {
  background: url("https://www.dn-solutions.com/resources/w/images/company/csm_esg_visual.jpg") center bottom no-repeat; }
.company.csm.esg .manage-area {
  overflow: hidden; }
  .company.csm.esg .manage-area .scont:first-of-type figure {
    margin-top: 40px; }
  .company.csm.esg .manage-area .scont figure {
    margin-top: 80px;
    opacity: 0;
    transform: translate(0, 100px);
    transition: all .4s ease-in-out; }
  .company.csm.esg .manage-area .scont .guidetxt {
    display: flex;
    margin-top: 40px; }
  .company.csm.esg .manage-area .scont h4.tit {
    flex-shrink: 0;
    width: 400px;
    font-size: 32px;
    font-weight: 700;
    line-height: 48px;
    opacity: 0;
    transform: translate(-100px, 0);
    transition: all .4s ease-in-out; }
    .company.csm.esg .manage-area .scont h4.tit a:hover, .company.csm.esg .manage-area .scont h4.tit a:active {
      color: #0B50F2; }
    .company.csm.esg .manage-area .scont h4.tit .icon-arrow {
      width: 30px; }
      .company.csm.esg .manage-area .scont h4.tit .icon-arrow::after {
        background: url("https://www.dn-solutions.com/resources/w/images/common/btn.png") -250px -50px no-repeat; }
  .company.csm.esg .manage-area .scont ul {
    flex-grow: 1;
    opacity: 0;
    transform: translate(100px, 0);
    transition: all .4s ease-in-out; }
    .company.csm.esg .manage-area .scont ul li {
      margin-top: 32px;
      font-size: 20px;
      line-height: 32px;
      text-indent: 0; }
      .company.csm.esg .manage-area .scont ul li:first-of-type {
        margin-top: 0; }
      .company.csm.esg .manage-area .scont ul li strong {
        font-size: 20px;
        font-weight: 700;
        color: #444444; }
      .company.csm.esg .manage-area .scont ul li p {
        margin-top: 12px; }
      .company.csm.esg .manage-area .scont ul li:first-of-type strong {
        font-size: 24px;
        line-height: 36px;
        color: #111111; }
      .company.csm.esg .manage-area .scont ul li:first-of-type p {
        margin-top: 16px;
        color: #111111; }
  .company.csm.esg .manage-area .scont.active figure, .company.csm.esg .manage-area .scont.active h4.tit, .company.csm.esg .manage-area .scont.active ul {
    opacity: 1;
    transform: translate(0, 0); }
.company.csm.esg .history-area {
  overflow: hidden;
  margin-top: 120px;
  padding: 120px 0;
  background-color: #F8F8F8; }
  .company.csm.esg .history-area .scont {
    display: flex; }
    .company.csm.esg .history-area .scont h3.tit {
      margin-top: 0;
      flex-shrink: 0;
      width: 432px;
      opacity: 0;
      transform: translate(-100px, 0);
      transition: all .4s ease-in-out; }
    .company.csm.esg .history-area .scont ul {
      flex-grow: 1;
      opacity: 0;
      transform: translate(100px, 0);
      transition: all .4s ease-in-out; }
      .company.csm.esg .history-area .scont ul li {
        display: flex;
        padding: 32px;
        border-bottom: 1px solid #D4D4D4;
        font-size: 28px;
        font-weight: 500;
        line-height: 40px; }
        .company.csm.esg .history-area .scont ul li:first-of-type {
          padding-top: 0; }
        .company.csm.esg .history-area .scont ul li em {
          flex-shrink: 0;
          width: 140px;
          color: #0B50F2;
          font-size: 24px;
          font-weight: 700;
          line-height: 36px; }
        .company.csm.esg .history-area .scont ul li p {
          flex-grow: 1; }
    .company.csm.esg .history-area .scont.active h3.tit, .company.csm.esg .history-area .scont.active ul {
      opacity: 1;
      transform: translate(0, 0); }
.company.csm.esg .certify-area {
  overflow: hidden;
  position: relative;
  padding-top: 120px; }
  .company.csm.esg .certify-area h3.tit {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 0;
    opacity: 0;
    transform: translate(-100px, 0);
    transition: all .4s ease-in-out; }
  .company.csm.esg .certify-area .certify-info {
    padding-left: 400px;
    opacity: 0;
    transform: translate(100px, 0);
    transition: all .4s ease-in-out; }
    .company.csm.esg .certify-area .certify-info p {
      color: #111111;
      font-size: 24px;
      font-weight: 500;
      line-height: 36px; }
    .company.csm.esg .certify-area .certify-info .table {
      margin-top: 60px;
      border-top: 1px solid #111111; }
      .company.csm.esg .certify-area .certify-info .table th {
        padding: 20px 10px;
        background-color: #F4F4F4;
        border-left: 1px solid #D4D4D4;
        color: #111111;
        font-size: 20px;
        font-weight: 700;
        line-height: 28px; }
        .company.csm.esg .certify-area .certify-info .table th:first-of-type {
          border-left: 0; }
      .company.csm.esg .certify-area .certify-info .table td {
        border-left: 1px solid #D4D4D4;
        padding: 18px;
        font-size: 20px;
        font-weight: 400;
        line-height: 32px;
        color: #444444; }
        .company.csm.esg .certify-area .certify-info .table td:first-of-type {
          border-left: 0; }
    .company.csm.esg .certify-area .certify-info .guidetxt {
      margin-top: 28px; }
      .company.csm.esg .certify-area .certify-info .guidetxt strong {
        display: block;
        margin-bottom: 16px;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px;
        color: #444444; }
      .company.csm.esg .certify-area .certify-info .guidetxt li {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px; }
  .company.csm.esg .certify-area .certify-list {
    margin-top: 80px;
    border-bottom: 1px solid #D4D4D4; }
    .company.csm.esg .certify-area .certify-list ul {
      display: flex;
      flex-wrap: wrap; }
      .company.csm.esg .certify-area .certify-list ul li {
        display: flex;
        padding: 80px 0;
        width: 50%; }
        .company.csm.esg .certify-area .certify-list ul li:nth-of-type(2n-1) {
          position: relative; }
          .company.csm.esg .certify-area .certify-list ul li:nth-of-type(2n-1)::before {
            position: absolute;
            top: 0;
            left: 0;
            content: '';
            width: 1280px;
            height: 1px;
            background-color: #D4D4D4;
            vertical-align: top; }
        .company.csm.esg .certify-area .certify-list ul li figure {
          flex-shrink: 0;
          width: 283px;
          height: 400px; }
        .company.csm.esg .certify-area .certify-list ul li .info {
          position: relative;
          margin: 0 80px;
          flex-grow: 1; }
          .company.csm.esg .certify-area .certify-list ul li .info small {
            display: block;
            margin-top: 40px;
            font-size: 20px;
            font-weight: 500;
            line-height: 32px;
            color: #0B50F2; }
          .company.csm.esg .certify-area .certify-list ul li .info strong {
            display: block;
            margin-top: 8px;
            font-size: 36px;
            font-weight: 700;
            line-height: 48px;
            color: #111111; }
          .company.csm.esg .certify-area .certify-list ul li .info .btn-download {
            position: absolute;
            bottom: 40px;
            left: 0; }
  .company.csm.esg .certify-area .scont.active h3.tit, .company.csm.esg .certify-area .scont.active .certify-info {
    opacity: 1;
    transform: translate(0, 0); }
.company.csm.environmental .subvisual-area {
  background: url("https://www.dn-solutions.com/resources/w/images/company/csm_environmental_visual.jpg") center center no-repeat; }
.company.csm.environmental .respond-area .visual {
  position: relative;
  margin-top: 40px;
  height: 520px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/csm_environmental_respond1.jpg") center center no-repeat;
  overflow: hidden; }
  .company.csm.environmental .respond-area .visual strong {
    position: absolute;
    top: 80px;
    left: 80px;
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateX(-50px);
    font-size: 36px;
    font-weight: 700;
    line-height: 48px;
    color: #FFFFFF; }
  .company.csm.environmental .respond-area .visual p {
    position: absolute;
    right: 80px;
    bottom: 80px;
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateX(50px);
    font-size: 20px;
    font-weight: 400;
    line-height: 32px;
    color: #FFFFFF; }
  .company.csm.environmental .respond-area .visual.active strong, .company.csm.environmental .respond-area .visual.active p {
    opacity: 1;
    transform: translate(0, 0); }
.company.csm.environmental .respond-area .type {
  display: flex;
  margin-top: 80px; }
  .company.csm.environmental .respond-area .type li {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateY(50px);
    position: relative;
    flex: 1 1 0;
    padding: 180px 32px 40px 32px;
    background: #F4F4F4 url("https://www.dn-solutions.com/resources/w/images/company/csm_environmental_type_bg1.png") 0 0 no-repeat; }
    .company.csm.environmental .respond-area .type li:nth-child(1) {
      transition-delay: 0.3s; }
    .company.csm.environmental .respond-area .type li:nth-child(2) {
      transition-delay: 0.4s; }
    .company.csm.environmental .respond-area .type li:nth-child(3) {
      transition-delay: 0.5s; }
    .company.csm.environmental .respond-area .type li + li {
      margin-left: 28px; }
    .company.csm.environmental .respond-area .type li strong {
      font-size: 24px;
      font-weight: 700;
      line-height: 36px;
      color: #111111; }
    .company.csm.environmental .respond-area .type li p {
      margin-top: 32px;
      font-size: 16px;
      font-weight: 400;
      line-height: 24px;
      color: #444444; }
      .company.csm.environmental .respond-area .type li p + p {
        margin-top: 16px; }
    .company.csm.environmental .respond-area .type li::after {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
      display: inline-block;
      background-position: 0 0;
      background-repeat: no-repeat;
      content: '';
      width: 50px;
      height: 50px; }
    .company.csm.environmental .respond-area .type li:after {
      top: 25px;
      left: 17px;
      transform: translate(0, 0);
      width: 150px;
      height: 150px;
      background-image: url("https://www.dn-solutions.com/resources/w/images/company/company.png"); }
    .company.csm.environmental .respond-area .type li:nth-child(1):after {
      background-position: 0 -250px; }
    .company.csm.environmental .respond-area .type li:nth-child(2) {
      background-image: url("https://www.dn-solutions.com/resources/w/images/company/csm_environmental_type_bg2.png"); }
      .company.csm.environmental .respond-area .type li:nth-child(2):after {
        background-position: -150px -250px; }
    .company.csm.environmental .respond-area .type li:nth-child(3) {
      background-image: url("https://www.dn-solutions.com/resources/w/images/company/csm_environmental_type_bg3.png"); }
      .company.csm.environmental .respond-area .type li:nth-child(3):after {
        background-position: -300px -250px; }
  .company.csm.environmental .respond-area .type.active li {
    opacity: 1;
    transform: translate(0, 0); }
.company.csm.environmental .respond-area .goal {
  margin-top: 80px; }
  .company.csm.environmental .respond-area .goal figure {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateY(50px);
    position: relative; }
    .company.csm.environmental .respond-area .goal figure figcaption {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0; }
      .company.csm.environmental .respond-area .goal figure figcaption p {
        position: absolute;
        top: 0;
        left: 0;
        background-color: #FFFFFF;
        font-size: 32px;
        font-weight: 800;
        line-height: 36px;
        color: #0B50F2; }
        .company.csm.environmental .respond-area .goal figure figcaption p.stit {
          top: 252px;
          left: 32px;
          font-size: 24px;
          font-weight: 700;
          line-height: 32px;
          color: #444444; }
        .company.csm.environmental .respond-area .goal figure figcaption p.txt-2030 {
          top: 43px;
          left: 750px;
          padding: 5px 0 7px;
          width: 300px;
          text-align: center;
          opacity: #84a7f8; }
        .company.csm.environmental .respond-area .goal figure figcaption p.txt-2050 {
          top: 112px;
          left: 985px;
          padding: 5px 0 7px;
          width: 300px;
          text-align: center; }
        .company.csm.environmental .respond-area .goal figure figcaption p strong {
          display: block;
          margin-bottom: 8px; }
  .company.csm.environmental .respond-area .goal > p {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateY(50px);
    margin-top: 40px;
    font-size: 20px;
    font-weight: 400;
    line-height: 32px;
    color: #444444; }
  .company.csm.environmental .respond-area .goal + .info {
    margin-top: 80px;
    padding-top: 80px;
    border-top: 1px solid #D4D4D4; }
  .company.csm.environmental .respond-area .goal.active figure, .company.csm.environmental .respond-area .goal.active p {
    opacity: 1;
    transform: translate(0, 0); }
.company.csm.environmental .respond-area .info {
  padding-top: 80px; }
  .company.csm.environmental .respond-area .info .guidetxt {
    display: flex; }
    .company.csm.environmental .respond-area .info .guidetxt strong {
      display: block;
      flex-shrink: 0;
      padding-right: 40px;
      width: 400px;
      font-size: 32px;
      font-weight: 700;
      line-height: 48px;
      color: #111111;
      opacity: 0;
      transition-duration: 0.4s;
      transition-timing-function: ease-in-out;
      transform: translateX(-50px); }
    .company.csm.environmental .respond-area .info .guidetxt p {
      flex-grow: 1;
      font-size: 20px;
      font-weight: 400;
      line-height: 32px;
      color: #111111;
      opacity: 0;
      transition-duration: 0.4s;
      transition-timing-function: ease-in-out;
      transform: translateX(50px); }
  .company.csm.environmental .respond-area .info figure {
    margin-top: 40px;
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateY(50px); }
  .company.csm.environmental .respond-area .info.active strong, .company.csm.environmental .respond-area .info.active p, .company.csm.environmental .respond-area .info.active figure {
    opacity: 1;
    transform: translate(0, 0); }
.company.csm.environmental .management-area {
  margin-top: 120px;
  margin-bottom: -160px;
  padding-bottom: 160px;
  background-color: #F8F8F8; }
  .company.csm.environmental .management-area .inner {
    padding-top: 60px; }
  .company.csm.environmental .management-area .scont {
    display: flex;
    padding-bottom: 80px; }
    .company.csm.environmental .management-area .scont > .tit.lv2 {
      opacity: 0;
      transition-duration: 0.4s;
      transition-timing-function: ease-in-out;
      transform: translateX(-50px);
      width: 400px;
      flex-shrink: 0; }
    .company.csm.environmental .management-area .scont > .guidetxt {
      opacity: 0;
      transition-duration: 0.4s;
      transition-timing-function: ease-in-out;
      transform: translateX(50px); }
    .company.csm.environmental .management-area .scont.active > .tit.lv2 {
      opacity: 1;
      transform: translateX(0); }
    .company.csm.environmental .management-area .scont.active > .guidetxt {
      opacity: 1;
      transform: translateX(0); }
    .company.csm.environmental .management-area .scont:last-child {
      padding-bottom: 0; }
    .company.csm.environmental .management-area .scont + .scont {
      position: relative;
      padding-top: 80px; }
      .company.csm.environmental .management-area .scont + .scont::before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: 100%;
        height: 1px;
        background-color: #D4D4D4;
        vertical-align: top; }
    .company.csm.environmental .management-area .scont.info {
      align-items: center;
      margin-top: 40px; }
      .company.csm.environmental .management-area .scont.info strong {
        font-size: 32px;
        line-height: 48px; }
      .company.csm.environmental .management-area .scont.info p {
        margin-top: 12px;
        font-size: 20px;
        line-height: 32px;
        color: #444444; }
        .company.csm.environmental .management-area .scont.info p.stit {
          margin-top: 20px;
          font-size: 24px;
          line-height: 36px;
          font-weight: 700;
          color: #111111; }
      .company.csm.environmental .management-area .scont.info figure {
        width: 626px;
        flex-shrink: 0; }
      .company.csm.environmental .management-area .scont.info:first-of-type {
        padding-bottom: 0; }
        .company.csm.environmental .management-area .scont.info:first-of-type figure {
          opacity: 0;
          transition-duration: 0.4s;
          transition-timing-function: ease-in-out;
          transform: translateX(-50px); }
        .company.csm.environmental .management-area .scont.info:first-of-type .guidetxt {
          opacity: 0;
          transition-duration: 0.4s;
          transition-timing-function: ease-in-out;
          transform: translateX(50px);
          padding-left: 80px; }
        .company.csm.environmental .management-area .scont.info:first-of-type.active figure {
          opacity: 1;
          transform: translateX(0); }
        .company.csm.environmental .management-area .scont.info:first-of-type.active .guidetxt {
          opacity: 1;
          transform: translateX(0); }
      .company.csm.environmental .management-area .scont.info:nth-of-type(2) figure {
        opacity: 0;
        transition-duration: 0.4s;
        transition-timing-function: ease-in-out;
        transform: translateX(50px); }
      .company.csm.environmental .management-area .scont.info:nth-of-type(2) .guidetxt {
        opacity: 0;
        transition-duration: 0.4s;
        transition-timing-function: ease-in-out;
        transform: translateX(-50px);
        padding-right: 80px; }
      .company.csm.environmental .management-area .scont.info:nth-of-type(2).active figure {
        opacity: 1;
        transform: translateX(0); }
      .company.csm.environmental .management-area .scont.info:nth-of-type(2).active .guidetxt {
        opacity: 1;
        transform: translateX(0); }
    .company.csm.environmental .management-area .scont.info + .info {
      padding-top: 0;
      margin-top: 60px; }
      .company.csm.environmental .management-area .scont.info + .info::before {
        display: none; }
    .company.csm.environmental .management-area .scont.group .guidetxt {
      text-align: center; }
      .company.csm.environmental .management-area .scont.group .guidetxt strong {
        display: inline-block;
        padding-top: 17px;
        padding-bottom: 17px;
        width: 205px;
        font-size: 20px;
        line-height: 32px;
        color: #FFFFFF;
        background-color: #0B50F2; }
      .company.csm.environmental .management-area .scont.group .guidetxt ul {
        position: relative;
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        margin-top: 56px;
        margin-left: 0; }
        .company.csm.environmental .management-area .scont.group .guidetxt ul::before {
          position: absolute;
          top: 0;
          left: 0;
          content: '';
          width: 1px;
          height: 28px;
          background-color: #0B50F2;
          vertical-align: top; }
        .company.csm.environmental .management-area .scont.group .guidetxt ul::before {
          top: -56px;
          left: 50%; }
        .company.csm.environmental .management-area .scont.group .guidetxt ul::after {
          position: absolute;
          top: -28px;
          left: 50%;
          transform: translate(-50%, 0);
          content: '';
          width: 676px;
          height: 28px;
          border-top: 1px solid #0B50F2;
          border-left: 1px solid #0B50F2;
          border-right: 1px solid #0B50F2; }
        .company.csm.environmental .management-area .scont.group .guidetxt ul li {
          display: flex;
          align-items: center;
          justify-content: center;
          padding: 20px;
          width: 205px;
          text-indent: 0;
          font-size: 18px;
          line-height: 24px;
          background-color: #FFFFFF;
          border: 1px solid #D4D4D4; }
          .company.csm.environmental .management-area .scont.group .guidetxt ul li + li {
            margin-top: 0; }
          .company.csm.environmental .management-area .scont.group .guidetxt ul li.blue {
            padding: 19px 20px;
            line-height: 26px;
            font-weight: 700;
            color: #0B50F2;
            background: rgba(11, 80, 242, 0.1);
            border: 1px solid #0B50F2; }
            .company.csm.environmental .management-area .scont.group .guidetxt ul li.blue:nth-of-type(2), .company.csm.environmental .management-area .scont.group .guidetxt ul li.blue:nth-of-type(3) {
              position: relative; }
              .company.csm.environmental .management-area .scont.group .guidetxt ul li.blue:nth-of-type(2)::before, .company.csm.environmental .management-area .scont.group .guidetxt ul li.blue:nth-of-type(3)::before {
                position: absolute;
                top: 0;
                left: 0;
                content: '';
                width: 1px;
                height: 28px;
                background-color: #0B50F2;
                vertical-align: top; }
              .company.csm.environmental .management-area .scont.group .guidetxt ul li.blue:nth-of-type(2)::before, .company.csm.environmental .management-area .scont.group .guidetxt ul li.blue:nth-of-type(3)::before {
                top: -28px;
                left: 50%; }
    .company.csm.environmental .management-area .scont.policy .guidetxt {
      position: relative; }
      .company.csm.environmental .management-area .scont.policy .guidetxt p {
        font-size: 20px;
        line-height: 32px;
        font-weight: 500; }
      .company.csm.environmental .management-area .scont.policy .guidetxt .stit {
        font-size: 24px;
        line-height: 36px;
        font-weight: 500; }
      .company.csm.environmental .management-area .scont.policy .guidetxt .guidetxt {
        padding-top: 60px; }
        .company.csm.environmental .management-area .scont.policy .guidetxt .guidetxt > p:not(.stit) {
          padding-left: 420px; }
      .company.csm.environmental .management-area .scont.policy .guidetxt figure {
        position: absolute;
        top: 60px;
        left: 0;
        width: 360px; }
      .company.csm.environmental .management-area .scont.policy .guidetxt ol {
        margin-top: 120px; }
        .company.csm.environmental .management-area .scont.policy .guidetxt ol li:nth-of-type(1), .company.csm.environmental .management-area .scont.policy .guidetxt ol li:nth-of-type(2) {
          padding-left: 420px; }
        .company.csm.environmental .management-area .scont.policy .guidetxt ol li strong {
          font-size: 20px;
          line-height: 32px; }
          .company.csm.environmental .management-area .scont.policy .guidetxt ol li strong em {
            margin-right: 12px;
            color: #0B50F2; }
        .company.csm.environmental .management-area .scont.policy .guidetxt ol li p {
          margin-top: 12px;
          font-size: 20px;
          line-height: 32px;
          color: #767676; }
        .company.csm.environmental .management-area .scont.policy .guidetxt ol li + li {
          margin-top: 40px; }
    .company.csm.environmental .management-area .scont.motto .tit.lv2 em {
      display: block;
      color: #0B50F2; }
    .company.csm.environmental .management-area .scont.motto .guidetxt ul {
      margin-left: 0; }
      .company.csm.environmental .management-area .scont.motto .guidetxt ul li {
        text-indent: 0; }
        .company.csm.environmental .management-area .scont.motto .guidetxt ul li strong {
          font-size: 24px;
          line-height: 36px;
          color: #111111; }
          .company.csm.environmental .management-area .scont.motto .guidetxt ul li strong em {
            color: #0B50F2; }
        .company.csm.environmental .management-area .scont.motto .guidetxt ul li p {
          margin-top: 16px;
          font-size: 20px;
          line-height: 32px;
          color: #444444; }
        .company.csm.environmental .management-area .scont.motto .guidetxt ul li + li {
          margin-top: 40px; }
.company.csm.social .subvisual-area {
  background: url("https://www.dn-solutions.com/resources/w/images/company/csm_social_visual.jpg") center center no-repeat; }
.company.csm.social .scont .tit.lv2 {
  opacity: 0;
  transition-duration: 0.4s;
  transition-timing-function: ease-in-out;
  transform: translateX(-50px); }
.company.csm.social .scont > figure {
  opacity: 0;
  transition-duration: 0.4s;
  transition-timing-function: ease-in-out;
  transform: translateY(50px); }
.company.csm.social .scont.active .tit.lv2 {
  opacity: 1;
  transform: translateX(0); }
.company.csm.social .scont.active > figure {
  opacity: 1;
  transform: translateY(0); }
.company.csm.social .synergy-area {
  margin-top: 120px;
  padding-bottom: 120px;
  background-color: #F8F8F8;
  padding-top: 60px; }
  .company.csm.social .synergy-area .scont {
    margin-top: 40px; }
    .company.csm.social .synergy-area .scont + .scont {
      margin-top: 80px; }
    .company.csm.social .synergy-area .scont .guidetxt:not(.dot) {
      display: flex;
      margin-top: 40px; }
      .company.csm.social .synergy-area .scont .guidetxt:not(.dot) .tit.lv2 {
        padding-right: 60px;
        width: 400px;
        flex-shrink: 0; }
      .company.csm.social .synergy-area .scont .guidetxt:not(.dot) p {
        font-size: 20px;
        line-height: 32px;
        opacity: 0;
        transition-duration: 0.4s;
        transition-timing-function: ease-in-out;
        transform: translateX(50px); }
        .company.csm.social .synergy-area .scont .guidetxt:not(.dot) p + p {
          margin-top: 24px; }
      .company.csm.social .synergy-area .scont .guidetxt:not(.dot) figure {
        opacity: 0;
        transition-duration: 0.4s;
        transition-timing-function: ease-in-out;
        transform: translateY(50px); }
      .company.csm.social .synergy-area .scont .guidetxt:not(.dot) > .guidetxt {
        opacity: 0;
        transition-duration: 0.4s;
        transition-timing-function: ease-in-out;
        transform: translateX(50px); }
        .company.csm.social .synergy-area .scont .guidetxt:not(.dot) > .guidetxt ul {
          margin-top: 24px; }
          .company.csm.social .synergy-area .scont .guidetxt:not(.dot) > .guidetxt ul li {
            font-size: 18px;
            font-weight: 500;
            line-height: 26px; }
    .company.csm.social .synergy-area .scont.active .guidetxt:not(.dot) p {
      opacity: 1;
      transform: translateX(0); }
    .company.csm.social .synergy-area .scont.active figure {
      opacity: 1;
      transform: translateY(0); }
    .company.csm.social .synergy-area .scont.active .guidetxt.dot {
      opacity: 1;
      transform: translateX(0); }
.company.csm.social .contribution-area .scont {
  margin-top: 40px; }
  .company.csm.social .contribution-area .scont + .scont {
    margin-top: 80px; }
  .company.csm.social .contribution-area .scont > figure {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateY(50px); }
  .company.csm.social .contribution-area .scont > .guidetxt > .tit.lv2 {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateX(-50px); }
  .company.csm.social .contribution-area .scont > .guidetxt > div > p {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateX(50px); }
  .company.csm.social .contribution-area .scont > .guidetxt ul li {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateY(50px); }
    .company.csm.social .contribution-area .scont > .guidetxt ul li.active {
      opacity: 1;
      transform: translateY(0); }
  .company.csm.social .contribution-area .scont.active > figure {
    opacity: 1;
    transform: translateY(0); }
  .company.csm.social .contribution-area .scont.active > .guidetxt > .tit.lv2 {
    opacity: 1;
    transform: translateX(0); }
  .company.csm.social .contribution-area .scont.active > .guidetxt > div > p {
    opacity: 1;
    transform: translateX(0); }
  .company.csm.social .contribution-area .scont:nth-of-type(2) {
    display: flex; }
    .company.csm.social .contribution-area .scont:nth-of-type(2) .tit.lv2 {
      padding-right: 60px;
      width: 400px;
      flex-shrink: 0; }
  .company.csm.social .contribution-area .scont .guidetxt {
    display: flex;
    margin-top: 40px; }
    .company.csm.social .contribution-area .scont .guidetxt .tit.lv2 {
      padding-right: 60px;
      width: 400px;
      flex-shrink: 0; }
    .company.csm.social .contribution-area .scont .guidetxt p {
      font-size: 20px;
      line-height: 30px; }
  .company.csm.social .contribution-area .scont ul {
    margin-left: 0; }
    .company.csm.social .contribution-area .scont ul li {
      display: flex;
      flex-wrap: wrap;
      margin-top: 48px;
      text-indent: 0; }
      .company.csm.social .contribution-area .scont ul li + li {
        position: relative;
        padding-top: 48px; }
        .company.csm.social .contribution-area .scont ul li + li::before {
          position: absolute;
          top: 0;
          left: 0;
          content: '';
          width: 100%;
          height: 1px;
          background-color: #D4D4D4;
          vertical-align: top; }
      .company.csm.social .contribution-area .scont ul li > strong {
        display: block;
        width: 100%;
        color: #111111; }
      .company.csm.social .contribution-area .scont ul li > div {
        width: calc((100% - 40px)/2); }
        .company.csm.social .contribution-area .scont ul li > div + div {
          margin-left: 40px; }
        .company.csm.social .contribution-area .scont ul li > div figure {
          margin-top: 24px; }
        .company.csm.social .contribution-area .scont ul li > div strong {
          display: block;
          margin-top: 24px;
          font-size: 20px;
          line-height: 32px;
          color: #444444; }
        .company.csm.social .contribution-area .scont ul li > div p {
          margin-top: 12px;
          color: #444444; }
.company.csm.social .guideline-area {
  padding-top: 60px; }
  .company.csm.social .guideline-area h3.tit {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateX(-50px); }
  .company.csm.social .guideline-area ul {
    opacity: 0;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
    transform: translateY(50px); }
  .company.csm.social .guideline-area .scont.active h3.tit {
    opacity: 1;
    transform: translateX(0); }
  .company.csm.social .guideline-area .scont.active ul {
    opacity: 1;
    transform: translateY(0); }
  .company.csm.social .guideline-area li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 52px 32px 52px 0;
    border-bottom: 1px solid #D4D4D4; }
    .company.csm.social .guideline-area li:first-of-type {
      padding-top: 60px; }
  .company.csm.social .guideline-area strong {
    width: 352px;
    font-size: 28px;
    font-weight: 700;
    line-height: 40px; }
  .company.csm.social .guideline-area p {
    width: 600px;
    color: #767676;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px; }
.company.csm.governance .subvisual-area {
  background: url("https://www.dn-solutions.com/resources/w/images/company/csm_governance_visual.jpg") center center no-repeat; }
.company.csm.governance .ethical-area .scont {
  margin-top: 80px; }
  .company.csm.governance .ethical-area .scont:first-of-type {
    margin-top: 60px; }
  .company.csm.governance .ethical-area .scont:nth-of-type(2n) {
    background-color: #F8F8F8; }
    .company.csm.governance .ethical-area .scont:nth-of-type(2n) .inner {
      padding: 80px 0; }
      .company.csm.governance .ethical-area .scont:nth-of-type(2n) .inner .tit {
        top: 80px; }
  .company.csm.governance .ethical-area .scont .tit {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 0;
    font-size: 36px;
    line-height: 48px;
    opacity: 0;
    transform: translateX(100px);
    transition: all .4s ease-in-out; }
  .company.csm.governance .ethical-area .scont .guidetxt {
    padding-left: 400px;
    opacity: 0;
    transform: translateX(-100px);
    transition: all .4s ease-in-out; }
    .company.csm.governance .ethical-area .scont .guidetxt ul li {
      color: #444444;
      font-size: 20px;
      font-weight: 500;
      line-height: 32px; }
      .company.csm.governance .ethical-area .scont .guidetxt ul li::before {
        margin: 14px 8px 0 0; }
  .company.csm.governance .ethical-area .scont img {
    margin-top: 40px;
    opacity: 0;
    transform: translateY(200px);
    transition: all .6s ease-in-out .2s; }
  .company.csm.governance .ethical-area .scont p {
    color: #767676;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    opacity: 0;
    transform: translateY(100px);
    transition: all .4s ease-in-out; }
    .company.csm.governance .ethical-area .scont p strong {
      padding-bottom: 24px;
      display: block;
      color: #111111;
      font-size: 24px;
      font-weight: 500;
      line-height: 36px; }
  .company.csm.governance .ethical-area .scont.active .tit {
    opacity: 1;
    transform: translateX(0); }
  .company.csm.governance .ethical-area .scont.active .guidetxt {
    opacity: 1;
    transform: translateX(0); }
  .company.csm.governance .ethical-area .scont.active img {
    opacity: 1;
    transform: translateY(0); }
  .company.csm.governance .ethical-area .scont.active p {
    opacity: 1;
    transform: translateY(0); }
.company.network#contents {
  padding-bottom: 0; }
.company.network .map-area {
  margin-top: 60px;
  display: flex; }
  .company.network .map-area.active .map-list {
    margin-left: -420px; }
    .company.network .map-area.active .map-list .btn-close::after {
      transform: translate(-50%, -50%) rotate(0); }
  .company.network .map-area .map-list {
    position: relative;
    flex-shrink: 0;
    padding: 0 20px;
    width: 420px;
    transition: margin-left 0.4s ease-in-out; }
    .company.network .map-area .map-list .btn-close {
      position: absolute;
      top: 372px;
      left: auto;
      right: -24px;
      width: 56px;
      height: 56px;
      background-color: #FFFFFF;
      border-radius: 50%;
      z-index: 1; }
      .company.network .map-area .map-list .btn-close::after {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
        display: inline-block;
        background-position: -100px -100px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
      .company.network .map-area .map-list .btn-close::after {
        margin-left: 12px;
        transform: translate(-50%, -50%) rotate(180deg);
        transition: all 0.4s ease-in-out; }
    .company.network .map-area .map-list .btn-country {
      position: relative;
      display: block;
      margin-top: 12px;
      padding: 12px 10px 12px 16px;
      width: 100%;
      text-align: left;
      font-size: 16px;
      line-height: 24px;
      border: 1px solid #D4D4D4; }
      .company.network .map-area .map-list .btn-country .icon-select {
        position: absolute;
        top: 0;
        left: auto;
        right: 0;
        width: 38px;
        height: 46px;
        transition: all .125s ease-in-out;
        pointer-events: none; }
      .company.network .map-area .map-list .btn-country.active .icon-select {
        transform: rotate(-180deg); }
    .company.network .map-area .map-list .country-list {
      position: relative;
      position: absolute;
      top: 109px;
      left: 20px;
      display: none;
      padding: 16px;
      width: 380px;
      height: 673px;
      border: 1px solid #D4D4D4;
      border-top: 0;
      background-color: #FFFFFF;
      z-index: 2; }
      .company.network .map-area .map-list .country-list::before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        margin: 0;
        width: 348px;
        height: 1px;
        background-color: #D4D4D4;
        vertical-align: top; }
      .company.network .map-area .map-list .country-list::before {
        left: 16px; }
      .company.network .map-area .map-list .country-list.active {
        display: flex; }
      .company.network .map-area .map-list .country-list > div {
        width: 50%; }
        .company.network .map-area .map-list .country-list > div .scroll-content {
          max-height: 100%; }
        .company.network .map-area .map-list .country-list > div.select-region {
          padding-left: 20px; }
      .company.network .map-area .map-list .country-list input + span {
        display: block;
        padding: 4px 0;
        line-height: 24px;
        color: #767676; }
        .company.network .map-area .map-list .country-list input + span::before {
          display: none; }
      .company.network .map-area .map-list .country-list input:checked + span {
        color: #0B50F2; }
      .company.network .map-area .map-list .country-list button {
        padding: 4px 0;
        display: block;
        text-align: left; }
    .company.network .map-area .map-list .form-search {
      margin-top: 12px;
      width: 100%; }
    .company.network .map-area .map-list .result {
      position: relative;
      margin-top: 12px;
      width: 380px;
      z-index: 1; }
      .company.network .map-area .map-list .result .tabs.type1-small {
        margin-left: -20px;
        margin-right: -20px; }
        .company.network .map-area .map-list .result .tabs.type1-small .swiper {
          padding-left: 20px;
          padding-right: 20px; }
          .company.network .map-area .map-list .result .tabs.type1-small .swiper .swiper-slide a {
            margin-right: 47px; }
          .company.network .map-area .map-list .result .tabs.type1-small .swiper .swiper-slide:last-of-type a {
            margin-right: 0; }
      .company.network .map-area .map-list .result .form-filter {
        height: auto; }
        .company.network .map-area .map-list .result .form-filter .total {
          padding-top: 20px;
          height: auto;
          line-height: 24px;
          font-size: 16px;
          font-weight: 400; }
          .company.network .map-area .map-list .result .form-filter .total em {
            color: #0B50F2;
            font-weight: 700; }
      .company.network .map-area .map-list .result .list-office {
        margin-right: -20px;
        padding-top: 20px;
        height: 500px; }
        .company.network .map-area .map-list .result .list-office .scroll-content {
          padding-right: 12px;
          max-height: 100%; }
        .company.network .map-area .map-list .result .list-office .hastag-area {
          margin-bottom: 10px; }
          .company.network .map-area .map-list .result .list-office .hastag-area input + span {
            margin-right: 6px;
            margin-bottom: 6px;
            padding: 0 8px;
            line-height: 32px;
            color: #767676;
            border: 1px solid #D4D4D4;
            border-radius: 30px; }
            .company.network .map-area .map-list .result .list-office .hastag-area input + span::before {
              display: none; }
          .company.network .map-area .map-list .result .list-office .hastag-area input:checked + span {
            color: #0B50F2;
            border-color: #0B50F2; }
        .company.network .map-area .map-list .result .list-office .label-area {
          margin-bottom: 6px; }
          .company.network .map-area .map-list .result .list-office .label-area span {
            margin: 0 2px 6px 0;
            padding: 1px 6px;
            display: inline-flex;
            justify-content: center;
            align-items: center;
            color: #FFFFFF;
            font-size: 12px;
            font-weight: 700;
            line-height: 18px;
            background-color: #1142B6; }
            .company.network .map-area .map-list .result .list-office .label-area span.salesagent {
              background-color: #1142B6; }
            .company.network .map-area .map-list .result .list-office .label-area span.service {
              background-color: #23AEC3; }
            .company.network .map-area .map-list .result .list-office .label-area span.salesbranch {
              background-color: #1F81B8; }
            .company.network .map-area .map-list .result .list-office .label-area span.partsagency {
              background-color: #FF9C28; }
            .company.network .map-area .map-list .result .list-office .label-area span.production {
              background-color: #5089F2; }
            .company.network .map-area .map-list .result .list-office .label-area span.headoffice {
              background-color: #0B50F2; }
        .company.network .map-area .map-list .result .list-office li {
          margin-top: 12px; }
          .company.network .map-area .map-list .result .list-office li:first-of-type {
            margin-top: 0; }
        .company.network .map-area .map-list .result .list-office a {
          display: block;
          padding: 20px;
          border: 1px solid #D4D4D4; }
          .company.network .map-area .map-list .result .list-office a strong {
            display: block;
            font-size: 16px;
            font-weight: 700;
            line-height: 24px; }
          .company.network .map-area .map-list .result .list-office a p {
            margin-top: 4px;
            font-size: 14px;
            line-height: 20px; }
          .company.network .map-area .map-list .result .list-office a .txt-tel {
            margin-top: 4px;
            color: #767676;
            font-size: 12px;
            line-height: 18px; }
          .company.network .map-area .map-list .result .list-office a.active {
            border-color: #0B50F2; }
            .company.network .map-area .map-list .result .list-office a.active strong {
              color: #0B50F2; }
  .company.network .map-area .map-content {
    flex-grow: 1; }
.company.reference .map-area {
  margin-top: 60px;
  background-color: rgba(11, 80, 242, 0.17); }
  .company.reference .map-area .map-content {
    height: 800px;
    background: url("https://www.dn-solutions.com/resources/w/images/company/map_global_reference.png") center center no-repeat; }
    .company.reference .map-area .map-content .country {
      position: absolute;
      padding: 0 28px 0 60px;
      width: 172px;
      height: 56px;
      line-height: 56px;
      border-radius: 28px;
      background-color: #0B50F2;
      color: #FFFFFF; }
      .company.reference .map-area .map-content .country::after {
        position: absolute;
        top: 50%;
        left: -40px;
        transform: translate(0, -50%);
        content: '';
        width: 44px;
        height: 1px;
        background-color: #0B50F2; }
      .company.reference .map-area .map-content .country .icon-flag {
        position: absolute;
        top: 50%;
        left: 3px;
        transform: translate(0, -50%); }
        .company.reference .map-area .map-content .country .icon-flag::after {
          background-image: url("https://www.dn-solutions.com/resources/m/images/common/flag.png");
          background-size: 1000px;
          width: 44px;
          height: 44px; }
      .company.reference .map-area .map-content .country .icon-ripple {
        position: absolute;
        top: 50%;
        left: -50px;
        transform: translate(0, -50%); }
      .company.reference .map-area .map-content .country.canada::after, .company.reference .map-area .map-content .country.mexico::after, .company.reference .map-area .map-content .country.india::after, .company.reference .map-area .map-content .country.china::after {
        left: auto;
        right: -40px; }
      .company.reference .map-area .map-content .country.canada .icon-ripple, .company.reference .map-area .map-content .country.mexico .icon-ripple, .company.reference .map-area .map-content .country.india .icon-ripple, .company.reference .map-area .map-content .country.china .icon-ripple {
        left: auto;
        right: -50px; }
      .company.reference .map-area .map-content .country.canada {
        top: 215px;
        left: 54px; }
        .company.reference .map-area .map-content .country.canada .icon-flag::after {
          background-position: 0 0; }
      .company.reference .map-area .map-content .country.usa {
        top: 322px;
        left: 305px;
        padding: 8px 0 8px 57px;
        line-height: 20px; }
        .company.reference .map-area .map-content .country.usa .icon-flag::after {
          background-position: -100px 0; }
      .company.reference .map-area .map-content .country.mexico {
        top: 398px;
        left: 30px; }
        .company.reference .map-area .map-content .country.mexico .icon-flag::after {
          background-position: -200px 0; }
      .company.reference .map-area .map-content .country.brazil {
        top: 469px;
        left: 470px; }
        .company.reference .map-area .map-content .country.brazil .icon-flag::after {
          background-position: -300px 0; }
      .company.reference .map-area .map-content .country.europe {
        top: 235px;
        left: 705px; }
        .company.reference .map-area .map-content .country.europe .icon-flag::after {
          background-position: -500px 0; }
      .company.reference .map-area .map-content .country.china {
        top: 337px;
        left: 766px; }
        .company.reference .map-area .map-content .country.china .icon-flag::after {
          background-position: -600px 0; }
      .company.reference .map-area .map-content .country.india {
        top: 412px;
        left: 659px; }
        .company.reference .map-area .map-content .country.india .icon-flag::after {
          background-position: -400px 0; }
      .company.reference .map-area .map-content .country.korea {
        top: 324px;
        right: 15px;
        padding: 8px 0 8px 60px;
        line-height: 20px; }
        .company.reference .map-area .map-content .country.korea .icon-flag::after {
          background-position: -700px 0; }
      .company.reference .map-area .map-content .country.southeastasia {
        top: 434px;
        right: 74px;
        padding: 8px 28px 8px 60px;
        line-height: 20px; }
        .company.reference .map-area .map-content .country.southeastasia .icon-flag::after {
          background-position: -800px 0; }
.company.reference .tabs.slide {
  margin-top: 60px; }
  .company.reference .tabs.slide .swiper-slide em {
    margin-left: 3px;
    color: #A9A9A9;
    font-weight: 500; }
  .company.reference .tabs.slide .swiper-slide a.active em {
    font-weight: 700;
    color: #111111; }
.company.reference .table-area {
  margin-top: 60px; }
  .company.reference .table-area .table {
    margin-top: 16px; }
  .company.reference .table-area table td {
    padding-top: 32px;
    padding-bottom: 32px;
    text-align: left;
    line-height: 24px;
    color: #767676; }
.company.management .tabs.slide {
  padding-top: 60px; }
  .company.management .tabs.slide .swiper-slide a {
    margin-right: 72px; }
  .company.management .tabs.slide .swiper-slide:last-of-type a {
    margin-right: 0; }
.company.management .menagetxt.menagetxt1 {
  margin-top: 48px;
  display: block;
  font-size: 32px;
  font-weight: 500;
  line-height: 48px; }
.company.management .menagetxt.menagetxt2 {
  margin-top: 32px;
  font-size: 20px;
  font-weight: 500;
  line-height: 32px; }
.company.management .menagetxt.menagetxt3 {
  margin-top: 32px;
  color: #444444;
  font-size: 16px;
  font-weight: 400;
  line-height: 28px; }
.company.management .menagetxt.menagetxt4 {
  margin-top: 40px;
  padding: 32px 24px;
  border-top: 1px solid #0B50F2;
  border-bottom: 1px solid #0B50F2; }
  .company.management .menagetxt.menagetxt4 li {
    color: #1142B6;
    font-weight: 500; }
    .company.management .menagetxt.menagetxt4 li::before {
      background-color: #1142B6; }
.company.management .menagetxt.menagetxt5 {
  margin-top: 40px;
  color: #444444;
  font-size: 16px;
  font-weight: 400;
  line-height: 28px; }
.company.management .menagetxt.menagetxt6 {
  margin-top: 80px;
  text-align: right;
  color: #767676;
  font-size: 14px;
  line-height: 20px; }
  .company.management .menagetxt.menagetxt6 strong {
    display: block;
    margin-top: 16px;
    color: #111111;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px; }
    .company.management .menagetxt.menagetxt6 strong.txt-sign {
      position: relative;
      font-weight: 700; }
      .company.management .menagetxt.menagetxt6 strong.txt-sign span {
        position: relative;
        margin-left: 15px;
        display: inline-block;
        width: 116px;
        height: 52px;
        vertical-align: middle;
        text-align: left;
        text-indent: -9999em; }
        .company.management .menagetxt.menagetxt6 strong.txt-sign span::before {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
          display: inline-block;
          background-position: -350px 0;
          background-repeat: no-repeat;
          content: '';
          width: 50px;
          height: 50px; }
        .company.management .menagetxt.menagetxt6 strong.txt-sign span::before {
          width: 116px;
          height: 52px;
          background-image: url("https://www.dn-solutions.com/resources/w/images/company/company.png"); }
.company.management .declaration-area .menagetxt2 {
  margin-top: 60px; }
.company.management .declaration-area .menagetxt4 ul {
  margin-left: 27px; }
.company.management .declaration-area .menagetxt4 li {
  text-indent: -27px; }
  .company.management .declaration-area .menagetxt4 li::before {
    display: none; }
  .company.management .declaration-area .menagetxt4 li .bl {
    margin: 3px 12px 0 0;
    display: inline-block;
    width: 15px;
    height: 15px;
    text-indent: 0;
    vertical-align: top;
    position: relative;
    position: relative; }
    .company.management .declaration-area .menagetxt4 li .bl::before {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      width: 5px;
      height: 5px;
      background-color: #1142B6;
      vertical-align: top; }
    .company.management .declaration-area .menagetxt4 li .bl::after {
      position: absolute;
      top: 0;
      left: auto;
      right: 0;
      content: '';
      width: 5px;
      height: 5px;
      background-color: #1142B6;
      vertical-align: top; }
    .company.management .declaration-area .menagetxt4 li .bl span {
      position: relative;
      position: relative;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
      .company.management .declaration-area .menagetxt4 li .bl span::before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: 5px;
        height: 5px;
        background-color: #1142B6;
        vertical-align: top; }
      .company.management .declaration-area .menagetxt4 li .bl span::after {
        position: absolute;
        top: 0;
        left: auto;
        right: 0;
        content: '';
        width: 5px;
        height: 5px;
        background-color: #1142B6;
        vertical-align: top; }
      .company.management .declaration-area .menagetxt4 li .bl span::before {
        top: auto;
        bottom: 0; }
      .company.management .declaration-area .menagetxt4 li .bl span::after {
        top: auto;
        left: auto;
        right: 0;
        bottom: 0; }
  .company.management .declaration-area .menagetxt4 li:nth-of-type(1) .bl::after {
    display: none; }
  .company.management .declaration-area .menagetxt4 li:nth-of-type(1) .bl span::before, .company.management .declaration-area .menagetxt4 li:nth-of-type(1) .bl span::after {
    display: none; }
  .company.management .declaration-area .menagetxt4 li:nth-of-type(2) .bl::after {
    display: none; }
  .company.management .declaration-area .menagetxt4 li:nth-of-type(2) .bl span::after {
    display: none; }
  .company.management .declaration-area .menagetxt4 li:nth-of-type(3) .bl span::after {
    display: none; }
.company.management .declaration-area .menagetxt6 strong {
  font-size: 20px;
  line-height: 32px; }
.company.map .tabs.slide {
  padding-top: 60px; }
  .company.map .tabs.slide .swiper-slide a {
    margin-right: 72px; }
  .company.map .tabs.slide .swiper-slide:last-of-type a {
    margin-right: 0; }
.company.map .tab-contents {
  margin-top: -20px; }
  .company.map .tab-contents ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
  .company.map .tab-contents li {
    margin-top: 80px;
    width: 626px; }
    .company.map .tab-contents li figure {
      position: relative; }
      .company.map .tab-contents li figure figcaption {
        padding: 32px 10px;
        font-size: 32px;
        font-weight: 500;
        line-height: 48px; }
        .company.map .tab-contents li figure figcaption small {
          display: block;
          margin-top: 12px;
          color: #767676;
          font-size: 16px;
          font-weight: 400;
          line-height: 24px; }
      .company.map .tab-contents li figure a {
        position: absolute;
        top: 440px;
        left: auto;
        right: 12px;
        width: 50px;
        height: 50px; }
        .company.map .tab-contents li figure a::after {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
          display: inline-block;
          background-position: -250px -200px;
          background-repeat: no-repeat;
          content: '';
          width: 50px;
          height: 50px; }
    .company.map .tab-contents li dl {
      display: flex;
      flex-wrap: wrap;
      border-top: 1px solid #EEEEEE; }
      .company.map .tab-contents li dl dt {
        padding: 20px 10px;
        width: 85px;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px;
        border-bottom: 1px solid #EEEEEE; }
      .company.map .tab-contents li dl dd {
        padding: 20px 10px;
        width: calc(100% - 85px);
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        border-bottom: 1px solid #EEEEEE; }
.company.partner .title-area {
  padding-top: 120px;
  text-align: center; }
  .company.partner .title-area .tit {
    font-size: 72px;
    line-height: 92px;
    color: #111111; }
.company.partner .link-area {
  margin-top: 60px;
  text-align: center; }
  .company.partner .link-area a {
    display: inline-block;
    padding: 0 24px;
    font-size: 24px;
    font-weight: 500;
    line-height: 36px;
    position: relative; }
    .company.partner .link-area a::before {
      position: absolute;
      top: 0;
      left: 0;
      content: '';
      margin: 8px 0 0;
      width: 1px;
      height: 20px;
      background-color: #D4D4D4;
      vertical-align: top; }
    .company.partner .link-area a:first-of-type::before {
      display: none; }
    .company.partner .link-area a.active {
      color: #0B50F2;
      font-weight: 700; }
.company.partner.titans .subvisual-area {
  height: 740px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/partner_titans_visual_usa.jpg") center top no-repeat; }
  .company.partner.titans .subvisual-area .inner {
    text-align: center; }
    .company.partner.titans .subvisual-area .inner strong {
      display: block;
      font-size: 100px;
      font-weight: 700;
      line-height: 120px; }
.company.partner.titans .infotxt-area {
  margin-top: 120px;
  text-align: center; }
  .company.partner.titans .infotxt-area strong {
    display: block;
    font-size: 36px;
    font-weight: 700;
    line-height: 48px; }
  .company.partner.titans .infotxt-area p {
    margin-top: 23px;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px; }
  .company.partner.titans .infotxt-area .btn {
    padding-left: 40px;
    padding-right: 40px; }
.company.partner.joe#contents {
  padding-bottom: 0; }
.company.partner.joe .subvisual-area {
  height: 740px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/partner_joe_visual_usa.jpg") center center no-repeat; }
  .company.partner.joe .subvisual-area .inner {
    text-align: center; }
    .company.partner.joe .subvisual-area .inner strong {
      display: block;
      font-size: 100px;
      font-weight: 700;
      line-height: 120px; }
.company.partner.joe .partner-area {
  margin-top: 120px; }
  .company.partner.joe .partner-area .tit {
    font-size: 48px;
    font-weight: 700;
    line-height: 60px;
    text-align: center;
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out; }
  .company.partner.joe .partner-area figure {
    margin-top: 80px; }
    .company.partner.joe .partner-area figure img {
      opacity: 0;
      transform: translate(0, 100px);
      transition: all .4s ease-in-out .2s; }
    .company.partner.joe .partner-area figure figcaption {
      margin-top: 32px;
      text-align: center; }
      .company.partner.joe .partner-area figure figcaption strong {
        display: block;
        font-size: 32px;
        font-weight: 700;
        line-height: 48px;
        opacity: 0;
        transform: translate(0, 50px);
        transition: all .4s ease-in-out .4s; }
      .company.partner.joe .partner-area figure figcaption p {
        margin-top: 16px;
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        opacity: 0;
        transform: translate(0, 50px);
        transition: all .4s ease-in-out .5s; }
  .company.partner.joe .partner-area.active .tit, .company.partner.joe .partner-area.active figure img, .company.partner.joe .partner-area.active figure figcaption strong, .company.partner.joe .partner-area.active figure figcaption p {
    opacity: 1;
    transform: translate(0, 0); }
.company.partner.joe .machine-area {
  margin-top: 120px; }
  .company.partner.joe .machine-area .video {
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out; }
    .company.partner.joe .machine-area .video a {
      position: relative;
      display: block; }
      .company.partner.joe .machine-area .video a::after {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
        display: inline-block;
        background-position: 0 -50px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
      .company.partner.joe .machine-area .video a::after {
        width: 60px;
        height: 60px; }
  .company.partner.joe .machine-area .tit {
    margin-top: 32px;
    font-size: 32px;
    font-weight: 700;
    line-height: 48px;
    text-align: center;
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out .2s; }
  .company.partner.joe .machine-area p {
    margin-top: 16px;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: center;
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out .4s; }
  .company.partner.joe .machine-area.active .video, .company.partner.joe .machine-area.active .tit, .company.partner.joe .machine-area.active p {
    opacity: 1;
    transform: translate(0, 0); }
.company.partner.joe .video-area .video {
  margin-top: 120px;
  opacity: 0;
  transform: translate(0, 50px);
  transition: all .4s ease-in-out; }
  .company.partner.joe .video-area .video a {
    position: relative;
    display: block; }
    .company.partner.joe .video-area .video a::after {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
      display: inline-block;
      background-position: 0 -50px;
      background-repeat: no-repeat;
      content: '';
      width: 50px;
      height: 50px; }
    .company.partner.joe .video-area .video a::after {
      width: 60px;
      height: 60px; }
.company.partner.joe .video-area.active .video {
  opacity: 1;
  transform: translate(0, 0); }
.company.partner.joe .jgr-area {
  margin-top: 120px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/partner_joe_jgr_usa.jpg") center top no-repeat; }
  .company.partner.joe .jgr-area .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 200px; }
  .company.partner.joe .jgr-area .tit {
    font-size: 28px;
    font-weight: 700;
    line-height: 40px;
    color: #FFFFFF; }
    .company.partner.joe .jgr-area .tit p {
      margin-top: 12px;
      font-size: 16px;
      font-weight: 400;
      line-height: 24px; }
  .company.partner.joe .jgr-area .btn {
    padding-left: 40px;
    padding-right: 40px; }
.company.partner.fanuc#contents {
  padding-bottom: 0; }
.company.partner.fanuc .subvisual-area {
  height: 740px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/partner_fanuc_visual_usa.jpg") center top no-repeat; }
  .company.partner.fanuc .subvisual-area .inner {
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    line-height: 36px;
    color: #FFFFFF;
    text-align: center; }
    .company.partner.fanuc .subvisual-area .inner strong {
      display: block;
      padding-bottom: 40px;
      font-size: 72px;
      font-weight: 700;
      line-height: 92px; }
.company.partner.fanuc .product-area {
  margin-top: 120px; }
  .company.partner.fanuc .product-area h3.tit {
    font-size: 48px;
    font-weight: 700;
    line-height: 56px; }
  .company.partner.fanuc .product-area .txt-sub {
    margin-top: 20px;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px; }
  .company.partner.fanuc .product-area > ul > li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 56px 0;
    border-top: 1px solid #D4D4D4; }
    .company.partner.fanuc .product-area > ul > li:first-of-type {
      border-top: 0; }
    .company.partner.fanuc .product-area > ul > li .info {
      margin-left: 80px;
      width: 600px; }
      .company.partner.fanuc .product-area > ul > li .info .tit {
        display: block;
        font-size: 40px;
        font-weight: 700;
        line-height: 52px; }
      .company.partner.fanuc .product-area > ul > li .info .price {
        margin-top: 12px;
        display: block;
        font-size: 28px;
        font-weight: 700;
        line-height: 40px; }
      .company.partner.fanuc .product-area > ul > li .info p {
        margin-top: 8px;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px; }
      .company.partner.fanuc .product-area > ul > li .info .guidetxt {
        margin-top: 24px; }
      .company.partner.fanuc .product-area > ul > li .info .btn {
        margin-top: 40px;
        width: 300px; }
.company.partner.fanuc .certify-area {
  margin-top: 120px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/partner_fanuc_certify.jpg") center top no-repeat; }
  .company.partner.fanuc .certify-area .inner {
    display: flex;
    justify-content: space-between;
    padding: 48px 0 0 0;
    height: 290px; }
  .company.partner.fanuc .certify-area .tit {
    font-size: 28px;
    font-weight: 700;
    line-height: 40px;
    color: #FFFFFF; }
  .company.partner.fanuc .certify-area .guidetxt {
    width: 880px; }
    .company.partner.fanuc .certify-area .guidetxt ul {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
      .company.partner.fanuc .certify-area .guidetxt ul li {
        margin-top: 10px;
        padding: 0 20px 0 0;
        width: 60%;
        color: #FFFFFF; }
        .company.partner.fanuc .certify-area .guidetxt ul li::before {
          background-color: #FFFFFF; }
        .company.partner.fanuc .certify-area .guidetxt ul li:nth-of-type(2n) {
          width: 40%; }
    .company.partner.fanuc .certify-area .guidetxt .btn {
      margin-top: 46px;
      width: 300px; }
.company.technical .title-area {
  padding-top: 120px;
  text-align: center; }
  .company.technical .title-area .tit {
    font-size: 72px;
    font-weight: 700;
    line-height: 92px; }
  .company.technical .title-area .tit-sub {
    margin-top: 100px;
    font-size: 32px;
    font-weight: 700;
    line-height: 48px; }
.company.technical .technical-area {
  margin-top: 80px;
  text-align: center; }
  .company.technical .technical-area img {
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out; }
  .company.technical .technical-area .info {
    margin-top: 16px; }
    .company.technical .technical-area .info strong {
      display: block;
      padding-top: 16px;
      padding-bottom: 8px;
      font-size: 20px;
      font-weight: 700;
      line-height: 32px;
      opacity: 0;
      transform: translate(0, 50px);
      transition: all .4s ease-in-out .2s; }
      .company.technical .technical-area .info strong em {
        padding-top: 64px;
        font-size: 32px;
        font-weight: 700;
        line-height: 48px; }
    .company.technical .technical-area .info p {
      padding-top: 16px;
      font-size: 16px;
      font-weight: 400;
      line-height: 24px;
      opacity: 0;
      transform: translate(0, 50px);
      transition: all .4s ease-in-out .4s; }
  .company.technical .technical-area.active img, .company.technical .technical-area.active .info strong, .company.technical .technical-area.active .info p {
    opacity: 1;
    transform: translate(0, 0); }
.company.machine .title-area {
  padding-top: 120px;
  text-align: center; }
  .company.machine .title-area .tit {
    font-size: 72px;
    font-weight: 700;
    line-height: 92px; }
.company.machine .subvisual-area {
  margin-top: 80px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/machine_visual.jpg") center center no-repeat; }
  .company.machine .subvisual-area p {
    width: 100%;
    color: #FFFFFF;
    font-size: 72px;
    font-weight: 700;
    line-height: 92px;
    text-align: center; }
.company.machine .machine-area {
  margin-top: 80px;
  text-align: center; }
  .company.machine .machine-area .video {
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out; }
    .company.machine .machine-area .video a {
      position: relative;
      display: block; }
      .company.machine .machine-area .video a::after {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url("https://www.dn-solutions.com/resources/w/images/common/btn.png");
        display: inline-block;
        background-position: 0 -50px;
        background-repeat: no-repeat;
        content: '';
        width: 50px;
        height: 50px; }
      .company.machine .machine-area .video a::after {
        width: 60px;
        height: 60px; }
  .company.machine .machine-area .tit {
    margin-top: 60px;
    font-size: 32px;
    font-weight: 700;
    line-height: 48px;
    opacity: 0;
    transform: translate(0, 50px);
    transition: all .4s ease-in-out .2s; }
  .company.machine .machine-area .info {
    text-align: center; }
    .company.machine .machine-area .info strong {
      padding-top: 32px;
      padding-bottom: 12px;
      display: block;
      font-size: 20px;
      font-weight: 700;
      line-height: 32px;
      opacity: 0;
      transform: translate(0, 50px);
      transition: all .4s ease-in-out .4s; }
    .company.machine .machine-area .info p {
      padding-top: 12px;
      font-size: 16px;
      line-height: 24px;
      opacity: 0;
      transform: translate(0, 50px);
      transition: all .4s ease-in-out .6s; }
  .company.machine .machine-area.active .video, .company.machine .machine-area.active .tit, .company.machine .machine-area.active .info strong, .company.machine .machine-area.active .info p {
    opacity: 1;
    transform: translate(0, 0); }
.company.finance {
  padding-bottom: 0 !important; }
  .company.finance .subvisual-area {
    height: 502px;
    margin-bottom: 160px;
    background: url("https://www.dn-solutions.com/resources/w/images/company/finance_visual.jpg") center center no-repeat; }
    .company.finance .subvisual-area .inner p {
      font-size: 32px;
      line-height: 48px;
      font-weight: 700; }
    .company.finance .subvisual-area .inner .note.st01 {
      margin-top: 20px; }
  .company.finance .financeinfo-area {
    margin-top: 80px; }
    .company.finance .financeinfo-area h3.tit.visual {
      height: 360px;
      font-size: 42px;
      color: #fff;
      line-height: 51px;
      background-position: 50%;
      background-repeat: no-repeat;
      display: flex;
      align-items: center;
      justify-content: center; }
    .company.finance .financeinfo-area .scont {
      display: flex;
      flex-wrap: wrap; }
      .company.finance .financeinfo-area .scont figure {
        position: relative;
        margin-top: -92px;
        margin-left: 50px; }
      .company.finance .financeinfo-area .scont .txtarea {
        margin: 40px 0 0 90px;
        font-size: 24px;
        line-height: 36px; }
        .company.finance .financeinfo-area .scont .txtarea p strong {
          margin-top: 4px;
          display: block; }
        .company.finance .financeinfo-area .scont .txtarea ul.note {
          margin-top: 10px; }
      .company.finance .financeinfo-area .scont .btns {
        width: 100%;
        flex: none; }
    .company.finance .financeinfo-area .table-area {
      margin-top: 70px; }
      .company.finance .financeinfo-area .table-area .note {
        margin-top: 20px; }
    .company.finance .financeinfo-area .btns {
      margin-top: 40px; }
    .company.finance .financeinfo-area.cont01 h3.tit.visual {
      background-image: url("https://www.dn-solutions.com/resources/w/images/company/finance_cont01.jpg"); }
    .company.finance .financeinfo-area.cont02 h3.tit.visual {
      background-image: url("https://www.dn-solutions.com/resources/w/images/company/finance_cont02.jpg"); }
  .company.finance .financedetail-area {
    margin-top: 80px;
    padding: 120px 0 134px 0;
    background: #f8f8f8; }
    .company.finance .financedetail-area h3.tit {
      margin-bottom: 10px; }
      .company.finance .financedetail-area h3.tit img {
        mix-blend-mode: darken; }
      .company.finance .financedetail-area h3.tit figcaption {
        display: none; }
    .company.finance .financedetail-area h4.tit {
      margin-bottom: 20px;
      font-size: 40px;
      line-height: 60px; }
    .company.finance .financedetail-area .scont.line {
      margin-top: 80px;
      padding-top: 80px;
      border-top: 1px solid #d4d4d4; }
    .company.finance .financedetail-area .btns {
      margin-top: 80px;
      justify-content: flex-start; }
      .company.finance .financedetail-area .btns .btn {
        width: 120px; }

html:lang(zh) .company.about .title-area .tit {
  font-family: "Noto Sans SC";
  font-weight: 700; }
html:lang(zh) .company.about .title-area .tit-sub {
  font-family: "Noto Sans SC";
  font-weight: 700; }
html:lang(zh) .company.about.dn .subvisual-area .inner {
  font-family: "Noto Sans SC";
  font-weight: 700; }
  html:lang(zh) .company.about.dn .subvisual-area .inner strong {
    font-weight: 700; }
html:lang(zh) .company.about.dn .crafts-area li em {
  font-family: "Noto Sans SC";
  font-weight: 700; }
html:lang(zh) .company.about.dn .role-area .tit {
  font-family: "Noto Sans SC";
  font-weight: 700; }
html:lang(zh) .company.about.dn .network-area h3.tit {
  font-family: "Noto Sans SC";
  font-weight: 700; }
  html:lang(zh) .company.about.dn .network-area h3.tit p {
    font-family: "Noto Sans SC"; }
html:lang(zh) .company.about.dn .network-area .networkmap .icon-ripple {
  font-weight: 700; }
  html:lang(zh) .company.about.dn .network-area .networkmap .icon-ripple em {
    font-family: "Noto Sans SC"; }
html:lang(zh) .company.about.dn .network-area .networkmap span {
  font-family: "Noto Sans SC";
  font-weight: 700; }
html:lang(zh) .company.about.dn .network-area .networktxt .tit {
  font-family: "Noto Sans SC"; }
html:lang(zh) .company.about.dn .ourproducts-area h3.tit {
  font-family: "Noto Sans SC";
  font-weight: 700; }
  html:lang(zh) .company.about.dn .ourproducts-area h3.tit p {
    font-family: "Noto Sans SC"; }
html:lang(zh) .company.about.history .historycont-area .pic figcaption {
  padding-left: 350px; }
html:lang(zh) .company.about.whyus .lineup-area .propic-swiper .info small {
  font-family: "Noto Sans SC"; }
html:lang(zh) .company.about.china .subvisual-area {
  background: url("https://www.dn-solutions.com/resources/w/images/company/about_china_visual.jpg") center center no-repeat;
  text-align: center; }
  html:lang(zh) .company.about.china .subvisual-area strong {
    display: block;
    color: #FFFFFF;
    font-size: 64px;
    font-weight: 700;
    line-height: 76px; }
  html:lang(zh) .company.about.china .subvisual-area p {
    margin-top: 16px;
    color: #FFFFFF;
    font-size: 24px;
    font-weight: 400;
    line-height: 36px; }
html:lang(zh) .company.about.china .tabs.slide {
  margin-top: 60px; }
  html:lang(zh) .company.about.china .tabs.slide .swiper .swiper-slide a {
    margin-right: 72px; }
  html:lang(zh) .company.about.china .tabs.slide .swiper .swiper-slide:last-of-type a {
    margin-right: 0; }
html:lang(zh) .company.about.china .chinacompany-area {
  margin-top: 60px; }
  html:lang(zh) .company.about.china .chinacompany-area .companyinfo ul {
    display: flex;
    justify-content: center;
    padding: 60px;
    height: 404px;
    background: url("https://www.dn-solutions.com/resources/w/images/company/about_china_chinacompany.jpg") center top no-repeat; }
  html:lang(zh) .company.about.china .chinacompany-area .companyinfo li {
    padding: 0 12px;
    flex-shrink: 0; }
    html:lang(zh) .company.about.china .chinacompany-area .companyinfo li span {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 200px;
      height: 200px;
      position: relative; }
      html:lang(zh) .company.about.china .chinacompany-area .companyinfo li span::before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: 200px;
        height: 200px;
        background-color: #D4D4D4;
        vertical-align: top; }
      html:lang(zh) .company.about.china .chinacompany-area .companyinfo li span::before {
        background: linear-gradient(138deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.7) 46.35%, #FFF 80.21%);
        border: 1px solid rgba(255, 255, 255, 0.6);
        opacity: 0.6;
        mix-blend-mode: overlay;
        border-radius: 50%; }
    html:lang(zh) .company.about.china .chinacompany-area .companyinfo li strong {
      position: relative;
      color: #FFFFFF;
      font-size: 28px;
      font-weight: 700;
      line-height: 40px; }
    html:lang(zh) .company.about.china .chinacompany-area .companyinfo li p {
      padding-top: 20px;
      color: #FFFFFF;
      font-size: 20px;
      font-weight: 500;
      line-height: 32px;
      text-align: center; }
  html:lang(zh) .company.about.china .chinacompany-area .companyinfo p {
    padding-top: 60px;
    color: #444444;
    font-size: 20px;
    font-weight: 400;
    line-height: 32px; }
  html:lang(zh) .company.about.china .chinacompany-area .companylist {
    margin-top: 120px; }
    html:lang(zh) .company.about.china .chinacompany-area .companylist .tit {
      font-size: 40px;
      font-weight: 700;
      line-height: 60px; }
    html:lang(zh) .company.about.china .chinacompany-area .companylist > ul {
      margin-top: 40px;
      border-top: 2px solid #D4D4D4; }
      html:lang(zh) .company.about.china .chinacompany-area .companylist > ul > li {
        display: flex; }
        html:lang(zh) .company.about.china .chinacompany-area .companylist > ul > li:first-of-type > strong {
          padding-top: 60px; }
        html:lang(zh) .company.about.china .chinacompany-area .companylist > ul > li:first-of-type > ul {
          margin-top: 16px; }
          html:lang(zh) .company.about.china .chinacompany-area .companylist > ul > li:first-of-type > ul > li:first-of-type {
            border-top: 0; }
        html:lang(zh) .company.about.china .chinacompany-area .companylist > ul > li > strong {
          padding-top: 44px;
          width: 660px;
          color: #0B50F2;
          font-size: 64px;
          font-weight: 700;
          line-height: 80px; }
        html:lang(zh) .company.about.china .chinacompany-area .companylist > ul > li > ul {
          width: 620px; }
          html:lang(zh) .company.about.china .chinacompany-area .companylist > ul > li > ul > li {
            position: relative;
            padding: 66px 0 66px 156px;
            font-size: 24px;
            font-weight: 400;
            line-height: 36px;
            border-top: 1px solid #D4D4D4; }
            html:lang(zh) .company.about.china .chinacompany-area .companylist > ul > li > ul > li em {
              position: absolute;
              top: 60px;
              left: 0;
              font-size: 32px;
              font-weight: 700;
              line-height: 48px; }
html:lang(zh) .company.about.china .greeting-area .ceogreeting {
  display: flex;
  padding-top: 60px; }
  html:lang(zh) .company.about.china .greeting-area .ceogreeting figure {
    width: 350px;
    flex-shrink: 0; }
    html:lang(zh) .company.about.china .greeting-area .ceogreeting figure figcaption {
      margin-top: 12px;
      font-size: 18px;
      font-weight: 400;
      line-height: 32px; }
      html:lang(zh) .company.about.china .greeting-area .ceogreeting figure figcaption .txt-sign {
        position: relative;
        display: block;
        margin-top: 20px;
        text-align: right; }
        html:lang(zh) .company.about.china .greeting-area .ceogreeting figure figcaption .txt-sign span {
          position: relative;
          display: inline-block;
          width: 94px;
          height: 33px;
          vertical-align: middle;
          text-align: left;
          text-indent: -9999em; }
          html:lang(zh) .company.about.china .greeting-area .ceogreeting figure figcaption .txt-sign span::before {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-image: url("https://www.dn-solutions.com/resources/w/images/common/icon.png");
            display: inline-block;
            background-position: 0 0;
            background-repeat: no-repeat;
            content: '';
            width: 50px;
            height: 50px; }
          html:lang(zh) .company.about.china .greeting-area .ceogreeting figure figcaption .txt-sign span::before {
            width: 94px;
            height: 33px;
            background-image: url("https://www.dn-solutions.com/resources/w/images/company/about_china_ceo_sign.jpg"); }
  html:lang(zh) .company.about.china .greeting-area .ceogreeting .info {
    display: flex;
    padding-left: 120px;
    width: 930px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start; }
    html:lang(zh) .company.about.china .greeting-area .ceogreeting .info strong {
      display: block;
      font-size: 40px;
      font-weight: 700;
      line-height: 52px; }
    html:lang(zh) .company.about.china .greeting-area .ceogreeting .info p {
      padding-top: 60px;
      color: #444444;
      font-size: 20px;
      font-weight: 400;
      line-height: 32px; }
html:lang(zh) .company.network#contents {
  padding-bottom: 160px; }
html:lang(zh) .company.network .chmap-area {
  position: relative;
  margin-top: 60px;
  height: 737px;
  background: url("https://www.dn-solutions.com/resources/w/images/company/global_network_map_ch.png") center top no-repeat; }
  html:lang(zh) .company.network .chmap-area li {
    position: absolute;
    top: 0;
    left: 0; }
    html:lang(zh) .company.network .chmap-area li .icon-ripple {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 68px;
      height: 68px;
      text-align: center;
      font-size: 20px; }
      html:lang(zh) .company.network .chmap-area li .icon-ripple em {
        color: #FFFFFF;
        font-family: "Noto Sans SC";
        z-index: 5; }
      html:lang(zh) .company.network .chmap-area li .icon-ripple::before {
        width: 160%;
        height: 160%; }
      html:lang(zh) .company.network .chmap-area li .icon-ripple::after {
        width: 233%;
        height: 233%; }
    html:lang(zh) .company.network .chmap-area li strong {
      position: relative;
      color: #FFFFFF;
      font-style: normal;
      font-weight: 500;
      line-height: 32px;
      z-index: 3; }
    html:lang(zh) .company.network .chmap-area li:nth-of-type(1) {
      top: 410px;
      left: 620px; }
    html:lang(zh) .company.network .chmap-area li:nth-of-type(2) {
      top: 260px;
      left: 780px; }
      html:lang(zh) .company.network .chmap-area li:nth-of-type(2) .icon-ripple::before, html:lang(zh) .company.network .chmap-area li:nth-of-type(2) .icon-ripple::after {
        animation-delay: 1.5s; }
    html:lang(zh) .company.network .chmap-area li:nth-of-type(3) {
      top: 443px;
      left: 726px; }
      html:lang(zh) .company.network .chmap-area li:nth-of-type(3) .icon-ripple {
        width: 51px;
        height: 51px;
        font-size: 16px; }
        html:lang(zh) .company.network .chmap-area li:nth-of-type(3) .icon-ripple::before, html:lang(zh) .company.network .chmap-area li:nth-of-type(3) .icon-ripple::after {
          animation-delay: .5s; }
    html:lang(zh) .company.network .chmap-area li:nth-of-type(4) {
      top: 579px;
      left: 730px; }
      html:lang(zh) .company.network .chmap-area li:nth-of-type(4) .icon-ripple {
        width: 68px;
        height: 68px; }
        html:lang(zh) .company.network .chmap-area li:nth-of-type(4) .icon-ripple::before, html:lang(zh) .company.network .chmap-area li:nth-of-type(4) .icon-ripple::after {
          animation-delay: 1s; }
    html:lang(zh) .company.network .chmap-area li:nth-of-type(5) {
      top: 317px;
      left: 885px; }
      html:lang(zh) .company.network .chmap-area li:nth-of-type(5) .icon-ripple {
        width: 51px;
        height: 51px;
        font-size: 16px; }
    html:lang(zh) .company.network .chmap-area li:nth-of-type(6) {
      top: 408px;
      left: 863px; }
      html:lang(zh) .company.network .chmap-area li:nth-of-type(6) .icon-ripple {
        width: 68px;
        height: 68px; }
        html:lang(zh) .company.network .chmap-area li:nth-of-type(6) .icon-ripple::before, html:lang(zh) .company.network .chmap-area li:nth-of-type(6) .icon-ripple::after {
          animation-delay: .8s; }
    html:lang(zh) .company.network .chmap-area li:nth-of-type(7) {
      top: 475px;
      left: 890px; }
      html:lang(zh) .company.network .chmap-area li:nth-of-type(7) .icon-ripple {
        width: 51px;
        height: 51px;
        font-size: 16px; }
        html:lang(zh) .company.network .chmap-area li:nth-of-type(7) .icon-ripple::before, html:lang(zh) .company.network .chmap-area li:nth-of-type(7) .icon-ripple::after {
          animation-delay: 0.1 0.2s; }
    html:lang(zh) .company.network .chmap-area li:nth-of-type(8) {
      top: 215px;
      left: 933px; }
      html:lang(zh) .company.network .chmap-area li:nth-of-type(8) .icon-ripple {
        width: 51px;
        height: 51px;
        font-size: 16px; }
html:lang(zh) .company.network .tabs.slide {
  padding-top: 64px; }
  html:lang(zh) .company.network .tabs.slide .swiper-slide a {
    margin-right: 72px; }
html:lang(zh) .company.network .chlist-area .tit {
  padding: 120px 0 24px; }
  html:lang(zh) .company.network .chlist-area .tit:first-of-type {
    padding-top: 60px; }
html:lang(zh) .company.network .chlist-area ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: -28px; }
  html:lang(zh) .company.network .chlist-area ul li {
    margin-top: 28px;
    padding: 56px;
    width: 626px;
    min-height: 210px;
    border: 1px solid #D4D4D4; }
    html:lang(zh) .company.network .chlist-area ul li dl dt {
      padding-bottom: 12px;
      font-size: 28px;
      font-weight: 700;
      line-height: 40px; }
      html:lang(zh) .company.network .chlist-area ul li dl dt small {
        display: block;
        font-size: 20px;
        font-weight: 400;
        line-height: 32px; }
    html:lang(zh) .company.network .chlist-area ul li dl dd {
      display: flex;
      padding-top: 12px;
      color: #111111;
      font-size: 20px;
      line-height: 32px; }
      html:lang(zh) .company.network .chlist-area ul li dl dd > .icon {
        flex-shrink: 0;
        width: 40px;
        height: 40px; }
      html:lang(zh) .company.network .chlist-area ul li dl dd > span {
        flex-grow: 1;
        padding: 3px 0 0 16px;
        width: 458px; }
html:lang(zh) .company.reference .map-area .map-content .country.usa, html:lang(zh) .company.reference .map-area .map-content .country.korea, html:lang(zh) .company.reference .map-area .map-content .country.southeastasia {
  padding: 0 28px 0 60px;
  line-height: 56px; }
html:lang(zh) .company.csm.environmental {
  word-break: break-all; }
  html:lang(zh) .company.csm.environmental .management-area .scont.policy .guidetxt .guidetxt > p:not(.stit) {
    padding-left: 0; }
  html:lang(zh) .company.csm.environmental .management-area .scont.policy .guidetxt ol {
    margin-top: 40px; }
  html:lang(zh) .company.csm.environmental .management-area .scont.policy .guidetxt ol li {
    padding-left: 0; }
html:lang(zh) .company.csm.social {
  word-break: break-all; }
  html:lang(zh) .company.csm.social .synergy-area {
    padding-bottom: 160px;
    margin-bottom: -160px; }
html:lang(zh) .company.map .tab-contents li dl dt {
  width: 95px; }
html:lang(zh) .company.map .tab-contents li dl dd {
  width: calc(100% - 95px); }

html:lang(en) .company.about .title-area .tit {
  font-family: "Noto Sans KR";
  font-weight: 700; }
html:lang(en) .company.about .title-area .tit-sub {
  font-family: "Noto Sans KR";
  font-weight: 700; }
html:lang(en) .company.about.dn .subvisual-area .inner {
  font-family: "Noto Sans KR";
  font-weight: 700; }
  html:lang(en) .company.about.dn .subvisual-area .inner strong {
    font-weight: 700; }
html:lang(en) .company.about.dn .crafts-area li em {
  font-family: "Noto Sans KR";
  font-weight: 700; }
html:lang(en) .company.about.dn .role-area .tit {
  font-family: "Noto Sans KR";
  font-weight: 600; }
html:lang(en) .company.about.dn .network-area h3.tit {
  font-family: "Noto Sans KR";
  font-weight: 700; }
  html:lang(en) .company.about.dn .network-area h3.tit p {
    font-family: "Noto Sans KR"; }
html:lang(en) .company.about.dn .network-area .networkmap .icon-ripple {
  font-weight: 700; }
  html:lang(en) .company.about.dn .network-area .networkmap .icon-ripple em {
    font-family: "Noto Sans KR"; }
html:lang(en) .company.about.dn .network-area .networkmap span {
  font-family: "Noto Sans KR";
  font-weight: 700; }
html:lang(en) .company.about.dn .network-area .networktxt .tit {
  font-family: "Noto Sans KR"; }
html:lang(en) .company.about.dn .ourproducts-area h3.tit {
  font-family: "Noto Sans KR";
  font-weight: 700; }
  html:lang(en) .company.about.dn .ourproducts-area h3.tit p {
    font-family: "Noto Sans KR"; }
html:lang(en) .company.about.dn .ourproducts-area .btn-view {
  width: 250px; }
html:lang(en) .company.about.whyus .lineup-area .propic-swiper .info small {
  font-family: "Noto Sans SC"; }
html:lang(en) .company.about.whyus .customer-area p {
  padding-left: 700px; }
html:lang(en) .company.about.history .historycont-area .inner > ul > li:last-of-type > ul > li:last-of-type:after {
  top: 21px; }
html:lang(en) .company.csm.environmental .management-area .scont.policy .guidetxt ol {
  margin-top: 40px; }
html:lang(en) .company.csm.environmental .management-area .scont.policy .guidetxt .guidetxt > p:not(.stit) {
  padding-left: 0; }
html:lang(en) .company.csm.environmental .management-area .scont.policy .guidetxt ol li {
  padding-left: 0; }
html:lang(en) .company.csm.environmental .management-area .scont.group .guidetxt strong {
  font-size: 16px;
  line-height: 24px; }
html:lang(en) .company.csm.environmental .management-area .scont.group .guidetxt ul li {
  font-size: 14px;
  line-height: 20px; }
html:lang(en) .company.csm.social .synergy-area {
  padding-bottom: 160px;
  margin-bottom: -160px; }
html:lang(en) .company.management .menagetxt.menagetxt6 strong.txt-sign span {
  width: 153px; }
  html:lang(en) .company.management .menagetxt.menagetxt6 strong.txt-sign span::before {
    width: 153px;
    height: 43px;
    background-position: -150px -200px; }
html:lang(en) .company.map .tab-contents li dl dt {
  width: 100px; }
html:lang(en) .company.map .tab-contents li dl dd {
  width: calc(100% - 100px); }

html:lang(de) .company.about .title-area .tit {
  font-family: "Noto Sans";
  font-weight: 700; }
html:lang(de) .company.about .title-area .tit-sub {
  font-family: "Noto Sans";
  font-weight: 700; }
html:lang(de) .company.about.dn .subvisual-area .inner {
  font-family: "Noto Sans";
  font-weight: 700; }
  html:lang(de) .company.about.dn .subvisual-area .inner strong {
    font-weight: 700; }
html:lang(de) .company.about.dn .crafts-area li em {
  font-family: "Noto Sans";
  font-weight: 700; }
html:lang(de) .company.about.dn .role-area .inner {
  padding-top: 90px; }
html:lang(de) .company.about.dn .role-area .tit {
  font-family: "Noto Sans";
  font-weight: 600; }
html:lang(de) .company.about.dn .network-area h3.tit {
  font-family: "Noto Sans";
  font-weight: 700; }
  html:lang(de) .company.about.dn .network-area h3.tit p {
    font-family: "Noto Sans"; }
html:lang(de) .company.about.dn .network-area .networkmap .icon-ripple {
  font-weight: 700; }
  html:lang(de) .company.about.dn .network-area .networkmap .icon-ripple em {
    font-family: "Noto Sans"; }
html:lang(de) .company.about.dn .network-area .networkmap span {
  font-family: "Noto Sans";
  font-weight: 700; }
html:lang(de) .company.about.dn .network-area .networktxt .tit {
  font-family: "Noto Sans"; }
html:lang(de) .company.about.dn .ourproducts-area h3.tit {
  font-family: "Noto Sans";
  font-weight: 700; }
  html:lang(de) .company.about.dn .ourproducts-area h3.tit p {
    font-family: "Noto Sans"; }
html:lang(de) .company.about.whyus .lineup-area .propic-swiper .info small {
  font-family: "Noto Sans"; }
html:lang(de) .company.about.whydn .dnshop-area .inner {
  padding-top: 30px; }
html:lang(de) .company.about.whydn .meet-area .shop-swiper .swiper-wrapper .swiper-slide figure .cover {
  padding: 25px; }
html:lang(de) .company.about.history .historycont-area .pic figcaption {
  padding-left: 280px; }
html:lang(de) .company.csm.esg .manage-area .scont h4.tit {
  width: 460px; }
html:lang(de) .company.csm.esg .certify-area .certify-info {
  padding-left: 440px; }
html:lang(de) .company.csm.environmental .respond-area .visual p {
  width: 700px; }
html:lang(de) .company.csm.environmental .respond-area .goal figure figcaption p {
  font-size: 26px;
  line-height: 30px; }
html:lang(de) .company.csm.environmental .management-area .scont.policy .guidetxt ol {
  margin-top: 40px; }
html:lang(de) .company.csm.environmental .management-area .scont.policy .guidetxt .guidetxt > p:not(.stit) {
  padding-left: 0; }
html:lang(de) .company.csm.environmental .management-area .scont.policy .guidetxt ol li {
  padding-left: 0; }
html:lang(de) .company.csm.environmental .management-area .scont.group .guidetxt ul li {
  padding-left: 8px;
  padding-right: 8px; }
html:lang(de) .company.csm.environmental .management-area .scont.group .guidetxt strong {
  font-size: 16px;
  line-height: 24px; }
html:lang(de) .company.csm.environmental .management-area .scont.group .guidetxt ul li {
  font-size: 14px;
  line-height: 20px; }
html:lang(de) .company.csm.social .synergy-area {
  padding-bottom: 160px;
  margin-bottom: -160px; }
html:lang(de) .company.map .tab-contents li dl dt {
  width: 100px; }
html:lang(de) .company.map .tab-contents li dl dd {
  width: calc(100% - 100px); }