@charset "utf-8";
.key    {
    aspect-ratio: 384 / 397;
    position: relative;
    width: 100vw;
    overflow: clip;
    z-index: 6;
}
.key:after {
    content: "";
    position: absolute;
    top: 0;
    border-left: 0;
    background-image: url(../images/key_bg_pc.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    aspect-ratio: 384 / 397;
    width: 100vw;
    z-index: 1;
}

.key .key_item  {
    position: absolute;
    z-index: 3;
}

.key .key_item.key_toyotetsu    {
    width: 46.14vw;
    height: auto;
    left: 22.86vw;
    top: 13.54vw;
    animation: sec2img 3s ease-in-out infinite alternate;
}

.key .key_item.key_message    {
    width: 31.25vw;
    height: auto;
    left: 15.1vw;
    top: 37.96vw;
}

.key .key_item.key_robot    {
    width: 9.11vw;
    height: auto;
    left: 72.81vw;
    top: 13.125vw;
}

.key .videoarea    {
    background-color: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 36.45vw;
    height: 36.45vw;
    border-radius: 50%;
    position: absolute;
    top: 22.39vw;
    left: 48.43vw;
    z-index: 2;
    overflow: clip;
}

.key .videoarea video    {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
main section.sec1   {
    background-color: #fff;
}

main section.sec1 .inner    {
    max-width: 1020px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

main section.sec1 .inner .flex   {
    gap: min(4.4271vw, 85px);
}

main section.sec1 .inner .titlecol img  {
    width: min(18.25vw,256px);
}
main section.sec1 .inner .infocol dl    {
    display: flex;
    flex-direction: column;
    gap: min(1.5625vw, 30px);
}
main section.sec1 .inner .infocol   {
    flex: 1;
}
main section.sec1 .inner .infocol div   {
    display: flex;
    gap: min(1.0417vw, 20px); 
}
main section.sec1 .inner .infocol div dt    {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: min(1.0417vw, 20px);
    font-weight: 400;
}
main section.sec1 .inner .infocol div dt span.date{
    white-space: nowrap;
}
main section.sec1 .inner .infocol div dd{
	flex:1;
}
main section.sec1 .inner .infocol div dt span.category  {
    display: inline-block;
    width: 120px;
    height: 24px;
    font-size: 12px;
    border-radius: 12px;
	color:#fff;
	text-align:center;
	flex-shrink:0;
	line-height:1.7;
}
main section.sec1 .inner .infocol div dt span.management-business {
  background-color: #E80000;
}
main section.sec1 .inner .infocol div dt span.award-certification{
  background-color: #c35791;
}
main section.sec1 .inner .infocol div dt span.exhibitions{
  background-color: #3f7cce;
}
main section.sec1 .inner .infocol div dt span.environment{
  background-color: #4db368;
}
main section.sec1 .inner .infocol div dt span.other{
  background-color: #8a8686;
}

main section.sec1 .inner .infocol div dd a{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}


main section.sec2   {
    aspect-ratio: 48/25;
    width: 100vw;
    background-image: url(../images/sec2_bg_pc.webp);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}


main section.sec2 .sec2img  {
    position: absolute;
    width: 33.85vw;
    height: auto;
    top: 5.34vw;
    left: 50.99vw;
    animation: sec2img 3s ease-in-out infinite alternate;
}

main section.sec2 .inner    {
    max-width: 1380px;
    width: 100%;
    padding: 0 20px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 2;
    padding-top: 14.68vw;
}

main section.sec2 .inner .titlearea *,
main section.sec3 .inner .titlearea *,
main section.sec4 .inner .titlearea *,
main section.sec5 .inner .titlearea * {
    line-height: 1;
}
.num120{
	display: flex;
	align-items: baseline;
	line-height: 1;
}
.num120 .roboto-condensed{
	display: inline-block;
	line-height: .85;
	transform: translateY(.06em);
}

main section.sec2 .inner .button {
    justify-content: flex-start;
}

main section.sec2 .robot    {
    position: absolute;
    top: 5.88vw;
    left: 39.79vw;
    width: 5.98vw;
}

main section.sec2 .inner .titlearea .button a   {
    display: inline-flex;
}

main section.sec3   {
    aspect-ratio: 48/25;
    width: 100vw;
    background-image: url(../images/sec3_bg_pc.webp);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}

main section.sec3 .inner   {
    position: relative;
    max-width: 1460px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 min(1.3228vw, 20px);
    z-index: 3;
}

main section.sec3 .business_details   {
    width: min(43.125vw,828px);
    height: min(45vw,857px);
    position: absolute;
    right: 0;
    top: 4.375vw;
}

@media screen and (max-width: 1660px)   {
    main section.sec3 .business_details   {
        right: 10vw;
    }
}

main section.sec3 .inner > .titlearea {
    position: relative;
    top: 6.6666vw;
    left: min(15vw,170px);
}

.absolute_img {
    position: absolute;
    z-index: 4;
}

main section.sec3 .absolute_img.sec3_car    {
    z-index: 2;
    width: 45.88vw;
    top: 17.91vw;
    left: 8.85vw;
}

main section.sec3 .absolute_img.sec3_sat-12 {
    width: 11.3vw;
    top: 5.41vw;
    left: 49.79vw;
    animation: sec3img1 3s ease-in-out infinite alternate;
}

main section.sec3 .absolute_img.sec3_sat-14 {
    width: 9.375vw;
    top: 17.91vw;
    left: 84.94vw;
    animation: sec3img2 2s ease-in-out infinite alternate;
}

main section.sec3 .absolute_img.sec3_sat-15 {
    width: 9.375vw;
    top: 38.64vw;
    left: 41.61vw;
    animation: sec3img3 2.5s ease-in-out infinite alternate;
}

main section.sec3 .absolute_img.sec3_robot {
    width: 9.22vw;
    top: 2.86vw;
    left: 36.3vw;
}

@media screen and (min-width: 1600px) {
    main section.sec3 .inner > .titlearea {
        left: 50px;
    }
    main section.sec3 .absolute_img.sec3_robot {
        left: 38.3vw;
    }
}

main section.sec4   {
    aspect-ratio: 48/25;
    width: 100vw;
    background-image: url(../images/sec4_bg_pc.webp);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}

main section.sec4 .inner    {
    max-width: 1000px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 min(1.0417vw, 20px);
    display: flex;
    justify-content: center;
    align-items: flex-end;
    height: 100%;
}

main section.sec4 .inner > .titlearea {
    position: absolute;
    left: 43.64vw;
    top: 7.5vw;
}

main section.sec4 .absolute_img.sec4_img1  {
    position: absolute;
    width: 25.72vw;
    height: auto;
    top: 1.35vw;
    left: 8.28vw;
    animation: sec2img 3s ease-in-out infinite alternate;
}

main section.sec4 .absolute_img.sec4_sat-16 {
    width: 9.375vw;
    top: 14.27vw;
    left: 75.15vw;
    animation: sec3img2 2s ease-in-out infinite alternate;
}

main section.sec4 .absolute_img.sec4_robot {
    width: 9.22vw;
    top: 3.02vw;
    left: 67.91vw;
}

main section.sec4 .inner .flex.sec4_cards   {
    width: 100%;
    gap: min(0.6250vw, 12px);
}

main section.sec4 .inner .flex.sec4_cards .col  {
    width: calc((100% - min(1.8750vw, 36px)) / 4);
    background-color: #fff;
    border-radius: min(0.7813vw, 15px);
    padding: min(1.0417vw, 20px);
}

main section.sec4 .inner .flex.sec4_cards .col .imgarea {
    border-radius: min(0.5208vw, 10px);
    overflow: clip;
}

main section.sec5   {
    aspect-ratio: 96/65;
    width: 100vw;
    background-image: url(../images/sec5_bg_pc.webp);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}

main section.sec5 .inner    {
    position: relative;
    z-index: 5;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding-bottom: min(10.41vw,200px);
}

main section.sec5 .inner > .titlearea   {
    position: absolute;
    top: 12.7vw;
    left: 14.06vw;
}

.sustainability_card .titlearea h2,
.sustainability_card .titlearea p    {
    line-height: 108.33%;
}

.sustainability_card .titlearea p   {
    letter-spacing: -1px;
}

.sustainability_card .cardtext   {
    padding: 0 min(2.6042vw, 50px);
}

main section.sec5 .sec5_img1    {
    position: absolute;
    width: 16.97vw;
    height: auto;
    top: 3.8vw;
    left: 27.65vw;
    animation: sec2img 3s ease-in-out infinite alternate;
}

main section.sec5 .sec5_img2    {
    position: absolute;
    width: 5.21vw;
    height: auto;
    top: 20.83vw;
    left: 52.81vw;
    animation: sec3img1 2s ease-in-out infinite alternate;
    z-index: 6;
}

main section.sec5 .sec5_sat-17    {
    position: absolute;
    width: 27.39vw;
    height: auto;
    top: 7.03vw;
    left: 60.88vw;
    animation: sec3img1 2.5s ease-in-out infinite alternate-reverse;
}

main section.sec5 .sec5_robot    {
    position: absolute;
    width: 8.64vw;
    height: auto;
    top: 7.7vw;
    left: 51.25vw;
}

main section.sec6   {
    aspect-ratio: 16/5;
    width: 100vw;
    background-image: url(../images/sec6_bg_pc.webp);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}
main section.sec6 .inner *  {
    line-height: 1;
}
main section.sec6 .inner    {
    max-width: 1220px;
    padding: min(5.88vw,113px) 20px;
    margin-left: auto;
    margin-right: auto;
}

main section.sec6 .inner .button    {
    justify-content: flex-start;
}

main section.sec6 .sec6_sat-18    {
    position: absolute;
    width: 10.57vw;
    height: auto;
    top: 14.94vw;
    left: 29.84vw;
    animation: sec2img 3.5s ease-in-out infinite alternate;
}

main section.sec6 .sec6_sat-19    {
    position: absolute;
    width: 25vw;
    height: auto;
    top: -4.58vw;
    left: 46.77vw;
    animation: sec3img1 2.5s ease-in-out infinite alternate;
}

main section.sec6 .sec6_sat-20    {
    position: absolute;
    width: 15.625vw;
    height: auto;
    top: 9.375vw;
    left: 68.02vw;
    animation: sec3img3 3s ease-in-out infinite alternate-reverse;
}


main section.sec6 .sec6_robot    {
    position: absolute;
    width: 9.11vw;
    height: auto;
    left: 37.65vw;
    top: 7.7vw;
}

main section.sec3 .sec3_clip {
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 834px)    {
    .key .key_item.key_toyotetsu    {
        width: 50vw;
        left: 8vw;
        top: 27.5vw;
    }
    
    .key .key_item.key_message  {
        width: 65vw;
        top: 51.5vw;
        left: 5vw;
    }
    
    .key .key_item.key_robot    {
        width: 22vw;
        left: 71vw;
        top: 41.25vw;
    }
    
    .key .videoarea {
        width: 50vw;
        height: 50vw;
        left: 39.5%;
        top: 63.5vw;
    }
    main section.sec1 .inner .infocol div dt    {
        align-items: flex-start;
    }
    main section.sec1 .inner .infocol div dt span.category  {
        width: auto !important;
        min-width: 30vw;
		line-height:1.4;
    }
    
    main section.sec2   {
        aspect-ratio: 1/2;
        background-image: url(../images/sec2_bg_sp.webp);
    }
    
    main section.sec2 .inner .titlearea *, 
    main section.sec3 .inner .titlearea *, 
    main section.sec4 .inner .titlearea * {
        letter-spacing: 0;
    }
    main section.sec2 .sec2img  {
        width: 80vw;
        left: 0;
        top: 81.5vw;
    }
    .num120{
		display: block;
	}
    main section.sec2 .robot    {
        width: 16vw;
        top: 12.5vw;
        left: 79vw;
    }
    
    main section.sec2   {
        aspect-ratio: 1/2;
        background-image: url(../images/sec2_bg_sp.webp);
    }
    
    main section.sec3 {
        aspect-ratio: auto;
        min-height: 225vw;
        background-image: url(../images/sec3_bg_sp.webp);
        background-position: center bottom;
        overflow-y: clip;
    }
    main section.sec3 .inner    {
        position: static;
    }
    
    main section.sec3 .sec3_clip {
        position: relative;
        width: 100%;
        height: 225vw;
        overflow: hidden;
    }

    main section.sec3 .business_details {
        position: absolute;
        top: auto;
        left: 50%;
        right: auto;
        bottom: 35vw;
        transform: translateX(-55%);
        height: 140vw;
    }
    
    main section.sec3 .business_details .business_details_scene {
        transform: rotate(-30deg) scale(calc(100vw / 1000px),calc(100vw / 1000px));
        position: relative;
        top: 45vw;
        height: 100vw;
    }
    
    main section.sec3 .absolute_img.sec3_sat-12,
    main section.sec3 .absolute_img.sec3_sat-14,
    main section.sec3 .absolute_img.sec3_sat-15 {
        display: none;
    }
    
    main section.sec3 .inner > .titlearea   {
        left:5vw;
    }
    main section.sec3 .absolute_img.sec3_robot  {
        width: 20.5vw;
        left: 53vw;
    }

    main section.sec3 .absolute_img.sec3_car    {
        width: 67.5vw;
        left: 30vw;
        top: 33vw;
    }

    main section.sec4   {
        aspect-ratio: 4/9;
        background-image: url(../images/sec4_bg_sp.webp);
    }
    
    main section.sec4 .inner    {
        padding-left: 5vw;
        padding-right: 5vw;
    }
    
    main section.sec4 .inner > .titlearea   {
        left: 15vw;
    }
    
    main section.sec4 .inner .flex.sec4_cards   {
        flex-wrap: wrap;
        gap: 2.54vw;
    }
    
    main section.sec4 .inner .flex.sec4_cards .col  {
        width: calc((100% - 2.54vw) / 2);
        padding: 5vw 0;
    }
    
    main section.sec4 .inner .flex.sec4_cards .col .imgarea {
        width: calc(100% - 10vw);
        margin-left: auto;
        margin-right: auto;
    }
    
    main section.sec4 .inner .flex.sec4_cards .col .titlearea   {
        min-height: 16vw;
        justify-content: flex-end;
    }

    main section.sec4 .absolute_img.sec4_robot  {
        width: 18.4vw;
        left: 77.25vw;
        top: 9vw;
    }
    
    main section.sec4 .absolute_img.sec4_img1,
    main section.sec4 .absolute_img.sec4_sat-16   {
        display: none;
    }
    
    main section.sec4 .button a.btn_small {
        width: calc(100% - 10vw);
        margin-left: auto;
        margin-right: auto;
    }
    
    main section.sec5   {
        aspect-ratio: 1/2;
        overflow-x: hidden;
        background-image: url(../images/sec5_bg_sp.webp);
    }
    
    main section.sec5 .inner  {
        overflow-x: hidden;
    }
    
    main section.sec5 .sp_narrow  {
        letter-spacing: -1.5px;
    }
    
    main section.sec5 .inner > .titlearea   {
        position: absolute;
        top: 15vw;
        left: 5vw;
    }
    
    main section.sec5 .sec5_img1,
    main section.sec5 .sec5_img2    {
        display: none;
    }
    
    main section.sec5 .sec5_sat-17  {
        width: 50vw;
        left: 45vw;
        top: 36.75vw;
    }
    
    main section.sec5 .sec5_robot   {
        width: 19vw;
        left: 69.5vw;
        top: 8.5vw;
    }

    main section.sec6   {
        aspect-ratio: 1/1;
        background-image: url(../images/sec6_bg_sp.webp);
    }
    
    main section.sec6 .inner    {
        padding: 14vw 5vw 0;
        position: relative;
        height: 100%;
    }
    
    main section.sec6 .inner .button    {
        position: absolute;
        left: 5vw;
        bottom: 10vw;
    }
    
    main section.sec6 .sec6_sat-18  {
        width: 20vw;
        left: 29.5vw;
        top: 57.5vw;
    }
    
    main section.sec6 .sec6_sat-19  {
        width: 45vw;
        left: 43vw;
        top: -8.5vw;
    }
    
    main section.sec6 .sec6_sat-20  {
        width: 25vw;
        top: 35.5vw;
        left: 71.5vw;
    }
    
    main section.sec6 .sec6_robot   {
        width: 19vw;
        top: 41vw;
        left: 48.5vw;
    }
}

@media screen and (max-width: 768px)    {
    main section.sec3 .business_details .business_details_scene {
        transform: rotate(-30deg) scale(calc(100vw / 960px),calc(100vw / 960px));
    }
}

@media screen and (max-width:630px)    {
    main section.sec3 .business_details .business_details_scene {
        transform: rotate(-30deg) scale(calc(105vw / 768px),calc(105vw / 768px));
    }
}

@media screen and (max-width:560px)    {
    main section.sec3 .business_details .business_details_scene {
        transform: rotate(-30deg) scale(calc(110vw / 660px),calc(110vw / 660px));
    }
}

@media screen and (max-width:460px)    {
    main section.sec3 .business_details .business_details_scene {
        transform: rotate(-30deg) scale(calc(100vw / 550px),calc(100vw / 550px));
    }
}

@media screen and (max-width:414px)    {
    main section.sec3 .business_details .business_details_scene {
        transform: rotate(-30deg) scale(calc(100vw / 500px),calc(100vw / 500px));
    }
}

@media screen and (max-width:375px)    {
    main section.sec3 .business_details .business_details_scene {
        transform: rotate(-30deg) scale(calc(100vw / 440px),calc(100vw / 440px));
    }
}