@charset "UTF-8";

/* 코티코 주걱턱 솔루션 */
#sub {
  main {
    &.orthodontic_01 {
      .section04 {
          .flex {
            display: flex;
            justify-content: center;
            gap: 2.2rem;

            li {
              background: #F3F4FA;
              padding: 3rem 0 0 0;
              border-radius: 5rem;
              overflow: hidden;

              h4 {
                font-size: 2.4rem;
                font-weight: 800;
                padding-bottom: 2rem;
                line-height: 1.4;
                color: var(--font_222);
                height: 8rem;
                display: flex;
                align-items: center;
                justify-content: center;
              }

              p {
                background: var(--color_1);
                color: var(--fff);
                padding: 3rem 0;
                font-size: 1.8rem;
                font-weight: 600;
              }

              img {
                border-radius: 0;
                display: block;
              }

              &:first-child {
                p {
                  background: var(--font_666);
                }
              }
            }
          }
        .playWrap {
          position: relative;

          i {
            position: absolute;
            color: var(--fff);
            font-size: 16rem;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
          }

          img {
            border-radius: 5rem;
            display: block;
          }
        }
      }

      .section05 {
        .imgWrap {
          position: relative;
          margin-bottom: 4rem;

          h5 {
            position: absolute;
            top: 100%;
            left: 50%;
            transform: translate(-50%, -150%);
            color: var(--fff);
            font-size: 3rem;
            font-weight: 800;
            line-height: 160%;
            letter-spacing: -0.15rem;

            span {
              font-size: 2.2rem;
              letter-spacing: -0.1rem;
            }
          }

          img {
            border-radius: 5rem;
            display: block;
          }
        }

        ul.checkList {
          margin-top: 2rem;
          margin-bottom: 0;

          li {
            min-width: 53rem;
          }

        }
      }

      .section06 {
        .inwrap {
          ul {
            display: flex;
            align-items: flex-end;
            gap: 2rem;

            li {
              div {
                position: relative;
                margin-bottom: -2.5rem;
              }

              p {
                font-size: 2.2rem;
                font-weight: 700;
                line-height: 140%;
                /* 30.8px */
                letter-spacing: -0.11rem;
                position: absolute;
                top: 60%;
                left: 50%;
                transform: translate(-55%, -160%);
              }

              &:nth-child(2) {
                p {
                  transform: translate(-53%, -121%);
                }
              }

              &:nth-child(3) {
                p {
                  transform: translate(-53%, -94%);
                }
              }

              >img {
                border-radius: 5rem;
                display: block;
              }
            }

            +div {
              margin-top: 4rem;
              display: flex;
              justify-content: center;
              gap: 2rem;

              a.viewMore-btn {
                font-weight: 800;
                width: 34rem;
                font-size: 2.4rem;
                /* transform: scale(1.2); */
                padding: .7em 2em;
              }
            }
          }
        }
      }
    }

    &.orthodontic_02 {
      .section02 {
        .subTit {}

        .flex {
          gap: 4rem;
          display: flex;
          justify-content: center;
          margin-top: 5rem;


          li {
            background: var(--color_1);
            position: relative;
            border-radius: 60rem;
            padding: 3rem 5rem 7rem;

            img {
              display: block;
              border-radius: 0;
            }

            h5 {
              position: absolute;
              left: 0;
              right: 0;
              color: var(--fff);
              font-weight: 800;
              font-size: 2.5rem;
            }

            &:nth-child(2) {
              background: var(--color_2);
            }

            &:nth-child(3) {
              background: var(--color_4);
            }
          }
        }
      }

      .section03 {
        .checkList {

          margin-bottom: 0;
        }
      }

      .section04 {
        .flex {
          display: flex;
          align-items: center;
          max-width: 1022px;
          margin: 2rem auto;
        }

        .checkList {
          margin-bottom:0;
          li {
            width: 50rem;
          }

        }
      }

      .section05 {
        .owl-carousel {
          .item {
            background: var(--color_1);
            border: 10px solid var(--color_1);
            border-radius: 5rem;
            overflow: hidden;

            h5 {
              margin-top: -35px;
              color: #fff;

            }

            .twentytwenty-container {
              padding-bottom: 5rem;
            }

            .twentytwenty-left-arrow {
              bottom: 45px;
            }

            .twentytwenty-horizontal {
              .twentytwenty-handle:before {
                background: var(--gray);
                bottom: 6rem;
                font-weight: 800;
              }

              .twentytwenty-handle:after {
                background: var(--color_4);
                bottom: 6rem;
                font-weight: 800;
              }

              .twentytwenty-left-arrow:before {
                content: "\f25a";
                font-family: 'icon-font';
                font-size: 3rem;
              }
            }


          }

          .owl-dots {
            /* position: absolute; */
            /* bottom: 0; */
            text-align: center;
            width: 100%;
            margin-top: 20px;

            .owl-dot {
              width: 20px;
              height: 20px;
              border-radius: 30px;
              background: #ccc;
              display: inline-block;
              margin: 0 5px;
              -webkit-transition: all 0.3s;
              -moz-transition: all 0.3s;
              -ms-transition: all 0.3s;
              -o-transition: all 0.3s;
              transition: all 0.3s;

              span {
                display: none;
              }

              &.active {
                width: 60px;
                background: #5abbc4;
              }
            }
          }

        }



      }
      .section06 {
        ul{
          margin-top:4em;
          border-radius:5rem;
          overflow:hidden;
        }
      }
    }

    &.orthodontic_03 {
      .section01 {
        .inwrap {
          ul.date {
            display: flex;
            justify-content: center;
            align-items: center;


            li {
              display: flex;
              flex-direction: column;
              justify-content: center;
              width: 26rem;
              height: 26rem;
              border: 1px solid var(--color_1);
              border-radius: 100rem;
              position: relative;


              p {
                font-size: 2.4rem;
                font-weight: 800;
                color: var(--font_333);
                line-height: 1.4;
              }

              h4 {
                font-size: 5rem;
                font-weight: 800;
                color: var(--font_333);

                &:before {
                  content: '';
                  width: 10rem;
                  height: 1px;
                  display: block;
                  background: var(--font_222);
                  margin: 2rem auto 1rem auto;
                }
              }

              &:last-child {

                &:before {
                  content: '';
                  left: 1rem;
                  right: 1rem;
                  position: absolute;
                  border: 1px solid var(--fff);
                  border-radius: 100rem;
                  top: 1rem;
                  bottom: 1rem;
                }

                background: var(--color_1);
                color: var(--fff);
                width: 35rem;
                height: 35rem;
                padding: 1rem;
                margin-left: -4rem;

                p {
                  color: var(--fff);
                  font-size: 3.2rem;
                }

                h4 {
                  color: var(--fff);

                  &:before {
                    background: var(--fff);
                  }
                }
              }
            }
          }

          >ul.photo {
            display: flex;
            gap: 2rem;
            margin-top: 4rem;








            img {
              display: block;
              border-radius: 3rem;
            }

            >li {
              padding: 3rem;
              border-radius: 5rem;



              h3 {
                color: var(--fff);
                font-size: 3rem;
                font-weight: 800;
                margin-bottom: 2rem;
                /* display: flex; */
                justify-content: center;
                align-items: center;
                gap: 3rem;
              }

              &:first-child {
                background: var(--gray_3);

                h3 {
                  color: var(--font_333);
                }
              }

              &:last-child {
                background: var(--color_1);
              }
            }
          }
        }
      }

      .section02 {
        .inwrap {
          .flex {
            display: flex;
            justify-content: center;
            gap: 2.2rem;

            li {
              background: #F3F4FA;
              padding: 3rem 0 0 0;
              border-radius: 5rem;
              overflow: hidden;

              h4 {
                font-size: 2.4rem;
                font-weight: 800;
                padding-bottom: 2rem;
                line-height: 1.4;
                color: var(--font_222);
                height: 8rem;
                display: flex;
                align-items: center;
                justify-content: center;
              }

              p {
                background: var(--color_1);
                color: var(--fff);
                padding: 3rem 0;
                font-size: 1.8rem;
                font-weight: 600;
              }

              img {
                border-radius: 0;
                display: block;
              }

              &:first-child {
                p {
                  background: var(--font_666);
                }
              }
            }
          }

          .checkList {
            margin-bottom: 0;

            li {
              min-width: 44.5rem;
            }


          }
        }
      }

      .section03 {
        .inwrap {
          .flex {
            display: flex;
            align-items: center;
            justify-content: center;


            .checkList {
              font-size: 2.2rem;
              margin-bottom: 0;
              margin-top: 0;
              max-width: 55rem;







              li {
                min-width: 55rem;
              }
            }
          }

        }
      }

      .section04 {
        .inwrap {
          .flex {
            display: flex;
            justify-content: center;
            font-size: 3rem;
            gap: 0;

            >li {
              background: rgba(151, 131, 192, 0.80);
              color: var(--fff);
              padding: 3rem 10rem;
              border-radius: 10rem;
              width: 65rem;
              display: flex;
              align-items: center;
              justify-content: center;
              line-height: 1.2em;
              font-weight: 700;

              &:last-child {
                background: rgba(40, 183, 196, 0.80);
                margin-left: -7rem;
                position: relative;
                font-size: 4rem;
                font-weight: 800;

                &:before {
                  content: '+';
                  position: absolute;
                  left: 14px;
                  font-size: 6rem;
                  font-weight: 800;
                }
              }
            }
          }

          >p {
            &:before {
              content: '\E819\E819';
              font-family: 'icon-font';
              letter-spacing: -.85em;
              font-size: 8rem;
              position: absolute;
              -webkit-transform: rotate(90deg);
              transform: rotate(90deg);
              margin-left: -1.4rem;
              margin-top: -3rem;
            }


          }

          >h4 {
            font-size: 4rem;
            font-weight: 800;
            margin-top: 13rem;
            margin-bottom: 5rem;
            color: var(--font_333);


























            span {
              color: var(--color_1);
            }
          }

          .stepList {
            display: flex;
            justify-content: center;
            gap: 2rem;
            align-items: center;

            >li {
              >div {
                background: var(--color_1);
                font-size: 3rem;
                color: var(--fff);
                aspect-ratio: 1 / 1;
                width: 24rem;
                border-radius: 20rem;
                display: flex;
                align-items: center;
                justify-content: center;
                position: relative;
                line-height: 1.4;
                font-weight: 800;

                &:before {
                  content: '';
                  position: absolute;
                  border: 1px solid var(--fff);
                  left: 1rem;
                  right: 1rem;
                  top: 1rem;
                  bottom: 1rem;
                  border-radius: 20rem;
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  z-index: 1;
                }

              }

              span.num {
                position: absolute;
                font-size: 15rem;
                font-weight: 900;
                font-family: 'Tangerine', cursive;
                right: 0px;
                top: -60px;
                line-height: 1;
                color: var(--gray_3);
                z-index: -1;
              }


              &:nth-child(2) {
                >div {
                  background: var(--color_2);
                }

              }

              &:nth-child(3) {
                >div {
                  background: var(--color_3);
                }
              }

              &:nth-child(4) {
                >div {
                  background: var(--color_4);
                }

              }


            }
          }
        }



      }

      .section05 {
        .inwrap {
          .left_img {
            margin-bottom: 5rem;
            display: inline-flex;

            >li {
              text-align: left;
              flex: auto;

              h3 {
                font-size: 4rem;
                color: var(--font_222);
                font-weight: 800;
                padding-left: 2rem;
              }

              h4 {
                font-size: 2.4rem;
                font-weight: 800;
                color: var(--color_1);
                margin-bottom: 3rem;
                padding-left: 2rem;
              }

              .flex {
                display: flex;
                justify-content: center;
                font-size: 3rem;
                gap: 0;

                >li {
                  background: var(--color_2);
                  color: var(--fff);
                  padding: 1rem 6rem;
                  border-radius: 10rem;
                  /* width: 65rem; */
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  line-height: 1em;
                  font-weight: 700;
                  /* border: 3px solid var(--fff); */

                  &:nth-child(2) {
                    /* position: absolute; */
                    /* left: 14px; */
                    font-size: 6rem;
                    /* font-weight: 800; */
                    width: 90px;
                    margin: 0 -4rem;
                    z-index: 1;
                    background: var(--color_4);
                    border: 5px solid var(--fff);
                    padding: 1rem 0;
                  }

                  &:last-child {
                    background: var(--color_1);
                  }
                }


              }

              >ul+ul {
                font-size: 2rem;
                gap: 1rem;
                border-top: 2px solid var(--line);
                padding-top: 4rem;
                border-bottom: 2px solid var(--line);
                padding-bottom: 4rem;
                max-width: 60.8rem;
                margin-top: 5rem;

                >li {
                  padding: 0;
                  min-width: 0;
                  background: none;
                  color: var(--font_666);
                  gap: 1rem;
                  font-weight: 600;
                  letter-spacing: -.03em;
                  padding: 0 2rem;
                  
                  
                  
                  
                  
                  
                  

                  i {
                    font-size: 2.4rem;
                    color: var(--color_2);
                  }

                  &:nth-child(4n-4) i {
                    color: var(--color_3);
                  }

                  &:nth-child(4n-3) i {
                    color: var(--color_4);
                  }

                  &:nth-child(4n-2) i {
                    color: var(--color_1);
                  }
                }

              }
            }



          }

          >.checkList {
            li {
              width: 45%;
            }
          }
        }

        .owl-carousel {
          background: var(--bg);
          padding: 10rem 0;
        }
      }
      .section06 {
      img {
        border-radius: 5rem;
      }
     }
    }

    &.orthodontic_04 {
      .section01 {
        ul.flex {
          max-width: 860px;
          margin: 0 auto;

          li {
            background: var(--bg2);
            border-radius: 5rem;
            overflow: hidden;
            color: var(--fff);

            img {
              display: block;
            }

            h5 {
              color: var(--font_333);
              padding: 5rem 0 2rem;




              b {
                color: var(--color_1);
                font-weight: 800;
              }
            }

            img+h5 {
              padding: 2rem 0 3rem;
              font-size: 2.4rem;
            }

            h3 {
              background: var(--color_1);
              font-size: 3.4rem;
              font-weight: 800;
              padding: 2rem 0;
            }
          }
        }
      }

      .section02 {
        .left_img {
          margin-bottom: 6rem;
        }
      }

      .section03 {
        .inwrap {
          .left_img {
            >li {
              &:first-child {
                flex: 1.2;
              }

              &:last-child {
                img {
                  margin-top: 4rem;
                }
              }
            }
          }
        }
      }

      .section04 {
        h5.tit {

          margin-top: 8rem;

          margin-bottom: 5rem;

        }
      }

      .section05 {
        .subTit {
          &+img {
            border-radius: 5rem;
          }
        }

        .checkList {
          li {
            min-width: 54rem;
          }
        }

        ul.flex {
          background: var(--bg);
          border-radius: 5rem;
          padding: 5rem;
          display: flex;
          align-items: center;




          li {
            flex: 1;
            text-align: left;


            img {
              border-radius: 3rem;
              display: block;

            }

            h4 {
              font-size: 2.4rem;
              color: var(--font_222);
              font-weight: 700;
              margin-bottom: 3rem;
              line-height: 1.4em;
            }

            p {
              font-size: 1.8rem;
              margin-bottom: 3rem;

              b {
                color: var(--color_1);
                font-size: 2rem;
              }

              &+p {
                margin-bottom: 0;
              }
            }
          }
        }
      }

      .section06 {
        .checkList {
          font-size: 2.2rem;
          li {
            min-width: 58rem;
          }
        }

        .reviewList {
          display: flex;
          align-items: flex-end;
          gap: 2rem;
          flex-wrap: wrap;
          justify-content: center;
          li {
            div {
              position: relative;
              margin-bottom: -2.5rem;
            }
            p {
              font-size: 2rem;
              font-weight: 700;
              line-height: 140%;
              /* 30.8px */
              letter-spacing: -0.05rem;
              position: absolute;
              top: 60%;
              left: 50%;
              transform: translate(-52%, -98%);
              width: 80%;
            }
            h6{
              margin-top:2rem;
              i{
                margin-right:1rem;
                color: var(--color_1);
              }
            }


            &:nth-child(3) {
              p {
                transform: translate(-53%, -84%);
              }
            }

            &:nth-child(4) {
              p {
                transform: translate(-53%, -89%);
              }
            }

            >img {
              border-radius: 2rem;
              display: block;
            }
          }

          +div {
            margin-top: 4rem;
            display: flex;
            justify-content: center;
            gap: 2rem;

            a.viewMore-btn {
              font-weight: 800;
              width: 34rem;
              font-size: 2.4rem;
              /* transform: scale(1.2); */
              padding: .7em 2em;
            }
          }
        }
      }
    }

    &.orthodontic_05 {
      .section02 {
        .inwrap {
          .left_img {
            margin-bottom: 5rem;
            display: inline-flex;

            >li {
              text-align: left;
              flex: auto;

              h3 {
                font-size: 4rem;
                color: var(--font_222);
                font-weight: 800;
                padding-left: 2rem;
              }

              h4 {
                font-size: 2.4rem;
                font-weight: 800;
                color: var(--color_1);
                margin-bottom: 3rem;
                padding-left: 2rem;
              }

              >ul {
                font-size: 2rem;
                gap: 1rem;
                border-top: 2px solid var(--line);
                padding-top: 4rem;
                border-bottom: 2px solid var(--line);
                padding-bottom: 4rem;
                max-width: 50.8rem;

                >li {
                  padding: 0;
                  min-width: 0;
                  background: none;
                  color: var(--font_666);
                  gap: 1rem;
                  font-weight: 600;
                  letter-spacing: -.03em;
                  padding: 0 2rem;

                  i {
                    font-size: 2.4rem;
                    color: var(--color_2);
                  }

                  &:nth-child(4n-4) i {
                    color: var(--color_3);
                  }

                  &:nth-child(4n-3) i {
                    color: var(--color_4);
                  }

                  &:nth-child(4n-2) i {
                    color: var(--color_1);
                  }
                }

              }

            }
          }
        }
      }

      .section03 {
        .inwrap {
          ul.flex {
            background: var(--bg2);
            border-radius: 5rem;
            margin-top: 15rem;
            text-align: right;
            display: flex;
            align-items: center;

            li {
              img {
                display: block;
                margin-top: -12rem;
              }

              &:last-child {
                padding: 10rem 0;

                h3 {
                  font-size: 4rem;
                  font-weight: 800;
                  color: var(--font_222);
                  line-height: 1.3;
                  margin-bottom: 5rem;
                  border-bottom: 1px solid var(--font_222);
                  padding-bottom: 4rem;
                }

                p {
                  font-size: 2rem;
                  margin-top: 3rem;
                  color: var(--font_333);
                  font-weight: 600;

                  b {
                    background: var(--color_1);
                    color: var(--fff);
                    font-weight: 800;
                    padding: .4rem;
                  }
                }
              }
            }
          }
        }
      }

      .section04 {
        .inwrap {
          >.flex {
            align-items: center;


            >li {
              h4 {
                font-size: 4rem;
                font-weight: 800;
                color: var(--font_222);
                margin: 1em 0;
                margin-bottom: 5rem;
                border-bottom: 1px solid var(--font_222);
                padding-bottom: 2rem;
              }

              p {
                font-size: 2rem;
                margin-top: 3rem;
                color: var(--font_222);

                b {
                  font-weight: 800;
                }
              }
            }
          }
        }
      }

      .section05 {
        .inwrap {
          ul.flex {
            display: inline-flex;
            justify-content: center;
            flex-wrap: wrap;


            li {
              img {
                border: 1px solid var(--line);
                display: block;
                max-width: 400px;
                border-radius: 5rem 5rem 0 0;
                border-bottom: 0;
              }

              h5 {
                background: var(--color_1);
                color: var(--fff);
                padding: .5em;
                border-radius: 0 0 5rem 5rem;
                font-weight: 800;
              }

            }

          }
        }
      }

      .section06 {
        .inwrap {
          ul.flex {
            background: #fdd86e;
            border-radius: 5rem;
            align-items: center;
            padding: 0 5rem;

            >li {
              h6 {
                display: inline-block;
                background: var(--fff);
                filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
                position: relative;
                padding: 1.5rem 2rem;
                border-radius: 15px;
                margin-top: 10rem;
                margin-right: 10rem;
                margin-bottom: 3rem;
                font-weight: 800;
                line-height: 1.4;

                img {
                  position: absolute;
                  right: 0;
                  top: 0;
                  transform: translate(50%, -50%);
                  border-radius: 0;
                }
              }

              img {
                border-radius: 0;
                display: block;
                margin: 0 auto;
              }

              &:last-child {
                margin-left: -5rem;


                h5 {
                  font-size: 3.6rem;
                  font-weight: 800;
                  color: var(--font_222);
                  line-height: 1.3;
                  margin: 4rem 0 2rem;
                }

                p {
                  font-size: 2rem;
                  margin-top: 3rem;
                  color: var(--font_333);
                  font-weight: 600;
                  margin-bottom: 4rem;

                  b {
                    background: var(--color_1);
                    color: var(--fff);
                    font-weight: 800;
                    padding: .4rem;
                  }
                }

                ul {
                  display: flex;
                  position: relative;
                  z-index: 1;
                  flex-direction: column;
                  gap: 1em;

                  li {
                    background: var(--fff);
                    color: var(--font_222);
                    font-size: 1.4em;
                    font-weight: 600;
                    padding: .4em;
                    border-radius: 60rem;
                  }
                }
              }

            }
          }
        }
      }

      .section07 {
        .inwrap {
          .subTit {
            margin-bottom: 0;
          }
          .flex{
            justify-content: center;
          }
          h4 {
            font-size: 3rem;
            padding: .4rem 4rem;
            border-radius: 10rem;
            display: inline-block;
            background: var(--color_4);
            color: var(--fff);
            margin-bottom: 4rem;
            margin-top: 8rem;
            font-weight: 600;
          }
        }
      }

      .section08{
        .checkList{
          margin-bottom:0;
          li{
            width: 100%;
            max-width: 260px;
          }
        }
      }
    }
  }
}




  @media (max-width: 768px) {
    #sub {
      main {
        &.orthodontic_01 {
          .section04 {
            .flex{
                li{
                  border-radius:3rem;
                  padding-top: 01rem;
                  
                  h4{
                    font-size: 1.8rem;
                    padding-bottom: 0;
                  }
                  p{
                    padding: 1rem 0;
                    font-size: 1.4rem;
                  }
                }
              }
            .playWrap {
              i {
                font-size: 6rem;
              }

              img {
                border-radius: 3rem;
              }
            }
          }

          .section05 {
            .imgWrap {
              margin-bottom: 2rem;

              h5 {
                font-size: 1.4rem;
                left: 0;
                right: 0;
                transform: translate(0%, -130%);

                span {
                  font-size: 1.8rem;
                }
              }

              img {
                border-radius: 3rem;
              }


            }

            h4.NotoSerifKR {
              font-size: 2rem;
            }

            ul.checkList {
              li {
                min-width: 23rem;
                text-align: center;

                span {
                  flex: 1;
                }
              }
            }
          }

          .section06 {
            .inwrap {
              ul {
                flex-direction: column;

                li {
                  >div {
                    p {
                      font-size: 1.6rem;
                    }

                    img {
                      width: 18rem;
                    }
                  }

                  >img {
                    border-radius: 3rem;
                  }
                }

                +div {
                  flex-direction: column;
                  margin-top: 2rem;
                  gap: 1rem;

                  a.viewMore-btn {
                    width: 100%;
                    font-size: 1.8rem;
                    padding: .7em 0;
                  }
                }
              }
            }
          }
        }

        &.orthodontic_02 {
          .section02{
            .flex{
               flex-wrap: wrap;
               flex-direction: row;
               gap: 0;
               margin-top: 1rem;
               gap: 2%;
              li{
                padding: 1rem 2rem 3rem;
                width: 32%;
                display: inline-block;
                text-align: center;
                h5{
                  font-size: 1.4rem;
                  margin-top: -0.4rem;
                }
                img{
                  margin:0 auto;
                }
              }
            
             
            }
          }
          .section03 {
            .checkList {
              li {
                width: 27rem;
              }
            }

            .photoList {
              gap: 1rem;

              li {
                width: calc(50% - .5rem);
                border-radius: 1.5rem;

                h6 {
                  font-size: 1.4rem;
                }

                p {
                  font-size: 1.4rem;
                }
              }
            }
          }

          .section04 {
            .checkList {
                li {
                  width: 30rem;
                min-width: 51%;
                }
            ;
                margin-bottom: 0;
            }
          }

          .section05 {
            & .owl-carousel {
              .item {
                border-radius: 3rem;

                .twentytwenty-container {
                  padding-bottom: 4rem;

                  .twentytwenty-handle {
                    height: 97%;

                  }

                  .twentytwenty-handle:before {
                    font-size: 1.2rem;
                    bottom: 5rem;
                    margin-left: -7rem;
                  }
                  .twentytwenty-handle:after {
                    font-size: 1.2rem;
                    bottom: 5rem;
                    margin-right: -7rem;
                  }
                }
              }
            }
          }
          .section06{
            ul{
              margin-top:3rem;
              border-radius:2rem;
            }
          }
        }

        &.orthodontic_03 {
          .section01{
            .inwrap{
              ul.date{
                display:flex;
                flex-direction: column;
                li{
                  height: 15rem;
                  width: 15rem;
                  p{
                    font-size: 1.6rem;
                  }
                  h4{
                    font-size: 2.4rem;
                    &:before{
                      margin: 1rem auto .5rem auto;
                    }
                  }
                  &:last-child{
                     height:auto;
                     margin: 0;
                     width: 20rem;
                     height: 20rem;
                     margin-top: -2rem;
                    &:before{
                      left:.5rem;
                      right:.5rem;
                      top:.5rem;
                      bottom:.5rem;
                    }
                  p{
                        font-size:2rem;
                      }
                  }
                
                  
                }
              }

              ul.photo{
                display:flex;
                flex-direction: column;
                margin-top: 2rem;
                > li{
                  padding:2rem;
                  border-radius:3rem;
                  img{
                    border-radius:2rem;
                  }
                  h3{
                    font-size: 2.2rem;
                    line-height: 1.2;
                    span{
                      display: block;
                      font-size: 1.6rem;
                    }
                  }
                }
              }
            }
          }
          .section02{
            .inwrap{
              .flex{
                li{
                  border-radius:3rem;
                  padding-top: 01rem;
                  
                  h4{
                    font-size: 1.8rem;
                    padding-bottom: 0;
                  }
                  p{
                    padding: 1rem 0;
                    font-size: 1.4rem;
                  }
                }
              }
              .checkList{
                li{
                  min-width:29rem;
                }
              }
            }
          }
          .section03{
            .inwrap{
              .flex{
                .checkList{
                li{
                  font-size: 1.6rem;
                  min-width: 29rem;
                  line-height: 1.4;
                }
              }
              
              }
            }
          }
          .section04{
            .inwrap{
              .flex{
                font-size:2rem;
                gap: 2rem;
                > li{
                  width: auto;
                  padding: 2rem 0rem;

                  &:last-child{
                    font-size: 2.4rem;
                    margin: 0;
                    
                    &:before{
                      top: -10px;
                      background: var(--yellow);
                      left: 50%;
                      font-size: 5rem;
                      width: 5rem;
                      line-height: 5rem;
                      border-radius: 10rem;
                      transform: translate(-50%,-50%);
                    }
                  }
                }
              }
              > h4{
                font-size: 2.4rem;
                margin-top: 6rem;
                margin-bottom: 3rem;
              }
              > p{
                &:before{
                  font-size: 5rem;
                }
              }
              .stepList{
                flex-wrap: wrap;
                gap: 1rem;
                > li{
                  width: 48%;
                  span.num{
                    font-size: 10rem;
                    top: -5rem;
                    right: 5px;
                  }
                  > div{
                    font-size:2rem;
                    width: auto;
                    &:before{
                      top: .5rem;
                      left: .5rem;
                      right: .5rem;
                      bottom: .5rem;
                    }
                  }
                }
              }
            }
            
          }
          .section05{
            .inwrap{
              .left_img{
                display: flex;
                flex-direction: column;
                margin-top: 4rem;
                gap: 2rem;
                margin-bottom: 4rem;
                
                > li{
                  > img{
                    border-radius: 3rem;
                  }
                  h3{
                    font-size: 3rem;
                    text-align: center;
                    padding: 0;
                  }
                  h4{
                    font-size: 1.8rem;
                    text-align: center;
                    padding: 0;
                  }
                  .flex{
                    display: flex;
                    align-items: center;
                    font-size: 2.4rem;
                    > li{
                      padding: 3rem 1rem;
                      width: 24rem;
                       &:nth-child(2){
                        width: 6rem;
                        font-size: 3rem;
                        margin: -2rem 0;
                      }
                    }
                   
                  }
                  > ul + ul{
                    margin-top: 4rem;
                    font-size: 1.4rem;
                    padding: 3rem 0;
                    line-height: 1.2;
                    
                    li{
                      text-align: left;
                      padding: 0;
                      display: flex;
                      align-items: flex-start;
                      gap: .6rem;
                      i{
                        font-size: 2rem;
                      }
                    }
                  }
                }
              }
              >.checkList{
                >li{
                width:100%;  
                }
              }
            }
            .owl-carousel{
              padding: 5rem 0;
              
            }
            .owl-theme .owl-nav{
                display:none;
              }
          }
          .section06{
            .inwrap{
              .left_img{
                display: flex;
                flex-direction: column;
                margin-top: 2rem;
                gap: 2rem;
                li{
                  img{
                    border-radius:3rem;
                  }
                }
              }
            }
          }
        }
        &.orthodontic_04{
          .section01{
            .inwrap{
              ul.flex{
                margin-top:3rem;
                
                
                > li{
                  border-radius:3rem;
                  h5{
                    padding: 2rem 0;
                  }  
                  h3{
                    font-size: 2.4rem;
                    padding: 1rem 0;
                  }
                }
                
              }
            }
          }
          .section02{
            .inwrap{
              .left_img{
                flex-direction: column;
                gap: 2rem;
                margin-top: 3rem;
                margin-bottom: 3rem;
                
                > li{
                  img{
                    border-radius: 3rem;
                  }
                }
              }
            }
          }
          .section03{
            .inwrap{
              .left_img{
                flex-direction: column;
                gap: 2rem;
                margin-top: 3rem;
                margin-bottom: 0;
                > li{
                  img{
                    border-radius: 3rem;
                  }
                }
              }
            }
          }
          .section04{
            .inwrap{
              .left_img{
                flex-direction: column;
                gap: 2rem;
                margin-top: 3rem;
                margin-bottom: 0;
                > li{
                  img{
                    border-radius: 3rem;
                  }
                }
              }
              h5.tit{
                margin-top:3rem;
                margin-bottom:2rem;
                &:before, &:after{
                  display: none;
                }
              }
            }
          }
          .section05{
            .subTit{
               &+img {
                border-radius: 3rem;
              }
            }
            h4{
                margin-top: 0;
              }
            .checkList{
              li{
                min-width:100%;
              }
            }
            ul.flex{
              border-radius: 3rem;
              padding: 2rem;
              li{
                img{
                  border-radius:2rem;
                }
                h4{
                  font-size:1.6rem;
                  margin-bottom: 2rem;
                }
                p{
                  font-size: 1.4rem;
                  margin-bottom: 1rem;
                  & + p{
                    b{
                      font-size: 1.3rem;
                    }
                 
                    text-align: center;
                   
                  }
                }
              }
            }
          }
          .section06{
            .checkList{
              font-size: 1.4rem;
              li{
                min-width: 100%;
              }
            }
            .reviewList{
              li{
                > div{
                  width:200px;
                  left: 50%;
                  margin-left: -100px;
                  
                  p{
                    font-size:1.4rem;
                  }
                
                }
                h6{
                  font-size:1.4rem;
                  margin-top: 1rem;
                  i{
                    display:none;
                  }
                }  
              }
              
            }
            
            
          }
        }
        &.orthodontic_05{
          .section02{
            .inwrap{
              .left_img{
                display:flex;
                flex-direction: column;
                margin-top: 3rem;
                gap: 3rem;
                
                li{
                  img{
                    border-radius:3rem;
                  }
                  h3{
                    text-align: center;
                    font-size: 3rem;
                    padding: 0;
                    line-height: 1.2;
                  }
                  h4{
                    text-align: center;
                    font-size: 2rem;
                    padding: 0;
                    margin-bottom: 2rem;
                  }
                  > ul{
                    font-size: 1.6rem;
                    padding-top: 3rem;
                    padding-bottom: 3rem;
                    
                    li{
                      padding:0;
                      text-align: left;
                      gap: .5rem;
                      i{
                        font-size:1.8rem;
                      }
                    }
                  }
                }
              }
              h6{
                font-size: 1.6rem;
              }
            }
          }
          .section03{
            .inwrap{
              ul.flex{
                gap:0;
                align-items: stretch;
                border-radius: 3rem;
                li{
                  img {
                    border-radius: 0;
                  }
                  &:last-child{
                    padding: 4rem 1.5rem;
                    text-align: center;
                    
                    
                    
                    
                    h3{
                      font-size: 2rem;
                      padding-bottom: 2rem;
                      margin-bottom: 2rem;
                    }
                    p{
                      font-size: 1.4rem;
                      margin-top: 1rem;
                    }
                  }
                }
              }
            }
          }
          .section04{
            .inwrap{
              > .flex{
                > li{
                  > ul{
                    flex-direction: row;
                    margin-top: -14rem;
                    gap:1rem;
                    > li {
                      img {
                        border-radius:2rem;
                        
                      }
                    }
                  }
                  > div {
                   h4{
                     margin-top: 1rem;
                     font-size: 2rem;
                     margin-bottom: 2rem;
                     padding-bottom: 1rem;
                   } 
                    p{
                      font-size: 1.4rem;
                      margin-top: 1rem;
                    }
                  }
                }
              }
            }
          }
          .section05{
            .inwrap{
              ul.flex{
                li{
                  img{
                    border-radius:3rem 3rem 0 0;
                    width: 100%;
                  }
                  h5{
                    border-radius: 0 0 3rem 3rem;
                    font-size: 1.8rem;
                  }
                }
              }
            }
          }
          .section06{
            .inwrap{
              ul.flex{
                border-radius: 3rem;
                padding: 0;
                flex-direction: column-reverse;
                overflow: hidden;
                
                
                > li {
                  padding: 0 2rem;
                  h6{
                    margin-top: 3rem;
                    margin-right: 0;
                    margin-bottom: 1rem;
                  }
                  &:last-child{
                    margin-left: 0;
                    padding-bottom: 0;
                    padding-top: 4rem;
                    
                    
                    
                    
                    
                    h5{
                      font-size: 2.4rem;
                      margin-top: 2rem;
                      margin-bottom: 1rem;
                    }
                    p{
                      font-size: 1.6rem;
                      margin-top: 1rem;
                      margin-bottom: 2rem;
                    }
                    ul{
                      display: flex;
                      flex-wrap: wrap;
                      flex-direction: row;
                      gap: 1rem .5rem;
                      justify-content: center;
                      
                      
                      
                      
                      
                      
                      
                      
                      
                      
                      li{
                        font-size: 1.4rem;
                        width: 49%;
                      }
                    }
                  }
                }
              }
            }
          }
          .section07{
            .inwrap{
              h4{
                font-size: 2rem;
                margin-top: 2rem;
                margin-bottom: 2rem;
                padding: .3rem 2.5rem;
              }
            }
          }
          .section08{
            
          }
        }
      }
    }
  }