@keyframes forwardRotate {
    from {
      transform: rotate(0deg), translate(-50% -50%);
    }

    to {
      transform: rotate(360deg);
    }
  }

  @keyframes reverseRotate {
    from {
      transform: rotate(-0deg);
    }

    to {
      transform: rotate(-360deg);
    }
  }

  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translate3d(0, 30%, 0);
    }

    to {
      opacity: 1;
      transform: translateZ(0);
    }
  }


  @keyframes fadeInMild {
    from {
      opacity: 0.5;
    }

    to {
      opacity: 1;
    }
  }

  @keyframes move {
    from {
      transform: translate3d(0, 0, 0);
    }

    to {
      transform: translate3d(55px, 0, 0);
    }
  }

  @keyframes bg {
    100% {
      background: #016DF9;
    }
  }

  @keyframes color {
    0% {
      color: #000;
    }

    100% {
      color: #016DF9;
    }
  }

    @font-face {
    font-family: 'KIMM_Bold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2212@1.0/KIMM_Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
  }


    #IBMxRedhat_m {
      width: 750px;
      margin: 0 auto;
      overflow-x: hidden;

      .inner {
        width: 670px;
        margin: 0 auto;
      }


      main {
        text-align: center;

        h2 {
          font-size: 90px;
          font-weight: 700;
        }

        h3 {
          font-size: 50px;
          font-weight: 700;

          span {
            color: #1E9EFF;
          }
        }

        h4 {
          font-size: 40px;
          font-weight: 500;
        }

        h5 {
          font-size: 30px;
          font-weight: 300;
        }

        h2,
        h3,
        h4,
        h5,
        p,
        td,
        .caption {
          color: #fff;
          letter-spacing: -0.02em;
        }

        .caption {
          font-size: 18px;
        }

        section.init {
          text-align: left;

          .initTitle {
            background: url(/m/home/images/main/ibm/new/m_init_bg.jpg) no-repeat center;
            padding: 100px 0 480px 0;
            margin-top: 110px;
            margin-bottom: -1px;

            p,
            span,
            h2,
            h5 {
              font-family: 'KIMM_Bold';
            }

            h2 {
              span {
                color: #1E9EFF;
              }
            }

            .sup {
              color: #AFAFAF;
              font-size: 20px;
              padding-bottom: 15px;
            }

            h2 {
              letter-spacing: -2.8px;
              padding-bottom: 25px;
              line-height: 105px;
            }

            .btnCont {
              background: #E6E6E6;
              display: flex;
              align-items: center;
              border-radius: 15px;
              padding: 15px 30px;
              margin: 40px 0 0 0;

              span,
              .zero {
                animation: color 2.2s alternate infinite ease-in-out;
              }

              .radioBg {
                animation: bg 2.2s alternate infinite ease-in-out;
              }

              span {
                color: #000;
                font-size: 44px;
              }

              p {
                color: #000;
                font-size: 24px;
                line-height: 25px;
              }

              .zero {
                flex: 0.4;
                padding-left: 15px;
              }

              .apply {
                flex: 1;
              }

              .radio {
                width: 155px;
                height: 36px;
                background-color: #dbdbdb;
                border-radius: 50px;
                padding: 12px;
                box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4) inset;
                margin-left: 48px;

                .radioBg {
                  background: #989898;
                  width: 130px;
                  height: 12px;
                  border-radius: 50px;
                  position: relative;
                  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7) inset;

                  .radioBtn {
                    background: url(/m/home/images/main/ibm/new/m_init_btn.png) no-repeat center;
                    width: 80px;
                    height: 29px;
                    position: absolute;
                    top: -9px;
                    left: -1px;
                    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
                    border-radius: 50px;
                    animation: move 2.2s alternate infinite ease-in-out;
                  }
                }
              }
            }
          }
          /* // initTitle */

          .initCont {
            .initBg {
              background: #000;
              position: absolute;
              z-index: -1;
              width: 750px;
              height: 840px;

              .purDot {
                background: url(/m/home/images/main/ibm/new/m_init_pdot.png) no-repeat center;
                width: 382px;
                height: 382px;
                margin: 0 auto;
                margin-top: -50px;
                animation: fadeInMild 1s alternate infinite ease-in-out;
              }
            }

            .title {
              text-align: center;
              padding-top: 100px;

              h3 {
                padding-bottom: 10px;
                font-size: 40px;
              }

              h5 {
                padding-bottom: 80px;
                font-size: 28px;
                font-weight: 400;

                span {
                  font-size: 20px;

                  span {
                    font-weight: 200;
                  }
                }
              }
            }

            .cont {
              padding-bottom: 80px;

              .ani {
                animation: fadeInUp 1.8s;
              }

              ul {
                margin: 0 auto;

                li {
                  display: flex;
                  align-items: center;
                  gap: 20px;
                  padding: 0 0 30px 60px;
                  text-align: left;

                  h5 {
                    padding-left: 20px;
                    line-height: 40px;
                    font-weight: 500;
                  }

                  .time {
                    font-size: 24px;
                    color: #fff;
                  }
                }

                li:last-child {
                  padding-bottom: 0;
                }

                li:first-child h5 {
                  padding-top: 30px;
                }
              }

              span {
                color: #C5C5C5;
              }

              .icon01 {
                width: 48px;
                height: 56px;
                background: url(/m/home/images/main/ibm/new/m_init_icon01.png) no-repeat center;
              }

              .icon02 {
                width: 48px;
                height: 56px;
                background: url(/m/home/images/main/ibm/new/m_init_icon02.png) no-repeat center;
              }

              .icon03 {
                width: 48px;
                height: 56px;
                background: url(/m/home/images/main/ibm/new/m_init_icon03.png) no-repeat center;
              }

              .icon04 {
                width: 48px;
                height: 56px;
                background: url(/m/home/images/main/ibm/new/m_init_icon04.png) no-repeat center;
              }

              .icon05 {
                width: 48px;
                height: 56px;
                background: url(/m/home/images/main/ibm/new/m_init_icon05.png) no-repeat center;
              }
            }
          }
          /* // initCont */

            .initBanner {
				background: #1B1B1B;
				padding: 40px 0;
				
				ul {
					li {
						display: flex; 
                        gap: 40px;
                        width: 750px;
					    justify-content: center;
					    align-items: flex-start;
                        position: relative;
						
						.icon {width: 115px;
							img {width: 100%;image-rendering: crisp-edges;}
						}
						.txt {padding-top: 20px;width:311px;
							.main-txt {
								.top {
									span {font-size: 18px;font-weight: 300;
										&.t1 {color: #46ACFF;font-weight: 500;}
										&.line {margin-left: 10px;text-decoration: line-through;}
										&.low-level {color: #666;}
									}
								}
								strong {margin-top: 6px;display: block;font-size: 32px;font-weight: 600;color: #fff;letter-spacing: -0.01em;}
							}
							.sub-txt {
								margin-top: 8px;
								p {font-size: 14px;font-weight: 500;letter-spacing: -0.01em;line-height: 1.4;color: #d8d8d8;white-space: nowrap;}
							}
						}
					}
                    li:nth-child(2) {
                        /*padding:30px;*/
                    }
				}
			}
          /* // initBanner */
        }
        /* // init */

       .ai {
        text-align: center;

        .aiHead {
          background: #000;
          padding-bottom: 80px;
          margin-bottom: -1px;

          h3 {
            padding-top: 80px;
          }

          p {
            font-size: 24px;
            font-weight: 200;
            padding-top: 20px;

            span {
              color: #1E9EFF;
              font-weight: 600;
            }
          }

          .aiSlide {
            display: flex;
            margin: 50px 0 0 55px;

            li {
              margin-right: 25px;

              p {
                padding-top: 40px;
              }
            }
          }
        }

        .aiCont {

          h5 {
            padding-bottom: 20px;
          }

          p {
            font-size: 24px;
            font-weight: 200;
          }

          .source {
            font-size: 18px;
          }

          .aiBg {
            background: #000;
            position: absolute;
            z-index: -2;
            width: 750px;
            height: 5610px;
            overflow: hidden;

            .blueDot {
              background: url(/m/home/images/main/ibm/new/m_ai_bdot.png) no-repeat center;
              width: 500px;
              height: 500px;
              animation: fadeInMild 1s alternate infinite ease-in-out;
              position: absolute;
              z-index: -1;
              top: 110px;
              right: -140px;
            }

            .purDot {
              background: url(/m/home/images/main/ibm/new/m_ai_pdot.png) no-repeat center;
              width: 715px;
              height: 680px;
              animation: fadeInMild 1s alternate infinite ease-in-out;
              position: absolute;
              z-index: -1;
              bottom: 360px;
              left: -330px;
            }
          }

          .aiTable {
            .unit {
              text-align: right;
              padding-right: 50px;
            }

            img {
              padding: 10px 0;
            }

            h3 {
              padding-bottom: 65px;

              span {
                color: #1E9EFF;
              }
            }
          }

          .aiRank {
            padding-top: 80px;

            img {
              padding-bottom: 80px;
            }
          }

          .aiGraph {
            padding-bottom: 80px;

            .sup {
              padding-bottom: 15px;
            }

            h3 {
              padding: 5px 0 40px 0;
            }

            h5 {
              padding-top: 50px;
            }

            .cirGraph {
              padding-top: 50px;
            }

            .sub {
              padding-bottom: 60px;
            }

            .now {
              padding-bottom: 20px;
            }
          }
        }
      }

      /* // ai */



      .curriHead {
        background: #000;
        text-align: center;
        margin-bottom: -1px;

        .sup {
          color: #227AD7;
          font-weight: 400;
          padding-bottom: 15px;
        }

        h3 {
          padding-bottom: 50px;
        }

        .curriBox {
          width: 670px;
          gap: 2px;
          margin: 0 auto;

          p {
            text-align: left;
          }

          .box {
            position: relative;
            overflow: hidden;
            transition: 0.3s ease;
          }

          .box.active .boxQ {
            background: #CA0202;
          }

          .boxQ {
            padding: 30px;
            background: #333;
            transition: 0.5s;
            border-radius: 10px;
            margin-bottom: 2px;
          }

          .boxTitle {
            margin: 0;
            font-size: 30px;
            line-height: 27px;
          }

          .boxA {
            border-radius: 10px;
            background-color: #ffffff;
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-in-out;

            p,
            td {
              line-height: 24px;
              font-size: 18px;
              font-weight: 300;
              color: #666;
            }

            .purpose {
              margin: 30px;
            }

            table {
              border-collapse: collapse;
              width: 610px;
              margin: 30px;

              td {
                border: 1px solid #c8c8c8;
              }

              td:nth-child(1) {
                background: #FFF2F2;
                width: 150px;
                color: #333;
              }

              td:nth-child(2) {
                text-align: left;
                padding: 20px 0 20px 20px;
                color: #666;

                .container {
                  display: flex;
                  gap: 30px;
                }
              }
            }

            span {
              font-weight: 600;
              color: #F91818;
            }
          }

          .boxTxt {
            padding: 0.5rem 1rem;
            color: #666;
            font-size: 1rem;
          }

          .box.active .boxA {
            max-height: 1100px;
            transition: max-height 0.3s ease-in-out;
          }

          .boxBtn {
            cursor: pointer;
            border: none;
            padding: 35px 35px 35px 610px;
            display: flex;
            justify-content: center;
            align-items: center;
            position: absolute;
            top: 0;
            right: 0;
            background: none;
          }

          .boxBtn:focus {
            outline: 0
          }

          .boxIcon.open {
            display: none;
          }

          .box.active .boxIcon.open {
            color: #ffffff;
            display: block;
          }

          .box.active .boxIcon.close {
            display: none;
          }
        }
      }

      /* //curriHead */


      .curriTail {
        background: #000;
        padding-top: 80px;
        position: relative;
        text-align: center;
        position: relative;
        margin-bottom: -1px;

        img {
          margin: 0 auto;
        }

        .sup {
          font-size: 24px;
          font-weight: 200;
          padding-bottom: 15px;
        }

        .curriEdge {
          width: 380px;
          height: 380px;
          position: absolute;
          border-radius: 50%;
          margin: 35% auto;
          top: 21.6%;
          left: 24.5%;


          .edge_wrap {
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            border-radius: 50%;
          }

          .edge_box {
            position: absolute;
            top: -20.5%;
            left: -21%;
            width: 145%;
            height: 145%;
            animation: forwardRotate 30s linear infinite;
            line-height: 1rem;
            border-radius: 50%;
            /* border: 1px solid red; */

            div {
              width: 165px;
              height: 165px;
              font-size: 18px;
              color: #426190;
              animation: reverseRotate 30s linear infinite;
              /* border: 1px solid red; */
              border-radius: 50%;
              align-content: center;

              p {
                letter-spacing: -0.5px;
                color: #fff;
                padding-top: 10px;
                font-weight: 200;
                letter-spacing: -0.7px;
              }
            }
          }

          .edge_box1 {

            div {
              position: relative;
              top: -12%;
              left: 54%;
            }
          }

          .edge_box2 {
            div {
              position: relative;
              top: 16.5%;
              left: 81%;
            }
          }

          .edge_box3 {
            div {
              position: relative;
              top: 54.5%;
              left: 81%;
            }
          }

          .edge_box4 {
            div {
              position: relative;
              top: 81%;
              left: 53%;
            }
          }

          .edge_box5 {
            div {
              position: relative;
              top: 81%;
              left: 15%;
            }
          }

          .edge_box6 {
            div {
              position: relative;
              top: 54.5%;
              left: -10%;
            }
          }

          .edge_box7 {
            div {
              position: relative;
              top: 16.5%;
              left: -11%;
            }
          }

          .edge_box8 {
            div {
              position: relative;
              top: -11%;
              left: 15%;
            }
          }
        }
      }

      /* //curriTail */


      .benefit {
        background: #000;
        text-align: center;
        margin-bottom: -1px;

        .sup {
          font-size: 24px;
          font-weight: 200;
          padding-bottom: 15px;
        }

        ul {
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          gap: 55px 30px;
          padding: 50px 0 40px 0;
        }
      }

      /* // benefit */


      .photo {
        p {
          font-size: 24px;
          font-weight: 200;
          padding-top: 20px;

          span {
            font-weight: 500;
          }
        }

        .photoBg {
          background: #000;
          width: 750px;
          height: 1080px;
          position: absolute;
          z-index: -2;
          overflow: hidden;
        }

        h3 {
          padding-top: 50px;
        }

        .orangeDot {
          background: url(/m/home/images/main/ibm/new/m_photo_odot.png)no-repeat center;
          position: absolute;
          width: 825px;
          height: 750px;
          right: -200px;
          animation: fadeInMild 1s alternate infinite ease-in-out;
        }

        .line {
          width: 670px;
          height: 2px;
          background: #666;
          margin: 0 auto;
        }

        .slider {
          margin: 75px 0 50px 0;

          .slick-slide img {
            margin: 0 auto;
            border-radius: 20px;
          }

          .slick-prev:before {
            content: '';
            display: block;
            background: url(/m/home/images/main/ibm/new/arrowL.png) no-repeat center;
            width: 35px;
            height: 57px;
          }

          .slick-next:before {
            content: '';
            display: block;
            background: url(/m/home/images/main/ibm/new/arrowR.png) no-repeat center;
            width: 35px;
            height: 57px;
          }
        }

        .thumb {
          width: 750px;
          margin-top: 50px;

          img {
            width: 134px;
            height: 92px;
            border-radius: 2px;
          }

          .slick-slide {
            filter: opacity(50%);
            width: 164px;
          }

          .slick-center {
            filter: brightness(100%);
          }

          .slick-slide img {
            margin: 0 auto;
          }
        }
      }
      /* // photo */


      .step {
        background: #000;
        padding-bottom: 80px;
        margin-bottom: -1px;

        h3 {
          padding: 50px 0 15px 0;
        }

        p {
          font-size: 24px;
        }

        ul {
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 35px;
          padding: 60px 0;

          li p {
            padding-top: 10px;
          }

          li:nth-child(1) p,
          li:nth-child(4) p {
            height: 58px;
          }

          li:nth-child(4) {
            p {
              color: #0BD800;
            }
          }
        }

        .caption {
          font-size: 18px;
          font-weight: 200;
          line-height: 24px;
          background: #333;
          width: 580px;
          padding: 15px 0;
          margin: 0 auto;
          border-radius: 10px;
        }
      }
      /* // step */



      .guide {
        padding: 60px 0 40px 0;
        background: #222;

        h3,
        h5 {
          color: #fff;
        }

        p {
          font-size: 24px;
          color: #999;
          padding: 10px 0 60px 0;
        }

        span {
          color: #999;
          font-size: 24px;
          font-weight: 400;
          display: inline-block;
          padding-top: 5px;
        }

        h5 {
          font-weight: 600;
          display: inline-block;
          text-align: left;
          vertical-align: top;
          padding: 35px 0 0 15px;
          margin-bottom: 60px;
        }

        li:last-child h5 {
          margin-bottom: 0;
        }
      }
      /* // guide */



        .faq {
          background: #FBFBFB;
          text-align: left;
          overflow: hidden;

          p {
            text-align: left;
          }

          .faqTitle {
            text-align: center;
            font-size: 55px;
            font-weight: 600;
            color: #222;
            padding-top: 100px;
          }

          .accordian {
            padding: 50px 0 100px 0;
          }

          details[open] .question::after {
            transform: translate(0, -50%) rotate(180deg);
          }

          .question {
            cursor: pointer;
            font-size: 32px;
            font-weight: 600;
            color: #222;
            padding: 20px 30px;
            background: #fff;
            border-top: 1px solid #E8ECEE;
            border-bottom: 2px solid #E8ECEE;

            p {
              color: #222;
              display: inline-block;
              margin-top: 2px;
              line-height: 40px;
            }

            &::before {
              content: '';
              display: block;
              float: left;
              width: 40px;
              height: 41px;
              background-image: url(/m/home/images/main/ibm/question.png);
              margin-right: 20px;
            }

            &::after {
              content: '';
              display: block;
              float: right;
              width: 25px;
              height: 16px;
              background: url(/m/home/images/main/ibm/more.png) no-repeat center / cover;
              margin-top: 14px;
            }
          }/*question */

          .firstQ {
            border-top: 2px solid #a2a2a2;
          }

          .lastQ {
            border-bottom: 2px solid #a2a2a2;

            .question {
              border-bottom: none;
            }

            .answer {
              border-top: 2px solid #E8ECEE;
            }
          }


          .answer {
            background: #F0FBFF;
            font-size: 26px;
            font-weight: 300;
            color: #444;
            padding: 40px 50px;
            line-height: 38px;
          }
        }/*faq */
      }/*main */

      .contact {
        position: relative;

        img {
          width: 750px;
        }

        .btn {
          width: 420px;
          height: 100px;
          background: #1b1b1b;
          border-radius: 60px;
          display: flex;
          justify-content: center;
          align-items: center;
          position: absolute;
          left: 50%;
          transform: translateX(-50%);
          bottom: 367px;

          img{
            width: 670px;
          }
        }
      }/*contact */
    }/*IBMxRedhat_m */

      .topBtn, .mainBtn {
        border: none;
        width: 100px;
        height: 100px;
        background-color: rgba(92, 100, 114, 0.5);
        background-image: url(/m/home/images/main/top_btn.png);
        border-radius: 50%;
        cursor: pointer;
        z-index: 50;
        position: fixed;
        right: 50px;
        bottom: 180px;
        display: none;
      }


    /*타이머 */
    .timer{
        position: fixed;
        bottom: 0;
        z-index: 99;

        .timerCont{
          width: 750px;
          margin: 0 auto;
          background: #E41915;
          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 40px;
          border-top-right-radius: 20px;
          border-top-left-radius: 20px;

          p{
            color: #fff;
            font-size: 25px;
            font-weight: 600;
          }

          .day,.h,.m,.s{
              padding-left:10px;
          }
                    
          button{
            border: none;
            background-color: #fff;
            padding: 15px 30px;
            border-radius: 5px;
            font-size: 25px;
            font-weight: 600;
            cursor: pointer;
            color: #222;
          }          
        }
      }

      .footerCont{
        height: 160px;
        align-content: center;
  
        pre {
          font-size: 18px;
          line-height: 26px;
          color: #666;
        }
      }


   .footerCont-m {
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    font-size: 18px;
    line-height: 30px;
    letter-spacing: -0.3px;
    box-sizing: border-box;
    padding: 15px 12px;
    border-top:2px solid #000;
    }

    .footer-list-m {
    display: flex;
    flex-direction: column;
    gap: 6px;
    }

    .footer-list-m .label {
    font-weight: 600;
    color: #222;
    margin-right: 6px;
    display: inline-block;
    width: 110px; /* label 길이 일정하게 */
    }

    .footer-list-m .value {
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    }

    .footer-list-m div {
    display: flex;
    align-items: center;
    }

      /*타이머 */