@charset "utf-8";
/* CSS Document */

.box3{ position:relative; padding:40px 0 90px;}
.box3 .con{ position:relative;}
.box3 h2.title{ text-align:left; float:left; width:22%;}
.box3 .swiper-container{ overflow:hidden; font-size:16px; margin:40px 0 0;}
.box3 .swiper-slide{}
.box3 .swiper-slide a{ display:block; background:#f2f2f2; overflow:hidden; padding:3em 1.5em 3em; padding:1.75em 1.5em 3em; position:relative; z-index:3; transition:all ease 0.4s; margin-bottom:4.5em;}
.box3 .swiper-slide a i{ display:block; width/:8em; overflow:hidden; border-radius/:50%; margin:0 auto;}
.box3 .swiper-slide a i img{ display:block; width:100%; height:8em; transition:all ease 0.4s; margin:0 auto; object-fit:cover;}
.box3 .swiper-slide a em{ display:block; line-height:3; color:#333; font-size:1.125em; font-weight:bold; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:0.75em 0 0; transition:/all ease 0.4s;}
.box3 .swiper-slide a em::after{ content:''; display:block; width:2em; height:3px; background:#bd0f1f; transition/:all ease 0.4s;}
.box3 .swiper-slide a .txt{ min-height:7.5em; min-height:15em; line-height:1.875; color:#666; font-size:0.875em; padding:1em 0 0; transition:margin ease 0.3s; transition-delay:0.4s;}
.box3 .swiper-slide a font{ display:block; line-height:1.5; color:#333; font-size:14px; overflow:hidden; padding:1.5em 0 0;}
.box3 .swiper-slide a font img{ display:block; height:1.5em; float:left; margin:0 0.5em 0 0;}


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

.box3 .swiper-slide-active a{ background:#bd0f1f; margin-bottom:0;}
.box3 .swiper-slide-active a em{ color:#fff;}
.box3 .swiper-slide-active a em::after{ background:#fff;}
.box3 .swiper-slide-active a .txt{ color:#fff; margin-bottom:4.5em;}
.box3 .swiper-slide-active a font{ color:#fff;}
.box3 .swiper-slide-active a font img{ filter:brightness(0) invert(1);}

}

.box3 .swiper-pagination{ width:306px; left:346px; text-align:left; font-size:1.75em; line-height:1;}
.box3 .swiper-pagination span.swiper-pagination-current{ font-size:1.5em; color:#bd0f1f;}
.box3 .swiper-pagination span.swiper-pagination-current::before{ content:'0';}
.box3 .swiper-pagination span.swiper-pagination-total::before{ content:'0';}

.box3 .swiper-button-prev,
.box3 .swiper-button-next{ width:42px; height:42px; background-color:#bd0f1f; background-size:auto 20px; border:1px solid #bd0f1f; border-radius:50%; top:auto; bottom:30px; margin:0; opacity:0.7;}
.box3 .swiper-button-prev{ background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); left:0;}
.box3 .swiper-button-next{ background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); left:0; right:auto; margin-left:60px;}
.box3 .swiper-button-prev:hover{ background-color:#bd0f1f; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); opacity:1;}
.box3 .swiper-button-next:hover{ background-color:#bd0f1f; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); opacity:1;}


/*
.box3 ul{ display:flex; flex-wrap:wrap; justify-content:space-between; font-size:16px; overflow:hidden;}
.box3 ul li{ display:block; flex-shrink:0; width:31%; position:relative; transition:all ease 0.4s; margin:4% 0 0;}
.box3 ul li a{ overflow:hidden; padding:4.8% 0; position:relative; z-index:3;}
.box3 ul li a i{ display:block; width:6.25em; overflow:hidden; border-radius:50%;}
.box3 ul li a i img{ display:block; width:100%; transition:all ease 0.4s;}
.box3 ul li a em{ display:block; line-height:3; color:#333; font-size:1.125em; font-weight:bold; text-decoration:underline; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:0.75em 0 0; transition:all ease 0.4s;}
.box3 ul li a .txt{ line-height:1.875; color:#666; font-size:0.875em; padding:0.5em 0 0;}
.box3 ul li a i:hover img{ transform:scale(1.1);}
.box3 ul li a:hover em{ color:#bd0f1f;}
*/

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

.box3{ padding:0 0 40px;}
.box3 .con{ padding:0 0 60px;}
.box3 h2.title{ text-align:center; float:none; width:auto;}
.box3 .swiper-container{ margin:20px 0 0;}
.box3 .swiper-slide{ background:#ededed;}
.box3 .swiper-slide a{ padding:20px 16px 30px; margin:0;}
.box3 .swiper-slide a .txt{ min-height/:0;}
.box3 .swiper-button-prev,
.box3 .swiper-button-next{ width:32px; height:32px; background-size:auto 16px; bottom:0;}
.box3 .swiper-button-prev{ left:50%; margin-left:-48px;}
.box3 .swiper-button-next{ left:auto; right:50%; margin-right:-48px;}


/*
.box3 ul{ font-size:15px; padding:10px 0 0;}
.box3 ul li{ width:100%; border-bottom:1px dashed #ddd; margin:0; padding:15px 0;}
.box3 ul li a i{ float:left; margin-right:20px; width:90px;}
.box3 ul li a em{ font-size:16px; line-height:2; padding:0.25em 0 0;}
.box3 ul li a .txt{ font-size:14px; overflow:hidden; line-height:1.75; padding:0.125em 0 0;}
*/



}





















/**/