@charset "UTF-8";
/*==============================================
business
==============================================*/
.visual{
    width: 100%;
    height: 568px;
    background: url("../img/business/visual01.jpg") no-repeat center;
    background-size: cover;
    position: relative;
}

.visual::before{
    content: "";
    width: 100%;
    height: 79px;
    background: url("../img/common/bg01.svg") no-repeat center;
    background-size: 100% 79px;
    position: absolute;
    bottom: 0;
    left: 0;
}

.visual h1{
    position: absolute;
    top: 330px;
    left: 10%;
}

.visual h1 span{
    font-size: 6.0rem;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    display: block;
}

.visual h1 small{
    font-size: 2.0rem;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    display: block;
    margin-top: 11px;
}

.philosophy{
    width: 100%;
    background: #f7f6f6;
    padding: 98px 40px 173px;
    position: relative;
}

.philosophy .inner{
    width: 100%;
    max-width: 1250px;
    padding-left: 4%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.philosophy .inner .ttlArea{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-top: 0.8em;
}

.philosophy .inner .ttlArea h2 span{
    font-size: 3.5rem;
    font-weight: bold;
    line-height: 1;
    display: block;
}

.philosophy .inner .ttlArea h2 small{
    font-size: 2.0rem;
    font-weight: 500;
    line-height: 1;
    display: block;
    margin-top: 16px;
}

.philosophy .inner .ttlArea img{
    width: 216px;
    margin-left: 14px;
}

.philosophy .inner p{
    width: 56%;
    font-size: 2.0rem;
    font-weight: 500;
    line-height: 2.5;
}

.strength{
    width: 100%;
    padding: 140px 40px 157px;
}

.strength .inner{
    width: 100%;
    max-width: 1250px;
    padding-left: 4%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.strength .inner .ttlArea h2 span{
    font-size: 3.5rem;
    font-weight: bold;
    line-height: 1;
    display: block;
}

.strength .inner .ttlArea h2 small{
    font-size: 2.0rem;
    font-weight: 500;
    line-height: 1;
    display: block;
    margin-top: 16px;
}

.strength .inner .ttlArea p{
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 2.05357;
    margin-top: 102px;
}

.strength .inner .txtArea{
    width: 56%;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.96875;
    margin-bottom: 174px;
}

.strength .inner .txtArea img{
    margin: 0 auto 56px;
    display: block;
}

.strength .inner ul li{
    width: 100%;
    margin-bottom: 125px;
    display: flex;
    flex-wrap: wrap;
}

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

.strength .inner ul li img{
    width: 100%;
    margin-bottom: 38px;
}

.strength .inner ul li .ttlArea{
    width: 41.67%;
    display: flex;
    justify-content: space-between;
}

.strength .inner ul li .ttlArea span{
    font-size: 3.7rem;
    font-weight: bold;
    line-height: 1;
}

.strength .inner ul li .ttlArea h3{
    width: 80%;
    font-size: 3.3rem;
    font-weight: 500;
    line-height: 1;
}

.strength .inner ul li .ttlArea h3 small{
    font-size: 1.5rem;
    font-family: var(--fontfamily-sans-serif);
    display: block;
    margin-top: 17px;
}

.strength .inner ul li .txtArea{
    width: 56%;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.96875;
    margin: 0;
}


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

.visual{
    height: 82.133vw;
    background: url("../img/business/sp/visual01.jpg") no-repeat center;
    background-size: cover;
}

.visual::before{
    height: 5.59895833vw;
    background: url("../img/common/sp/bg01.png") no-repeat center;
    background-size: 100% 5.59895833vw;
    bottom: -0.1302vw;
}

.visual h1{
    top: 54.6875vw;
    left: 5.46875vw;
}

.visual h1 span{
    font-size: 10.4167vw;
}

.visual h1 small{
    font-size: 3.515625vw;
    margin-top: 1.467vw;
}

.philosophy{
    padding: 18.75vw 5.2vw 32.552vw;
}

.philosophy .inner{
    padding-left: 0;
    display: block;
}

.philosophy .inner .ttlArea{
    padding-top: 0;
}

.philosophy .inner .ttlArea h2 span{
    font-size: 6.8359375vw;
}

.philosophy .inner .ttlArea h2 small{
    font-size: 3.90625vw;
    margin-top: 4.55729167vw;
}

.philosophy .inner img{
    width: 36.84895833vw;
    margin-top: 13.41145833vw;
}

.philosophy .inner p{
    width: 100%;
    font-size: 3.90625vw;
    margin-top: 12.63vw;
}

.strength{
    padding: 21.354167vw 5.2vw;
}

.strength .inner{
    padding-left: 0;
    display: block;
}

.strength .inner .ttlArea h2 span{
    font-size: 6.8359375vw;
}

.strength .inner .ttlArea h2 small{
    font-size: 3.90625vw;
    margin-top: 4.55729167vw;
}

.strength .inner .ttlArea p{
    font-size: 5.46875vw;
    margin-top: 10.9375vw;
}

.strength .inner .txtArea{
    width: 100%;
    font-size: 3.125vw;
    margin-bottom: 19.53125vw;
}

.strength .inner .txtArea img{
    margin: 11.71875vw auto;
    width: 100%;
}

.strength .inner ul li{
    margin-bottom: 13.8vw;
}

.strength .inner ul li img{
    margin-bottom: 7.8125vw;
}

.strength .inner ul li .ttlArea{
    width: 100%;
    justify-content: flex-start;
    position: relative;
    padding-left: 18.88vw;
}

.strength .inner ul li .ttlArea span{
    font-size: 7.2265625vw;
    position: absolute;
    top: 0;
    left: 0;
}

.strength .inner ul li .ttlArea h3{
    width: auto;
    font-size: 6.4453125vw;
}

.strength .inner ul li .ttlArea h3 small{
    font-size: 2.9296875vw;
    margin-top: 3.3854167vw;
}

.strength .inner ul li .txtArea{
    width: 100%;
    font-size: 3.125vw;
    margin: 5.2vw 0 0;
    padding-left: 18.88vw;
}

}