/*--------------------------------------------------------------

# About One

--------------------------------------------------------------*/

.about-one {

    position: relative;

    display: block;

    padding: 120px 0 120px;

    z-index: 1;

}



.about-one__shape-1 {

    position: absolute;

    top: 50%;

    left: 0;

    transform: translateY(-50%);

    z-index: -1;

}



.about-one__shape-1 img {

    width: auto;

    animation: topBottom 3s ease-in-out infinite;

}



.about-one__shape-2 {

    position: absolute;

    top: 50%;

    right: 0;

    transform: translateY(-50%);

    z-index: -1;

}



.about-one__shape-2 img {

    width: auto;

    animation: topBottom 3s ease-in-out infinite;

}



.about-one__left {

    position: relative;

    display: block;

    margin-top: 21px;

    z-index: 1;

}



.about-one__left-shape-1 {

    position: absolute;

    top: 27px;

    left: 44px;

    width: 492px;

    height: 492px;

    border: 1px solid var(--fistudy-primary);

    border-radius: 50%;

}



.about-one__img-box {

    position: relative;

    display: block;

    margin-right: 47px;

}



.about-one__img {

    position: relative;

    display: block;

    overflow: hidden;

    border-radius: 15px;

    z-index: 1;

}



.about-one__img::before {

    background: rgba(255, 255, 255, 0.3);

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 0;

    opacity: 1;

    z-index: 9;

    pointer-events: none;

}



.about-one__img-box:hover .about-one__img::before {

    height: 100%;

    opacity: 0;

    -webkit-transition: all 400ms linear;

    transition: all 400ms linear;

}



.about-one__img img {

    width: 100%;

    border-radius: 15px;

    transition: .5s ease;

    transform: scale(1.05);

}



.about-one__img-box:hover .about-one__img img {

    transform: scale(1);

}



.about-one__awards-box {

    position: relative;

    display: block;

    background: #FFFFFF;

    box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.09);

    border-radius: 12px;

    margin-right: 41px;

    margin-left: 68px;

    padding: 18px 23px 21px;

    margin-top: 24px;

}



.about-one__awards-box::before {

    content: "";

    position: absolute;

    top: 8px;

    left: 8px;

    right: 8px;

    bottom: 8px;

    border: 1px dashed var(--fistudy-bdr-color);

    border-radius: 12px;

}



.about-one__awards-count-box {

    position: relative;

    display: flex;

    align-items: flex-start;

}



.about-one__awards-count-box h3 {

    font-family: var(--fistudy-font-two) !important;

    font-size: 48px;

    font-weight: 700;

    font-style: italic;

    line-height: 48px !important;

}



.about-one__awards-count-box span {

    font-family: var(--fistudy-font-two) !important;

    font-size: 48px;

    font-weight: 700;

    font-style: italic;

    line-height: 48px !important;

    color: var(--fistudy-black);

}



.about-one__awards-box p {

    font-size: 14px;

    font-weight: 500;

    line-height: 14px;

    font-family: var(--fistudy-font-two);

    font-style: italic;

    color: var(--fistudy-base);

    margin-top: 2px;

}



.about-one__experience-box {

    position: relative;

    display: block;

    max-width: 225px;

    width: 100%;

    margin-left: -38px;

    margin-top: 13px;

    margin-bottom: 20px;

}



.about-one__experience-box-inner {

    position: relative;

    display: flex;

    align-items: center;

    gap: 15px;

    background: #FFFFFF;

    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);

    border-radius: 45px;

    padding: 17px 20px 19px;

    z-index: 1;

}



.about-one__experience-box-shape {

    position: absolute;

    top: 6px;

    left: 6px;

    right: -6px;

    bottom: -6px;

    border: 2px solid var(--fistudy-black);

    border-radius: 45px;

    z-index: -1;



}



.about-one__experience-icon {

    position: relative;

    display: block;

}



.about-one__experience-icon img {

    width: auto;

    transition: all 500ms linear;

    transition-delay: 0.1s;

    transform: scale(1);

}



.about-one__experience-box-inner:hover .about-one__experience-icon img {

    transform: scale(0.9);

}



