
.horoscope-widget { margin: 0 -10px; background-color:#fff; border-radius: 4px; }
.horoscope-widget .swiper-container { width:100%; }
.horoscope-widget .swiper-wrapper { justify-content:space-between; }
.horoscope-widget.destroy .swiper-wrapper { overflow-x:auto; overflow-y:hidden;}
.horoscope-title { height:50px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
.horoscope-title span { height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 20px; border-bottom: 1px solid #4e1bbf; font-size:16px; color:#4e1bbf; font-family:var(--font-bold); }
.horoscope-title.type-02 span { border-bottom: none; font-size: 24px; color: #272727; font-family: var(--font-bold);}
.horoscope-title.type-03 span { border-bottom-color: #ff0005; font-size: 20px; color: #ff0005; font-family: var(--font-bold);}
.horoscope-items { display:-webkit-box; display:-ms-flexbox; display:flex; padding:10px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; white-space: nowrap; overflow: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch;}
.horoscope-items::-webkit-scrollbar { height:2px; }
.horoscope-items .swiper-slide { width:auto; margin-right:28px;background:none;}
.horoscope-items .swiper-slide:last-child { margin-right:0;}
.horoscope-items .swiper-slide a { display:block; position:relative; }
.horoscope-items .swiper-slide a i { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width:63px; height:63px; margin: 0 auto; border-radius:50%; }
.horoscope-items .swiper-slide a i svg { -webkit-transition:.2s; -o-transition:.2s; transition:.2s; -webkit-transform:scale(.9); -ms-transform:scale(.9); transform:scale(.9); }
.horoscope-items .swiper-slide a .horoscope-aries { background: rgb(255,0,8);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,0,8,1)), to(rgba(181,0,6,1)));
	background: -o-linear-gradient(top, rgba(255,0,8,1) 0%, rgba(181,0,6,1) 100%);
	background: linear-gradient(180deg, rgba(255,0,8,1) 0%, rgba(181,0,6,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff0008",endColorstr="#b50006",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-aries:before { content:''; width:100%; height:100%; 
	background-image: url("data:image/svg+xml;utf8,<svg id='Group_5109' data-name='Group 5109' xmlns='http://www.w3.org/2000/svg' width='49.839' height='32.655' viewBox='0 0 49.839 32.655'> <path id='Path_5351' data-name='Path 5351' d='M1175.911,3571.458a4.848,4.848,0,0,0-3.319-2.926c0,1.077-1.231,1.6-1.231,1.6a2.637,2.637,0,0,0,.456-1.86,8.991,8.991,0,0,0-5.583.25,3.875,3.875,0,0,1,.454,2.563,3.15,3.15,0,0,0-1.4-2.028,8.127,8.127,0,0,0-4.024,3.373,3.83,3.83,0,0,1,2.824,1.3,4.5,4.5,0,0,0-3.474,0c-.824,2.448,1.463,4.47,1.463,4.47a5.694,5.694,0,0,0,2.193,1.173,4.89,4.89,0,0,0,2.107-3.437,3.858,3.858,0,0,1-1.008,3.642,7.359,7.359,0,0,0,2.876-.285,4.646,4.646,0,0,0,3.25-3.417,4,4,0,0,0-3.463-1.43,3.345,3.345,0,0,1,3.58.3,8.4,8.4,0,0,0-.783-3.379s-4.339-.288-4.714,3.516c0,0-1.364-3.5,3.928-4.135a6.83,6.83,0,0,1,1.277,0c4.844.453,3.6,6.451,3.6,6.451A5.26,5.26,0,0,0,1175.911,3571.458Z' transform='translate(-1126.519 -3565.812)' fill='%23fff'></path> <path id='Path_5352' data-name='Path 5352' d='M909.18,3556.55a7.9,7.9,0,0,1-4.4,1.641,15.255,15.255,0,0,0,3.907-2.753,5.473,5.473,0,0,1-.1-2.868,8.5,8.5,0,0,1,3.12-4.279,10.97,10.97,0,0,1,4.739-1.926,10.128,10.128,0,0,0-4.74-1.62,9.022,9.022,0,0,1-.306,2.946,5.211,5.211,0,0,0-.883-2.96,12.135,12.135,0,0,0-5.525,1.81,5.8,5.8,0,0,1,2.851,4.788c-.462-2.323-2.566-3.452-4.087-3.975a19.3,19.3,0,0,0-3.513,3.257,19.293,19.293,0,0,0-3.514-3.257c-1.52.523-3.623,1.652-4.084,3.975a5.8,5.8,0,0,1,2.85-4.788,12.142,12.142,0,0,0-5.526-1.81,5.225,5.225,0,0,0-.882,2.96,8.964,8.964,0,0,1-.3-2.946,10.115,10.115,0,0,0-4.74,1.62s6.036.664,7.858,6.2a5.477,5.477,0,0,1-.085,2.825,14.48,14.48,0,0,0,3.943,2.767,7.086,7.086,0,0,1-4.41-1.672,6.016,6.016,0,0,1-1.683,1.873s-1.075,1.735,1.407,3.39a3.819,3.819,0,0,1,0-2.316s.329,3.637,3.391,4.052,3.059,4.634,3.059,4.634a4.864,4.864,0,0,0-3.224-2.73,2.557,2.557,0,0,1-2.316-2.318s-.334,3.144,3.638,10.589a4.728,4.728,0,0,0,9.24,0c3.972-7.445,3.641-10.589,3.641-10.589a2.557,2.557,0,0,1-2.316,2.318,4.869,4.869,0,0,0-3.226,2.73s0-4.221,3.059-4.634,3.393-4.052,3.393-4.052a3.82,3.82,0,0,1,0,2.316c2.48-1.656,1.406-3.39,1.406-3.39A6.066,6.066,0,0,1,909.18,3556.55Zm-8.929,3.384a3.429,3.429,0,0,1-1.161-1.228s1.161.453,1.161-.387c0,.84,1.16.387,1.16.387A3.423,3.423,0,0,1,900.252,3559.934Z' transform='translate(-875.332 -3544.731)' fill='%23fff'></path> <path id='Path_5353' data-name='Path 5353' d='M804.134,3573.734a4.5,4.5,0,0,0-3.473,0,3.824,3.824,0,0,1,2.822-1.3,8.124,8.124,0,0,0-4.023-3.373,3.156,3.156,0,0,0-1.407,2.028,3.873,3.873,0,0,1,.455-2.563,8.988,8.988,0,0,0-5.581-.25,2.643,2.643,0,0,0,.453,1.86s-1.231-.524-1.231-1.6a4.847,4.847,0,0,0-3.318,2.926,5.252,5.252,0,0,0,.993,5.75s-1.243-5.994,3.6-6.454a7.149,7.149,0,0,1,1.279,0c5.294.633,3.93,4.135,3.93,4.135-.371-3.8-4.714-3.516-4.714-3.516a8.435,8.435,0,0,0-.782,3.379,3.349,3.349,0,0,1,3.581-.3,4.006,4.006,0,0,0-3.466,1.43,4.646,4.646,0,0,0,3.25,3.417,7.349,7.349,0,0,0,2.875.285,3.864,3.864,0,0,1-1.006-3.642,4.892,4.892,0,0,0,2.107,3.437,5.739,5.739,0,0,0,2.2-1.173S804.954,3576.182,804.134,3573.734Z' transform='translate(-788.384 -3565.812)' fill='%23fff'></path></svg>");
	background-repeat: no-repeat;
	background-position: center center; 
}

.horoscope-items .swiper-slide a .horoscope-taurus { background: rgb(200,0,104);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(200,0,104,1)), to(rgba(122,0,64,1)));
	background: -o-linear-gradient(top, rgba(200,0,104,1) 0%, rgba(122,0,64,1) 100%);
	background: linear-gradient(180deg, rgba(200,0,104,1) 0%, rgba(122,0,64,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c80068",endColorstr="#7a0040",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-gemini { background: rgb(111,35,149);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(111,35,149,1)), to(rgba(61,18,83,1)));
	background: -o-linear-gradient(top, rgba(111,35,149,1) 0%, rgba(61,18,83,1) 100%);
	background: linear-gradient(180deg, rgba(111,35,149,1) 0%, rgba(61,18,83,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#6f2395",endColorstr="#3d1253",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-cancer { background: rgb(85,77,169);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(85,77,169,1)), to(rgba(44,40,90,1)));
	background: -o-linear-gradient(top, rgba(85,77,169,1) 0%, rgba(44,40,90,1) 100%);
	background: linear-gradient(180deg, rgba(85,77,169,1) 0%, rgba(44,40,90,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#554da9",endColorstr="#2c285a",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-leo { background: rgb(0,119,184);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,119,184,1)), to(rgba(0,49,75,1)));
	background: -o-linear-gradient(top, rgba(0,119,184,1) 0%, rgba(0,49,75,1) 100%);
	background: linear-gradient(180deg, rgba(0,119,184,1) 0%, rgba(0,49,75,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0077b8",endColorstr="#00314b",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-virgo { background: rgb(64,203,191);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(64,203,191,1)), to(rgba(10,66,61,1)));
	background: -o-linear-gradient(top, rgba(64,203,191,1) 0%, rgba(10,66,61,1) 100%);
	background: linear-gradient(180deg, rgba(64,203,191,1) 0%, rgba(10,66,61,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#40cbbf",endColorstr="#0a423d",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-libra { background: rgb(0,170,68);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,170,68,1)), to(rgba(0,90,36,1)));
	background: -o-linear-gradient(top, rgba(0,170,68,1) 0%, rgba(0,90,36,1) 100%);
	background: linear-gradient(180deg, rgba(0,170,68,1) 0%, rgba(0,90,36,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00aa44",endColorstr="#005a24",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-scorpio { background: rgb(163,212,0);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(163,212,0,1)), to(rgba(92,119,2,1)));
	background: -o-linear-gradient(top, rgba(163,212,0,1) 0%, rgba(92,119,2,1) 100%);
	background: linear-gradient(180deg, rgba(163,212,0,1) 0%, rgba(92,119,2,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#a3d400",endColorstr="#5c7702",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-sagittarius { background: rgb(255,243,0);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,243,0,1)), to(rgba(135,129,0,1)));
	background: -o-linear-gradient(top, rgba(255,243,0,1) 0%, rgba(135,129,0,1) 100%);
	background: linear-gradient(180deg, rgba(255,243,0,1) 0%, rgba(135,129,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fff300",endColorstr="#878100",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-capricorn { background: rgb(255,181,0);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,181,0,1)), to(rgba(122,87,0,1)));
	background: -o-linear-gradient(top, rgba(255,181,0,1) 0%, rgba(122,87,0,1) 100%);
	background: linear-gradient(180deg, rgba(255,181,0,1) 0%, rgba(122,87,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffb500",endColorstr="#7a5700",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-acquarius { background: rgb(255,133,0);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,133,0,1)), to(rgba(179,94,0,1)));
	background: -o-linear-gradient(top, rgba(255,133,0,1) 0%, rgba(179,94,0,1) 100%);
	background: linear-gradient(180deg, rgba(255,133,0,1) 0%, rgba(179,94,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff8500",endColorstr="#b35e00",GradientType=1);
}
.horoscope-items .swiper-slide a .horoscope-pisces { background: rgb(255,75,0);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,75,0,1)), to(rgba(160,47,0,1)));
	background: -o-linear-gradient(top, rgba(255,75,0,1) 0%, rgba(160,47,0,1) 100%);
	background: linear-gradient(180deg, rgba(255,75,0,1) 0%, rgba(160,47,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff4b00",endColorstr="#a02f00",GradientType=1);
}

.horoscope-items .swiper-slide a .before strong { display: block; margin-top: 7px; font-size:14px; color:#053679; font-family:var(--font-semibold); text-align: center;}

.horoscope-items .swiper-slide a .before { display: block; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; -o-transition: transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s; }
.horoscope-items .swiper-slide a .after { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 63px; height: 63px; position: absolute; top: 0; left: 0; background-color: #4e1bbf; border-radius: 50%; -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; -o-transition: transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s; -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.horoscope-items .swiper-slide a .after strong { display:block; margin-bottom:3px; font-size:10px; line-height:13px; font-family:var(--font-semibold); color:#fff; }
.horoscope-items .swiper-slide a .after strong:last-child { margin-bottom:0; }
.horoscope-items .swiper-slide a:hover .before { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); }
.horoscope-items .swiper-slide a:hover .after { -webkit-transform: rotateY(0); transform: rotateY(0); }


.horoscope-widget.type-02 {}
.horoscope-widget.type-02 .swiper-container { overflow:initial; }
.horoscope-widget.type-02 .horoscope-items { padding:30px 20px 20px; }
.horoscope-widget.type-02 .horoscope-items .swiper-slide a .before strong { margin-top:30px; }
.horoscope-widget.type-02 .horoscope-items .swiper-slide.active { opacity:1; }
.horoscope-widget.type-02 .horoscope-items .swiper-slide:hover { opacity:1; }
.horoscope-widget.type-02 .horoscope-items .swiper-slide { opacity:.6; }

.horoscope-widget.type-02 .horoscope-items .swiper-slide.active a i:after { content:''; width:100px; height:100px; background:url(../i/horoscope-active-bg.png) no-repeat 0px 0px; position: absolute; top: -20px; left: 50%; transform: translateX(-50%); z-index: -1;}


@media (min-width: 767px) {
	.horoscope-widget { margin:0; }
	.horoscope-title span { font-size:20px; }
	.horoscope-title.type-03 span { font-size: 26px; }
	.horoscope-items { padding:19px 16px; }
	.horoscope-items .swiper-slide a i svg { -webkit-transition:.2s; -o-transition:.2s; transition:.2s; -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1);}

	
}

@media (min-width: 992px) {
	.horoscope-items { -ms-flex-wrap:nowrap; flex-wrap:nowrap; }
	.horoscope-items .swiper-slide { width:auto; }
	.horoscope-items .swiper-slide:last-child { margin-right:0; }
}
