@charset "utf-8";

/*==================================================
---COMMON
====================================================*/
body {
    line-height: 28px;
    animation-duration: 1.8s;
    overflow: auto;
    position: relative;
    z-index: -2;
    font-feature-settings: "palt";
    letter-spacing: .15em;
    color: #333;
    word-wrap: break-word;
    font-weight: 500;
    font-style: normal;
    animation-name: opacity;
    min-width: 1164px;
    font-family: YakuHanJPs_Noto, "prometo", "Noto Sans JP", sans-serif;
    font-style: normal;
    font-optical-sizing: auto;
}



.enFont {
    font-family: "prometo", sans-serif;
    font-weight: 700;
    font-style: normal;
}



body a {
    color: #333;
    display: block;
}

img {
    -webkit-backface-visibility: hidden;
    vertical-align: bottom;
    image-rendering: -webkit-optimize-contrast;
}

@keyframes opacity {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


.bodyWrap {
    position: relative;
    z-index: 1;
    overflow: hidden;
    background: #fff;
}










.sameFade {
    opacity: 0;
    transform: translate(0, 1em);
    transition: .9s cubic-bezier(0.36, 0.14, 0, 1) 0s;
}

.sameFade.scrollin {
    opacity: 1;
    transform: translate(0);
}

.sameFade2 {
    opacity: .5;
    transform: translate(0, 20px);
    transition: 4s cubic-bezier(0.36, 0.14, 0, 1);
}

.sameFade2.scrollin {
    opacity: 1;
    transform: translate(0);
}

.rightFade {
    opacity: 0;
    transform: translate(20px, 0);
    transition: 4s cubic-bezier(0.76, 0, 0.24, 1);
}

.rightFade.scrollin {
    opacity: 1;
    transform: translate(0);
}









.fadezoom {
    overflow: hidden;
}

.fadezoom img {
    transform: scale(1.06);
    transition: .75s;
    opacity: 0;

}

.fadezoom.scrollin img {
    animation: fadeopa 1.4s cubic-bezier(0.36, 0.14, 0, 1) forwards;
    transform: scale(1);
}

@keyframes colorEffect {

    0% {
        color: #fff;
    }

    100% {
        color: #000;
    }

}

@keyframes colorEffect2 {

    0% {
        color: #fff;
    }

    100% {
        color: #000;
    }

}





@keyframes maskEffect {

    0% {
        transform: translateX(-100%);
    }

    30% {
        transform: translateX(0);
    }

    40% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(101%);
    }

}



@keyframes fadeopa {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}







@keyframes titleBtmFade {
    0% {
        -webkit-transform: translate(0, 100%);
        transform: translate(0, 100%);
    }

    100% {
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
    }
}



@keyframes pulseMotion {
    0% {
        transform: translate(-50%, -50%) scale(1, 1);
        background: rgba(255, 255, 255, 0.7);
    }

    100% {
        transform: translate(-50%, -50%) scale(4.8, 4.8);
        background: rgba(255, 255, 255, 0);
    }
}


.headerInnr.change-color {
    padding: 30px 60px 0 60px;
}



.textAnime span {
    display: inline-block;
    transform: translate(0, 101%);
    transition: transform 1.2s cubic-bezier(0.36, 0.14, 0, 1);
    opacity: 0;
    -webkit-transform: translate3d(0, .2em, 0);
    transform: translate3d(0, .2em, 0);
    transition: 400ms;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;

}


.textAnime.-visible span {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.textAnime span:nth-child(2) {
    transition-delay: 50ms;
}

.textAnime span:nth-child(3) {
    transition-delay: 100ms;
}

.textAnime span:nth-child(4) {
    transition-delay: 150ms;
}

.textAnime span:nth-child(5) {
    transition-delay: 200ms;
}

.textAnime span:nth-child(6) {
    transition-delay: 250ms;
}

.textAnime span:nth-child(7) {
    transition-delay: 300ms;
}

.textAnime span:nth-child(8) {
    transition-delay: 350ms;
}

.textAnime span:nth-child(9) {
    transition-delay: 400ms;
}

.textAnime span:nth-child(10) {
    transition-delay: 450ms;
}

.textAnime span:nth-child(11) {
    transition-delay: 500ms;
}

.textAnime span:nth-child(12) {
    transition-delay: 650ms;
}

.textAnime span:nth-child(13) {
    transition-delay: 700ms;
}

.textAnime span:nth-child(14) {
    transition-delay: 750ms;
}

.textAnime span:nth-child(15) {
    transition-delay: 800ms;
}

.textAnime span:nth-child(16) {
    transition-delay: 850ms;
}

.textAnime span:nth-child(17) {
    transition-delay: 900ms;
}

.textAnime span:nth-child(18) {
    transition-delay: 950ms;
}

.textAnime span:nth-child(19) {
    transition-delay: 1000ms;
}

.textAnime span:nth-child(20) {
    transition-delay: 1050ms;
}


.spheader {
    display: none;
}

.pcHeader {
    position: fixed;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    top: 54px;
    justify-content: space-between;
    align-items: center;
    padding: 0 54px;
    z-index: 4;
    transition: .4s;

    min-width: 1164px;
}

.navListBox {
    display: flex;
    align-items: center;
    column-gap: 20px;
}

.navListBox ul {
    display: flex;
    align-items: center;
    column-gap: 34px;
    border: solid #E7E7E7 1px;
    backdrop-filter: blur(20px);
    background: #ffffff7d;
    padding: 10px 45px;
    border-radius: 100vw;
}

.navListBox ul a {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .03em;
}

header .h_nav p {
    position: relative;
    display: inline-block;
}

header .h_nav p::before {
    content: attr(data-replace);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2C3138;
    transform: rotateX(90deg);
    opacity: 0;
    transform-origin: 50% 100%;
    transform: translate(0, 30%);
    transition: .5s, transform .5s cubic-bezier(.36, .14, 0, 1);
}

header .h_nav .line::after {
    content: "";
    position: absolute;
    bottom: 1px;
    left: 0;
    display: block;
    width: 0;
    height: 1px;
    background-color: #FFB302;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}

header .h_nav:hover {
    color: transparent;
}

header .h_nav:hover p::before {
    transform: translate(0, 0);
    opacity: 1;
    color: #FFB302;
}

header .h_nav:hover .line::after {
    width: 100%;
}

header .h_nav {
    position: relative;
    display: inline-block;
    padding: 9px 0;
}

header .h_nav .text {
    display: inline-block;
    transition: .5s, transform .5s cubic-bezier(.36, .14, 0, 1);
}

header .h_nav:hover .text {
    transform: translate(0, -40%);
    transform: translateY(-40%) scaleY(0);
}


header .inConta a {
    background: #000;
    color: #fff;
    border-radius: 100vw;
    height: 66px;
    width: 236px;
    display: flex;
    box-sizing: border-box;
    position: relative;
    padding-right: 20px;
    justify-content: center;
    transition: .4s;
    letter-spacing: .03em;
    font-weight: 800;
    align-items: center;
}

header .inConta a::after {
    content: "";
    position: absolute;
    background-image: url(../img/mailicon.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 18px;
    height: 14px;
    right: 24px;
    top: 27px;
}


header .inConta a:hover {
    background: #FFB302;
}

.hLogo img {
    width: 280px;
}

.heroWrap .flex {
    display: flex;
    padding: 0 40px;
    padding-top: 328px;
    align-items: center;
    position: relative;
    justify-content: center;
    column-gap: 20%;
    flex-direction: row-reverse;
}

.heroWrap .flex .imgBox img {
    width: 700px;
}

.heroWrap .flex::after {
    content: "";
    position: absolute;
    background: #F7F5EF;
    right: 20px;
    top: 20px;
    left: 46%;
    bottom: -66%;
    z-index: -1;
    border-radius: 16px;
}

.heroWrap .textBox h2 {
    font-size: 79px;
    font-weight: 600;
    letter-spacing: .1em;
    line-height: 1;
    margin-bottom: 36px;
}

.heroWrap .textBox h2 span:nth-child(1) {
    margin-bottom: 24px;
}

.heroWrap .textBox h2 span {
    display: block;
}

.heroWrap .subTitle {
    font-weight: 600;
    font-size: 16px;
    letter-spacing: .08em;
}




.herofade01 {
    opacity: 0;
    transform: translate(-2rem, 0);
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1) 0s;
}

.heroWrap.scrollin .herofade01 {
    opacity: 1;
    transform: translate(0);
}

.herofade02 {
    opacity: 0;
    transform: translate(-2rem, 0);
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1) .2s;
}

.heroWrap.scrollin .herofade02 {
    opacity: 1;
    transform: translate(0);
}

.herofade03 {
    opacity: 0;
    transform: translate(-2rem, 0);
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1) .4s;
}

.heroWrap.scrollin .herofade03 {
    opacity: .77;
    transform: translate(0);
}

.herofade04 {
    opacity: 0;
    transform: translate(0, 2rem);
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1) .8s;
}

.heroWrap.scrollin .herofade04 {
    opacity: 1;
    transform: translate(0);
}

.herofade05 {
    opacity: 0;
    transform: translate(0, 2rem);
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1) 1s;
}

.heroWrap.scrollin .herofade05 {
    opacity: 1;
    transform: translate(0);
}







.udHero .herocoment {
    opacity: 0;
    transform: translate(0, 2rem);
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1) .4s;
}

.udHero.scrollin .herocoment {
    opacity: 1;
    transform: translate(0);
}




.loopSlideWrap {
    overflow: hidden;
    margin-top: 157px;
}

.loopSlide {
    display: flex;
    width: 100vw;
    height: 580px;
    position: relative;
}


.loopSlide img {
    width: auto;
    height: 100%;
}

.loopSlide img:first-child {
    animation: slide3 120s -60s linear infinite;
}

.loopSlide img:last-child {
    animation: slide4 120s linear infinite;
}




@keyframes slide1 {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(100%);
    }
}

@keyframes slide2 {
    0% {
        transform: translateX(-200%);
    }

    100% {
        transform: translateX(0%);
    }
}



@keyframes slide3 {
    0% {
        transform: translateX(100%);
    }

    to {
        transform: translateX(-100%);
    }
}

@keyframes slide4 {
    0% {
        transform: translateX(0);
    }

    to {
        transform: translateX(-200%);
    }
}

.commonTitle .enTitle {
    font-size: 90px;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #fff;
}



.commonTitle .space {
    display: inline-block;
    width: 35px;
}


.commonTitle .jaTitle {
    font-size: 18px;
    letter-spacing: .06em;
    line-height: 1;
    display: block;
    margin-top: 25px;
    color: #fff;
    font-weight: 600;
}

#aboutUs {
    margin-top: 260px;
}

#aboutUs .commonTitle .enTitle {
    color: #EC2B2B;
    font-size: 120px;
}

#aboutUs .commonTitle .jaTitle {
    color: #000;
    font-size: 26px;
}

#aboutUs .commonTitle {
    max-width: 1800px;
    margin: 0 auto;
    padding: 0 80px;
}

#aboutUs .mainTextBox {
    width: 557px;
    margin: 0 auto;
    margin-top: 177px;
    padding-left: 7vw;
}

#aboutUs .mainTextBox h4 {
    font-size: 41px;
    font-weight: 600;
    margin-bottom: 46px;
    letter-spacing: .1em;
    line-height: 66px;
}

#aboutUs .mainTextBox .des {
    font-size: 18px;
    line-height: 40px;
    font-weight: 400;
    margin-bottom: 28px;
    letter-spacing: .06em;
}

#aboutUs .mainTextBox .des:last-child {
    margin-bottom: 0;
}

#aboutUs .contWrap {
    position: relative;
}

#aboutUs .aboutBg {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    z-index: -1;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
}

#aboutUs .aboutBg img {
    width: 100%;
}

#aboutUs .aboutUsimg01 {
    position: absolute;
    left: 0;
    top: -11%;
}

#aboutUs .commonBtn {
    margin-top: 54px;
}

#aboutUs .aboutUsimg01 .fadezoom {
    border-radius: 0 16px 16px 0;
}

#aboutUs .aboutUsimg01 img {
    width: 29vw;
    border-radius: 0 16px 16px 0;
    height: 780px;
    object-position: 50% 26%;
    object-fit: cover;
}

.aboutUsimg02 {
    position: absolute;
    right: 0;
    top: -81%;
    text-align: right;
}