.about-one__experience-count-box {

    position: relative;

    display: block;

}



.about-one__experience-count {

    position: relative;

    display: flex;

    align-items: center;

}



.about-one__experience-count h3 {

    font-size: 24px;

    font-weight: 600;

    line-height: 24px !important;

    font-family: var(--fistudy-font-two) !important;

}



.about-one__experience-count span {

    font-size: 24px;

    font-weight: 600;

    line-height: 24px !important;

    font-family: var(--fistudy-font-two) !important;

    color: var(--fistudy-black);

}



.about-one__experience-count>p {

    font-weight: 600;

    font-family: var(--fistudy-font-two);

    color: var(--fistudy-black);

    text-transform: capitalize;

    position: relative;

    top: 3px;

    margin-left: 5px;

    font-size: 16px;

    line-height: 26px;

}



.about-one__experience-count-box>p {

    font-weight: 600;

    font-family: var(--fistudy-font-two);

    color: var(--fistudy-black);

    text-transform: lowercase;

    font-size: 16px;

    line-height: 26px;

}



.about-one__img-box-2 {

    position: relative;

    display: block;

    margin-left: -47px;

    margin-right: 46px;

}



.about-one__img-2 {

    position: relative;

    display: block;

    overflow: hidden;

    border-radius: 12px;

    z-index: 1;

}



.about-one__img-2::before {

    background: rgba(255, 255, 255, 0.3);

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 0;

    opacity: 1;

    z-index: 9;

    pointer-events: none;

}



.about-one__img-box-2:hover .about-one__img-2::before {

    height: 100%;

    opacity: 0;

    -webkit-transition: all 400ms linear;

    transition: all 400ms linear;

}



.about-one__img-2 img {

    width: 100%;

    border-radius: 12px;

    transition: .5s ease;

    transform: scale(1.05);

}



.about-one__img-box-2:hover .about-one__img-2 img {

    transform: scale(1);

}



.about-one__img-shape-1 {

    position: absolute;

    top: 12px;

    left: -50px;

    z-index: 3;

}



.about-one__img-shape-1 img {

    width: auto;

}



.about-one__right {

    position: relative;

    display: block;

}



.about-one__right .section-title {

    margin-bottom: 20px;

}



.about-one__mission-and-vision {

    position: relative;

    display: flex;

    align-items: center;

    gap: 50px;

    margin-top: 40px;

    margin-bottom: 40px;

}



.about-one__mission-and-vision li {

    position: relative;

    display: block;

}



.about-one__icon-and-title {

    position: relative;

    display: flex;

    align-items: center;

    gap: 13px;

    margin-bottom: 14px;

}



.about-one__icon {

    position: relative;

    display: block;

}



.about-one__icon img {

    width: auto;

    transition: all 500ms linear;

    transition-delay: 0.1s;

    transform: scale(1);

}



.about-one__mission-and-vision li:hover .about-one__icon img {

    transform: scale(0.9);

}



.about-one__icon-and-title h3 {

    font-size: 24px;

    font-weight: 600;

    line-height: 34px;

    font-family: var(--fistudy-font-two);

    text-transform: capitalize;

    font-style: italic;

}



.about-one__btn-and-live-class {

    position: relative;

    display: flex;

    align-items: center;

    gap: 25px;

}



.about-one__btn-box {

    position: relative;

    display: block;

}



.about-one__live-class {

    position: relative;

    display: inline-block;

    font-size: 32px;

    font-weight: 600;

    line-height: 32px;

    font-family: var(--fistudy-font-two);

    color: #FFC224;

    -webkit-text-stroke: 1px var(--fistudy-black);

}



.about-one__live-class img {

    position: absolute;

    top: -14px;

    right: -22px;

}



/*--------------------------------------------------------------

# About Two

--------------------------------------------------------------*/

.about-two {

    position: relative;

    display: block;

    padding: 48px 0 48px;

    z-index: 1;

}



.about-two__bg-shape {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center;

    z-index: -1;

}



