@charset "utf-8";

/*common

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

section{

	padding: 150px 0;

}



.contents-wrapper{

	width: calc(100% - 100px);

	max-width: 1500px;

	margin: 0 auto;

}





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

    section{

        padding: 30px 0;

    }



    .contents-wrapper{

        width: calc(100% - 60px);

    }

}





/*home

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

.fv-title{

    font-size: 6.2rem;

    color: rgba(0, 110, 62, 1);

    padding: 10px 0;

    font-weight: 500;

}



.fv-text{

    font-size: 2.8rem;

    font-weight: 500;

}



.fv-top{

    margin-top: 300px;

    z-index: 10;

    position: relative;

}



.fv-orange{

    position: absolute;

    width: 40%;

    top: 0;

    left: 0;

}



.fv-bg{

    position: absolute;

    width: 100%;

    top: 15%;

    right: 0;

    z-index: 0;

}



.fv-circle-orange{

    position: absolute;

    width: 150px;

    top: 110px;

    right: 370px;

}



.fv-circle-green{

    position: absolute;

    width: 70px;

    top: 140px;

    left: 39%;

}



.fv-circle-brown{

    position: absolute;

    width: 120px;

    bottom: 400px;

    left: 80px;

}



.fv-img{

    position: absolute;

    width: 250px;

    bottom: 450px;

    left: 180px;

}



.front-blog{

    width: 90%;

}



.fv-flex{

    justify-content: space-between;

    align-items: end;

    position: relative;

    z-index: 1;

}



.fv-blog{

    width: 60%;

    background-color: rgba(255, 255, 255, 1);

    padding: 30px 30px 30px 200px;

    border-radius: 0 30px 30px 0;

}



.fv-blog-text{

    font-size: 1.7rem;

    font-weight: 500;

    text-align: left;

    margin-bottom: 20px;

}



.fv-blog-eng{

    font-size: 1rem;

    padding-left: 20px;

}



.arrow-img{

    position: absolute;

    width: 40px;

    top: 40%;

    right: 30px;

}



.fv-green{

    width: 32%;

    margin: 0;

    margin-top: -150px;

}



.front-medical-bg{

    position: absolute;

    width: 90px;

    top: 0px;

    left: 100px;

}



.front-medical-text{

    font-size: 1.7rem;

    font-weight: 500;

    margin-top: 200px;

}



.front-medical-flex{

    gap: 65px;

    justify-content: space-between;

    align-items: center;

}



.front-medical-link{

    display: block;

    background-image: url("../images/front-medical1.png");

    width: 400px;

    padding:129px 0;

    margin-top: -100px;

}



.front-medical-link2{

    margin-top: 90px;

    background-image: url("../images/front-medical2.png");



}



.front-medical-link3{

    background-image: url("../images/front-medical3.png");

}



.front-medical-img{

    position: absolute;

    width: 20%;

    top: 0;

    left: 0;

}



.front-medical-eng{

    color: rgba(255, 255, 255, 1);

    font-size: 1.7rem;

}



.front-medical-title{

    font-size: 2.1rem;

    font-weight: 500;

    color: rgba(76, 44, 15, 1);

    padding-bottom: 10px;

}



div.front-medical-arrow{

    width: 50px;

    right: 0px;

}



.front-medical-link:hover .arrow-right{

	right: -50px;

}



.front-link{

	color: rgba(76, 44, 15, 1);

	font-size: 1.2rem;

	padding: 20px 50px;

	width: 350px;

	border-radius: 50px;

	font-weight: 500;

    border: 2px solid rgba(76, 44, 15, 1);

    text-align: left;

    justify-content: space-between;

    align-items: center;

    z-index: 1;

}



span.front-link-arrow{

    background-color: rgba(76, 44, 15, 1);

    right: 0;

    top: auto;

    margin-right: 30px;

}



span.front-link-arrow::before{

    border: 2px solid rgba(76, 44, 15, 1);

    border-left: 0;

	border-bottom: 0;

}



.front-link:hover .arrow-right{

    right: -30px;

}



.front-link-flex{

    gap: 30px;

    justify-content: center;

    margin-top: 100px;

}



.front-researcher{

    text-align: right;

    margin-bottom: 70px;

}



.front-researcher-text{

    writing-mode: vertical-rl;

    color: rgba(0, 110, 62, 1);

    font-weight: 500;

    font-size: 3.5rem;

    margin-right: 20px;

    letter-spacing: 10px;

    align-self: start;

}



.front-researcher-orange::after{

    position: absolute;

    content: '';

    width: 17px;

    height: 17px;

    background-color: rgba(210, 118, 32, 1);

    top: 38%;

    right: -20px;

    border-radius: 50%;

}



.front-researcher-flex{

    gap: 40px;

    align-items: center;

    z-index: 1;

    position: relative;

    height: 750px;

}



.front-researcher-flex img{

    border-radius: 30px;

}



.front-researcher-left{

    width: 22%;

    align-self: start;

}



.front-researcher-right{

    width: 39%;

    align-self: start;

}



.front-researcher-img{

    margin-bottom: 30px;

}



.front-researcher-left2{

    align-self: flex-end;

}



.front-researcher-bg{

    position: absolute;

    width: 45%;

    top: -200px;

    left: 30px;

}



.front-achievements-top{

    background-color: rgba(255, 255, 255, 1);

    overflow: hidden;

}



.front-achievements-flex{

    padding-left: 50px;

    max-width: 1500px;

    margin: 0 auto;

    gap: 150px;

}



.front-achievements-left{

    width: 33%;

    text-align: left;

}



.front-achievements-text{

    margin: 60px 0;

}



.front-achievements-orange{

    position: absolute;

    width: 45px;

    top: -30px;

    left: 200px;

}



.front-achievements-green1{

    position: absolute;

    width: 95px;

    bottom: 100px;

    left: 100px;

}



.front-achievements-green2{

    position: absolute;

    width: 50px;

    bottom: 40px;

    left: 400px;

}



.front-achievements-right{

    width: 60%;

    flex-grow: 1;

    /* インナーを超えて右側を拡張 */

    margin-right: calc(50% - 50vw);

    position: relative;

    padding-top: 150px;

    text-align: left;

}

  