.aboutUsimg02 .fadezoom {
    border-radius: 16px;
}

.aboutUsimg02Inner {
    position: relative;
}

.aboutUsimg02 .fadezoom img {
    border-radius: 16px;
}

.aboutUsimg02Inner > div:first-child img {
    width: 14vw;
}

.aboutUsimg02Inner > div:last-child img {
    width: 20vw;
}

.aboutUsimg02Inner > div:first-child {
    text-align: left;
    margin-left: -140px;
}

.aboutUsimg02Inner > div:last-child {
    margin-top: -70px;
}

.commonBtn a {
    display: flex;
    align-items: center;
    color: #fff;
    position: relative;
    border-radius: 100vw;
    width: 296px;
    height: 72px;
    background: #000;
    padding: 0 35px;
    box-sizing: border-box;
    letter-spacing: .06em;
    transition: .4s;
    font-size: 15px;
}

.commonBtn a:hover {
    background: #FFB302;
}

.commonBtn .arrowLink {
    content: "";
    position: absolute;
    top: 9px;
    right: 8px;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: #fff;
    overflow: hidden;
    transition: background-color .5s;
}

.commonBtn .arrowLink::before,
.commonBtn .arrowLink::after {
    content: "";
    position: absolute;
    top: 24px;
    right: 18px;
    width: 15px;
    height: 7px;
    background: url(../img/btnArrow.svg) 0 0 no-repeat;
    background-size: cover;
    z-index: 3;
}

.commonBtn .arrowLink::after {
    transform: translateX(-38px);
}

.commonBtn a:hover .arrowLink {
    background: #F18E2A;
}

.commonBtn a:hover .arrowLink::before,
.commonBtn a:hover .arrowLink::after {
    background: url(../img/wbtnArrow.svg) 0 0 no-repeat;
}


.commonBtn a:hover .arrowLink::before {
    animation: befobtn .5s cubic-bezier(0.36, 0.14, 0, 1);
}

.commonBtn a:hover .arrowLink::after {
    animation: afterbtn .5s cubic-bezier(0.36, 0.14, 0, 1);
}

@keyframes befobtn {
    0% {
        transform: translateX(0);
        opacity: 1;
    }

    100% {
        transform: translateX(38px);
        opacity: 0;
    }
}

@keyframes afterbtn {
    0% {
        transform: translateX(-38px);
        opacity: 0;
    }

    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

.loopSlideWrap02 {
    margin-top: 360px;
}

.loopSlideWrap02 .loopSlide {
    height: 140px;
}

#ryouiku {
    background: #F5F9FC;
    border-radius: 140px;
    padding: 220px 0 160px 0;
    margin-top: -71px;
}


#ryouiku .flex {
    display: flex;
    justify-content: center;
    column-gap: 8%;
    max-width: 1200px;
    align-items: end;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.ryouikuInner {
    position: relative;
}

.ryouikuInner::after {
    content: "Growth";
    position: absolute;
    font-size: 308px;
    text-transform: uppercase;
    right: 0;
    left: 0;
    margin: 0 auto;
    text-align: center;
    top: 72px;
    letter-spacing: .06em;
    width: 100%;
    color: #fff;
    opacity: .59;
    font-weight: 700;
}









#ryouiku .flex .textBox .enTitle {
    text-transform: uppercase;
    color: #EC2B2B;
    font-size: 20px;
    letter-spacing: .06em;
}

#ryouiku .flex .textBox h3 {
    font-size: 41px;
    font-weight: 600;
    margin-bottom: 46px;
    letter-spacing: .1em;
    line-height: 66px;
    margin-top: 38px;
    letter-spacing: .15em;
}

#ryouiku .space {
    width: 10px;
}



#ryouiku .flex .textBox {
    width: 52%;
}

#ryouiku .flex .contBox {
    width: 48%;
}

#ryouiku .flex .textBox .des {
    font-size: 18px;
    letter-spacing: .08em;
    font-weight: 400;
    margin-bottom: 40px;
    line-height: 40px;
}

#ryouiku .flex .textBox .des:last-child {
    margin-bottom: 0;

}

#ryouiku .commonBtn {
    margin-top: 50px;
}




#ryouiku .contBox h4 {
    font-size: 20px;
    letter-spacing: .06em;
    position: relative;
    padding-left: 30px;
    margin-bottom: 44px;
    padding-bottom: 24px;
}

#ryouiku .contBox h4::after {
    content: "";
    position: absolute;
    background-image: url(../img/srlist.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 19px;
    height: 19px;
    left: 0;
    top: 4px;
}

#ryouiku .contBox h4::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-image: repeating-linear-gradient(to right,
            #ACACAC,
            #ACACAC 5px,
            /* ダッシュの長さ */
            transparent 5px,
            transparent 10px
            /* ダッシュの間隔 */
        );
}

#ryouiku .contBox ul li {
    margin-bottom: 18px;
}

#ryouiku .contBox ul li:last-child {
    margin-bottom: 0;
}

#ryouiku .contBox ul {
    list-style: none;
    width: 83%;
}

#ryouiku .contBox ul a {
    display: block;
    background: #fff;
    transition: .4s;
    border-radius: 16px;
    padding: 7px 34px 7px 7px;
    box-sizing: border-box;
    box-shadow: 20px 20px 30px rgba(0, 0, 0, 0.04);
}

#ryouiku .contBox ul a:hover {
    background: #EC2B2B;
    color: #fff;
}



#ryouiku .contBox ul li:nth-child(2) a:hover {
    background: #26D2CA;
}

#ryouiku .contBox ul li:nth-child(3) a:hover {
    background: #F18E2A;
}


#ryouiku .contBox .imgBox {
    border-radius: 10px;
    overflow: hidden;
}


#ryouiku .contBox ul a:hover .imgBox img {
    transform: scale(1.1);
}

#ryouiku .contBox .imgBox img {
    width: 100%;
    border-radius: 10px;
    max-width: 218px;
    transition: 1s cubic-bezier(0.36, 0.14, 0, 1);
}


#ryouiku .contBox .inFlex {
    display: flex;
    column-gap: 19px;
    align-items: center;
}

#ryouiku .contBox .enTitle {
    text-transform: uppercase;
    font-size: 20px;
    width: 127px;
    transition: .4s;

    letter-spacing: .06em;
    font-weight: 700;
    position: relative;
}



#ryouiku .contBox .enTitle::before,
#ryouiku .contBox .enTitle::after {
    content: "";
    position: absolute;
    top: 12px;
    right: 18px;
    width: 13px;
    height: 6px;
    background: url(../img/btnArrow.svg) 0 0 no-repeat;
    background-size: cover;
    z-index: 3;
}

#ryouiku .contBox .enTitle::after {
    transform: translateX(-38px);
    opacity: 0;
}







#ryouiku .contBox ul li:nth-child(1) .enTitle {
    color: #EC2B2B;
}

#ryouiku .contBox ul li:nth-child(2) .enTitle {
    color: #26D2CA;
}

#ryouiku .contBox ul li:nth-child(3) .enTitle {
    color: #F18E2A;
}

#ryouiku .contBox ul a:hover .enTitle {
    color: #fff;
}

/*


#ryouiku .contBox ul a:hover .enTitle::after {
    animation: befobtn .5s cubic-bezier(0.36, 0.14, 0, 1);
}
*/
#ryouiku .contBox ul a:hover .enTitle::after {
    background: url(../img/wbtnArrow.svg) 0 0 no-repeat;
}

#ryouiku .contBox ul a:hover .enTitle::before {
    background: url(../img/wbtnArrow.svg) 0 0 no-repeat;
}

#ryouiku .contBox h5 {
    font-size: 18px;
    letter-spacing: .06em;
    font-weight: 700;
    text-decoration: underline;
    margin-top: 3px;
}







.fadeRhythm01 {
    opacity: 0;
    transform: translate(0, 2rem);
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1) 0s;
}

.ryouikuInner.scrollin .fadeRhythm01 {
    opacity: 1;
    transform: translate(0);
}

.fadeRhythm02 {
    opacity: 0;
    transform: translate(0, 2rem);
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1) .3s;
}

.ryouikuInner.scrollin .fadeRhythm02 {
    opacity: 1;
    transform: translate(0);
}







#service {
    position: relative;
    padding: 160px 80px;


}

#service::after {
    content: "";
    position: absolute;
    background: #F18E2A;
    right: 0;
    top: -80%;
    left: 0;
    bottom: -80%;
    z-index: -2;
}

.serviceInner {}

.srBg {
    position: absolute;
    z-index: -1;
    width: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) scale(1.1);
    transform: translate(-50%, -50%) scale(1.1);
    text-align: center;
}


#service .commonTitle {
    text-align: center;

}

#service .flex {
    display: flex;
    justify-content: space-between;
    max-width: 1300px;
    margin: 0 auto;
    margin-top: 100px;
    column-gap: 48px;
}

#service .flex a {
    position: relative;
}

#service .flex h4 {
    display: inline-block;
    position: absolute;
    top: 28px;
    left: 28px;
    font-size: 20px;
    color: #F18E2A;
    border: solid 1px #F18E2A;
    background: #fff;
    padding: 13px 26px 11px 26px;
    z-index: 2;
    line-height: 1;
    letter-spacing: .06em;
    font-weight: 600;
    border-radius: 100vw;
}

#service .flex .imgBox {
    border-radius: 16px;
}

#service .flex .imgBox img {
    width: 100%;
    border-radius: 16px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

#service .flex .des {
    font-size: 18px;
    margin-top: 24px;
    color: #fff;
    line-height: 34px;
    letter-spacing: .06em;
    font-weight: 600;
    padding-right: 98px;
}


#service .flex a {
    display: block;
    width: 50%;
}


#service .arrowBox {
    content: "";
    position: absolute;
    bottom: 41px;
    right: -13px;
    width: 95px;
    height: 95px;
    border-radius: 50%;
    background: #fff;
    box-sizing: border-box;
    border: solid 7px #F18E2A;
    overflow: hidden;
    transition: background-color .5s;
    transition: .5s;
}

#service .arrowBox::after {
    transform: translateX(-68px);
}

.arrowBox::before,
.arrowBox::after {
    content: "";
    position: absolute;
    top: 36px;
    right: 29px;
    width: 23px;
    height: 10px;
    background: url(../img/orArrow.svg) 0 0 no-repeat;
    background-size: cover;
    z-index: 3;
}

/*
#service .flex a:hover .arrowBox::before, #service .flex a:hover .arrowBox::after {
    background: url(../img/wbtnArrow.svg) 0 0 no-repeat;
}
*/


#service .flex a:hover .arrowBox::before {
    animation: befobtn2 .5s cubic-bezier(0.36, 0.14, 0, 1);
}



#service .flex a:hover .arrowBox::after {
    animation: afterbtn2 .5s cubic-bezier(0.36, 0.14, 0, 1);
}



@keyframes befobtn2 {
    0% {
        transform: translateX(0);
        opacity: 1;
    }

    100% {
        transform: translateX(68px);
        opacity: 0;
    }
}

@keyframes afterbtn2 {
    0% {
        transform: translateX(-68px);
        opacity: 0;
    }

    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

#service .flex a:hover .imgBox img {
    transform: scale(1.07);
}



#service .flex a:hover .arrowBox {
    transform: scale(.8);
    right: -24px;
}


#service .srIcon {
    position: absolute;
    z-index: -1;
    top: -15%;
    left: 10%;
    transform: translateY(-4em);
    transition: transform .6s cubic-bezier(0.68, -0.6, 0.32, 1.6), opacity 1.4s ease;
}

#service.scrollin .srIcon {
    opacity: 1;
    transform: translateY(0);
}




.spBr {
    display: none;
}

#classRoom {
    background: #383842;
    padding: 160px 80px 240px 80px;
    position: relative;
    border-radius: 140px 140px 0 0;
}


#classRoom .clain01 {
    position: absolute;
    top: 9%;
    left: -4%;
    transform: translateX(-5em);
    transition: transform .6s cubic-bezier(0.68, -0.6, 0.32, 1.6), opacity 1.4s ease;
}

#classRoom.scrollin .clain01 {
    opacity: 1;
    transform: translateX(0);
}

#classRoom .commonTitle {
    text-align: center;
}

#classRoom .flex {
    display: flex;
    gap: 60px 3%;
    flex-wrap: wrap;
    max-width: 1300px;
    margin: 0 auto;
    margin-top: 80px;
}

