


/* === 메인오토롤링PC소스아래꺼만갖다쓰면됨PC,TABLET === */
.scroll00 li {max-width:320px; background:#fff; padding:50px; text-align:center; border-radius:50px; margin:25px 0;}
.scroll00 li figure {width:210px; height:210px; margin:0 auto;}
.scroll00 li figure img {width:100%; border-radius:200px; }
.scroll00 li h3 {font-size:27px; color:#222; font-family:'RiaSans-Extrabold'; font-weighT:400; margin:20px auto;}
.scroll00 li p {font-size:18px; color:#222; line-height:25px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.rolling_wraper {overflow:hidden; position:relative; height:700px; /* 세로스크롤일 땐 높이 필요 */}
.rolling_track {display:flex; will-change:transform; transition:none;}
#main02 .rolling_track, #main02 .rolling_list {flex-direction:column !important;}
.rolling_wraper {overflow:hidden; position:relative;}
.rolling_list {display:flex; flex-wrap:nowrap; animation-timing-function:linear; animation-iteration-count:infinite;}
.rolling_list > li {flex-shrink:0; width:100%; box-sizing:border-box;}
.scroll01, .scroll02 {flex-direction:column;}
.scroll01 {animation-name:scroll-down; animation-duration:20s;}
.scroll02 {animation-name:scroll-up; animation-duration:20s;}

@keyframes scroll-down {
0% {transform:translateY(-50%);}
100% {transform:translateY(0%);}
}

@keyframes scroll-up {
0% {transform:translateY(0%);}
100% {transform:translateY(-50%);}
}





@media screen and (min-width:1400px)
{
/* 메인01 */
.rolling_wraper {height:1070px; /* 세로 스크롤 높이 지정 */}
}




@media screen and (min-width:769px) and (max-width:1399px)
{
/* 메인01 */
.scroll00 li {width:180px; padding:20px; border-radius:20px;}
.scroll00 li figure {width:100px; height:100px;}
.scroll00 li h3 {margin:10px auto; font-size:18px;}
.scroll00 li p {font-size:15px; line-height:24px;}
}




@media screen and (min-width:0) and (max-width:768px)
{
/* === 메인오토롤링소스아래꺼만갖다쓰면됨모바일 === */
.rolling_wraper {width:100%; height:260px;}
.rolling_track, .rolling_list {flex-direction:row;}
.rolling_list {display:flex; flex-direction:row !important; width:1000%;}
.rolling_list > li {flex-shrink:0; margin:20px;}
.scroll00 li {width:180px; padding:20px; border-radius:20px;}
.scroll00 li figure {width:100px; height:100px;}
.scroll00 li h3 {margin:10px auto; font-size:18px;}
.scroll00 li p {font-size:15px; line-height:24px;}
.scroll01, .scroll02 {flex-direction:row;}
.scroll01 {animation-name:scroll-left-to-right; animation-duration:20s;}
.scroll02 {animation-name:scroll-right-to-left; animation-duration:20s;}
@keyframes scroll-left-to-right {
0% {transform:translateX(-50%);}
100% {transform:translateX(0%);}
}
@keyframes scroll-right-to-left {
0% {transform:translateX(0%);}
100% {transform:translateX(-50%);}
}


}