.front-swiper-ymd{

    color: rgba(152, 152, 152, 1);

    font-size: 0.9rem;

    padding: 25px 0;

}



.front-swiper-title{

    color: rgba(76, 44, 15, 1);

    font-weight: 500;

}

.front-swiper-img{
    display: flex;
    align-items: center;
    height: 230px;
	background-color: rgba(255, 255, 255, 1);
	padding: 15px
}

.front-swiper-img img{

    height: 100%;

    object-fit: cover;

}

.front-swiper-img img.no-thumnails{
    width: 100%;
    height: auto;
}


/* .swiper-navWrap{

    display: flex;

    position: absolute;

    width: 100%;

    height: 50px;

    top: 0;

    left: 0;

} */



div.swiper-button-prev::after,div.swiper-button-next::after {

    font-size: 1rem;

}



div.swiper-button-prev,div.swiper-button-next {

    color: rgba(210, 118, 32, 1);

    border: 1px solid rgba(210, 118, 32, 1);

    border-radius: 50%;

    padding: 10px;

    top: 100px;

    left: 60%;

    width: 35px;

    height: 35px;

  }

  /* 次への矢印 */

 div.swiper-button-next {

    right: 27%;

    left: auto;

  }



.front-blog-top{

    text-align: left;

    width: 90%;

    margin: auto;

}



.front-blog-flex{

    gap: 200px;

}



.front-blog-left{

    width: 20%;

}



.front-blog-right{

    width: calc(100% - 20% - 200px);

}



.front-achievements-green3{

    display: none;

}









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

    .fv-top {

        margin-top: 180px;

    }



    .fv-img {

        bottom: 450px;

        left: 70px;

    }



    .fv-circle-brown {

        bottom: 350px;

        left: 20px;

    }



    .fv-green {

        width: 30%;

        margin-top: -50px;

    }



    .front-medical-flex {

        gap: 30px;

    }



    .front-medical-link {

        width: 340px;

        padding: 100px 0;

    }



    .front-researcher-right {

        width: 35%;

    }



    .front-researcher-flex {

        height: 540px;

    }



    .front-achievements-left {

        width: 30%;

    }



    .front-achievements-flex {

        gap: 60px;

    }



    .front-link-swiper{

        width: 100%;

    }

}



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

    .fv-title {

        font-size: 5rem;

    }



    .fv-text {

        font-size: 2rem;

    }



    .fv-blog {

        padding: 30px 30px 30px 60px;

        width: 65%;

    }



    .front-medical-link {

        width: 288px;

        padding: 73px 0;

    }



    .front-researcher-flex {

        gap: 30px;

        height: 528px;

    }



    .front-blog-flex {

        gap: 70px;

    }



    .front-blog-right {

        width: calc(100% - 20% - 70px);

    }



}



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

    .fv-circle-orange {

        width: 100px;

        top: 70px;

        right: 130px;

    }



    .fv-circle-green {

        top: 110px;

        left: 35%;

    }



    .fv-title {

        font-size: 4rem;

    }



    .fv-text {

        font-size: 1.8rem;

    }



    .fv-top {

        margin-top: 60px;

    }



    .fv-green {

        margin-top: 0px;

    }



    .fv-circle-brown {

        width: 60px;

    }



    .fv-img {

        width: 200px;

        bottom: 400px;

        left: 25px;

    }



    .front-medical-bg {

        width: 70px;

        left: 50px;

    }



    .front-medical-text {

        margin: 70px 0 40px;

    }



    .front-medical-flex {

        gap: 10px;

    }



    .front-medical-link {

        width: 216px;

        padding: 42px 0;

    }



    .front-medical-eng {

        font-size: 1.2rem;

    }



    .front-link {

        width: 47%;

    }



    .front-researcher-text {

        font-size: 2.5rem;

    }



    .front-researcher-flex {

        gap: 15px;

        height: 400px;

    }



    .front-researcher-right {

        width: 37%;

    }



    .front-achievements-left {

        width: 100%;

    }



    .front-achievements-green1 {

        bottom: 10px;

    }



    .front-blog-top {

        width: 100%;

    }



    .front-blog-flex {

        gap: 30px;

    }



    .front-blog-left {

        width: 24%;

    }



    .front-blog-right {

        width: calc(100% - 24% - 30px);

    }



    .front-achievements-right {

        padding-top: 0px;

    }



    div.swiper-button-prev, div.swiper-button-next {

        top: -45px;

    }



}



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

    .fv-circle-orange,.fv-circle-green{

        display: none;

    }



    .fv-circle-brown {

        bottom: 400px;

        left: 5px;

        width: 50px;

    }



    .fv-img {

        width: 140px;

        bottom: 440px;

        left: 240px;

    }



    .fv-text {

        font-size: 1.3rem;

    }



    .fv-title {

        font-size: 3rem;

    }



    .fv-top {

        margin-top: 80px;

    }



    .fv-blog {

        width: 95%;

        padding: 20px 20px 20px 30px;

    }



    .fv-flex {

        margin-top: 25px;

    }



    .arrow-img {

        right: 20px;

    }



    .fv-green {

        width: 40%;

        margin-left: auto;

    }



    .front-medical-bg {

        width: 48px;

        top: -180px;

    }



    .front-medical-text {

        margin: 20px 0;

        font-size: 1.3rem;

    }



    .front-medical-link {

        width: 230px;

        padding: 58px 0;

        margin: 0 auto;

    }



    .front-medical-flex {

        gap: 20px;

    }



    .front-medical-link2 {

        margin-top: 0px;

    }



    .front-link {

        width: 100%;

    }



    .front-link-flex {

        gap: 20px;

        margin-top: 30px;

    }



    .front-researcher {

        margin-bottom: 25px;

    }



    .front-researcher-right{

        order: 1;

        width: 70%;

    }



    .front-researcher-text{

        order: 2;

    }



    .front-researcher-left{

        order: 3;

        width: 35%;

        margin-top: -100px;

    }



    .front-researcher-left2{

        order: 4;

    }



    .front-researcher-img {

        margin-bottom: 15px;

    }



    .front-researcher-flex img {

        border-radius: 10px;

    }



    .front-link-flex2{

        margin-top: 100px;

    }



    .front-achievements-flex {

        padding-left: 0px;

    }



    div.swiper-button-prev, div.swiper-button-next {

        top: -25px;

    }



    div.swiper-button-prev {

        left: 50%;

    }



    .front-achievements-text {

        margin: 20px 0;

    }



    .front-swiper-ymd{

        padding: 10px 0;

    }



    .front-achievements-green1,.front-achievements-green2{

        display: none;

    }



    .front-blog-left {

        width: 100%;

    }



    .front-achievements-orange {

        width: 90px;

        top: 90px;

        left: 220px;

    }



    .front-achievements-green3{

        display: block;

        position: absolute;

        width: 60px;

        top: 10px;

        right: 10px;

    }



    .front-blog-right{

        width: 100%;

    }



    .front-blog-flex {

        gap: 15px;

    }

}