#classRoom .flex > a {
    width: 31.3%;
}





#classRoom .flex > a:hover h4 {
    color: #E75400;
}

#classRoom .flex h4 {
    font-size: 18px;
    color: #fff;
    text-decoration: underline;
    font-weight: 600;
    margin-top: 26px;
    line-height: 24px;
    transition: .4s;
    margin-bottom: 16px;
    letter-spacing: .06em;
}

#classRoom .flex .map {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .06em;
    position: relative;
    padding-left: 21px;
    color: #fff;
}

#classRoom .flex .map::after {
    content: "";
    position: absolute;
    background-image: url(../img/map.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 9px;
    height: 17px;
    left: 0;
    top: 5px;
}

#classRoom .imgBox {
    border-radius: 16px;
    box-sizing: border-box;
    border: solid 8px #fff;
}

#classRoom .imgBox img {
    width: 100%;
    border-radius: 6px;
    box-sizing: border-box;
}



#classRoom .flex > a:hover .imgBox img {
    transform: scale(1.06);
}



#classRoom .commonBtn {
    margin-top: 74px;
}

#classRoom .commonBtn a {
    margin: 0 auto;
}


.loopSlideWrap03 {
    overflow: visible;
}

.loopSlideWrap02.loopSlideWrap03 {
    margin-top: -80px;
    position: relative;
    z-index: 1;
}

.loopSlideWrap02.loopSlideWrap03 .loopSlide {
    height: 80px;
}


.loopSlideWrap02.loopSlideWrap03 .loopSlide img:first-child {
    animation: slide3 120s -60s linear infinite;
}



.loopSlideWrap03 .clain02 {
    position: absolute;
    transform: translateY(-2em)
}



.loopSlideWrap03 .clain02 {
    transition: transform .6s cubic-bezier(0.68, -0.6, 0.32, 1.6), opacity 1.4s ease;
}



.loopSlideWrap03 .loopSlide img:first-child {
    position: relative;
}

.loopSlideWrap03 .clain02 {
    position: absolute;
    z-index: -1;
    top: -43%;
    right: 24%;
}

.loopSlideWrap03.scrollin .clain02 {
    animation: moveLThenUp 2s forwards cubic-bezier(0.68, -0.6, 0.32, 1.6);
}

@keyframes moveLThenUp {
    0% {
        transform: translateY(-2em);
        /* スタート：上に */
    }

    30% {
        transform: translateY(3.2em);
        /* 中央に */
    }

    60% {
        transform: translate(8.8em, 3em);
        /* 右に移動 */
    }

    100% {
        transform: translate(8.8em, -2em);
        /* 最後に上に */
    }
}



#blog {
    background: #F5F9FC;
    padding: 160px 0;
    z-index: 1;
    position: relative;
}







#blog .tab-group {
    position: relative;
    width: auto;
}

#blog .tab-group ul {
    display: flex;
    column-gap: 15px;
    margin-bottom: 54px;
}

#blog .tab {
    padding: 0;
    list-style: none;
    font-weight: 600;
    border-bottom: solid 5px rgba(27, 144, 217, 0);
    font-size: 18px;
    text-align: center;
    letter-spacing: .06em;
    margin-top: -1px;
    line-height: 1;
    cursor: pointer;
    color: rgba(0, 0, 0, 0.38);
    background: #fff;
    border-radius: 100vw;
    width: 138px;
    height: 44px;
    display: flex;
    border: solid 1px #CBCBCB;
    justify-content: center;
    align-items: center;
}

#blog .tab.is-active {
    color: #fff;
    background: #000;
    border: solid 1px #000;
    transition: all 0.2s ease-out;
}

#blog .panel.is-show {
    height: auto;
    opacity: 1;
    transform: translateY(0);
}

#blog .panel {
    height: 0;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}







#blog .blogInner {
    max-width: 1800px;
    margin: 0 auto;
    padding: 0 80px;
    box-sizing: border-box;
}

#blog .commonTitle {
    margin-bottom: 90px;
}

#blog .commonTitle .enTitle {
    color: #EC2B2B;

}

#blog .commonTitle .jaTitle {
    color: #000;
}

#blog .imgBox {
    border-radius: 16px;
}

#blog .imgBox img {
    width: 100%;
    border-radius: 16px;
}


#blog .brogLogo {
    position: absolute;
    top: 175px;
    right: 0;
}


#blog .swiper-slide {
    margin-bottom: 140px;
}



#blog a {
    transition: .4s;
}

#blog a .imgBox {
    overflow: hidden;
}

#blog a:hover .imgBox img {
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1);
    transform: scale(1.06);
}

#blog a .imgBox img {
    transition: .75s cubic-bezier(0.36, 0.14, 0, 1);
}

#blog a:hover h4 {
    color: #E75400;
}




#blog .swiper-pagination-bullet {
    opacity: 1;
    width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 11px));
    height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 11px));
    background: #E0E0E0;
}

#blog .swiper-pagination-bullet-active {
    background: #000;
}

#blog .swiper-button-prev::after {
    background-image: url(../img/llarrowsp.svg);
    content: "";
    width: 27px;
    height: 27px;
}

#blog .swiper-button-next::after {
    background-image: url(../img/arroesp.svg);
    content: "";
    width: 27px;
    height: 27px;
}

#blog .swiArrow {
    position: absolute;
    width: 169px;
    left: 0;
    bottom: 22px;
    right: 0;
    margin: 0 auto;
}

#blog .commonBtn {
    margin-top: 60px;
}

#blog .commonBtn a {
    margin: 0 auto;
}



#blog .day {
    font-size: 12px;
    letter-spacing: .06em;
    font-weight: 700;
    margin-top: 29px;
    margin-bottom: 16px;
    display: block;
    color: #B4B6B7
}

#blog h4 {
    font-size: 18px;
    letter-spacing: .06em;
    font-weight: 600;
    text-decoration: underline;
    margin-bottom: 23px;
    transition: .4s;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#blog .cat {
    line-height: 1;
    display: inline-block;
    border-radius: 100vw;
    color: #fff;
    font-size: 13px;
    letter-spacing: .03em;
    border-radius: 100vw;
    padding: 6px 14px;
    font-weight: 600;
    background: #26D2CA;
}

#blog .snku {
    position: absolute;
    left: 0;
    top: 10%;
}





.fCtaBox .flex {
    display: flex;
    position: relative;
}

.fCtaBox .textBox {
    position: absolute;
    top: 54%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) translateZ(0);
    transform: translate(-50%, -50%) translateZ(0);
    text-align: center;
    z-index: 2;
    width: 100%;
    color: #fff;
}

.fCtaBox .imgBox img {
    width: 100%;
}

.fCtaBox .flex > a {
    width: 50%;
    display: block;
    position: relative;
    transition: .4s;
}

.fCtaBox .reserveBox::after {
    content: "";
    position: absolute;
    background: rgba(13, 65, 63, 0.71);
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
}


.fCtaBox .recruitBox::after {
    content: "";
    position: absolute;
    background: rgba(54, 32, 9, 0.71);
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
}

.fCtaBox .textBox p.enTitle {
    font-size: 13px;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .7;
    margin-bottom: 16px;
}


.fCtaBox .textBox h4 {
    font-size: 28px;
    letter-spacing: .06em;
    font-weight: 600;
    margin-bottom: 34px;
}

.fCtaBox .textBox .des {
    font-size: 16px;
    letter-spacing: .08em;
    text-decoration: underline;
    font-weight: 500;
}


.fCtaBox .arrowLink {
    content: "";
    position: absolute;
    bottom: 43px;
    right: 43px;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: solid 1px rgba(255, 255, 255, 0.50);
    overflow: hidden;
    z-index: 2;
    transition: background-color .5s;
}

.fCtaBox .arrowLink::before,
.fCtaBox .arrowLink::after {
    content: "";
    position: absolute;
    top: 24px;
    right: 18px;
    width: 15px;
    height: 7px;
    background: url(../img/farrow.svg) 0 0 no-repeat;
    background-size: cover;
    z-index: 3;
}

.fCtaBox .arrowLink::after {
    transform: translateX(-38px);
}

.fCtaBox .flex > a .imgBox {
    overflow: hidden;
}

.fCtaBox .flex > a:hover .imgBox img {
    transform: scale(1.06);
}

.fCtaBox .flex > a:hover .arrowLink::after {
    animation: afterbtn .5s cubic-bezier(0.36, 0.14, 0, 1);
}

.fCtaBox .flex > a:hover .arrowLink::before {
    animation: befobtn .5s cubic-bezier(0.36, 0.14, 0, 1);
}

.fCtaBox .flex > a::after {
    transition: .4s;
}

.fCtaBox .flex > a:hover .arrowLink {
    background: #FFB302;
    border: solid 1px rgba(255, 255, 255, 0.50);
}

.fCtaBox .flex > a:hover::after {
    opacity: .6;
}



.fCtaBox {
    position: relative;
    z-index: 2;
}

.fCtaBox .glaycr {
    position: absolute;
    z-index: 2;
    top: 0px;
    width: 100%;
}

.fCtaBox .glaycr svg {
    width: 100%;
}

.fCtaBox .contactIcon {
    position: absolute;
    z-index: 3;
    text-align: center;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: -16px;
}

footer {
    padding: 18px;
    color: #fff;
}

footer address {
    display: block;
}

footer .flex {
    display: flex;
    justify-content: space-between;
    margin-bottom: 50px;
}

.footerInner {
    background: #111111;
    padding: 0 40px;
    padding-top: 136px;
    border-radius: 16px;
    padding-bottom: 100px;
}

footer .navBox li {
    margin-bottom: 24px;
}

footer .navBox a {
    color: #fff;
    padding-left: 15px;
    font-size: 14px;
    font-weight: 600;
    transition: .4s;
    letter-spacing: .06em;
    position: relative;
}

footer .navBox a:hover {
    color: #E75400
}

footer .navBox a:hover::after {
    left: 2px;
}