.about-two__left {

    position: relative;

    display: block;

    margin-left: 180px;

    margin-right: 61px;

}



.about-two__img-box {

    position: relative;

    display: block;

    z-index: 1;

}



.about-two__img {

    position: relative;

    display: block;

}



.about-two__img img {

    width: 100%;

    border-bottom-left-radius: 250px;

    border-bottom-right-radius: 250px;

}



.about-two__shape-1 {

    position: absolute;

    bottom: -6px;

    right: -6px;

    z-index: -1;

}



.about-two__shape-1 img {

    width: auto;

}



.about-two__shape-1::before {

    content: "";

    position: absolute;

    bottom: -8px;

    right: -6px;

    width: 554px;

    height: 554px;

    border: 1px dashed var(--fistudy-bdr-color);

    border-radius: 50%;

}



.about-two__shape-1::after {

    content: "";

    position: absolute;

    bottom: -10px;

    right: -17px;

    width: 598px;

    height: 598px;

    border: 1px dashed var(--fistudy-bdr-color);

    border-radius: 50%;

}



.about-two__shape-2 {

    position: absolute;

    top: 90px;

    right: 60px;

    z-index: -1;

}



.about-two__shape-2 img {

    width: auto;

}



.about-two__shape-3 {

    position: absolute;

    top: 55px;

    right: 35px;

    z-index: -1;

}



.about-two__shape-3 img {

    width: auto;

}



.about-two__client-box {

    position: absolute;

    top: 90px;

    left: -180px;

    max-width: 252px;

    width: 100%;

    border-radius: 16px;

    background-color: #FFFFFF;

    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.12);

    border-radius: 16px;

    padding: 16px 16px 16px;

}



.about-two__client-text {

    font-size: 14px;

    line-height: 21px;

}



.about-two__client-info {

    position: relative;

    display: flex;

    align-items: center;

    gap: 10px;

    margin-top: 14px;

}



.about-two__client-img {

    position: relative;

    display: block;

    max-width: 40px;

    width: 100%;

}



.about-two__client-img img {

    width: 100%;

    border: 1px solid var(--fistudy-bdr-color);

    border-radius: 50%;

}



.about-two__client-content {

    position: relative;

    display: block;

}



.about-two__client-content h3 {

    font-size: 18px;

    font-weight: 500;

    line-height: 18px;

    color: var(--fistudy-primary);

}



.about-two__client-content p {

    font-size: 14px;

    line-height: 20px;

}



.about-two__client-quote {

    position: absolute;

    bottom: 6px;

    right: 0px;

}



.about-two__client-quote span {

    position: relative;

    display: inline-block;

    font-size: 15px;

    color: var(--fistudy-black);

}



.about-two__class-day {

    position: absolute;

    left: -132px;

    bottom: -28px;

    max-width: 214px;

    width: 100%;

    background-color: var(--fistudy-primary);

    border-top-left-radius: 10px;

    border-top-right-radius: 30px;

    border-bottom-left-radius: 30px;

    border-bottom-right-radius: 10px;

    padding: 16px 20px 20px;

}



.about-two__class-title {

    font-size: 18px;

    font-weight: 600;

    line-height: 28px;

    font-family: var(--fistudy-font-two);

    color: var(--fistudy-white);

    border-bottom: 1px dashed var(--fistudy-bdr-color);

    padding-bottom: 7px;

    margin-bottom: 8px;

}



.about-two__class-list {

    position: relative;

    display: block;

}



.about-two__class-list li {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: space-between;

}



.about-two__class-list li+li {

    margin-top: 5px;

}



.about-two__class-list li p {

    font-size: 14px;

    line-height: 24px;

    color: var(--fistudy-white);

}



.about-two__class-list li span {

    font-size: 14px;

    font-weight: 500;

    line-height: 24px;

    color: var(--fistudy-white);

}



.about-two__class-btn-box {

    position: relative;

    display: block;

    margin-top: 8px;

}



.about-two__class-btn-box .thm-btn {

    font-size: 16px;

    color: var(--fistudy-black);

    padding: 8px 17px 9px;

    background-color: var(--fistudy-white);

}