/*MEDICAL AND ERGONOMICS 医療と人間工学

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

.page-title-top{

    margin-top: 200px;

}



.page-bg{

    position: absolute;

    width: 50%;

    right: 0;

    top: 0;

}



.page-title-box{

    background-color: rgba(255, 255, 255, 1);

    padding: 120px 200px;

    width: 70%;

    z-index: 1;

    position: relative;

    text-align: left;

    border-radius: 0 30px 30px 0;

    margin-bottom: 30px;

}



.page-title-ja{

    color: rgba(0, 110, 62, 1);

    font-weight: 500;

    font-size: 3.6rem;

}



.bread li{

    display: inline;

}

.bread li a{

    color: inherit;

    text-decoration: none;

}

.bread li + li:before{

    content: "/";

    margin:.5em;

}



.bread{

    margin:  0 auto 0 200px;

    width: fit-content;

}



.medical-title{

    font-size: 2.8rem;

    font-weight: 500;

}



.medical-title-orange{

    color: rgba(210, 118, 32, 1);

}



.medical-ergonomics-flex{

    align-items: center;

    gap: 30px;

    margin-top: 100px;

    height: 450px;

}



.medical-ergonomics-left{

    width: 50%;

    text-align: left;

    padding-right: 40px;

    align-self: center;

}



.medical-ergonomics-left p{

    line-height: 2;

}



.medical-ergonomics-txst{

    font-size: 1.7rem;

    font-weight: 500;

    margin-bottom: 30px;

}



.medical-flex{

    gap: 25px;

    width: 45%;

    margin-right: calc(50% - 48vw);

    flex-grow: 1;

    height: 450px;

}



.medical-ergonomics-img{

    border-radius: 30px;

    align-self: flex-start;

    width: calc((100% - 25px)/2);

}



.medical-ergonomics-img2{

    align-self: flex-end;

    border-radius: 30px;

}



.medical-arrow{

    width: 100px;

    margin-bottom: 30px;

}



.medical-when-box{

    margin: 50px 100px 0 auto;

    width: 60%;

}



.medical-when-box2{

    margin: 50px auto 0 0;

}



.medical-when-title{

    font-weight: 500;

    font-size: 1.5rem;

    padding: 20px;

    background-color: rgba(240, 234, 214, 1);

    border-radius: 30px 30px 0 0;

    width: 250px;

    margin-left: auto;

}



.medical-when-title2{

    margin: 0 auto 0 0;

}



.medical-when-title::after{

    position: absolute;

    content: '';

    width: 10px;

    height: 10px;

    background-color: rgba(210, 118, 32, 1);

    top: 45%;

    left: 40px;

    border-radius: 50%;

}



.medical-when-text{

    background-color: rgba(240, 234, 214, 1);

    padding: 35px 65px;

    line-height: 2;

    text-align: left;

    border-radius: 30px 0 30px 30px;

}



.medical-when-text2{

    z-index: 1;

    position: relative;

    border-radius: 0 30px 30px 30px;

}



.medical-when-text span{

    display: block;

    padding-top: 30px;

}



.medical-bg1{

    position: absolute;

    width: 35%;

    left: 0;

    bottom: 7%;

}



.medical-bg2{

    position: absolute;

    width: 10%;

    right: 180px;

    bottom: 150px;

}



.medical-approach-title{

    color: rgba(255, 255, 255, 1);

    font-size: 2.8rem;

    font-weight: 500;

    background-color: rgba(76, 44, 15, 1);

    padding: 10px;

    border-radius: 30px;

    width: 900px;

    margin: 0 auto 80px;

}



.medical-approach-flex{

    gap: 100px;

    align-items: center;

    width: 80%;

    margin: auto;

}



.medical-approach-text{

    line-height: 2;

    width: 60%;

    text-align: left;

}



.medical-approach-img{

    width: 30%;

    border-radius: 30px;

}



.medical-flex-box{

    gap: 50px;

    width: 90%;

    margin: 80px auto 50px;

}



.medical-number-flex{

    margin: 60px 0;

}



.medical-approach-box{

    background-color: rgba(255, 255, 255, 1);

    width: 600px;

    padding: 30px 20px 30px 120px;

    border-radius: 50px;

    text-align: left;

}



.medical-approach-number{

    color: rgba(255, 255, 255, 1);

    font-size: 2.7rem;

    background-color: rgba(210, 118, 32, 1);

    border-radius: 50%;

    padding: 30px;

    margin-right: -100px;

    z-index: 1;

}



.medical-approach-main{

    color: rgba(0, 110, 62, 1);

    font-size: 1.7rem;

    font-weight: 500;

    margin-right: 30px;

}



.medical-approach-example{

    color: rgba(152, 152, 152, 1);

}



.medical-polygon{

    width: 45%;

    margin-bottom: 40px;

}



.medical-polygon-text{

    font-weight: 500;

    font-size: 1.5rem;

    width: 60%;

    margin: auto;

}



.br-stat{

    display: none;

}



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

    .medical-approach-box {

        width: 560px;

    }

}





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

    .medical-ergonomics-left {

        width: 57%;

        padding-right: 0;

    }



    .medical-flex {

        width: 42%;

        height: auto;

    }



    .medical-ergonomics-img {

        width: 80%;

        margin: 0 auto 0 0;

        height: 200px;

        object-fit: cover;

    }



    .medical-ergonomics-img2 {

        margin: 0 0 0 auto;

    }



    .medical-ergonomics-flex {

        height: 400px;

    }



    .medical-when-box {

        width: 80%;

        margin: 50px 50px 0 auto;

        position: relative;

        z-index: 1;

    }



    .medical-bg1 {

        bottom: 30%;

    }



    .medical-when-box2 {

        margin: 50px auto 0 20px;

    }



    .medical-bg2 {

        bottom: 200px;

        z-index: 2;

    }



    .medical-approach-flex {

        width: 100%;

    }



    .medical-flex-box {

        gap: 20px;

        width: max-content;

    }



    .medical-approach-box {

        width: 528px;

        padding: 25px 20px 25px 100px;

    }



    .medical-approach-number {

        padding: 25px;

        margin-right: -90px;

    }



    .page-title-box {

        padding: 120px 130px;

    }

}





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



    .medical-ergonomics-left {

        width: 68%;

    }



    .medical-flex {

        width: 30%;

    }



    .medical-bg2 {

        right: 150px;

        bottom: 340px;

    }



    .medical-approach-flex {

        gap: 50px;

    }



    .medical-approach-img {

        width: 34%;

    }



    .medical-approach-main {

        font-size: 1.5rem;

        margin-right: 10px;

    }



    .medical-approach-number {

        font-size: 2rem;

        padding: 20px;

        margin-right: -70px;

    }



    .medical-approach-box {

        width: 440px;

        padding: 20px 20px 20px 80px;

    }



    .medical-approach-example {

        font-size: 0.8rem;

    }



    .page-title-box {

        padding: 120px 70px;

    }

}



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

    .page-title-box {

        padding: 50px 50px;

        width: 80%;

    }



    .page-title-top {

        margin-top: 130px;

    }



    .page-title-ja {

        font-size: 3.2rem;

    }



    .bread {

        margin: 0 auto 0 50px;

    }



    .medical-title {

        font-size: 2.1rem;

    }



    .medical-ergonomics-left {

        width: 100%;

    }



    .medical-ergonomics-img {

        width: 48%;

        height: auto;

    }



    .medical-ergonomics-flex {

        height: auto;

    }



    .medical-arrow {

        margin: 30px auto;

    }



    .medical-when-text {

        padding: 30px;

    }



    .medical-when-box {

        width: 100%;

        margin: 50px 0 0;

    }



    .medical-bg1 {

        bottom: 47%;

    }



    .medical-bg2 {

        right: 85px;

        bottom: 410px;

    }



    .medical-approach-title {

        font-size: 2.4rem;

        width: 100%;

    }



    .medical-approach-text {

        width: 100%;

    }



    .medical-approach-img {

        width: 80%;

        height: 250px;

        object-fit: cover;

    }



    .medical-flex-box {

        gap: 30px;

        width: 70%;

    }



    .medical-number-flex {

        margin: 30px 0;

    }



    .medical-polygon-text {

        width: 93%;

    }

}



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

    .page-title-box {

        padding: 30px 20px;

        width: 95%;

        margin-bottom: 10px;

        text-align: center;

    }



    h2.title-eng {

        font-size: 1.3rem;

    }



    .page-title-ja {

        font-size: 2.2rem;

    }



    .page-title-top {

        margin-top: 80px;

    }



    .bread {

        margin: 0 auto 0 30px;

    }



    .medical-ergonomics-flex {

        align-items: center;

        margin-top: 25px;

    }



    .br-end{

        display: none;

    }



    .medical-ergonomics-txst {

        margin-bottom: 20px;

    }



    .medical-flex {

        gap: 10px;

        margin-right: 0;

    }



    .medical-arrow {

        margin: 20px auto;

        width: 30px;

    }



    .medical-when-title {

        padding: 10px;

    }



    .medical-when-text {

        padding: 10px 20px 20px;

    }



    .medical-when-text span {

        padding-top: 10px;

    }



    .medical-when-box {

        margin: 20px 0 0;

    }



    .medical-bg2 {

        right: 40px;

        bottom: 390px;

    }



    .medical-approach-title {

        font-size: 2rem;

        margin-bottom: 25px;

    }



    .br-stat{

        display: block;

    }



    .medical-approach-flex {

        gap: 20px;

    }



    .medical-approach-img {

        width: 100%;

    }



    .medical-flex-box {

        gap: 15px;

        width: 100%;

        margin: 25px 0;

    }



    .medical-approach-number {

        font-size: 1.5rem;

        padding: 15px;

        margin-right: -56px;

    }



    .medical-approach-box {

        width: 100%;

        padding: 15px 10px 15px 75px;

    }



    .medical-approach-main {

        font-size: 1.1rem;

        margin-right: 10px;

    }



    .medical-box{

        width: 100%;

    }



    .medical-approach-example {

        font-size: 0.6rem;

    }



    .medical-number-flex {

        margin: 15px 0;

    }



    .medical-polygon {

        width: 100%;

        margin-bottom: 20px;

    }



    .medical-polygon-text {

        font-size: 1.4rem;

        width: 100%;

        text-align: left;

    }



    .medical-title {

        font-size: 1.8rem;

        text-align: left;

    }

}







/*HISTORY OF CHAIR 椅子の歴史

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

.chair-all-left{

    width: 20%;

}



.sticky{

    position: sticky;

    z-index: 900;

    top: 100px;

}



.chair-all-left a{

    display: block;

    text-align: left;

    color: rgba(76, 44, 15, 1);

    margin-bottom: 20px;

}




.emsp{

    padding-left: 25px;

}



.sticky-link:hover .emsp{

    padding-left: 0;

}







.chair-all-right{

    width: 80%;

}



.chair-history{

    background-color: rgba(76, 44, 15, 1);

    color: rgba(255, 255, 255, 1);

    font-weight: 500;

    font-size: 2.8rem;

    border-radius: 30px;

    display: inline-block;

    margin-bottom: 70px;

    padding: 10px;

    width: 500px;

    z-index: 1;

    position: relative;

}



.chair-era-flex{

    /* gap: 150px; */

    text-align: left;

    margin-bottom: 50px;

}