footer .navBox a::after {
    content: "";
    position: absolute;
    background-image: url(../img/orAwwro.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 10px;
    height: 6px;
    transition: .4s;
    left: -3px;
    top: 11px;
}

footer .contBox {
    max-width: 1256px;
    margin: 0 auto;
}

footer .navBox ul {
    list-style: none;
}

footer .snsBox {
    display: flex;
    margin-top: 42px;
    column-gap: 7px;
}

footer .snsBox a {
    transition: .4s;
}

footer .snsBox a:hover {
    opacity: .6;
}

footer .navBox {
    display: flex;
    column-gap: 62px;
}

footer .fLine {
    background: rgba(255, 255, 255, 0.20);
    height: 1px;
    margin-bottom: 58px;
    width: 100%;
}

footer .bottmFlex {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
}


footer .copBOx {
    display: flex;
    column-gap: 26px;
}

footer .copBOx .copLink a {
    background: #fff;
    border-radius: 100vw;
    color: #000;
    letter-spacing: .06em;
    font-size: 12px;
    position: relative;
    text-transform: uppercase;
    padding-right: 20px;
    width: 178px;
    box-sizing: border-box;
    padding-top: 1px;
    height: 35px;
    display: flex;
    transition: .4s;
    justify-content: center;
    align-items: center;
}

footer .copBOx .copLink a:hover {
    background: #FFB302;
    color: #fff;
}

footer .copBOx .copLink a::after {
    content: "";
    position: absolute;
    background-image: url(../img/tabicon.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: .4s;
    width: 11px;
    height: 11px;
    right: 20px;
    top: 12px;
}

footer .copBOx .copLink a:hover::after {
    background-image: url(../img/htabicon.svg);
}

.privacy {
    color: #fff;
    opacity: .5;
    font-size: 12px;
    letter-spacing: .06em;
}

footer .copy {
    color: #fff;
    font-size: 12px;
    letter-spacing: .06em;
}


.spcommonBtn {
    display: none;
}

.spFixNav {
    display: none;
}









/*================================*/
/*================================*/
/*================================*/
/*================================*/



.dropdown__lists {
    display: none;
    /*デフォルトでは非表示の状態にしておく*/
    width: 100%;
    position: absolute;
    top: 60px;
    left: 0;
}

.gnavi__list {
    position: relative;
}

.gnavi__list:hover .dropdown__lists {
    display: block;
    /*Gナビメニューにホバーしたら表示*/
}

.dropdown__list {


    transition: all .3s;
    position: relative;
}

.dropdown__list:not(:first-child)::before {
    content: "";
    width: 100%;
    height: 1px;
    background-color: #ffffff;
    position: absolute;
    top: 0;
    z-index: 1;
    left: 0;
}

.dropdown__list a:hover {
    background-color: #26D2CA;
}

.dropdown__list a {
    display: flex;
    transition: .3s;
    justify-content: center;
    align-items: center;
    color: #fff;
    background-color: #FFB302;
    height: 60px;
    text-decoration: none;
    position: relative;
}

.dropdown__list a::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    transform: rotate(135deg);
    position: absolute;
    right: 15px;
    top: calc(50% - 5px);
}

.dropdown__lists {
    visibility: hidden;
    opacity: 0;
    transition: all .3s;
    width: 250px;
    position: absolute;
    top: 69px;
    left: 0;
}


.dropdown__lists::after {
    content: "";
    position: absolute;
    background-image: url(../img/arrowsr.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 9px;
    height: 9px;
    left: 35px;
    top: -9px;
}



.gnavi__list:hover .dropdown__lists {
    visibility: visible;
    /*Gナビメニューにホバーしたら表示*/
    opacity: 1;
    /*不透明度1*/
}




.navListBox ul .dropdown__lists {
    display: block;
    border: none;
    backdrop-filter: blur(0);
    background: #ffffff7d;
    padding: 0;
    border-radius: 100vw;
}




.dropdown__lists li:first-child a {
    border-radius: 6px 6px 0 0;
}

.dropdown__lists li:last-child a {
    border-radius: 0 0 6px 6px;
}


.udHero {
    padding: 280px 0 0 0;
    position: relative;
}

.udHero::after {
    content: "";
    position: absolute;
    background: #F7F5EF;
    z-index: -1;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
}


.udHero h3 {
    text-align: center;
}

.udHero .commonTitle {
    position: relative;
    z-index: 2;
}

.udHero h3 .enTitle {
    color: #EC2B2B;
}

.udHero h3 .jaTitle {
    color: #000000;
}

.udImgHero {
    position: relative;
    margin-top: -3vw;
}

.herowTop {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    left: 0;
}

.herocoment {
    position: absolute;
    z-index: 1;
    left: 8%;
    top: 22%;
}

.herowBt {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}

.udImgHero .imgBox img {
    width: 100%;
    object-fit: cover;
}


.serviceNav {
    background: #F7F5EF;
}

.serviceNav p {
    text-align: center;
    text-decoration: underline;
    margin-bottom: 44px;
    font-weight: 600;
    letter-spacing: .06em;
    font-size: 18px;
}

.serviceNav .ankFlex {
    display: flex;
    justify-content: center;
    column-gap: 20px;
}

.serviceNav .ankFlex a {
    display: flex;
    align-items: center;
    border-radius: 100vw;
    color: #fff;
    font-weight: 600;
    font-size: 24px;
    letter-spacing: .06em;
    width: 369px;
    height: 78px;
    padding: 0 34px;
    box-sizing: border-box;
    position: relative;
}

.serviceNav .ankFlex a::after {
    content: "";
    position: absolute;
    background-image: url(../img/serviceNavarrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 32px;
    height: 32px;
    right: 24px;
    top: 24px;
}



.serviceNav .ankFlex a:first-child {
    background: #EE4499;
}

.serviceNav .ankFlex a:last-child {
    background: #F08E2A;
}

.serviceCommonBox {
    position: relative;
    z-index: 1;
}

.serviceCommonBox .opBox {
    background: #EE4499;
    border-radius: 26px;
    padding: 71px 86px;
    position: relative;
    overflow: hidden;
    margin-bottom: 44px;
}

.serviceCommonBox .opBox::after {
    content: "";
    position: absolute;
    background-image: url(../img/opBoxsBg.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 776px;
    height: 741px;
    right: 37px;
    top: 25px;
}

.serviceCommonBox .mainDes p {
    font-size: 18px;
    line-height: 40px;
    font-weight: 600;
    letter-spacing: .06em;
}



.serviceCommonBox .opBox .imgBox {
    border-radius: 16px;
    position: relative;
    z-index: 2;
}

.serviceCommonBox .opBox .imgBox img {
    width: 100%;
    border-radius: 16px;
    object-fit: cover;
    aspect-ratio: 1027 / 400;
}

.serviceCommonBox {
    padding: 120px 80px 110px 80px;
    background: #F7F5EF;
    border-radius: 0 0 140px 140px;
}

.serviceCommonBoxInner {
    max-width: 1200px;
    margin: 0 auto;
}

.serviceCommonBoxInner .nam {
    background: #fff;
    line-height: 1;
    text-transform: uppercase;
    color: #EE4499;
    border-radius: 100vw;
    padding: 5px 14px;
    font-weight: 700;
    letter-spacing: .06em;
    font-size: 13px;
    display: inline-block;
    margin-left: 22px;
    margin-bottom: 38px;
}

.serviceCommonBoxInner h4 {
    color: #fff;
    font-size: 38px;
    font-weight: 600;
    position: relative;
    padding-left: 22px;
}

.serviceCommonBoxInner h4::after {
    content: "";
    position: absolute;
    background: #fff;
    width: 10px;
    height: 10px;
    left: 0;
    border-radius: 100vw;
    top: 7px;
}

.serviceCommonBoxInner .titleBox {
    margin-bottom: 46px;
    position: relative;
    z-index: 2;
}

.serviceCommonBoxInner .conBox {
    margin-top: 102px;
}

.serviceCommonBoxInner .conBox h5 {
    font-size: 24px;
    text-decoration: underline;
    font-weight: 600;
    padding-left: 27px;
    letter-spacing: .03em;
    position: relative;
    margin-bottom: 25px;
}

.serviceCommonBoxInner .conBox h5::after {
    content: "";
    position: absolute;
    background-image: url(../img/titleicon.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 15px;
    height: 22px;
    left: 0;
    top: 4px;
}

.serviceCommonBoxInner .conBox .des {
    line-height: 30px;
    font-size: 16px;
    letter-spacing: .06em;
    font-weight: 500;
    margin-bottom: 33px;
}

.commonsubjectList {
    background: #fff;
    border: solid 1px #E3E3E3;
    border-radius: 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 15px 23px;
    padding: 38px 52px;
    list-style: none;
}


.commonsubjectList li {
    position: relative;
    font-size: 18px;
    letter-spacing: .03em;
    font-weight: 600;
    padding-left: 27px;
}

.commonsubjectList li::after {
    content: "";
    position: absolute;
    border-radius: 100vw;
    background: #D1D1D1;
    width: 18px;
    height: 18px;
    left: 0;
    top: 5px;
}

.commoniconFlex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 66px 1.1%;
    margin-top: 60px;
}

.commoniconFlex > div {
    background: #fff;
    position: relative;
    border-radius: 16px;
    border: solid 1px #E3E3E3;
    width: 32.6%;
    padding: 38px 30px 30px 30px;
    box-sizing: border-box;
}

.commoniconFlex > div::after {
    content: "01";
    position: absolute;
    font-size: 45px;
    left: 0;
    text-align: center;
    right: 0;
    font-weight: 700;
    margin: 0 auto;
    top: -17px;
}

.commoniconFlex > div:nth-child(2)::after {
    content: "02";
}

.commoniconFlex > div:nth-child(3)::after {
    content: "03";
}

.commoniconFlex > div:nth-child(4)::after {
    content: "04";
}

.commoniconFlex > div:nth-child(5)::after {
    content: "05";
}







.commoniconFlex h6 {
    color: #26D2CA;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    letter-spacing: .06em;
}

.commoniconFlex .iconBox {
    text-align: center;
    margin: 28px 0 28px;
}

.commoniconFlex ul {
    list-style: none;
}

.commoniconFlex ul li {
    padding-left: 16px;
    position: relative;
    font-size: 16px;
    margin-bottom: 20px;
    line-height: 26px;
    letter-spacing: .06em;
    font-weight: 500;
}

.commoniconFlex ul li:last-child {
    margin-bottom: 0;
}

.commoniconFlex ul li::after {
    content: "";
    position: absolute;
    background: #F08E2A;
    border-radius: 100vw;
    width: 8px;
    height: 8px;
    left: 0;
    top: 7px;
}




.coomhuki {
    position: relative;
    max-width: 755px;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 26px 83px;
    border-radius: 100vw;
    background: #EE4499;
    margin-top: 60px;
}

.coomhuki::after {
    content: "";
    position: absolute;
    background-image: url(../img/phuki.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 22px;
    height: 31px;
    right: 0;
    left: 0;
    margin: 0 auto;
    text-align: center;
    top: -28px;
}

#service02 .coomhuki::after {
    background-image: url(../img/ohuki.svg);
}


#service02 .serviceCommonBoxInner .nam {
    color: #F08E2A;
}


.coomhuki p {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    line-height: 30px;
    letter-spacing: .06em;
}

.commonCircleD::after {
    content: "";
    position: absolute;
    background: #383842;
    right: 0;
    top: -30%;
    left: 0;
    bottom: 0;
    z-index: -1;
}

.commonCircleD {
    position: relative;
    padding: 110px 80px 140px 80px;
    text-align: center;
}

.commonCircleD .conBox {
    box-sizing: border-box;
    border: solid 30px #fff;
    max-width: 1200px;
    margin: 0 auto;
    border-radius: 60px;
    background: #F5F9FC;
    padding: 80px 30px;
}

.commonCircleD .conBox .des span {
    display: inline-block;
}

.commonCircleD .conBox .des {
    font-size: 18px;
    line-height: 40px;
    font-weight: 600;
    margin-bottom: 66px;
    letter-spacing: .06em;
}

.commonCircleD .conBox .des .lFont {
    font-size: 30px;
}

.commonCircleD .conBox .des .bcolo {
    color: #26D2CA;
}


.commonCircleD .imgBox img {
    max-width: 100%;
}

.commonCircleD .atenBox {
    margin-top: 50px;
}

.commonCircleD .atenBox p {
    font-size: 15px;
    display: inline-block;
    line-height: 28px;
    background: #fff;
    border-radius: 100vw;
    text-align: left;
    padding: 8px 46px;
    letter-spacing: .06em;
}



.udCtaBox {
    background: #FFB302;
    position: relative;
    padding: 0 80px;
}

.udCtaBox::before {
    content: "";
    position: absolute;
    background: #fff;
    border-radius: 0 0 180px 180px;
    width: 275px;
    height: 10px;
    right: 0;
    left: 0;
    margin: 0 auto;
    text-align: center;
    top: 0;
}

.udCtaBox::after {
    content: "CONTACT US";
    position: absolute;
    right: 0;
    left: 0;
    margin: 0 auto;
    text-align: center;
    opacity: .23;
    font-weight: 700;
    color: #fff;
    font-size: 189px;
    top: 133px;
    line-height: 1;
}

.udCtaBoxIner {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 656px;
    color: #fff;
    text-align: center;
    max-width: 1500px;
    margin: 0 auto;
}

.udCtaBoxIner::after {
    content: "";
    position: absolute;
    background-image: url(../img/dodleft.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 141px;
    height: 109px;
    left: 0;
    top: 9%;
}

.udCtaBoxIner::before {
    content: "";
    position: absolute;
    background-image: url(../img/dodright.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 141px;
    height: 109px;
    right: 0;
    bottom: 29%;
}


.udCtaBoxIner > div {
    margin-top: 67px;
}

.udCtaBoxIner h4 {
    font-size: 40px;
    font-weight: 600;
    margin-bottom: 23px;
}

.udCtaBoxIner .des {
    font-size: 19px;
    text-decoration: underline;
    font-weight: 500;
    letter-spacing: .06em;
    margin-bottom: 45px;
}

.udCtaBoxIner .commonBtn a {
    margin: 0 auto;
}


.loopSlideWrap03.udNamiBox .clain02 {
    right: auto;
    left: 7%;
}

.loopSlideWrap03.udNamiBox.scrollin .clain02 {
    animation: moveLThenUp2 2s forwards cubic-bezier(0.68, -0.6, 0.32, 1.6);
}

@keyframes moveLThenUp2 {
    0% {
        transform: translateY(-2em);
        /* スタート：上に */
    }

    30% {
        transform: translateY(3.2em);
        /* 中央に */
    }

    60% {
        transform: translate(13.8em, 3em);
        /* 右に移動 */
    }

    100% {
        transform: translate(13.8em, -2em);
        /* 最後に上に */
    }
}








#service02.serviceCommonBox .opBox {
    background: #F08E2A;
}

#service02 .coomhuki {
    background: #F08E2A;
}




#service02.serviceCommonBox {
    padding: 80px 80px 110px 80px;
}

.udCtaBox .commonBtn a:hover {
    background: #26D2CA;
}

.udCtaBox .commonBtn a:hover .arrowLink {
    background: #1b8e88;
}


#flow {
    background: #F7F5EF;
    padding: 130px 80px;
    border-radius: 0 0 140px 140px;
}



.udCommonTitle h4 span {
    display: block;
}

.udCommonTitle h4 .jaTitle {
    font-size: 40px;
    letter-spacing: .06em;
    font-weight: 600;
    margin-bottom: -5px;
}

.udCommonTitle {
    margin-bottom: 60px;
}

.udCommonTitle h4 .enTitle {
    position: relative;
    text-transform: uppercase;
    padding-left: 27px;
    color: #26D2CA;
    letter-spacing: .06em;
    font-weight: 700;
    display: inline-block;
}

.udCommonTitle h4 .enTitle::after {
    content: "";
    position: absolute;
    background-image: url(../img/titleicon.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 16px;
    height: 23px;
    left: 0;
    top: 2px;
}

.flowInner {
    max-width: 1000px;
    margin: 0 auto;
}

.flowInner ol {
    list-style: none;
}


.flowInner ol > li {
    background: #fff;
    border-radius: 16px;
    border: solid 1px #E6E6E6;
    padding: 48px 116px 48px 145px;
    position: relative;
    margin-bottom: 44px;
}

.flowInner ol > li:last-child {
    margin-bottom: 0;
}


.flowInner ol > li:before {
    content: "";
    width: 1px;
    height: 112%;
    background-image: repeating-linear-gradient(to bottom,
            #8E8E8E,
            #8E8E8E 5px,
            transparent 5px,
            transparent 10px);
    display: block;
    position: absolute;
    left: 75px;
    z-index: 1;
    top: 52px;
}

.flowInner ol > li:nth-child(5):before {
    display: none;
}


.flowInner ol li h5 {
    font-size: 26px;
    letter-spacing: .06em;
    font-weight: 700;
    text-decoration: underline;
    padding-left: 50px;
    position: relative;
    margin-bottom: 20px;
}

.flowInner ol li h5::after {
    content: "01";
    position: absolute;
    font-size: 32px;
    font-weight: 700;
    color: #EE4499;
    left: 0;
    top: 0px;
}

.flowInner ol > li:nth-child(2) h5::after {
    content: "02";
    color: #26D2CA;
}

.flowInner ol > li:nth-child(3) h5::after {
    content: "03";
    color: #00A3FE;
}



.flowInner ol > li:nth-child(4) h5::after {
    content: "04";
    color: #F08E2A;
}

.flowInner ol > li:nth-child(5) h5::after {
    content: "05";
    color: #EC2B2B;
}




.flowInner ol p {
    font-size: 16px;
    line-height: 30px;
    letter-spacing: .06em;
    font-weight: 500;
}

.flowInner ol li i {
    position: absolute;
    left: 55px;
    top: 43px;
    z-index: 2;
}

.flowInner ol ul {
    list-style: none;
    margin: 26px 0;
}

.flowInner ol ul li {
    position: relative;
    padding-left: 18px;
    letter-spacing: .06em;
    font-size: 16px;
    font-weight: 500;
}

.flowInner ol ul li::after {
    content: "";
    position: absolute;
    width: 8px;
    background: #F08E2A;
    border-radius: 100vw;
    height: 8px;
    left: 0;
    top: 11px;
}

.flowInner ol .commonBtn {
    margin-top: 24px;
}

.flowInner ol .commonBtn a {
    line-height: 24px;
    width: 314px;
}



#receipt {
    position: relative;
    padding: 130px 80px;
}

#receipt::after {
    content: "";
    position: absolute;
    z-index: -1;
    background: #FFB302;
    right: 0;
    top: -30%;
    left: 0;
    bottom: 0;
    border-radius: 0 0 140px 140px;
}