.about-two__class-btn-box .thm-btn:hover {

    color: var(--fistudy-white);

}



.about-two__class-btn-box .thm-btn::before {

    bottom: -45px;

    right: -20px;

    background-color: var(--fistudy-base);

}



.about-two__class-btn-box .thm-btn:hover::before {

    width: 150%;

    height: 250%;

}



.about-two__class-day-icon {

    position: absolute;

    display: flex;

    align-items: center;

    justify-content: center;

    top: -40px;

    left: -40px;

    width: 60px;

    height: 60px;

    border: 1px solid var(--fistudy-primary);

    background-color: var(--fistudy-white);

    border-radius: 50%;

}



.about-two__class-day-icon img {

    width: auto;

}



.about-two__right {

    position: relative;

    display: block;

}



.about-two__right .section-title-two {

    margin-right: -150px;

    margin-bottom: 22px;

}



.about-two__text {

    font-size: 16px;

    line-height: 24px;

}



.about-two__points-list {

    position: relative;

    display: block;

    margin-top: 22px;

    margin-bottom: 32px;

}



.about-two__points-list li {

    position: relative;

    display: flex;

    align-items: center;

    gap: 30px;

}



.about-two__points-list li:nth-child(2) {

    flex-direction: row-reverse;

    text-align: right;

}



.about-two__points-list li+li {

    margin-top: 30px;

}



.about-two__icon {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 60px;

    height: 60px;

    background-color: var(--fistudy-white);

    border: 1px dashed #FFC224;

    border-radius: 50%;

}



.about-two__points-list li:nth-child(2) .about-two__icon {

    border: 1px dashed var(--fistudy-primary);

}



.about-two__points-list li:nth-child(3) .about-two__icon {

    border: 1px dashed var(--fistudy-bdr-color);

}



.about-two__icon img {

    width: auto;

    transition: all 500ms linear;

    transition-delay: 0.1s;

    transform: scale(1);

}



.about-two__points-list li:hover .about-two__icon img {

    transform: scale(0.9);

}





.about-two__content {

    position: relative;

    display: block;

    flex: 1;

}



.about-two__content h3 {

    font-size: 18px;

    font-weight: 600;

    line-height: 28px;

    font-family: var(--fistudy-font-two);

    margin-bottom: 9px;

}



.about-two__content p {

    font-size: 17px;

    line-height: 22px;

}



.about-two__client-and-btn-box {

    position: relative;

    display: flex;

    align-items: center;

    gap: 30px;

}



.about-two__client-info-2 {

    position: relative;

    display: flex;

    align-items: center;

    gap: 10px;

}



.about-two__client-two-img {

    position: relative;

    display: block;

    max-width: 50px;

    width: 100%;

    z-index: 1;

}



.about-two__client-two-img img {

    width: 100%;

    border: 1px solid var(--fistudy-primary);

    border-radius: 50%;

}



.about-two__client-two-content {

    position: relative;

    display: block;

    border: 1px solid var(--fistudy-bdr-color);

    margin-left: -33px;

    padding: 12px 21px 16px;

    padding-left: 33px;

    border-radius: 10px;

}



.about-two__client-two-content p {

    font-size: 14px;

    font-weight: 500;

    line-height: 20px;

}



.about-two__client-two-content h4 {

    font-size: 20px;

    font-weight: 500;

    line-height: 20px;

    margin-top: 2px;

}



.about-two__client-two-content h4 a {

    color: var(--fistudy-black);

}



.about-two__client-two-content h4 a:hover {

    color: var(--fistudy-base);

}



.about-two__btn-box {

    position: relative;

    display: block;

}





/*--------------------------------------------------------------

# About Three

--------------------------------------------------------------*/