.chair-history-number{

    font-size: 5rem;

}



.chair-history-number::after{

    position: absolute;

    content: '';

    width: 30px;

    height: 30px;

    border-radius: 50%;

    top: 40%;

    left: -50px;

    background-color: rgba(210, 118, 32, 1);

    

}



.chair-era{

    color: rgba(210, 118, 32, 1);

    font-weight: 500;

    font-size: 1.5rem;

}



.chair-history-era{

    width: 20%;

    margin-left: 50px;

}



.chair-history-text{

    width: calc(100% - 20% - 100px);

    line-height: 2;

    text-align: justify;
    padding-left: 30px;

}



.chair-history-text2{

    padding-right: 50px;
    padding-left: 30px;
    width: calc(100% - 20% - 300px);

    line-height: 2;

    text-align: justify;

}



.chair-history-inner{

    display: block;

    margin-top: 30px;

}



.chair-history-img{

    width: 250px;

    object-fit: cover;

}



.chair-history-box{

    margin: 0 auto 0 0;

}



.chair-history-mini{

    font-weight: 500;

    padding: 20px 0 0;

    background-color: rgba(240, 234, 214, 1);

    border-radius: 30px 30px 0 0;

    width: 250px;

}



.chair-history-mini::after{

    position: absolute;

    content: '';

    width: 10px;

    height: 10px;

    background-color: rgba(210, 118, 32, 1);

    top: 65%;

    left: 70px;

    border-radius: 50%;

}