#receipt .udCommonTitle {
    text-align: center;
    color: #fff;
}

#receipt .udCommonTitle h4 .enTitle {
    color: #fff;
}


.udCommonTitle h4 .enTitle.center {
    margin-left: -14px;
}


#receipt .title {
    text-align: center;
}

#receipt .title h5 {
    font-size: 20px;
    letter-spacing: .06em;
    font-weight: 600;
    display: inline-block;
    border-radius: 100vw;
    color: #fff;
    background: #FFB302;
    line-height: 1;
    padding: 16px 31px 14px 31px;
}

#receipt .conBox {
    box-sizing: border-box;
    border-radius: 16px;
    padding: 50px 48px;
    background: #F7F5EF;
    max-width: 1000px;
    margin: 0 auto;
    border: solid 10px #FFFFFF;
}

#receipt .conBox .des {
    font-size: 16px;
    line-height: 30px;
    letter-spacing: .06em;
    margin-bottom: 25px;
    font-weight: 500;
}

#receipt .conBox:first-child {
    margin-bottom: 25px;
}

#receipt .conBox .des:last-child {
    margin-bottom: 0;
}

#receipt .tlarrow {
    text-align: center;
    margin-bottom: 20px;
}


#receipt .conBox .des a {
    display: inline-block;
    font-weight: 600;
    text-decoration: underline;
    color: #26D2CA;
}


#receipt .conBox .desl {
    font-size: 18px;
    margin-bottom: 26px;
    text-align: center;
    line-height: 40px;
    letter-spacing: .06em;
    font-weight: 600;
}

#receipt .imgBox {
    text-align: center;
}

#receipt .imgBox img {
    max-width: 100%;
}



#price {
    padding: 130px 80px;
    position: relative;
}

#price::after {
    content: "";
    position: absolute;
    z-index: -2;
    background: #F7F5EF;
    right: 0;
    top: -30%;
    left: 0;
    bottom: 0;
}

#price .udCommonTitle {
    text-align: center;
}

#price .des {
    font-size: 18px;
    line-height: 40px;
    letter-spacing: .06em;
    font-weight: 500;
    margin-bottom: 50px;
    text-align: center;
}

#price .des span {
    display: inline-block;
    font-weight: 600;
    color: #EE4499;
}


.priceTable {
    max-width: 1000px;
    margin: 0 auto;
}

.priceTable .leftTop {
    width: 560px;
    border-radius: 0.75rem 0 0 0;
    border-right: 2px solid #fff;
}

.priceTable .rightTop {
    border-radius: 0 0.75rem 0 0;
    width: 440px;
    background: #26D2CA;
}

.priceTable table thead th {
    background: #FFB302;
    color: #fff;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: .06em;
    text-align: center;
    padding: 27px 0;
}


.priceTable table .title {
    border-right: 1px dashed #ccc;
    text-align: left;
    padding-left: 1.875rem;
}

.priceTable table tbody td small {
    font-size: 12px;
    letter-spacing: .03em;
    font-weight: 500;
    opacity: .6;
}


.priceTable table tbody {}

.priceTable table tbody td {
    padding: 20px 40px;
    letter-spacing: .06em;
    text-align: center;
    font-weight: 500;
    font-size: 18px;
}

.priceTable table .price {
    font-size: 15px;
}

.priceTable table strong {
    color: #26D2CA;
    font-size: 25px;
    margin-right: 5px;
}

.priceTable table em {
    font-size: 25px;
    margin-right: 5px;
    font-style: normal;
}

.priceTable table tbody tr {
    background: #fff;
}

.priceTable table tbody tr:nth-child(2n) {
    background: #F5F9FC;
}



.page-id-14 .fCtaBox .cls-1 {
    fill: #383842;
}



.page-id-20 .fCtaBox .cls-1 {
    fill: #F7F5EF;
}


.page-id-27 .fCtaBox .cls-1 {
    fill: #F7F5EF;
}



.soloHero{
    padding-bottom: 70px;
}
.soliVt{
    height: 1px;
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
    margin-top: 70px;
    background: #E2E2E2;
}
#privacy {
    padding: 0 80px;
    padding-bottom: 120px;
    background: #F7F5EF;
}
.privacyInner {
    max-width: 800px;
    margin: 0 auto;
}

#privacy h3 {
    font-size: 24px;
    font-weight: 600;
    color: #242424;
    letter-spacing: .06em;
    margin-bottom: 5px;
    padding-bottom: 9px;
}
#privacy .des {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .12em;
    color: #585858;
    line-height: 2.4em;
}
#privacy li {
    letter-spacing: .12em;
    color: #585858;
    font-weight: 400;
    line-height: 2.4em;
}

#privacy ul {
    margin-top: 28px;
    letter-spacing: .06em;
    font-size: 14px;
    line-height: 30px;
    list-style: none;
}
#privacy ul ul {
    margin-top: 4px;
    margin-left: 35px;
}

#privacy ul span{
    display: block;
}
#privacy  .poliBox {
    margin-bottom: 48px;
}

#privacy .priConta .des{
     font-size: 14px;
    font-weight: 400;
    letter-spacing: .12em;
    color: #585858;
    line-height: 1.8em;
}
#privacy .priConta {
    margin-top: -30px;
    padding-left: 18px;
    border-left: solid 1px #858585;
}
#privacy .priConta .des a{
    display: inline-block;
    color: #26D2CA;
    text-decoration: underline;
}



@media screen and (max-width:1920px) {
    .heroWrap .flex {
        column-gap: 11%;
    }

    .loopSlide {
        height: 480px;
    }





}



@media screen and (max-width:1730px) {
    .hLogo img {
        width: 214px;
    }

    .navListBox ul {
        column-gap: 24px;
        padding: 10px 34px;
    }

    header .inConta a {
        width: 224px;
    }



}




@media screen and (max-width:1550px) {
    .hLogo img {
        width: 203px;
    }

    .udImgHero {
        margin-top: -1vw;
    }

    .navListBox ul {
        column-gap: 24px;
        padding: 10px 30px;
    }

    header .inConta a {
        height: 66px;
        width: 217px;
        font-size: 15px;
        padding-right: 20px;
    }

    .navListBox ul a {
        font-size: 13px;
        letter-spacing: .02em;
    }

    .heroWrap .flex .imgBox img {
        width: 600px;
    }

    .heroWrap .loopSlide {
        height: 400px;
    }

    .heroWrap .flex {
        padding: 0 40px;
        padding-top: 287px;
    }

    .loopSlideWrap {
        margin-top: 106px;
    }

    #aboutUs .aboutUsimg01 img {
        width: 28vw;
        height: 600px;
    }

    #aboutUs .mainTextBox {
        padding-left: 13vw;
    }

    .loopSlideWrap02 .loopSlide {
        height: 108px;
    }

    .loopSlideWrap {
        margin-top: 132px;
    }

    #ryouiku {
        padding: 160px 0 160px 0;
        margin-top: -46px;
    }

    .ryouikuInner::after {
        font-size: 269px;
        top: 55px;
    }

    #ryouiku .commonBtn {
        margin-top: 39px;
    }

    #ryouiku .flex .textBox .des {
        font-size: 18px;
        margin-bottom: 28px;
    }


    #classRoom .flex {
        gap: 48px 3%;
    }

    .pcHeader.change-color {
        top: 37px;
    }

    #classRoom .flex .map {
        font-size: 13px;
    }

    #classRoom .clain01 {
        top: 7%;
        left: -5%;
    }

    .commonTitle .jaTitle {
        margin-top: 15px;
    }

    #aboutUs .aboutUsimg01 img {
        height: 584px;
    }

    .ryouikuInner {
        padding: 0 80px;
    }

    @keyframes moveLThenUp {
        0% {
            transform: translateY(-2em);
            /* スタート：上に */
        }

        30% {
            transform: translateY(3.2em);
            /* 中央に */
        }

        60% {
            transform: translate(13.8em, 3em);
            /* 右に移動 */
        }

        100% {
            transform: translate(13.8em, -2em);
            /* 最後に上に */
        }
    }

    #aboutUs .commonTitle .jaTitle {
        font-size: 23px;
    }

    #aboutUs .aboutUsimg01 {
        top: -8%;
    }

    #blog {
        padding: 120px 0 160px 0;
    }

    #blog .tab {
        font-size: 17px;
        width: 129px;
        height: 40px;
    }

    #blog .tab-group ul {
        column-gap: 13px;
        margin-bottom: 48px;
    }

    #classRoom {
        padding: 160px 80px 238px 80px;
    }

    #classRoom .clain01 img {
        width: 91%;
    }

    #blog .brogLogo {
        top: 136px;
        right: -10vw;
    }

    #blog .swiper-slide {
        margin-bottom: 124px;
    }

    #blog .commonBtn {
        margin-top: 35px;
    }

    #blog .day {
        margin-top: 23px;
        margin-bottom: 8px;
    }

    #blog h4 {
        margin-bottom: 20px;
    }

    footer {
        padding: 10px;
    }

    header .inConta a::after {
        top: 26px;
    }

    .udHero {
        padding: 224px 0 0 0;
    }

    .udCtaBoxIner {
        height: 632px;
    }

    .udCtaBoxIner > div {
        margin-top: 60px;
    }

    .udCtaBox::after {
        top: 124px;
    }

    .serviceCommonBox .opBox {
        padding: 57px 86px;
    }