.about-three {

    position: relative;

    display: block;

    padding: 48px 0 48px;

    background: linear-gradient(180deg, #FFFFFF 0%, #F5F8FF 50%, #FBFBFF 100%);

    z-index: 1;

}



.about-three__shape-2 {

    position: absolute;

    bottom: 100px;

    left: 55px;

    width: 104px;

    height: 104px;

    background: linear-gradient(134.15deg, rgba(247, 13, 197, 0.099) 15.4%, rgba(247, 13, 197, 0) 73.27%);

    border-radius: 50%;

}



.about-three__shape-3 {

    position: absolute;

    top: 100px;

    right: 55px;

    width: 104px;

    height: 104px;

    background: linear-gradient(134.15deg, rgba(247, 13, 197, 0.099) 15.4%, rgba(247, 13, 197, 0) 73.27%);

    border-radius: 50%;

}



.about-three__shape-4 {

    position: absolute;

    bottom: 100px;

    right: 100px;

    position: absolute;

    width: 85px;

    height: 85px;

    border: 1px solid #D1E3FB;

    border-radius: 50%;

}



.about-three__left {

    position: relative;

    display: block;

    margin-right: 312px;

}



.about-three__shape-1 {

    position: absolute;

    top: 45px;

    right: -170px;

}



.about-three__shape-1 img {

    width: auto;

}



.about-three__img-box {

    position: relative;

    display: block;

}



.about-three__img-one {

    position: relative;

    display: block;

    overflow: hidden;

    border-radius: 40px;

    z-index: 1;

}



.about-three__img-one::before {

    background: rgba(255, 255, 255, 0.3);

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 0;

    opacity: 1;

    z-index: 9;

    pointer-events: none;

}



.about-three__img-box:hover .about-three__img-one::before {

    height: 100%;

    opacity: 0;

    -webkit-transition: all 400ms linear;

    transition: all 400ms linear;

}



.about-three__img-one img {

    width: 100%;

    border-radius: 40px;

    transition: .5s ease;

    transform: scale(1.05);

}



.about-three__img-box:hover .about-three__img-one img {

    transform: scale(1);

}



.about-three__img-two {

    position: absolute;

    bottom: -30px;

    right: -230px;

    z-index: 2;

}



.about-three__img-two img {

    width: auto;

    border-radius: 40px;

    border: 4px solid var(--fistudy-white);

}



.about-three__experience-box {

    position: relative;

    display: block;

    max-width: 225px;

    width: 100%;

    margin-left: 0px;

    margin-top: 40px;

}



.about-three__experience-box-inner {

    position: relative;

    display: flex;

    align-items: center;

    gap: 15px;

    background: #FFFFFF;

    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);

    border-radius: 45px;

    padding: 17px 20px 19px;

    z-index: 1;

}



.about-three__experience-box-shape {

    position: absolute;

    top: 6px;

    left: 6px;

    right: -6px;

    bottom: -6px;

    border: 2px solid var(--fistudy-black);

    border-radius: 45px;

    z-index: -1;



}



.about-three__experience-icon {

    position: relative;

    display: block;

}



.about-three__experience-icon img {

    width: auto;

    transition: all 500ms linear;

    transition-delay: 0.1s;

    transform: scale(1);

}



.about-three__experience-box-inner:hover .about-three__experience-icon img {

    transform: scale(0.9);

}



.about-three__experience-count-box {

    position: relative;

    display: block;

}



.about-three__experience-count {

    position: relative;

    display: flex;

    align-items: center;

}



.about-three__experience-count h3 {

    color: var(--fistudy-base);

    font-size: 24px;

    font-weight: 600;

    line-height: 24px !important;

    font-family: var(--fistudy-font-two) !important;

}



.about-three__experience-count span {

    font-size: 24px;

    font-weight: 600;

    line-height: 24px !important;

    font-family: var(--fistudy-font-two) !important;

    color: var(--fistudy-base);

}



.about-three__experience-count>p {

    font-weight: 600;

    font-family: var(--fistudy-font-two);

    color: var(--fistudy-black);

    text-transform: capitalize;

    position: relative;

    top: 3px;

    margin-left: 5px;

    font-size: 16px;

    line-height: 26px;

}



.about-three__experience-count-box>p {

    font-weight: 600;

    font-family: var(--fistudy-font-two);

    color: var(--fistudy-black);

    text-transform: lowercase;

    font-size: 16px;

    line-height: 26px;

}