.chair-mini-text{

    background-color: rgba(240, 234, 214, 1);

    padding: 30px 65px;

    line-height: 2.3;

    text-align: left;

    border-radius: 0 30px 30px 30px;

    font-size: 0.8rem;

    letter-spacing: 2px;

    margin-bottom: 150px;

}



.chair-world{

    font-size: 2.1rem;

    font-weight: 500;

}



.chair-world-inner{

    margin-top: 30px;

    display: block;

}



.chair-rena-flex{

    gap: 70px;

}



.chair-rena-box{

    width: calc((100% - 70px*3)/4);

}



.chair-rena-img{

    margin-bottom: 10px;

}



.chair-yoke{

    font-size: 1.7rem;

    margin-bottom: 10px;

}



.chair-era-yoke{

    font-size: 1.3rem;

}



.chair-world::after{

    top: 25%;

}



.chair-world-rena::after{

    top: 10%;

}



.chair-world-flex{

    gap: 70PX;

    text-align: left;

    margin-bottom: 50px;

    justify-content: end;

}



.chair-england-text{

    font-weight: 500;

    font-size: 1.1rem;

    display: block;

    margin-bottom: 20px;

}



.chair-world-text{

    text-align: left;

    margin: 0 0 50px auto;

    width: 75%;

}



.chair-century-flex{

    gap: 70px;

    margin: 0 0 50px auto;

    width: 75%;

    text-align: left;

}



.chair-century-box{

    width: 45%;

}



.chair-mini-last{

    margin-bottom: 0;

}