.soloHero {
    padding-bottom: 70px;
}



}




@media screen and (max-width:1456px) {

    .pcHeader {
        padding: 0 27px;
    }

    .navListBox {
        column-gap: 13px;
    }

    .navListBox ul {
        column-gap: 18px;
        padding: 19px 28px;
    }

    header .inConta a {
        width: 200px;
        font-size: 14px;
        padding-right: 18px;
    }

    .navListBox ul {
        flex-wrap: wrap;
    }

    .navListBox ul li {
        line-height: 1;
    }

    .pcHeader {
        column-gap: 4px;
    }

    .heroWrap .flex {
        padding-top: 272px;
    }

    .heroWrap .textBox h2 {
        font-size: 66px;
    }

    .heroWrap .flex .imgBox img {
        width: 500px;
    }

    #service .flex h4 {
        top: -23px;
        left: 19px;
        font-size: 20px;
    }





}






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

    body {
        min-width: auto;
    }
#service .flex a {
    width: auto;
}
    #service .flex .des {
    padding-right: 71px;
}
    .pcHeader {
        min-width: auto;
        display: none;
    }

    .spheader {
        display: block;
    }


    .heroWrap .flex {
        padding-top: 142px;
        display: block;
    }

    .heroWrap .textBox {
        margin-top: 80px;
    }

    .heroWrap .textBox h2 {
        font-size: 57px;
    }

    .heroWrap .loopSlide {
        height: 340px;
    }

    .loopSlideWrap {
        margin-top: 102px;
    }

    #aboutUs .aboutUsimg01 {
        padding-right: 40px;
    }

    #aboutUs .aboutUsimg01 img {
        width: 100%;
    }

    #aboutUs .aboutUsimg01 img {
        height: auto;
    }

    #aboutUs .aboutUsimg01 {
        position: static;
    }

    .aboutUsimg02 {
        position: static;
        margin-top: 60px;
    }

    #aboutUs .commonTitle {
        padding: 0 40px;
    }

    #aboutUs .mainTextBox {
        padding: 0 80px;
        width: auto;
    }

    #aboutUs .mainTextBox {
        margin-top: 70px;
    }

    #aboutUs .commonTitle .enTitle {
        font-size: 12vw;
    }

    .commonTitle .space {
        width: 25px;
    }

    #aboutUs .commonTitle {
        margin-bottom: 50px;
    }

    #aboutUs .commonTitle .jaTitle {
        font-size: 18px;
        margin-top: 14px;
    }

    #aboutUs .mainTextBox .des br {
        display: none;
    }

    #aboutUs .aboutBg {
        top: 28%;
        transform: translate(-50%, -50%) scale(2);
    }

    .aboutUsimg02Inner > div:last-child img {
        width: 68vw;
    }

    #aboutUs .mainTextBox h4 {
        font-size: 36px;
        margin-bottom: 32px;
        line-height: 62px;
    }

    #aboutUs .commonBtn {
        margin-top: 36px;
    }


    .aboutUsimg02Inner > div:first-child img {
        width: 46vw;
    }

    .aboutUsimg02Inner > div:first-child {
        text-align: right;
        margin-left: 0;
        margin-right: 46vw;
    }

    .loopSlideWrap02 .loopSlide {
        height: 79px;
    }

    .ryouikuInner {
        padding: 0 40px;
    }

    #ryouiku .flex {
        display: block;
    }

    #ryouiku .flex .textBox {
        width: auto;
    }

    .ryouikuInner::after {
        font-size: 18vw;
        transform: scale(1.28);
        top: 72px;
        white-space: nowrap;
    }

    #ryouiku .flex .textBox h3 {
        font-size: 36px;
        margin-bottom: 32px;
        margin-top: 28px;
        line-height: 62px;
    }

    .spcommonBtn {
        display: block;
    }

    .pccommonBtn {
        display: none;
    }

    #ryouiku .flex .contBox {
        width: auto;
        margin-top: 60px;
    }

    #ryouiku .commonBtn a {
        margin: 0 auto;
    }

    #ryouiku .contBox ul {
        margin: 0 auto;
    }

    #ryouiku {
        padding: 120px 0 78px 0;
        margin-top: -32px;
    }

    #ryouiku {
        border-radius: 48px;
    }

    #service {
        padding: 78px 40px;
    }

    .commonTitle .enTitle {
        font-size: 48px;
    }


    .commonTitle .jaTitle {
        font-size: 16px;
    }

    #service .srIcon img {
        width: 168px;
    }

    #service .srIcon {
        top: -8%;
        left: -4%;
    }

    #service .flex {
        display: block;
        margin-top: 100px;
    }

    .srBg img {
        width: 100%;
    }

    .srBg {
        -webkit-transform: translate(-50%, -50%) scale(1.6);
        transform: translate(-50%, -50%) scale(1.6);
    }

    #service .flex a:last-child {
        margin-top: 90px;
    }

    #service .flex .des {
        font-size: 18px;
        margin-top: 20px;
        line-height: 31px;
    }

    #service .arrowBox {
        bottom: 66px;
        right: -7px;
        width: 56px;
        height: 56px;
        border: solid 4px #F18E2A;
    }

    .arrowBox::before,
    .arrowBox::after {
        top: 21px;
        right: 15px;
        width: 17px;
        height: 7px;
    }

    #service .flex h4 {
        padding: 11px 21px 9px 21px;
    }


    #classRoom {
        padding: 78px 40px 200px 40px;
        position: relative;
        border-radius: 48px 48px 0 0;
    }


    #classRoom .clain01 img {
        width: 112px;
    }

    #classRoom .clain01 {
        top: 6%;
        left: -4%;
    }

    #classRoom .imgBox {
        border: solid 4px #fff;
    }

    #classRoom .flex {
        gap: 60px 3%;
    }

    #classRoom .flex > a {
        width: 48.5%;
    }

    #classRoom.scrollin .clain01 {

        transform: translateX(0) rotate(30deg);
    }

    #classRoom .flex {
        margin-top: 64px;
    }


    .loopSlideWrap03.scrollin .clain02 img {
        width: 118px;
    }

    .loopSlideWrap03 .clain02 {
        top: -28%;
        right: 40%;
    }

    #blog {
        padding: 50px 0 160px 0;
    }

    #blog .commonTitle {
        margin-bottom: 55px;
    }

    #blog .snku {
        display: none;
    }

    #blog .brogLogo {
        display: none;
    }

    #blog .blogInner {
        padding: 0 40px;
    }

    #blog .tab-group ul {
        column-gap: 9px;
        margin-bottom: 38px;
    }

    .fCtaBox .contactIcon {
        top: -64px;
    }

    #blog .tab {
        font-size: 15px;
        width: 106px;
        height: 34px;
    }

    #blog h4 {
        font-size: 16px;
        margin-bottom: 14px;
    }

    #blog .day {
        margin-top: 20px;
    }

    #blog .swiper-slide {
        margin-bottom: 107px;
    }


    .fCtaBox .flex {
        display: block;
    }



    .fCtaBox .flex > a {
        width: auto;
    }

    footer .flex {
        display: block;
        margin-bottom: 20px;
    }

    footer address {
        text-align: center;
    }

    footer .navBox {
        display: block;
    }

    footer .snsBox {
        justify-content: center;
        margin-top: 22px;
        column-gap: 6px;
    }

    .footerInner {
        padding: 0 40px;
        padding-top: 80px;
        border-radius: 6px;
        padding-bottom: 80px;
    }

    .fotlogo img {
        width: 100%;
        max-width: 246px;
    }


    footer .navBox a {
        padding: 26px 0;

    }

    footer .navBox li {
        margin-bottom: 0;
    }

    footer .navBox a::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        opacity: .3;
        width: 100%;
        height: 1px;
        background-image: repeating-linear-gradient(to right,
                #ACACAC,
                #ACACAC 5px,
                /* ダッシュの長さ */
                transparent 5px,
                transparent 10px
                /* ダッシュの間隔 */
            );
    }

    footer .navBox a::after {
        width: 10px;
        height: 6px;
        transition: .4s;
        left: auto;
        right: 0;
        top: 36px;
    }

    footer .fLine {
        opacity: 0;
        margin-bottom: 58px;
    }

    footer .navBox li {
        position: relative;
    }

    footer .navBox li:first-child::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        opacity: .3;
        width: 100%;
        height: 1px;
        background-image: repeating-linear-gradient(to right,
                #ACACAC,
                #ACACAC 5px,
                /* ダッシュの長さ */
                transparent 5px,
                transparent 10px
                /* ダッシュの間隔 */
            );
    }

    footer .navBox {
        margin-top: 38px;
    }

    .menu__line {
        background: #111;
        height: 2px;
    }

    .humFlow .menu__line--bottom {
        display: none;
    }

    .spheader {
        position: fixed;
        width: 97%;
        top: 1%;
        margin: 0 auto;
        right: 0;
        left: 0;
        box-sizing: border-box;
        z-index: 3;
    }

    .commonBtn .arrowLink::before,
    .commonBtn .arrowLink::after {
        z-index: 1;
    }

    .logoBox {
        border: solid 1px #E7E7E7;
        border-radius: 6px;
        background: #ffffff7d;
        z-index: 99;
        position: relative;
        backdrop-filter: blur(20px);
        padding: 9px 20px 11px 20px;
    }

    .spheader {
        transition: .4s;
    }

    .change-color.spheader {
        width: 98.4%;
        top: .5%;
    }

    #ryouiku .flex {
        z-index: 1;
    }

    .fCtaBox {
        z-index: 1;
    }

    .hLogo img {
        width: 128px;
    }

    .gnav {
        background: #F7F5EF;
        transition: transform .65s cubic-bezier(0.86, 0, 0.07, 1);
        transform: translate3d(0, -100%, 0);
        overflow: scroll;
    }


    .gnav__menu {
        opacity: 0;
        transition: .65s cubic-bezier(0.36, 0.14, 0, 1) .56s;
        transform: translateY(2rem);
        margin-top: 120px;
    }

    .open .gnav__menu {
        opacity: 1;
        transform: translateY(0);
    }



    .open .gnav {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .menu {
        right: 25px;
        top: 26px;
        width: 48px;
    }

    .open .menu__line--center {
        top: 7px;
    }

    .open .menu .hlabel {
        bottom: -17px;
    }

    .menu__line.menu__line--top {
        background: #EC2B2B
    }

    .menu__line.menu__line--center {
        background: #00A3FE;
    }

    #aboutUs {
        margin-top: 140px;
    }

    .menu .hlabel {
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .06em;
        position: absolute;
        right: 10px;
        bottom: -13px;
        transition: .4s;
    }

    .gnav__menu {
        padding: 0 40px;
        padding-bottom: 52px;
        padding-top: 320px;
        width: 100%;
    }

    .gnav__menu li a {
        padding: 20px 0;
        letter-spacing: .06em;
        font-size: 16px;
        position: relative;
    }

    .gnav__menu li a::after {
        content: "";
        position: absolute;
        background-image: url(../img/orAwwro.svg);
        background-size: contain;
        background-repeat: no-repeat;
        width: 10px;
        height: 6px;
        transition: .4s;
        right: 0;
        top: 28px;
    }

    .gnav__menu li:first-child a::before {
        display: none;
    }



    .gnav__menu li a::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        opacity: .5;
        width: 100%;
        height: 1px;
        background-image: repeating-linear-gradient(to right,
                #ACACAC,
                #ACACAC 5px,
                /* ダッシュの長さ */
                transparent 5px,
                transparent 10px
                /* ダッシュの間隔 */
            );
    }

    .spFixNav {
        display: block;
    }


    .spFixNav {
        padding: 0 0.3125rem;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        box-sizing: border-box;
        z-index: 100;
    }

    .spFixNav a {
        width: auto;
        flex-grow: 1;
        height: 57px;
        margin: 0 1px;
        display: flex;
        align-items: center;
        text-align: center;
        justify-content: center;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        letter-spacing: .06em;
        border-left: 2px solid #fff;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        border-radius: 16px 16px 0 0;
        background: #EE4499;
        position: relative;
    }

    .spFixNav a::after {
        content: "";
        position: absolute;
        background-image: url(../img/spFixNavArrow.svg);
        background-size: contain;
        background-repeat: no-repeat;
        width: 28px;
        height: 28px;
        right: 16px;
        top: 18px;
    }

    .spFixNav a:last-child {
        background: #26D2CA;
    }



    .spFixNav {
        display: flex;
        justify-content: space-between;
        transform: translateY(4rem);
        /* 初期状態で隠す */
        opacity: 0;
        transition: transform 0.6s cubic-bezier(0.68, -0.6, 0.32, 1.6), opacity 1.4s ease;
        position: fixed;
        bottom: 0;
        width: 100%;
        z-index: 1000;
    }

    .spFixNav.show {
        transform: translateY(0);
        opacity: 1;
    }

    .udHero {
        padding: 144px 0 0 0;
    }



    .udHero .herocoment img {
        width: 80%;
    }

    .serviceNav {
        padding: 40px 40px 0 40px;
    }

    .serviceNav .ankFlex a {
        font-size: 16px;
        width: 100%;
        height: 70px;
        padding: 0 30px;
    }

    .serviceNav .ankFlex a::after {
        right: 20px;
        top: 20px;
    }

    .serviceCommonBox .opBox {
        margin-bottom: 36px;
    }

    .serviceCommonBox {
        padding: 80px 40px 80px 40px;
        border-radius: 0 0 80px 80px;
    }

    #service02.serviceCommonBox {
        padding: 30px 40px 80px 40px;
        border-radius: 0 0 80px 80px;
    }

    .serviceCommonBox .opBox {
        padding: 40px 25px;
    }

    .serviceCommonBox .opBox {
        border-radius: 24px;
    }

    .serviceCommonBoxInner h4 {
        font-size: 26px;
    }

    .serviceCommonBox .mainDes p {
        font-size: 16px;
        line-height: 40px;
    }

    .serviceCommonBoxInner .nam {
        padding: 4px 12px;
        font-size: 11px;
        margin-bottom: 20px;
    }

    .serviceCommonBoxInner .conBox h5 {
        font-size: 20px;
        padding-left: 27px;
        margin-bottom: 16px;
    }

    .serviceCommonBoxInner .conBox .des {
        margin-bottom: 28px;
    }

    .commonsubjectList {
        gap: 15px 19px;
        padding: 28px 22px;
    }

    .commonsubjectList li {
        font-size: 15px;
        padding-left: 20px;
    }

    .coomhuki {
        padding: 21px 43px;
    }

    .coomhuki p {
        font-size: 16px;
    }

    .coomhuki p br {
        display: none;
    }

    .commoniconFlex > div {
        width: 49%;
        padding: 38px 20px 30px 20px;
    }

    .udCtaBoxIner h4 {
        font-size: 36px;
    }

    .commonsubjectList li::after {
        background: #D1D1D1;
        width: 14px;
        height: 14px;
        top: 6px;
    }

    .udCtaBoxIner::before {
        right: -48px;
        bottom: 13%;
    }

    .udCtaBoxIner::after {
        left: -53px;
        top: 3%;
    }

    .udCtaBoxIner {
        height: 577px;
    }

    .udCtaBox {
        padding: 0 40px;
        padding-bottom: 40px;
    }

    .commonCircleD {
        padding: 80px 40px 80px 40px;
    }

    .udCtaBox::after {
        font-size: 15vw;
        top: 19vw;
    }

    .commonCircleD .conBox {
        border: solid 20px #fff;
        border-radius: 30px;
        padding: 60px 30px;
    }
