@charset "utf-8";   
 
/* main-4 */
.main4__sec , .main4__inner { width:100% }
.main4__sec   { padding:6rem 1.5rem }
.main4__inner { margin-bottom:3rem }  
.main4__group { display:flex ; flex-wrap:wrap ; justify-content:center ; gap:2rem }

.main4__title {
    font-size:3.4rem ; line-height:140% ; font-weight:600 ; color:#111111 ; text-align:center ;
    margin-bottom:3rem ; letter-spacing:-0.1rem ;
}
.main4__btn__prev , .main4__btn__next { display:none }
 
.main4__item , .main4__item::after , .main4__imgBox {  border-radius:0.4rem }
.main4__item {
    display:none ; min-width:200px ; max-width:28.5rem ;  
    flex:1 1 25% ; margin-bottom:2rem ; 
    position:relative ;
    padding:16rem 1.5rem 3rem 1.5rem
} 
.main4__item:nth-child(1) , .main4__item:nth-child(2) , .main4__item:nth-child(3) , .main4__item:nth-child(4) { display:block } 
.main4__item:hover { box-shadow:0 0.1rem 0.5rem rgba(0,0,0,0.2) }
.main4__item::after {
    display:block ; content:"" ; width:100% ; height:100% ; 
    position:absolute ; left:50% ; top:50% ; transform:translate(-50%,-50%) ; z-index:5 ;
    border:solid 1px rgba(0,0,0,0.1) ; box-sizing:border-box ;
    transition:0.3s all
}

.main4__imgBox {
    display:block ; width:100% ; height:16rem ; 
    position:absolute ; left:0 ; top:0 ; overflow:hidden ;
}

.main4__imgBox::before , .main4__item__img , .main4__item__icon ,
.main4__item__icon::before , .main4__item__icon::after { position:absolute ; left:50% ; top:50% ; transform:translate(-50%,-50%) }
.main4__imgBox::before , .main4__item__img { display:block ; width:100% ; height:100% ; transform:translate(-50%,-50%) scale(1.01) }


.main4__item , .main4__item__img , .main4__item__icon , .main4__imgBox::before , .main4__more , .main4__item__tag { transition:0.3s all }
.main4__item__img  { z-index:2 ; background-repeat:no-repeat ; background-position:center ; background-size:cover } 
.main4__item:hover .main4__item__img { transform:translate(-50%,-50%) scale(1.1) }
.main4__imgBox::before { 
    content:"" ;
    z-index:3 ; background-color:rgba(0,0,0,0.1) 
}
.main4__item:hover .main4__imgBox::before { background-color:rgba(0,0,0,0.3) }
.main4__item__icon { 
    z-index:4 ; top:60% ; opacity:0 ;
    width:6rem ; height:6rem ; border-radius:100% ;
    background-color:rgba(0,0,0,0.4) ;
} 
.main4__item:hover .main4__item__icon { top:50% ; opacity:0.9 }

.main4__item__icon::before , .main4__item__icon::after { 
    display:block ; content:"" ; box-sizing:border-box 
}
.main4__item__icon::before { 
    width:2rem ; height:2rem ; border-radius:100% ;
    border:solid 0.2rem #ffffff ;
    left:48% ; top:48% ;
}
.main4__item__icon::after {
    width:0.8rem ; height:0.2rem ; border-radius:1rem ;
    background-color:#ffffff ;
    left:62% ; top:62% ;
    transform:translate(-50%,-50%) rotate(45deg)
}

.main4__item__tag {
    display:inline-block ; padding:0.3rem 1rem 0.5rem ; margin:1.5rem 0 0.5rem ;
    font-size:1.2rem ; line-height:110% ; color:#ffffff ; 
    text-shadow:0 0 0.3rem rgba(0,0,0,0.1) ;
    background-color:#444444 ; border-radius:0.4rem ;
}
.main4__item:hover .main4__item__tag { background-color:#ff6600 ; color:#ffffff ; text-shadow:0 0 0.3rem rgba(0,0,0,0.1) }
.main4__item__txt {
    display:block ; 
    font-size:1.8rem ; line-height:160% ; word-break:keep-all ; 
}
.main4__item__txt > span {
    font-size:inherit ; line-height:inherit ; font-weight:inherit ; color:inherit ; 
    word-break:inherit ; letter-spacing:inherit ;
    border-bottom:solid 1px rgba(0,0,0,0) ; padding-bottom:0.2rem ;
} 
.main4__item:hover .main4__item__txt > span { border-color:rgba(0,0,0,0.2) ; color:#111111  }

.main4__more {
    display:block ; width:9rem ; padding:1rem ; margin:auto ; 
    font-size:1.4rem ; line-height:110% ; text-align:center ;
    border:solid 1px rgba(0,0,0,0.1) ; border-radius:0.4rem ;
}
.main4__more:hover {
    background-color:#111111 ; border-color:#111111 ;
    color:#ffffff ; text-shadow:0 0 0.3rem rgba(0,0,0,0.2) ;
}



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

    /* main-4 */
    .main4__sec   { padding:8rem 0 }
    .main4__inner { width:96% ; max-width:120rem ; margin:0 auto 2rem ; overflow:hidden ; position:relative } 
    .main4__title { font-size:4rem ; margin-bottom:4rem }
    .main4__link  { margin-bottom:0 }
 
    .main4__group { 
        display:block ; width:100% ; 
        position:relative ; transition:left 0.5s ease; 
    }
    .main4__group , .main4__item { height:32rem }
    .main4__item  { 
        display:block ; width:23.75% ; margin:0 ;
        min-width:auto ; max-width:28.5rem ; flex:none ;
        position:absolute ; top:0 ; 
    }
    .main4__item:nth-child(1) { left:0 }
    .main4__item:nth-child(2) { left:25.4166% }
    .main4__item:nth-child(3) { left:50.8333% }
    .main4__item:nth-child(4) { left:76.25% } 
    .main4__item:nth-child(5) { left:101.6666% }
    .main4__item:nth-child(6) { left:127.0833% }
    .main4__item:nth-child(7) { left:152.5% }
    .main4__item:nth-child(8) { left:177.9166% }
    .main4__item:nth-child(9) { left:203.3333% }
 
    .main4__item:hover { box-shadow:none }
    .main4__item:hover::after { border-color:rgba(0,0,0,0.3) }

    .main4__btn__prev , .main4__btn__next {
        display:block ; width:4rem ; height:4rem ;  
        overflow:hidden ; font-size:0 ; color:transparent ; text-indent:-99rem ;
        position:absolute ; left:50% ; top:3rem ; transform:translate(-50%,-50%) ; 
    } 
    .main4__btn__prev::before , .main4__btn__next::before { 
        width:1rem ; height:1rem ; display:block ; content:"" ;
        position:absolute ; left:50% ; top:50%; transform:translate(-50%,-50%) rotate(45deg) ; 
        border:solid 1px #000000 ; opacity:0.3 ;
        transition:0.3s all ;
    }
    .main4__btn__prev:hover::before , .main4__btn__next:hover::before { transform:translate(-50%,-50%) rotate(45deg) scale(1.1) ; opacity:0.8 }
    .main4__btn__prev { margin-left:-15rem }
    .main4__btn__next { margin-left:15rem }

    .main4__btn__prev::before { border-top:none ; border-right:none }
    .main4__btn__next::before { border-bottom:none ; border-left:none }
    

 

}
  




@media print {  }