.chair-history-country{

    line-height: 2;

    width: 50%;

}





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

    .chair-yoke {

        font-size: 1.5rem;

        font-weight: 700;

    }



    .chair-era-yoke {

        font-size: 1.2rem;

        font-weight: 500;

    }

}





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

    .chair-history-img {

        width: 200px;

    }



    .chair-history-era {

        width: 24%;

        margin-left: 0px;

    }



    .chair-history-number::after {

        width: 20px;

        height: 20px;

        left: -25px;

    }



    .chair-history-text2 {

        padding-right: 20px;

        width: calc(100% - 50%);

    }



    .chair-century-flex {

        gap: 65px;

    }

}



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

    .chair-history-era {

        width: 100%;

        margin: 0 0 30px 50px;

    }



    .chair-history-number::after {

        left: -50px;

    }



    .chair-all-left {

        width: 25%;

    }



    .chair-all-right {

        width: 75%;
        padding-left: 50px;

    }



    .chair-history-text{

        width: 100%;

    }



    .chair-history-img {

        width: 220px;

    }



    .chair-history-text2 {

        width: calc(100% - 34%);

    }



    .chair-rena-flex {

        gap: 30px;

    }



    .chair-rena-box {

        width: calc((100% - 30px* 3) / 4);

    }



    .chair-world-rena::after {

        top: 25%;

    }



    .chair-century-flex {

        width: 100%;

        gap: 50px;

    }



    .chair-rena-box3{

        width: calc((100% - 50px *2)/3);

    }



    .chair-world-flex {

        gap: 50PX;

    }



    .chair-rena-box2{

        width: 45%;

    }



    .chair-rena-img2 {

        height: 300px;

        object-fit: cover;

    }



    .chair-history-country {

        width: 61%;

    }

}







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

    .chair-all-left {

        width: 100%;

        margin-bottom: 50px;

    }



    .br-last{

        display: none;

    }



    .chair-all-left a {

        font-size: 1rem;

        width: 45%;

        display: inline-block;

    }



    .chair-all-right {

        width: 100%;
        padding-left: 0;

    }



    .chair-history-country {

        width: 59%;

    }



    .sticky-link:hover{

        width: 250px;

        margin-right: 50px;

    }

    

    .emsp{

        padding-left: 0;

    }



}





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

    .chair-all-left a {

        width: 90%;

    }



    .chair-history {

        width: 100%;

        margin-bottom: 15px;

    }



    .chair-all-left {

        margin-bottom: 10px;

    }



    .chair-history-number {

        font-size: 4rem;

    }



    .chair-history-number::after {

        left: -35px;

    }



    .chair-era-flex {

        margin-bottom: 20px;

    }



    .chair-history-era {

        width: 100%;

        margin: 0 0 15px 40px;

    }



    .chair-history-text2{

        width: 100%;

    }



    .chair-history-inner {

        margin-top: 10px;

    }



    .chair-history-img {

        width: 75%;

        margin-top: 15px;

    }



    .chair-mini-text {

        padding: 20px;

        line-height: 1.7;

    }



    .chair-mini-text {

        margin-bottom: 30px;

    }



    .chair-world{

        font-size: 2.5rem;

    }



    .chair-world-inner {

        margin-top: 10px;

    }



    .chair-rena-box {

        width: 45%;

    }



    .chair-world-text {

        margin: 0 0 20px auto;

    }



    

    .chair-world-flex{

        gap: 10px;

    }

    

    .chair-world-flex {

        margin-bottom: 20px;

    }

    

    .chair-england-text {

        margin-bottom: 10px;

    }

    

    .chair-century-flex {

        gap: 10px;

        margin-bottom: 25px;

    }

    

    .chair-century-box {

        width: 48%;

    }

    

    .chair-rena-box3 {

        width: calc((100% - 10px* 2) / 3);

    }



    .chair-yoke {

        margin-bottom: 0px;

    }



    .chair-history-country {

        width: 100%;

    }



    .chair-rena-box2 {

        width: 48%;

    }



    .chair-rena-img2 {

        height: 180px;

    }



    .chair-mini-img{

        height: 210px;

        width: 100%;

        margin-bottom: 10px;

    }



    .chair-mini-box{

        margin: auto;

    }

}