#privacy h3 {
    font-size: 18px;
    margin-bottom: 5px;
    padding-bottom: 0;
}
.soloHero {
    padding-bottom: 60px;
}
    .serviceNav .ankFlex {
        column-gap: 14px;
    }

    .commoniconFlex ul li {
        font-size: 15px;
    }

    .udCtaBox::before {
        width: 233px;
    }

#privacy {
    padding: 0 32px;
    padding-bottom: 120px;
}
    .loopSlideWrap03.udNamiBox .clain02 {
        right: auto;
        left: -6%;
    }


    #flow {
        padding: 80px 40px;
        border-radius: 0 0 80px 80px;
    }

    #receipt {
        padding: 80px 40px;
    }

    .udCommonTitle h4 .jaTitle {
        font-size: 27px;
        margin-bottom: -12px;
    }


    .flowInner ol li h5 {
        font-size: 20px;
        padding-left: 40px;
        margin-bottom: 20px;
    }

    .flowInner ol li h5::after {
        font-size: 25px;
    }

    .flowInner ol > li {
        padding: 48px 60px 48px 90px;
        margin-bottom: 44px;
    }

    .flowInner ol li i {
        left: 28px;
        top: 46px;
    }

    .flowInner ol li i img {
        width: 30px;
        height: 30px;
    }

    .flowInner ol > li {
        margin-bottom: 29px;
    }

    .flowInner ol > li:before {
        height: 109%;
        left: 42px;
        top: 52px;
    }

    .flowInner ol p {
        font-size: 15px;
        line-height: 30px;
    }


    #receipt .conBox {
        padding: 46px 38px;
        border: solid 8px #FFFFFF;
    }

    #receipt::after {
        border-radius: 0 0 80px 80px;
    }

    #price {
        padding: 80px 40px 138px 40px;
        position: relative;
    }

    #price .des {
        font-size: 16px;
        line-height: 30px;
        margin-bottom: 40px;
    }


    .udCommonTitle {
        margin-bottom: 44px;
    }


    .gnav__menu li ul a::after {
        display: none;
    }

    .gnav__menu li ul a::before {
        display: none;
    }

    .gnav__menu li ul a {
        font-size: 12px;
        opacity: .6;
        padding: 2px 0;
    }

    .gnav__menu li ul {
        padding-left: 26px;
        margin-top: -10px;
        margin-bottom: 16px;
    }


    .gnav__menu li ul li {
        padding-left: 12px;
        position: relative;
    }

    .gnav__menu li ul li::after {
        content: "";
        position: absolute;
        background: #E75400;
        width: 4px;
        height: 4px;
        left: 0;
        top: 14px;
        border-radius: 100vw;
    }





.commonCircleD.commonCircleD02 {
    padding-bottom: 120px;
}









}




