@charset "utf-8";

/*------------------
共通部分
--------------------*/

*{
    margin: 0;
    padding: 0;
}

html{
    font-size: 62.5%;
}

body{
    font-family: "Sawarabi Mincho", serif;
    font-size: 1vw;
    font-weight: 400;
    font-style: normal;
    color: #000;
    line-height: 1.5;
}

img{
    max-width: 100%;
    height: auto;
}

li{
    list-style-type: none;
}

span{
    display: block;
}

/*----------共通部分 / SP----------*/

@media screen and (max-width: 768px){
   body{
    font-size: 3.73vw;
   } 
}

/*------------------
HEADER
--------------------*/

.header-title{
    font-family: "Castoro Titling", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 4.4vw;
    line-height: 1.4;
}

.header-sub-title{
    font-family: "Pinyon Script", cursive;
    font-weight: 400;
    font-style: normal;
    font-size: 3.3vw;
    transform: rotate(-40deg);
    display: inline-block;
    margin-top: 2vw;
}

.header-txt{
    font-size: 1.67vw;
    text-align: center;
    margin-top: 1vw;
    margin-right: 8.8vw;
}

.title-line{
    border: none;
    height: 3px;
    background-color: #000;
    width: 33.4vw;
    margin: 0 auto;
}

.title-wrapper{
    display: flex;
    justify-content: center;
    gap: 1.2vw;
    margin-top: 15.6vw;
}

.header-line{
    border: none;
    height: 2.94vw;
    background-color: #000;
    width: 89vw;
    margin-top: 15.6vw;
}

/*----------HEADER / SP----------*/

@media screen and (max-width: 768px){
   
    .header-title{
        font-size: 10.3vw;
    }

    .title-wrapper{
        gap: 1vw;
        margin-top: 22vw;
        padding-left: 6vw;
    }

    .header-sub-title{
        font-size: 8.53vw;
        margin-top: 6vw;
        margin-right: 2.5vw;
        position: relative;
        right: 1.5vw;
    }

    .title-line{
        width: 68vw;
        padding-right: 6vw;
        margin-top: 3.2vw;
    }

    .header-txt{
        font-size: 4.2vw;
        margin-top: 2vw;
        margin-right: 7.2vw;
    }

    .header-line{
        width: 88vw;
        height: 3.5vw;
        margin-top: 25.5vw;
    }

}

/*------------------
MAIN
--------------------*/

.design-title{
    font-family: "Playfair Display", serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 4.4vw;
    margin-top: 5.9vw;
    padding-left: 9.5vw;
}

.design-subtitle{
    position: relative;
    display: inline-block;
    padding: 0 2vw;
    margin-top: 6.2vw;
    font-size: 1.94vw;
    font-weight: 500;
    background-color: #fff;
    position: relative;
    z-index: 3;
}

.design-line{
    width: 40vw;
    margin: 0 auto;
    position: relative;
    bottom: 1.3vw;
}

.design-subtitle-img{
    width: 47vw;
}

.design-subtitle-wrapper{
    text-align: center;
    background-color: #fff;
    position: relative;
    z-index: 3;
}

.design-circle{
    width: 30vw;
    height: 30vw;
    background-color: #F8F8F8;
    border-radius: 50%;
}

.design-txt{
    font-size: 1.39vw;
    line-height: 5;
    margin-top: 7.9vw;
    text-align: center;
    position: relative;
    z-index: 3;
}

.design-txt1{
    padding-right: 16vw;
}

.design-txt2{
    padding-left: 24vw;
}

.design-txt3{
    padding-right: 14vw;
}

.design-circle{
    margin: 0 auto;
    position: relative;
    bottom: 25vw;
}

.arrow-img-wrapper{
    text-align: center;
    margin-top: -23vw;
}

.arrow-img{
    width: 4.7vw;
}

.summarize-txt-wrapper{
    text-align: center;
    margin-top: 7.7vw;
    position: relative;
    z-index: 3;
}

.summarize-txt{
    font-size: 1.39vw;
    display: inline-block;
    text-align: left;
    padding-left: 0.4vw;
}

.summarize-box{
    text-align: center;
}

.summarize-box-img{
    width: 38vw;
    position: relative;
    bottom: 13vw;
}

.thinking-title{
    font-size: 2.36vw;
    text-align: center;
    margin-top: -5vw;
}