/*RESEARCHER研究者について

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

.researcher-greeting{

    font-weight: 500;

    color: rgba(210, 118, 32, 1);

    font-size: 2.1rem;

    margin-bottom: 50px;

}



.researcher-greeting-name{

    font-weight: 500;

    font-size: 1.5rem;

    margin-top: 50px;

}



.researcher-greeting-img{

    position: absolute;

    width: 30%;

    top: 300px;

    left: 0;

}



.researcher-greeting-text{

    width: 80%;

    margin: auto;

    line-height: 2;

}



.researcher-profile-flex{

    margin-top: 200px;

    gap: 100px;

    align-items: flex-start;

    margin-bottom: 120px;

}



.researcher-profile-left{

    width: 60%;

    text-align: left;

}



.researcher-profile-name{

    font-weight: 500;

    font-size: 2.1rem;

    margin-bottom: 60px;

}



.researcher-profile-orange{

    color: rgba(210, 118, 32, 1);

}



.researcher-profile-aboreto{

    font-size: 1.7rem;

    padding-left: 30px;

}



.researcher-profile-text{

    font-size: 1.1rem;

    width: calc(100% - 140px - 30px);

}



.researcher-profile-list{

    gap: 30px;

    margin-top: 25px;

    align-items: flex-start;

}



.researcher-profile-title{

    background-color: rgba(214, 205, 85, 1);

    font-size: 1.1rem;

    color: rgba(255, 255, 255, 1);

    padding: 5px;

    width: 140px;

    text-align: center;

}



.researcher-profile-img{

    width: 30%;

}



.researcher-career{

    margin-bottom: 100px;

}



.researcher-career-title{

    font-size: 2.1rem;

    font-weight: 500;

    padding: 30px 0 10px 120px;

    background-color: rgba(240, 234, 214, 1);

    border-radius: 30px 30px 0 0;

    width: 450px;

    text-align: left;

}



.researcher-career-title::after{

    position: absolute;

    content: '';

    width: 30px;

    height: 30px;

    background-color: rgba(210, 118, 32, 1);

    top: 50%;

    left: 70px;

    border-radius: 50%;

}



.researcher-career-box{

    background-color: rgba(240, 234, 214, 1);

    padding: 30px 60px;

    line-height: 2.3;

    text-align: left;

    border-radius: 0 30px 30px 30px;

    font-size: 0.8rem;

    letter-spacing: 2px;

}



.researcher-career-flex{

    gap: 20px 150px;

    align-items: center;



}



.researcher-career-number{

    font-size: 1.7rem;

    width: 120px;

}



.researcher-career-number::after{

    position: absolute;

    content: '';

    right: -70px;

    top: 20px;

    width: 17px;

    height: 17px;

    border-radius: 50%;

    background-color: rgba(76, 44, 15, 1);

}



.researcher-career-stick::before{

    position: absolute;

    content: '';

    right: -62px;

    top: 20px;

    width: 1px;

    height: 890px;

    background-color: rgba(76, 44, 15, 1);

}



.researcher-academic-text{

    margin-left: 70px;

    line-height: 3;

}



.researcher-academic-text::after{

    position: absolute;

    content: '';

    left: -70px;

    top: 7px;

    width: 17px;

    height: 17px;

    border-radius: 50%;

    background-color: rgba(76, 44, 15, 1);

}



.mini{

    font-size: 0.8rem;

}



.researcher-profile-birth{

    font-size: 1.1rem;

}





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

    .researcher-profile-flex {

        margin-top: 200px;

        gap: 50px;

    }



    .researcher-profile-img {

        width: 33%;

    }

    

}



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

    .researcher-all-left{

        width: 20%;

    }



    .researcher-all-right{

        width: 80%;

    }



    .researcher-greeting-text {

        width: 100%;

    }



    .researcher-profile-title {

        width: 110px;

    }

    

    .researcher-profile-list {

        gap: 20px;

    }



    .researcher-profile-text {

        width: calc(100% - 110px - 20px);

    }



    .researcher-career-flex {

        gap: 20px 25px;

    }



    .researcher-career-number::after {

        right: -7px;

    }



    .researcher-career-stick::before {

        right: 0px;

    }



    .researcher-academic-text {

        margin-left: 35px;

    }



    .researcher-academic-text::after {

        left: -35px;

    }

}



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

    .researcher-all-left{

        width: 100%;

    }



    /* .researcher-all-left a{

        width: 30%;

    }

 */

    .researcher-all-right{

        width: 100%;

    }



    .researcher-profile-left {

        width: 100%;

    }



    .researcher-profile-img {

        width: 35%;

        position: absolute;

        right: 0;

        top: -80px;

    }



    .researcher-career-text{

        width: 77%;

    }



    .researcher-career-box {

        padding: 30px 10px 30px 27px ;

    }



}



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

    .researcher-greeting {

        margin-bottom: 10px;

    }



    .researcher-greeting-text {

        text-align: left;

    }



    .researcher-greeting-name {

        margin-top: 25px;

        text-align: right;

        margin-right: 50px;

    }



    .researcher-greeting-img {

        width: 60%;

        top: 400px;

    }



    .researcher-profile-img {

        width: 100%;

        height: 200px;

        object-fit: cover;

        top: -230px;

    }



    .researcher-profile-aboreto {

        font-size: 1.5rem;

        padding-left: 5px;

    }



    .researcher-profile-name {

        margin-bottom: 25px;

    }



    .researcher-profile-title {

        width: 50%;

    }



    .researcher-profile-text{

        width: 100%;

    }



    .researcher-profile-list {

        gap: 10px;

        margin-top: 20px;

    }



    .researcher-profile-flex {

        margin-bottom: 30px;

    }



    .researcher-career-title::after {

        width: 20px;

        height: 20px;

        left: 15px;

        top: 43%;

    }



    .researcher-career-title {

        font-size: 1.5rem;

        padding: 20px 0 10px 50px;

        width: 80%;

    }



    .researcher-career-number::after {

        right: 138px;

        top: 19px;

        width: 15px;

        height: 15px;

    }



    .researcher-career-stick::before {

        right: 145px;

        height: 1030px;

    }



    .researcher-career-number {

        margin-left: 20px;

    }



    .researcher-career-text {

        width: 100%;

        margin: -15px 0 0 15px;

    }



    .researcher-career-flex {

        gap: 0px;

    }



    .researcher-career-box {

        padding: 0px 10px 25px 27px;

    }



    .researcher-career {

        margin-bottom: 30px;

    }



    .researcher-academic-text::after {

        left: -20px;

        top: 11px;

        width: 10px;

        height: 10px;

    }



    .researcher-academic-text {

        margin-left: 10px;

    }



}



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

    .researcher-career-stick::before {

        height: 1200px;

    }



}