@media screen and (max-width:650px) {
    .spBr {
        display: block;
    }
.commoniconFlex ul li::after {
    top: 9px;
}
    .heroWrap .flex::after {
        display: none;
    }

    .heroWrap .flex .imgBox img {
        width: 100%;
        max-width: 325px;
    }

    .heroWrap .textBox h2 {
        font-size: 37px;
    }


    .heroWrap .textBox h2 span:nth-child(1) {
        margin-bottom: 12px;
    }

    .commonTitle .space {
        width: 9px;
    }

    .heroWrap .flex {
        padding: 0 30px;
        padding-top: 125px;
    }

    .heroWrap .textBox {
        margin-top: 47px;
    }

    .heroWrap .subTitle {
        font-size: 13px;
    }

    .heroWrap .textBox h2 {
        margin-bottom: 12px;
    }

    .loopSlideWrap {
        margin-top: 28px;
    }

    .heroWrap .loopSlide {
        height: 300px;
    }

    #aboutUs {
        margin-top: 58px;
    }

    #aboutUs .commonTitle {
        margin-bottom: 46px;
    }

    #aboutUs .commonTitle {
        padding: 0 30px;
    }

    #aboutUs .commonTitle .jaTitle {
        font-size: 16px;
        margin-top: 8px;
    }

    #aboutUs .aboutUsimg01 {
        padding-right: 30px;
    }

    #aboutUs .mainTextBox {
        padding: 0 30px;
    }

    #aboutUs .mainTextBox .des {
        font-size: 16px;
        line-height: 40px;
        margin-bottom: 24px;
        letter-spacing: .05em;
    }

    #aboutUs .mainTextBox h4 {
        font-size: 29px;
        margin-bottom: 24px;
        line-height: 50px;
    }

    #aboutUs .mainTextBox {
        margin-top: 40px;
    }

    .loopSlideWrap {
        margin-top: 42px;
    }

    #aboutUs .aboutBg {
        transform: translate(-50%, -50%) scale(3);
    }

    #aboutUs .commonBtn a {
        margin: 0 auto;
    }

    .aboutUsimg02Inner > div:first-child {
        margin-bottom: 16px;
    }

    .loopSlideWrap02 .loopSlide {
        height: 62px;
    }

    .commonBtn a {
        width: 270px;
        height: 66px;
        padding: 0 25px;
        font-size: 14px;
    }

    #aboutUs .commonBtn {
        margin-top: 28px;
    }

    .ryouikuInner {
        padding: 0 30px;
    }

    #ryouiku {
        padding: 70px 0 78px 0;
        margin-top: -22px;
    }

    #ryouiku .flex .textBox .enTitle {
        font-size: 12px;
        font-weight: 700;
    }

    #ryouiku .space {
        width: 4px;
    }

    #ryouiku .flex .textBox h3 {
        font-size: 29px;
        margin-bottom: 24px;
        line-height: 50px;
        margin-top: 16px;
    }

    .ryouikuInner::after {
        font-size: 20vw;
        transform: scale(1.28);
        top: 40px;
    }

    #ryouiku .flex .textBox .des {
        font-size: 16px;
        margin-bottom: 24px;
        line-height: 40px;
    }

    #ryouiku .flex .textBox .des br {
        display: none;
    }

    .spFixNav {
        padding: 0 2px;
    }

    .spFixNav a::after {
        width: 23px;
        height: 23px;
        right: 11px;
        top: 17px;
    }

    .spFixNav a {
        margin: 0 1px;
        justify-content: left;
        font-size: 14px;
        height: 52px;
        padding-left: 18px;
        padding-top: 2px;
    }

    #ryouiku .contBox ul {
        width: auto;
    }

    #ryouiku .contBox .imgBox img {
        height: 120px;
        max-width: 218px;
        width: 150px;
        object-fit: cover;
    }

    #ryouiku .contBox .enTitle {
        width: 104px;
    }

    #ryouiku .contBox .imgBox img {
        height: 110px;
        max-width: 150px;
        width: 100%;
        object-fit: cover;
    }

    #ryouiku .contBox h5 {
        font-size: 15px;
    }

    .commonBtn .arrowLink {
        top: 6px;
        right: 8px;
        width: 52px;
        height: 52px;
    }

    #ryouiku .contBox .enTitle::before,
    #ryouiku .contBox .enTitle::after {
        right: -1px;
    }

    #ryouiku .contBox h4 {
        position: relative;
        margin-bottom: 34px;
        padding-bottom: 28px;
    }

    #ryouiku .contBox ul a {
        padding: 7px 24px 7px 7px;
    }

    #ryouiku .contBox ul li {
        margin-bottom: 15px;
    }

    #service {
        padding: 78px 30px;
    }

    #service .flex {
        margin-top: 81px;
    }

    .commonTitle .enTitle {
        font-size: 45px;
    }

    #service .srIcon {
        top: -11%;
        left: -9%;
    }

    #service .flex h4 {
        font-size: 18px;
    }

    #service .flex h4 {
        padding: 9px 19px 7px 19px;
    }

    #service .flex .des {
        font-size: 16px;
        margin-top: 20px;
        line-height: 30px;
    }

    #service .flex .des br {
        display: none;
    }

    .srBg {
        -webkit-transform: translate(-50%, -50%) scale(2);
        transform: translate(-50%, -50%) scale(2);
    }

    #service .imgBoxWrap {
        position: relative;
    }

    #service .arrowBox {
        bottom: -10px;
    }

    #service .flex a:last-child {
        margin-top: 74px;
    }

    #service .flex .imgBox img {
        height: 211px;
    }

    #service .flex .des {
        margin-top: 18px;
    }

    #blog .blogInner {
        padding: 0 30px;
    }

    #blog .tab-group ul {
        column-gap: 6px;
    }

    #blog .tab {
        font-size: 12px;
        width: 96px;
        height: 26px;
    }

    #blog .swiArrow {
        width: 187px;
    }

    #classRoom {
        padding: 78px 30px 200px 30px;
    }

    #classRoom .commonBtn {
        margin-top: 52px;
    }

    .loopSlideWrap02.loopSlideWrap03 .loopSlide {
        height: 65px;
    }

    #blog {
        padding: 20px 0 160px 0;
    }

    .commonTitle .jaTitle {
        font-size: 16px;
        line-height: 30px;
    }

    #classRoom .flex h4 {
        font-size: 16px;
        margin-top: 22px;
        margin-bottom: 13px;
    }

    .loopSlideWrap03 .clain02 {
        right: 75%;
    }

    .loopSlideWrap03.scrollin .clain02 img {
        width: 112px;
    }

    #classRoom .flex {
        display: block;
        margin-top: 68px;
    }

    #blog .commonBtn {
        margin-top: 27px;
    }

    #classRoom .flex > a {
        width: auto;
        margin-bottom: 60px;
    }

    #blog .swiper-slide {
        margin-bottom: 95px;
    }

    #classRoom .flex > a:last-child {
        margin-bottom: 0;
    }

    #classRoom .clain01 img {
        width: 92px;
    }

    #classRoom .clain01 {
        top: 4.4%;
        left: -6%;
    }

    .fCtaBox .glaycr {
        top: -8px;
    }

    .fCtaBox .arrowLink {
        bottom: 15px;
        right: 14px;
    }

    .fCtaBox .contactIcon img {
        width: 188px;
    }

    .fCtaBox .contactIcon {
        top: -68px;
    }

    .fCtaBox .textBox .des {
        display: none;
    }

    .fCtaBox .textBox p.enTitle {
        font-size: 13px;
        margin-bottom: 1px;
    }

    .fCtaBox .textBox h4 {
        font-size: 20px;
        margin-bottom: 0;
    }

    footer .navBox a {
        padding: 19px 0;
    }

    footer {
        padding: 6px;
    }

    .footerInner {
        padding: 0 30px;
        padding-top: 64px;
        padding-bottom: 80px;
    }

    footer .navBox a::after {
        top: 31px;
    }

    footer .bottmFlex {
        display: block;
    }

    footer .copBOx .copLink a {
        font-size: 10px;
        padding-right: 20px;
        width: 155px;
        height: 33px;
    }

    .gnav__menu li a {
        padding: 13px 0;
        font-size: 14px;
    }

    .menu {
        top: 22px;
    }

    .gnav__menu li a::after {
        top: 24px;
    }

    footer .fLine {
        margin-bottom: 27px;
    }

    footer .copy {
        font-size: 10px;
        text-align: center;
        margin-top: 35px;
    }

    .logoBox {
        padding: 7px 20px 9px 20px;
    }

    .change-color.spheader {
        width: 97%;
        top: .8%;
    }

    .spheader {
        width: 94%;
        top: 1.6%;
    }

    .udHero {
        padding: 124px 0 0 0;
    }

    .serviceNav {
        padding: 62px 30px 0 30px;
    }

    .udImgHero {
        margin-top: 12px;
    }

    .serviceNav .ankFlex a::after {
        right: 20px;
        top: 17px;
    }

    .serviceNav .ankFlex a {
        font-size: 15px;
        height: 64px;
    }

    .udHero .herocoment img {
        width: 76%;
    }

    .herocoment {
        top: auto;
        left: 20%;
        bottom: -25%;
    }

    .serviceNav p {
        margin-bottom: 28px;
        font-size: 16px;
    }

    .serviceNav .ankFlex {
        display: block;
    }

    .serviceNav .ankFlex a:first-child {
        margin-bottom: 8px;
    }

    .serviceCommonBox .opBox {
        padding: 26px 20px;
    }

    .serviceCommonBox .opBox {
        border-radius: 16px;
    }

    .serviceCommonBox .opBox {
        margin-bottom: 28px;
    }

    .commonsubjectList li::after {
        width: 10px;
        height: 10px;
        top: 8px;
    }

    .serviceCommonBoxInner .conBox h5::after {
        top: 2px;
    }

    #service02.serviceCommonBox {
        padding: 10px 30px 60px 30px;
        border-radius: 0 0 30px 30px;
    }

    .commonsubjectList {
        gap: 10px 15px;
        padding: 20px 19px;
    }

    .commonsubjectList li {
        font-size: 14px;
        padding-left: 16px;
    }

    .serviceCommonBox {
        padding: 60px 30px 60px 30px;
        border-radius: 0 0 30px 30px;
    }

    .serviceCommonBoxInner .conBox .des {
        font-size: 15px;
        margin-bottom: 24px;
    }

    .serviceCommonBoxInner .conBox h5 {
        font-size: 18px;
        padding-left: 27px;
    }

    .serviceCommonBoxInner .conBox {
        margin-top: 60px;
    }

    .serviceCommonBox .opBox .imgBox {
        border-radius: 10px;
    }

    .serviceCommonBoxInner .titleBox {
        margin-bottom: 24px;
    }

    .serviceCommonBox .opBox .imgBox img {
        border-radius: 10px;
        aspect-ratio: auto;
    }

    .serviceCommonBoxInner h4 {
        font-size: 20px;
        padding-left: 16px;
        letter-spacing: .06em;
    }

    .serviceCommonBoxInner h4::after {
        width: 7px;
        height: 7px;
        top: 10px;
    }

    .commoniconFlex .iconBox {
        margin: 22px 0 24px;
    }

    .commoniconFlex ul li {
        font-size: 14px;
    }

    .commoniconFlex > div::after {
        font-size: 37px;
    }

    .serviceCommonBoxInner .nam {
        padding: 3px 12px;
        font-size: 10px;
        margin-left: 16px;
        margin-bottom: 17px;
    }

    .commoniconFlex {
        display: block;
        margin-top: 60px;
    }

    .commoniconFlex > div {
        width: auto;
        margin-bottom: 35px;
        padding: 38px 20px 30px 20px;
    }

    .commoniconFlex > div:last-child {
        margin-bottom: 0;
    }


    .coomhuki p {
        font-size: 15px;
    }

    .coomhuki {
        padding: 18px 28px;
        border-radius: 16px;
    }

    .coomhuki {
        margin-top: 40px;
    }

    .commonCircleD {
        padding: 60px 20px 60px 20px;
    }

    .commonCircleD .conBox {
        border: solid 10px #fff;
        border-radius: 16px;
        padding: 40px 20px;
    }

    .commonCircleD .conBox .des .lFont {
        font-size: 22px;
    }

    .commonCircleD .conBox .des {
        font-size: 16px;
        line-height: 34px;
        margin-bottom: 38px;
    }

    .commonCircleD .atenBox p {
        font-size: 12px;
        line-height: 24px;
        letter-spacing: .03em;
        border-radius: 16px;
        padding: 14px 20px;
    }

    .udCtaBox {
        padding: 0 30px;
        padding-bottom: 107px;
    }

    .udCtaBox::before {
        width: 176px;
        height: 7px;
    }

    .udCtaBoxIner .des {
        font-size: 15px;
        letter-spacing: .03em;
        margin-bottom: 38px;
    }

    .udCtaBoxIner::before {
        right: -55px;
        bottom: -1%;
    }

    .udCtaBoxIner::after {
        left: -66px;
        top: 2%;
    }

    .udCtaBox::after {
        top: 31vw;
    }

    .udCtaBoxIner > div {
        margin-top: 36px;
    }

    .commonCircleD .atenBox {
        margin-top: 29px;
    }

    .udCtaBoxIner {
        height: 451px;
    }

    .udCtaBoxIner h4 {
        font-size: 26px;
        margin-bottom: 16px;
    }

    .udCtaBoxIner::after {
        width: 114px;
        height: 80px;
    }

    .udCtaBoxIner::before {
        width: 114px;
        height: 80px;
    }


    .flowInner ol li h5::after {
        font-size: 19px;
    }

    .udCommonTitle h4 .jaTitle {
        font-size: 22px;
        margin-bottom: -21px;
    }

    .flowInner ol li h5::after {
        top: -1px;
    }

    .flowInner ol ul li {
        font-size: 14px;
    }

    .flowInner ol ul {
        margin: 24px 0;
    }

    #flow {
        padding: 70px 30px 60px 30px;
        border-radius: 0 0 30px 30px;
    }

    .flowInner ol li h5 {
        font-size: 18px;
        padding-left: 30px;
        margin-bottom: 16px;
        line-height: 28px;
    }

    .flowInner ol .commonBtn a {
        width: auto;
    }

    .flowInner ol > li:before {
        left: 33px;
        top: 52px;
    }

    .flowInner ol li i {
        left: 22px;
        top: 24px;
    }

    .flowInner ol > li:before {
        height: 105%;
    }

    .udCommonTitle {
        margin-bottom: 30px;
    }

    .flowInner ol > li {
        padding: 28px 20px 28px 60px;
        margin-bottom: 44px;
    }

    .flowInner ol li i img {
        width: 24px;
        height: 24px;
    }

    .flowInner .commonBtn a br {
        display: none;
    }

    .flowInner .commonBtn a {
        padding-right: 70px;
        height: 78px;
        font-size: 12px;
    }

    .flowInner ol .commonBtn a {
        line-height: 18px;
    }

    .flowInner .commonBtn .arrowLink {
        top: 13px;
    }

    #receipt::after {
        border-radius: 0 0 30px 30px;
    }

    #receipt .conBox .desl {
        font-size: 16px;
        margin-bottom: 24px;
        line-height: 32px;
    }

    .flowInner ol > li {
        margin-bottom: 30px;
    }

   #receipt {
    padding: 90px 8px 60px 8px;
    margin-top: -30px;
}

    .udCommonTitle h4 .enTitle {
        font-size: 14px;
    }

    #receipt .title h5 {
        font-size: 16px;
        padding: 15px 28px 13px 28px;
    }

    #receipt .conBox .des {
        font-size: 15px;
        line-height: 28px;
        margin-bottom: 24px;
    }

    #receipt .conBox {
        padding: 30px 20px;
        border: solid 6px #FFFFFF;
    }

    #price {
        padding: 90px 30px 130px 30px;
        margin-top: -30px;
    }


    #price .des {
        text-align: left;
    }

    .priceTable table em {
        font-size: 20px;
    }

    .priceTable table thead th {
        font-size: 14px;
        padding: 11px 0;
    }

    .priceTable table .title {
        padding-left: 20px;
    }

    .priceTable table tbody td {
        padding: 10px 10px;
        font-size: 14px;
    }

    .priceTable table tbody td {
        text-align: right;
        vertical-align: middle;
    }

    .priceTable .rightTop {
        width: 249px;
    }

   .priceTable table .title {
    padding-left: 14px;
    line-height: 23px;
    letter-spacing: .03em;
}

    .priceTable table strong {
        font-size: 23px;
    }

    .priceTable table tbody td small {
        font-size: 10px;
        letter-spacing: .03em;
        margin-top: -4px;
        display: block;
    }
    #privacy ul {
    margin-top: 17px;
}
    #privacy .priConta {
    margin-top: -14px;
    padding-left: 10px;
}
    #privacy ul ul {
    margin-left: 24px;
}
#privacy .des {
    font-size: 13px;
    letter-spacing: .12em;
    line-height: 2.2em;
}
    #privacy .priConta .des {
      font-size: 13px;
    letter-spacing: .12em;
    line-height: 1.6em;
}
    #privacy li {
    font-size: 13px;
    letter-spacing: .12em;
    line-height: 2.2em;
}
    .priceTable table thead th {
        font-weight: 700;
        letter-spacing: .03em;
    }
#privacy  .poliBox {
    margin-bottom: 36px;
}
    .gnav__menu {
        padding-top: 520px;
    }


.udHero .commonTitle .enTitle {
    font-size: 42px;
}
.soloHero {
    padding-bottom: 40px;
}
.soliVt {
    margin-top: 33px;
}
#service .flex .des {
    padding-right: 0;
}

  
.page-id-27 .udHero .commonTitle .enTitle {
    font-size: 34px;
}
    
    
    


}