.about-three__right {

    position: relative;

    display: block;

    margin-left: -30px;

}



.about-three__right .section-title-two {

    margin-bottom: 20px;

}



.about-three__mission-vission {

    position: relative;

    display: block;

    border-radius: 20px;

    background-color: var(--fistudy-white);

    border: 1px solid var(--fistudy-bdr-color);

    padding: 20px 20px 20px;

    overflow: hidden;

    margin-top: 33px;

}



.about-three__tab-box {

    position: relative;

    display: block;

}



.about-three__tab-box .tab-buttons {

    position: relative;

    display: flex;

    margin-bottom: 18px;

    align-items: center;

    gap: 15px;

}



.about-three__tab-box .tab-buttons .tab-btn {

    position: relative;

    display: block;

}



.about-three__tab-box .tab-buttons .tab-btn+.tab-btn {

    margin-left: 0;

}



.about-three__tab-box .tab-buttons .tab-btn span {

    position: relative;

    display: inline-block;

    font-size: 16px;

    font-weight: 400;

    color: var(--fistudy-black);

    background-color: transparent;

    padding: 6px 16px 5px;

    cursor: pointer;

    transition: all 200ms linear;

    transition-delay: 0.1s;

    z-index: 1;

    text-align: center;

    text-transform: capitalize;

    border: 1px solid var(--fistudy-bdr-color);

    border-radius: 20px;

    overflow: hidden;

}



.about-three__tab-box .tab-buttons .tab-btn.active-btn span {

    color: var(--fistudy-white);

    border: 1px solid var(--fistudy-base);

}



.about-three__tab-box .tab-buttons .tab-btn span:before {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    content: "";

    background-color: var(--fistudy-base);

    background-position: top bottom;

    transition-delay: .1s;

    transition-timing-function: ease-in-out;

    transition-duration: .5s;

    transition-property: all;

    transform-origin: top;

    transform-style: preserve-3d;

    transform: scaleY(0);

    z-index: -1;

}



.about-three__tab-box .tab-buttons .tab-btn.active-btn span:before {

    transform: scaleY(1.0);

}



.about-three__tab-box .tabs-content {

    position: relative;

    display: block;

}



.about-three__tab-box .tabs-content .tab {

    position: relative;

    display: none;

    -webkit-transform: translateY(35px);

    -ms-transform: translateY(35px);

    transform: translateY(35px);

    -webkit-transition: all 600ms ease;

    -moz-transition: all 600ms ease;

    -ms-transition: all 600ms ease;

    -o-transition: all 600ms ease;

    transition: all 600ms ease;

    z-index: 10;

}



.about-three__tab-box .tabs-content .tab.active-tab {

    display: block;

    margin-top: 0px;

    -webkit-transform: translateY(0px);

    -ms-transform: translateY(0px);

    transform: translateY(0px);

}



.tabs-content__inner {

    position: relative;

    display: block;

}



.about-three__mission-vission-list {

    position: relative;

    display: block;

    padding-left: 20px !important;

}



.about-three__mission-vission-list li {

    position: relative;

    display: block;

}



.about-three__mission-vission-list li::before {

    content: "";

    position: absolute;

    top: 0;

    left: -15px;

    bottom: 0;

    width: 4px;

    background: rgb(104, 126, 255);

    background: linear-gradient(180deg, rgba(104, 126, 255, 1) 39%, rgba(104, 126, 255, 0) 100%);

}



.about-three__mission-vission-list li:last-child::before {

    background: rgb(253, 8, 163);

    background: linear-gradient(180deg, rgba(253, 8, 163, 1) 39%, rgba(104, 126, 255, 0) 100%);

}



.about-three__mission-vission-list li+li {

    margin-top: 28px;

}



.about-three__mission-vission-content {

    position: relative;

    display: block;

}



.about-three__mission-vission-title {

    font-size: 18px;

    font-weight: 600;

    font-family: var(--fistudy-font-two);

    line-height: 28px;

    margin-bottom: 7px;

}

































/*--------------------------------------------------------------

# End

--------------------------------------------------------------*/