/*会社情報

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

.company-title{

    margin-bottom: 50px;

    font-size: 2.1rem;

    font-weight: 500;

    padding-left: 50px;

    text-align: left;

}



.company-title::after{

    position: absolute;

    content: '';

    width: 30px;

    height: 30px;

    background-color: rgba(210, 118, 32, 1);

    top: 25%;

    left: 0px;

    border-radius: 50%;

}



.company-overview-flex{

    gap: 50px;

    margin-bottom: 25px;

    align-items: flex-start;

}



.company-overview-title{

    background-color: rgba(255, 255, 255, 1);

    font-size: 1.1rem;

    padding: 10px;

    width: 180px;

    text-align: center;

    font-weight: 500;

}



.company-overview-text{

    font-size: 1.1rem;

    width: calc(100% - 180px - 50px);

    text-align: left;

}



.company-overview-last{

    text-align: left;

    line-height: 2;

}



.company-overview-last2{

    margin-left: 100px;

}



.company-staff-top{

    text-align: left;

}



.company-staff-flex{

    background-color: rgba(240, 234, 214, 1);

    padding: 30px 70px;

    margin-top: 30px;

    justify-content: space-between;

    gap: 200px;

}



.company-staff-box{

    width: 50%;

}



.company-staff-name{

    font-size: 1.7rem;

    font-weight: 500;

}



.company-staff-name span{

    color: rgba(0, 110, 62, 1);

}



.company-staff-text{

    margin: 50px 0;

}



.company-staff-img{

    width: 32%;

    border-radius: 30px;

    height: 340px;

    object-fit: cover;

}





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

    .company-staff-flex {

        gap: 100px;

    }



    .company-staff-img {

        width: 35%;

    }

}



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

    .company-overview-last2 {

        margin-left: 230px;

        margin-top: -50px;

    }



    .company-staff-flex {

        gap: 50px;

        padding: 30px;

    }



    .company-staff-img {

        width: 40%;

    }



    .company-staff-box {

        width: 54%;

    }

}



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

    .company-overview-flex {

        gap: 24px;

    }



    .company-overview-last2 {

        margin-left: 205px;

        margin-top: -25px;

    }



    .company-staff-flex {

        gap: 10px;

    }



    .company-staff-box {

        width: 58%;

    }



    .company-link{

        width: 90%;

    }

}



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



    .company-title::after {

        width: 25px;

        height: 25px;

    }



    .company-title {

        padding-left: 35px;

        margin-bottom: 25px;

    }



    .company-overview-text{

        width: 100%;

        margin-left: 10px;

    }



    .company-overview-flex {

        gap: 10px;

    }



    .company-overview-last {

        margin-left: 10px;

        width: 100%;

    }



    .company-overview-last2 {

        margin-top: -10px;

    }



    .company-staff-top{

        padding-top: 0;

    }



    .company-staff-box {

        width: 100%;

    }



    .company-link {

        width: 100%;

        padding: 20px;

    }



    .company-staff-text {

        margin: 15px 0;

    }



    .company-staff-img {

        width: 100%;

    }



    .company-staff-flex {

        padding: 25px 15px;

    }

}









/*お問い合わせ

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

.contact-form-top{

    text-align: left;

    width: 70%;

    margin: auto;

}



.contact-text{

    font-size: 1.5rem;

    font-weight: 500;

}



.text-common{

    width: 100%;

    height: 64px;

    padding: 10px 50px;

    border-radius: 10px;

    border: none;

    margin: 10px 0 35px;

}



.area-common{

    width: 100%;

    border-radius: 20px;

    padding: 30px 50px;

    border: none;

    margin: 10px 0 35px;

}



.contact-privacy{

    border-bottom: 1px solid rgba(76, 44, 15, 1);

    position: relative;

}



.contact-form-privacy{

    color: rgba(76, 44, 15, 1);

}



.contact-form-title{

    margin: 15px 0 ;

}



.contact-title p{

    font-weight: 700;

}



.required{

    color: rgba(222, 0, 0, 1);

    font-size: 0.8rem;

}



.wpcf7-list-item{

    margin: 0 20px 0 0;

}



.contact-radio{

    margin: 50px 0;

}



.wpcf7 .wpcf7-submit{

    opacity: 0.5;

    border: none;

}



.wpcf7 .wpcf7-submit.active {

    opacity: 1;

    cursor: pointer;

}



.contact-privacy::after {

	position: absolute;

    top: 25px;

	left: 0;

	content: '';

	width: 100%;

	height: 1px;

	background: rgba(76, 44, 15, 1);

	bottom: -5px;

	transform: scale(0, 1);

	transform-origin: center top; /*変形（アンダーラインの伸長）の原点がaタグ（各メニュー）の右端*/

	transition: transform 0.3s;   /*変形の時間*/

}

	

.contact-privacy:hover::after {

	transform: scale(1, 1); /*ホバー後、x軸方向に1（相対値）伸長*/

}



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

    .contact-form-top {

        width: 100%;

    }



    .footer-copy-contact {

        padding: 100px 50px 30px;

    }

}







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

    .contact-radio {

        margin: 20px 0;

    }



    .text-common {

        padding: 10px 25px;

        margin: 10px 0 20px;

    }



    .area-common {

        padding: 30px 25px;

        margin: 10px 0 20px;

    }



    .footer-copy-contact {

        padding: 30px 50px 30px;

    }



}



/*プライバシーポリシー

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

.privacy-policy-top{

    text-align: left;

    width: 70%;

    margin: auto;

}



.privacy-policy{

    font-size: 1.5rem;

    font-weight: 500;

    border-bottom: 1px solid rgba(152, 152, 152, 1);

    padding-bottom: 15px;

    margin: 50px 0 30px;

}



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

    .privacy-policy-top {

        width: 80%;

    }

}







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

    .privacy-policy-top {

        width: 100%;

    }



    .privacy-policy {

        font-size: 1.4rem;

    }

}



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

    .privacy-policy {

        padding-bottom: 5px;

        margin: 25px 0 10px;

    }

}