.thinking-subtitle{
    position: relative;
    display: inline-block;
    font-size: 1.39vw;
    font-weight: 500;
    padding: 0 2vw;
    margin-top: 1vw;
    background-color: #fff;
    position: relative;
    z-index: 3;
}

.thinking-line{
    width: 18vw;
    margin: 0 auto;
    position: relative;
    bottom: 1.1vw;
}



.thinking-subtitle-wrapper{
    text-align: center;
}

.thinking-section-subtitle1,
.thinking-section-subtitle2,
.thinking-section-subtitle3{
    font-size: 1.25vw;
    text-align: center;
    margin-top: 4.7vw;
    margin-bottom: 2vw;
}

.thinking-circle-title1,
.thinking-circle-title2,
.thinking-circle-title3{
    font-size: 1.53vw;
}

.thinking-circle-txt1,
.thinking-circle-txt3{
    font-size: 1.25vw;
    margin-top: 1vw;
}

.thinking-circle-txt2{
    font-size: 1.39vw;
}

.thinking-circle1{
    width: 24vw;
    border: solid 1px #000;
    border-radius: 50%;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.thinking-circle2{
    width: 28vw;
    border: solid 1px #000;
    border-radius: 50%;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.thinking-circle3{
    width: 24vw;
    border: solid 1px #000;
    border-radius: 50%;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.thinking-section-container{
    display: flex;
    justify-content: center;
    vertical-align: middle;
}

.thinking-section1, .thinking-section3{
    margin-top: 2vw;
}

.thinking-section1{
    position: relative;
    left: 2vw;
}

.thinking-section3{
    position: relative;
    right: 2vw;
}

.triangle1-img, .triangle2-img{
    width: 1.7vw;
}

.triangle1-img{
    position: relative;
    right: 9.4vw;
    bottom: 15vw;
}

.triangle2-img{
    position: relative;
    left: 9.4vw;
    bottom: 15vw;
}

.triangle-wrapper{
    text-align: center;
}

.sp-br{
    display: none;
}


/*----------DESIGN / SP----------*/

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

    .design-title{
        font-size: 7.5vw;
        padding-left: 4.3vw;
        margin-top: 10vw;
    }

    .design-subtitle{
        font-size: 4.8vw;
        margin-top: 8.2vw;
        padding: 0 3vw;
    }

    .design-line{
        width: 64vw;
        bottom: 3.5vw;
    }

    .design-subtitle-img{
        display: none;
    }

    .design-subtitle-img-sp{
        display: block;
        width: 64vw;
    }

    .design-circle{
        width: 63vw;
        height: 63vw;
        margin-top: -14vw;
    }

    .design-txt{
        font-size: 3.7vw;
        position: relative;
        top: 12vw;
    }

    .design-txt1{
        padding-right: 34vw;
        line-height: 1.5;
    }
    
    .design-txt2{
        padding-left: 46vw;
        line-height: 1.5;
        margin-top: 4vw;
    }
    
    .design-txt3{
        padding-right: 35vw;
        line-height: 1.5;
        margin-top: 5vw;
    }

    .sp-br{
        display: block;
    }

    .arrow-img{
        width: 8.5vw;
    }

    .summarize-txt{
        font-size: 3.74vw;
    }

    .summarize-box-img{
        width: 90.6vw;
        bottom: 23vw;
    }

    .summarize-txt{
       position: relative;
       top: 9.5vw;
    }

    .thinking-title{
        font-size: 5.87vw;
    }


    .thinking-subtitle{
        font-size: 4.2vw;
        padding: 0 3vw;
        margin-top: 1vw;
    }

    .thinking-line{
        width: 38vw;
        bottom: 3vw;
    }

    .thinking-section-container{
        display: block;
    }


    .thinking-section-subtitle1,
    .thinking-section-subtitle2,
    .thinking-section-subtitle3{
        transform: rotate(90deg);
        height: 3.2vw;
        margin-bottom: 0;
        font-size: 3.2vw; 
        position: relative;
        right: 39vw;
        top: 34vw;
    }

    .thinking-section-subtitle1{
        top: 36vw;
    }

    .thinking-section-subtitle2{
        top: 23vw;
    }

    .thinking-section-subtitle3{
        top: 36vw;
    }

    .thinking-section1,
    .thinking-section2,
    .thinking-section3{
        left: 0;
        right: 0;
    }

    .thinking-circle-txt1,
    .thinking-circle-txt3{
        font-size: 3.73vw;
    }

    .thinking-circle-txt2{
        font-size: 4.27vw;
    }

    .thinking-circle-title1,
    .thinking-circle-title2,
    .thinking-circle-title3{
        font-size: 4.27vw;
    }

    .thinking-circle1{
        width: 67vw;
       margin: 0 auto; 
    }

    .thinking-circle2{
        width: 72vw;
        margin: -15vw auto;
        
    }

    .thinking-circle3{
        width: 67vw;
        margin: 0 auto; 
    }

    .triangle1-img, .triangle2-img{
        width: 4vw;
        transform: rotate(90deg);
    }

    .triangle1-img{
        position: relative;
        bottom: 123vw;
        left: 2.5vw;
    }

    .triangle2-img{
        position: relative;
        bottom: 75vw;
        left: -2.5vw;
    }

    

}

/*------------------WORK-----------------*/

.work-title{
    font-family: "Playfair Display", serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 4.4vw;
    text-align: center;
    margin-top: 8vw;
}

.work-subtitle{
    position: relative;
    display: inline-block;
    padding: 0 2vw;
    margin-top: 2vw;
    font-size: 1.94vw;
    background-color: #fff;
    position: relative;
    z-index: 3;
}

.work-line{
    width: 38vw;
    margin: 0 auto;
    position: relative;
    bottom: 1.3vw;
}

.work-subtitle-img{
    width: 47.9vw;
}


.work-subtitle-wrapper{
    text-align: center;
}

.work-txt-wrapper{
    text-align: center;
    font-size: 1.25vw;
}

.work-txt1{
    margin-top: 2.1vw;
}

.work-txt2{
    margin-top: 0.8vw;
}

.url{
    display: inline-block;
    padding-right: 2vw;
}

.work-img-wrapper{
    text-align: center;
    margin-top: 4vw;
}

.work-img{
    width: 85.2vw;
    margin: 0 auto;
}

.Explanation-title{
    font-size: 2.36vw;
    text-align: center;
    margin-top: 8vw;
}

.Explanation-subtitle{
    position: relative;
    display: inline-block;
    padding: 0 2vw;
    font-size: 1.39vw;
    margin-top: 1vw;
    font-weight: 500;
    background-color: #fff;
    position: relative;
    z-index: 3;
}



.Explanation-line{
    width: 30vw;
    margin: 0 auto;
    position: relative;
    bottom: 1.1vw;
}



.Explanation-subtitle-wrapper{
    text-align: center;
    margin-bottom: 4vw;
}

.Explanation-dl1, .Explanation-dl2, .Explanation-dl3,
.Explanation-dl4, .Explanation-dl5{
    text-align: center;
    margin-top: 3.8vw;
}

.Explanation-dt{
    font-size: 1.25vw;
}

.dd-en{
    font-size: 1.39vw;
    display: inline;
    font-weight: 400;
}

.Explanation-dd, .Explanation-dd2{
    font-size: 1.25vw;
    font-weight: 400;
    margin-top: 0.6vw;
    margin-bottom: 1.2vw;
}

.dd3{
    padding-right: 19.3vw;
}

.vertical-line{
    width: 0.12vw;
    height: 1.2vw;
    background-color: #000;
    margin: 0.4vw auto;
}

.dd-2{
    display: inline-block;
    padding-right: 26.2vw;
}

.work-img-sp{
    display: none;
}

.point-title{
    font-size: 2.36vw;
    text-align: center;
    margin-top: 10vw;
}

.point-img-1{
    width: 34vw;
}

.point-number{
    font-size: 1vw;
    padding-top: 0.15vw;
}

.point-number-wrapper{
    border: 0.14vw solid #000 ;
    width: 6vw;
    border-radius: 30vw;
    text-align: center;
}

.point-section1-title{
    font-size: 1.94vw;
    margin-left: 12vw;
}

.point-section1-txt{
    font-size: 1.1vw;
    width: 40vw;
    line-height: 1.7;
    margin-top: 1.3vw;
}

.point-section1-title-wrapper{
    display: flex;
    align-items: center;
}

.point-section1{
    display: flex;
    justify-content: center;
    gap: 3vw;
    margin-top: 6vw;
    margin-left: 1vw;
}

.point-section2{
    display: flex;
    justify-content: center;
    gap: 3vw;
    margin-top: 7vw;
    margin-left: 1vw;
    flex-direction: row-reverse;
}

.point-section-inner1{
    margin-top: 2.2vw;
}

.point-section2-txt{
    font-size: 1.1vw;
    width: 40vw;
    line-height: 1.7;
    margin-top: 1.3vw;
}

.point-section2-title-wrapper{
    display: flex;
    align-items: center;
    margin-top: 2.7vw;
}

.point-section3-title-wrapper{
    display: flex;
    align-items: center;
    margin-top: 2.7vw;
}

.point-section2-title{
    font-size: 1.94vw;
    margin-left: 8vw;
}

.point-section3-title{
    font-size: 1.94vw;
    margin-left: 6vw;
}



.point-section3{
    display: flex;
    justify-content: center;
    gap: 3vw;
    margin-top: 7vw;
    margin-left: 1vw;
}

.point-section-inner3{
    margin-top: 2.2vw;
}

.Explanation-spbr{
    display: none;
}


/*----------WORK / SP----------*/

@media screen and (max-width: 768px){
    .work-title{
        font-size: 7.5vw;
        margin-top: 18vw;
    }
    .work-subtitle{
        font-size: 4.8vw;
        padding: 0 3vw;
    }

    .work-line{
        width: 55vw;
        bottom: 3.5vw;
    }


    .work-txt-wrapper{
        font-size: 3.73vw;
        margin-top: 3vw;
    }

    .work-img-sp{
        display: block;
        width: 94vw;
        margin: 4vw auto;
    }

    .work-img{
        display: none;
    }

    .work-img-wrapper{
        margin-top: 10vw;
    }

    .Explanation-title{
        font-size: 5.87vw;
    }

    .Explanation-subtitle{
        font-size: 4.2vw;
        padding: 0 3vw;
        margin-top: 1vw;
    }

    .Explanation-line{
        width: 55vw;
        bottom: 3vw;
    }

    .Explanation-txt{
        width: 75vw;
        margin-top: 5vw;
    }

    .Explanation-spbr{
        display: block;
    }

    .Explanation-dt{
        font-size: 4.2vw;
        font-weight: 450;
    }

    .Explanation-dd, .Explanation-dd2{
        font-size: 3.8vw;
        display: inline-block;
        text-align: left;
    }

    .Explanation-dd-inner{
        padding-right: 4vw;
    }

    .Explanation-dd2-inner{
        padding-left: 2vw;
    }

    .Explanation-dd-inner3, .Explanation-dd-inner4{
        padding-left: 2vw;
    }

    .Explanation-pcbr{
        display: none;
    }

    .dd-2{
        display: inline;
    }

    .Explanation-dd2{
        margin-top: 5vw;
    }

    .dd-en{
        font-size: 4.27vw;
    }

    .vertical-line{
        width: 0.53vw;
        height: 3.4vw;
        margin-top: 1.3vw;
        margin-bottom: 1.6vw;
    }

    .Explanation-dt{
        margin-top: 13vw;
    }

    .dd3{
        padding-right: 11.3vw;
    }
    
    .point-title{
        font-size: 5.87vw;
        margin-top: 24vw;
    }

    .point-section1, .point-section2, .point-section3{
        display: block;
       text-align: center;
    }

    .point-img-1, .point-img-2, .point-img-3{
        width: 85vw;

        
    }

    .point-img-1{
        margin-top: 11vw;
    }

    .point-section1-title-wrapper{
        justify-content: center;
        gap: 10.5vw;
        padding-right: 14.5vw;
        margin-top: 4vw;
        margin-right: 21vw;
    }

    .point-section1-txt{
        margin: 0 auto;
        font-size: 3.73vw;
        width: 88vw;
        text-align: left;
        margin-top: 5vw;
    }

    .point-section1-title, .point-section2-title, .point-section3-title{
        font-size: 4.8vw;
    }

    .point-number{
        font-size: 2.67vw;
        
    }

    .point-number-wrapper{
        width: 14vw;
    }

    .point-section2-txt{
        margin: 0 auto;
        font-size: 3.73vw;
        width: 88vw;
        text-align: left;
        margin-top: 5vw;
    }

    .point-section3-txt{
        margin: 0 auto;
        font-size: 3.73vw;
        width: 88vw;
        text-align: left;
        margin-top: 5vw;
    }

    .point-section2-title-wrapper{
        justify-content: center;
        gap: 8vw;
        margin-top: 4vw;
        margin-right: 21vw;
        padding-right: 8vw;
    }

    .point-section3-title-wrapper{
        justify-content: center;
        gap: 8vw;
        margin-top: 4vw;
        margin-right: 21vw;
        padding-right: 1vw;
    }

    
}



/*------------------PROFILE-----------------*/

.profile-title{
    font-family: "Playfair Display", serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 4.4vw;
    margin-top: 12vw;
    padding-left: 10vw;
}

.profile-subtitle{
    font-size: 2.22vw;
    border-bottom: solid 0.08vw #000;
    width: 27.4vw;
    transform: rotate(90deg);
    position: relative;
    top: 21vw;
}

.profile-img{
    width: 13.3vw;
    margin-top: 0.1vw;
}

.profile-name{
    position: relative;
    display: inline-block;
    padding: 0 55px;
    margin-top: 2vw;
    width: 44.8vw;
}

.profile-date-container{
    position: relative;
    bottom: 0.19vw;
}

.profile-date{
    margin-top: 1.8vw;
}

.birthplace{
    margin-top: 0.6vw;
}

.profile-txt-wrapper{
    margin-top: 0.8vw;
    width: 44.4vw;
}

.profile-txt{
    line-height: 1.7;
}

.profile-container{
    display: flex;
    align-items: center;
    gap: 2.6vw;
    padding-left: 22vw;
    margin-top: 5vw;
}

.profile-date-container{
    margin-top: -3vw;
}

.profile-name-sp{
    display: none;
}

.profile-txt-wrapper-sp{
    display: none;
}


/*----------PROFILE / SP----------*/

@media screen and (max-width: 768px){
    .profile-title{
        font-size: 7.5vw;
        margin-top: 22vw;
        padding-left: 5vw;
    }

    .profile-subtitle{
        font-size: 5vw;
        width: 50vw;
        right: 15vw;
        top: 30.5vw;
       margin-top: 6vw;
    }

    .profile-name-sp{
        display: block;
        width: 60vw;
        margin-left: 30vw;
        position: relative;
        bottom: 4vw;
    }

    .profile-name-wrapper{
        display: none;
    }

    .profile-container{
        align-items: flex-start;
        padding-right: 4vw;
        padding-left: 16vw;
        gap: 6vw;
    }

    .profile-date{
        font-size: 3.73vw;
        margin-top: 0;
        line-height: 2;
        margin-top: -3vw;
    }

    .profile-img{
        width: 32vw;
        position: relative;
        bottom: 7vw;
    }

    .profile-txt-wrapper{
        display: none;
    }

    .profile-txt-wrapper-sp{
        display: block;
    }

    .profile-txt{
        width: 79vw;
        margin: 2.5vw auto;
        
    }

}

/*----------PROFILE / PERSONALITY----------*/

.personality-title{
    font-size: 2.36vw;
    text-align: center;
    margin-top: 10vw;
}

.personality-subtitle{
    position: relative;
    display: inline-block;
    padding: 0 2vw;
    font-size: 1.39vw;
    margin-top: 1vw;
    font-weight: 500;
    background-color: #fff;
    position: relative;
    z-index: 3;
}

.personality-line{
    width: 28vw;
    margin: 0 auto;
    position: relative;
    bottom: 1.1vw;
}

.personality-subtitle-img{
    width: 21.9vw;
}


.personality-subtitle-wrapper{
    text-align: center;
}

.personality-circle-title1, 
.personality-circle-title2, 
.personality-circle-title3{
    font-size: 1.39vw;
    text-align: center;
}

.personality-circle1{
    width: 22vw;
    border: solid 1px #000;
    border-radius: 50%;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.personality-circle2{
    width: 22vw;
    border: solid 1px #000;
    border-radius: 50%;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.personality-circle3{
    width: 22vw;
    border: solid 1px #000;
    border-radius: 50%;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.personality-circle-txt1,
.personality-circle-txt2,
.personality-circle-txt3
{
    font-size: 1vw;
    margin-top: 0.8vw;
}

.personality-circle1-inner,
.personality-circle2-inner,
.personality-circle3-inner{
    margin-top: -1vw;
}

.personality-circle1{
    margin: 4.2vw auto;
}

.personality-section-container{
    display: flex;
    justify-content: center;
    gap: 2vw;
    position: relative;
    bottom: 10vw;
}

.personality-subtitle-img-sp{
    display: none;
}

/*----------PROFILE / PERSONALITY / SP----------*/

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

    .personality-title{
        font-size: 5.87vw;
        margin-top: 16vw;
    }

    .personality-subtitle{
        font-size: 4.2vw;
        padding: 0 3vw;
        margin-top: 1vw;
    }

    .personality-line{
        width: 50vw;
        bottom: 3vw;
    }

    .personality-circle-title1, 
    .personality-circle-title2, 
    .personality-circle-title3{
        font-size: 4.27vw;
        margin-bottom: 3vw;
}

    .personality-circle-txt1,
    .personality-circle-txt2,
    .personality-circle-txt3{
        font-size: 3.73vw;
    }

    .personality-circle-txt3{
        padding-left: 2vw;
    }

    .personality-circle1{
        width: 72vw;
        margin: 9vw 0 0 auto;
    }

    .personality-circle2{
        width: 72vw;
    }

    .personality-circle3{
        width: 72vw;
        margin: 0 0 0 auto;
        position: relative;
        bottom: 10.7vw;
    }

    .personality-section1{
        padding-right: 4vw;
    }

    .personality-section2{
        padding-left: 4vw;
    }

    .personality-section3{
        padding-right: 4vw;
    }

    .personality-section-container{
        display:block;
    }

}

/*----------PROFILE / CAREER----------*/

.career-title{
    font-size: 2.36vw;
    text-align: center;
    margin-top: -1vw;
}


.career-subtitle{
    position: relative;
    display: inline-block;
    padding: 0 2vw;
    font-size: 1.39vw;
    margin-top: 1vw;
    font-weight: 500;
    background-color: #fff;
    position: relative;
    z-index: 3;
}

.career-line{
    width: 30vw;
    margin: 0 auto;
    position: relative;
    bottom: 1.1vw;
}

.career-subtitle-img{
    width: 21.9vw;
}


.career-subtitle-wrapper{
    text-align: center;
} 

.career-date{
    display: flex;
    margin-bottom: 2.4vw;
}

.career-detail{
    margin-left: 6vw;
}

.career-detail1, .career-detail5{
    margin-left: 2.8vw;
}

.career-detail1{
    margin-left: 2.6vw;
}

.career-date-container{
    font-size: 1.1vw;
    margin-top: 4vw;
    display: flex;
    justify-content: center;
}

.career-subtitle-img-sp{
    display: none;
}

/*----------PROFILE / CAREER / SP----------*/

@media screen and (max-width: 768px){
    .career-title{
        font-size: 5.87vw;
    }

    .career-subtitle{
        font-size: 4.2vw;
        padding: 0 3vw;
    }

    .career-line{
        width: 55vw;
        bottom: 3vw;
    }

    
    .career-year, .career-year1{
        font-size: 4.27vw;
        text-align: center;
        margin-top: 11vw;
    }

    .career-year1{
        margin-top: 4vw;
    }

    

    .career-detail, .career-detail1, .career-detail5{
        font-size: 3.73vw;
        width: 83.4vw;
        margin-top: 2vw;
        margin-left: 0;
    }

    .career-date{
        display: block;
    }

    .career-br{
        display: none;
    }

    .career-date-container{
        justify-content: center;
    }
}

/*----------PROFILE / SKILL----------*/

.skill-title{
    font-size: 2.36vw;
    text-align: center;
    margin-top: 7vw;
}

.skill-img{
    width: 15vw;
}

.skill-img{
    display: block;
}

.skill-date-container{
    margin-top: 3.2vw;
}

.skill-date-inner1{
    display: flex;
    gap: 4.2vw;
    justify-content: center;
}

.skill-date-inner2{
    display: flex;
    gap: 4.2vw;
    justify-content: center;
    margin-top: 3.5vw;
}

.skill-detail{
    margin-top: 0.8vw;
}

/*----------PROFILE / SKILL / SP----------*/

@media screen and (max-width: 768px){
    .skill-title{
        font-size: 5.87vw;
        margin-top: 19vw;
        margin-bottom: 7vw;
    }

    .skill-date-inner1, .skill-date-inner2{
        display: block;
    }

    .skill-detail, .skill-detail2 {
        display: inline-block;
        text-align: left;
        font-size: 4.27vw;
        margin-top: 3vw;
        margin-bottom: 11vw;
    }

    .skill-detail{
        padding-left: 4vw;
        margin-top: 3vw;
    }
    
    .skill-date-container{
        text-align: center;
    }

    .skill-img{
       margin: 0 auto;
       width: 60vw;
    }

    }

/*----------PROFILE / EXPERIENCE----------*/

.experience-title{
    font-size: 2.36vw;
    text-align: center;
    margin-top: 7.5vw;
    
}

.experience-subtitle{
    position: relative;
    display: inline-block;
    padding: 0 2vw;
    font-size: 1.39vw;
    margin-top: 1vw;
    font-weight: 500;
    background-color: #fff;
    position: relative;
    z-index: 3;
}

.experience-line{
    width: 30vw;
    margin: 0 auto;
    position: relative;
    bottom: 1.1vw;
}

.experience-subtitle-img{
    width: 29vw;
}

.experience-subtitle-wrapper{
    text-align: center;
    margin-top: 0.5vw;
}

.experience-img{
    width: 28vw;
    margin-top: 7.5vw;
}

.number1{
    display: inline-block;
    padding-left: 3vw;
}

.number2{
    display: inline-block;
    padding-left: 7.1vw;
}

.experience-dt{
    font-size: 1.39vw;
}

.experience-dd1{
    font-size: 1.1vw;
    margin-top: 1vw;
}

.experience-dd2{
    font-size: 1.1vw;
    margin-top: 0.6vw;
}

.experience-txt{
    font-size: 1.1vw;
    width: 43vw;
    margin-top: 1vw;
    line-height: 1.7;
}

.experience-inner{
    display: flex;
    align-items: center;
    gap: 4vw;
    justify-content: center;
    padding-left: 2vw;
}

.experience-dl{
    margin-top: 5vw;
}

.experience-subtitle-img-sp{
    display: none;
}

/*----------PROFILE / EXPERIENCE /SP----------*/

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

    .experience-title{
        font-size: 5.87vw; 
    }

    .experience-subtitle{
        font-size: 4.2vw;
        padding: 0 3vw;
    }

    .experience-line{
        width: 55vw;
        bottom: 3vw;
    }

    .experience-subtitle-img{
        display: none;
    }

    .experience-inner{
        display: block;
    }

    .experience-img-wrapper{
        text-align: center;
    }

    .experience-img{
        width: 80vw;
    }

    .experience-dt{
        font-size: 4.8vw;
        text-align: center;
        font-weight: 400;
    }

    .experience-dd1, .experience-dd2{
        font-size: 3.73vw;
        text-align: center;
        padding-right: 12vw;
    }

    .experience-dd1{
        margin-top: 5vw;
    }

    .experience-dd2{
        margin-top: 3.5vw;
    }

    .experience-txt{
        font-size: 3.73vw;
        width:90vw;
        margin: 0 auto;
        margin-top: 5vw;
    }

    .number2{
        padding-left: 18vw;
    }
}

/*----------PROFILE / STRENGTHS----------*/

.strengths-title{
    font-size: 2.36vw;
    text-align: center;
    margin-top: 7.5vw;
}

.strengths-subtitle{
    position: relative;
    display: inline-block;
    padding: 0 2vw;
    font-size: 1.39vw;
    margin-top: 1vw;
    font-weight: 500;
    background-color: #fff;
    position: relative;
    z-index: 3;
}

.strengths-line{
    width: 30vw;
    margin: 0 auto;
    position: relative;
    bottom: 1.2vw;
}



.strengths-subtitle-wrapper{
    text-align: center;
    margin-top: 0.5vw;
}

.strengths-number1, .strengths-number2, .strengths-number3{
    font-size: 8.3vw;
    color: #F2F1F1;
    margin-top: 1vw;
    
}


.strengths-contents1-txt,
.strengths-contents2-txt,
.strengths-contents3-txt{
    font-size: 1.1vw;
    width: 48vw;
    margin-top: 2vw;
    line-height: 1.7;
}

.strengths-section1{
    margin-top: 7vw;
}

.strengths-section2,
.strengths-section3{
    margin-top: 8.5vw;
}

.strengths-contents1-title,
.strengths-contents2-title,
.strengths-contents3-title{
    font-size: 1.39vw;
    text-align: center;
    padding-right: 1vw;
}

.strengths-section1,
.strengths-section2,
.strengths-section3{
    display: flex;
    gap: 4vw;
    align-items: center;  
    justify-content: center;
    padding-right: 12vw;
}

/*----------PROFILE / STRENGTHS /SP----------*/

@media screen and (max-width: 768px){
    .strengths-title{
        font-size: 5.87vw;
        margin-top: 20vw;
    } 

    .strengths-subtitle{
        font-size: 4.2vw;
        padding: 0 3vw;
    }

    .strengths-line{
        width: 45vw;
        bottom: 3vw;
    }

    .strengths-contents1-title,
    .strengths-contents2-title,
    .strengths-contents3-title{
        font-size: 4.27vw;
        padding-right: 0;
    }

    .strengths-contents1-txt,
    .strengths-contents2-txt,
    .strengths-contents3-txt{
        font-size: 3.73vw;
        margin: 8vw auto;
        width: 89vw;
    }

    .strengths-section1,
    .strengths-section2,
    .strengths-section3{
        display: block;
        padding-right: 0;
        margin-top: -14vw;
    }

    .strengths-number1{
        position: relative;
        top: 18vw;
        left: 4.5vw;
        width: 90vw;
    }

    .strengths-number2{
        position: relative;
        top: 18vw;
        left: 4.5vw;
        width: 90vw;
    }

    .strengths-number3{
        position: relative;
        top: 18vw;
        left: 4.5vw;
        width: 90vw;
    }

    .strengths-number1, .strengths-number2, .strengths-number3{
        font-size: 18vw;
    }
}

/*----------AFTER-------------------*/

.after-subtitle{
    font-size: 1.39vw;
}

.after-subtitle-wrapper{
    margin-top: 4vw;
    text-align:center;
}

.after-txt{
    width: 48vw;
    margin: 0 auto;
    margin-top: 2vw;
    line-height: 1.7;
}

.fin-img{
    width: 80vw;
    margin-top: 10vw;
}

.fin-img-wrapper{
    padding-left: 6vw; 
}

.fin-img-sp{
    display: none;
}

/*----------AFTER /SP----------*/

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

    .fin-img-sp{
        display: block;
        width: 92vw;
        margin-top: 30vw;
    }

    .fin-img{
        display: none;
    }

    .fin-img-wrapper{
        padding-left: 0;
    }

    .after-subtitle{
        font-size: 4.27vw;
    }

    .after-txt{
        width: 79vw;
        margin-top: 5vw;
        margin-bottom: 32vw;
    }
}

/*------------------
FOOTER
--------------------*/

.footer-line1-wrapper{
    margin: 0 0 0 auto;
    margin-top: 14.5vw;
    width: 88vw;
}

.footer-title{
    font-size: 22.4vw;
    font-family: "Sofia Sans Extra Condensed", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    line-height: 1.1;
    color: #F5F5F5;
    padding-left: 2vw;
    margin-top: 2.5vw;
}

.footer-subtitle-wrapper{
    text-align: center;
    margin-top: -35vw;
}

.footer-subtitle{
    font-size: 3.6vw;
    display: inline-block;
    text-align: left;
    font-family: "Playfair Display", serif;
    font-optical-sizing: auto;
    font-style: normal;
    letter-spacing: 0.2vw;
    
}

.mail-wrapper{
    height: 3.8vw;
    background-color: #000;
    width: 20.7vw;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 3vw auto;
}

.mail{
    font-size: 1.39vw; 
    color: #fff;
    
}

.footer-line2-wrapper{
    margin-bottom: 2vw;
    margin-top: 3vw;
    width: 88vw;
    
}

.copyright{
    margin-top: 14vw;
}

/*----------FOOTER /SP----------*/

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

    .footer-title{
        font-size: 35vw;
    }
    
    .mail-wrapper{
        position: relative;
        z-index: 3;
        width: 44vw;
        height: 7.2vw;
        margin-top: 7vw;
    }

    .footer-subtitle{
        font-size: 6.7vw;
        padding-left: 3vw;
    }

    .mail{
        font-size: 3.2vw;
    }

    .footer-subtitle-wrapper{
        position: relative;
        bottom: 20vw;
    }

    .copyright{
        font-size: 2.67vw;
        margin-top: 16vw;
    }

    .footer-line2-wrapper{
        margin-top: -11vw;
        margin-bottom: 5vw;
    }
}