.home-banner .banner-animote{max-width:750px}
.home-banner .banner-animote .p1{font-weight:var(--fontbold6)}
.home-banner .banner-animote .p3 a{color:var(--color);background:#fff;border-radius:8px}
.home-banner .banner-animote .p3 a:hover{color:#fff}
.home-banner .banner-animote .p3 a em{margin-left:10px;font-weight:var(--fontbold6)}
@media (min-width:1025px){.home-banner .banner-animote .p1{font-size:54px}}
.home-banner .swiper-slide>a::after { background: linear-gradient(to right, rgb(0 0 0 / 33%), rgb(0 0 0 / 27%));}
.home-banner{height:auto}
.home-banner .swiper-slide>a::after{display:none}
.home-banner .swiper-slide>a.bannerbg{position:absolute;left:0px;top:0px;width:100%;height:100%;background:linear-gradient(to right,rgb(0 0 0 / 33%),rgb(0 0 0 / 27%))}
.home-banner .banner-animote .p1,.home-banner .banner-animote .p2{text-shadow:1px 1px 2px #000}
@media (max-width:500px){.home-banner .banner-animote .p2{line-height:1.4;font-size:var(--fontsize14)}
.home-banner .banner-animote .p2 br{display:none}
.home-banner .banner-animote .p1{margin:0 0 5px}}

.home-mainpro{position:relative;padding:4% 0 0}
.home-mainpro .mainpro-list{margin-top:3%;display:flex;flex-wrap:wrap;list-style:none}
.home-mainpro .mainpro-list li{width:23%;margin-right:2.6%;margin-bottom:2em}
.home-mainpro .mainpro-list li:nth-child(4n){margin-right:0}
.home-mainpro .mainpro-list li a{background:#FFFFFF;box-shadow:0 10px 40px 0 rgba(0,0,0,.1);display:block;width:100%;height:100%;position:relative;padding-bottom:5px}
.home-mainpro .mainpro-list li a .img{width:100%;aspect-ratio:1/1;position:relative}
.home-mainpro .mainpro-list li a .img img{width:100%;height:100%;object-fit:cover}
.home-mainpro .mainpro-list li a .title{margin-bottom:10px;padding:10px 15px 0;font-size:var(--fontsize18);transition:all .1s linear;position:relative;border-top:1px solid #EEEEEE}
.home-mainpro .mainpro-list li a .title::before{content:"";position:absolute;top:-1px;left:0;width:0%;height:1px;background:var(--color);transition:all .3s linear;z-index:1}
.home-mainpro .mainpro-list li a .title::after{transition:all .3s linear;content:"";position:absolute;top:-3.5px;left:0;opacity:0;width:0;height:0;border-style:solid;border-width:3px 0 3px 5px;border-color:transparent transparent transparent var(--color)}
.home-mainpro .mainpro-list li a:hover .img img{transform:scale(1.02)}
.home-mainpro .mainpro-list li a:hover .title{color:var(--color)}
.home-mainpro .mainpro-list li a:hover .title::before{width:100%}
.home-mainpro .mainpro-list li a:hover .title::after{opacity:1;left:calc(100% - 4px)}
@media (max-width:768px){.home-mainpro{padding:40px 0 0}
.home-mainpro .mainpro-list{justify-content:space-between}
.home-mainpro .mainpro-list li{width:48%;margin-right:0;margin-bottom:1em}}