.charity--slide {
    position: relative;
    background-color: #F1FBfB;
    width: 100%;
    height: 71vh;
}
.charity--slide--box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
	background-size: cover;
    opacity: 0;
    z-index: -1;
}
.charity--slide--box.fade {
	opacity: 1;
	z-index: 1;
}
.slide--t--1,
.slide--t--2,
.slide--t--3,
.slide--icon,
.slide--dir--lft{
	position: absolute;
}
.slide--icon{
	top: 0;
	left: 0;
}
.fade .slide--icon{
	-webkit-animation-name: slide--fire;
	animation-name: slide--fire;
	-webkit-animation-duration: 1500ms;
	animation-duration: 1500ms;
	-webkit-animation-delay: 0;
	animation-delay: 0;
	-webkit-animation-timing-function: ease-out;
	animation-timing-function: ease-out;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@keyframes slide--fire{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0.5;
	}
	100%{
		opacity: 1;
	}
}
.slide--dir--lft {
    top: 30%;
    left: 2%;
    opacity: 0;
    z-index: 1;
    width: 22vw;
}
.fade .slide--dir--lft {
	-webkit-animation: slide--dir--lft 1s ease-in 1.5s forwards;
	animation: slide--dir--lft 1s ease-in 1.5s forwards;
}
@keyframes slide--dir--lft {
	50% {
		opacity: .5;
	}
	75% {
		opacity: .75;
	}
	100% {
		opacity: 1;
		top: 17%;
	}
}
.slide--t--1 {
    top: 15%;
    left: 34%;
    font-size: 3.906vw;
    opacity: 0;
}
.fade .slide--t--1{
	-webkit-animation: w--1 1s ease-in 1.5s forwards;
	animation: w--1 1s ease-in 1.5s forwards;
}
@keyframes w--1 {
	50% {
		opacity: .5;
	}
	75% {
		opacity: .75;
	}
	100% {
		opacity: 1;
		top: 25%;
	}
}
.fade.charity--slide--box--3 .slide--t--1{
	-webkit-animation: w--1--3 1s ease-in 1.5s forwards;
	animation: w--1--3 1s ease-in 1.5s forwards;
}
@keyframes w--1--3 {
	50% {
		opacity: .5;
	}
	75% {
		opacity: .75;
	}
	100% {
		opacity: 1;
		top: 16%;
	}
}
.charity--slide--box--2 .slide--t--1 {
    left: 31%;
}
.charity--slide--box--4 .slide--t--1 {
    left: 27%;
}
.charity--slide--box--2 .slide--t--2 {
    left: 34%;
    font-size: 1.417vw;
}
.charity--slide--box--3 .slide--t--2 {
    top: 57%;
    left: 28%;
    font-size: 1.583vw;
}
.charity--slide--box--2 .slide--t--3 {
    top: 38%;
    left: 30%;
}
.slide--t--2 {
	top: 41%;
	left: 32%;
	font-size: 2.083vw;
	color: var(--cream);
	padding: 0.417vw 1.667vw;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
.charity--slide--box--2 .slide--t--2 {
	top: 53%;
}
.slide--t--2::before {
	position: absolute;
	content: '';
	background-color: var(--middleblue);
	-webkit-transform: skew(-30deg);
	-ms-transform: skew(-30deg);
	transform: skew(-30deg);
	width: 100%;
	height: 100%;
	-webkit-box-shadow: 10px 10px 0 -1px rgb(0 0 0 / 25%);
	box-shadow: 10px 10px 0 -1px rgb(0 0 0 / 25%);
	top: -80%;
	left: 0;
	opacity: 0;
}
.fade .slide--t--2::before{
	-webkit-animation: w--top 1.5s ease-in 2s forwards;
	animation: w--top 1.5s ease-in 2s forwards;
}
@keyframes w--top{
	100%{
		top: 0;
		opacity: 1;
	}
}
.slide--t--2 > span {
	position: relative;
	font-weight: 700;
	z-index: 1;
	opacity: 0;
}
.fade .slide--t--2 > span {
	-webkit-animation: w--span 1.5s ease-in 3.5s forwards;
	animation: w--span 1.5s ease-in 3.5s forwards;
}
@keyframes w--span{
	100%{
		opacity: 1;
	}
}
.slide--t--3 {
	top: 52%;
	left: 40%;
	font-size: 3.556vw;
	opacity: 0;
}
.charity--slide--box--3 .slide--t--3 {
    top: 38%;
}
.charity--slide--box--3 .slide--t--1 {
    max-width: 37.500vw;
    text-align: center;
    line-height: 1;
	top: 5%;
    left: 30%;
}
.fade .slide--t--3 {
	-webkit-animation: w--3 1.5s ease-in 3.5s forwards;
	animation: w--3 1.5s ease-in 3.5s forwards;
}
@keyframes w--3 {
	50% {
		opacity: .5;
	}
	75% {
		opacity: .75;
	}
	100% {
		opacity: 1;
		left: 34%;
	}
}
.fade.charity--slide--box--3 .slide--t--3 {
	-webkit-animation: w--3--3 1.5s ease-in 3.5s forwards;
	animation: w--3--3 1.5s ease-in 3.5s forwards;
}
@keyframes w--3--3 {
	50% {
		opacity: .5;
	}
	75% {
		opacity: .75;
	}
	100% {
		opacity: 1;
		left: 28%;
	}
}
.color--mood{
	color: #1F7BB2;
	font-weight: 700;
}
.slide--tool {
	position: absolute;
	bottom: 0;
	left: 39%;
	opacity: 0;
}
.fade .slide--tool {
	-webkit-animation: slide--tool 1.5s ease-in 3.5s forwards;
	animation: slide--tool 1.5s ease-in 3.5s forwards;
}
@keyframes slide--tool{
	0%{
		opacity: 0;
	}
	50%{
		opacity: 0.5;
	}
	100%{
		opacity: 1;
		bottom: 8%;
	}
}
.slide--tool > * > img, .slide--tool > * > svg {
    width: 2.604vw;
    height: 2.604vw;
    margin-right: 0.625vw;
}
.slide--tool > * > img + span , .slide--tool > * > svg + span {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	font-size: 1vw;
	text-decoration: underline;
}
.s--t--1 {
    margin-right: 5.75rem;
}
.A--R {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 6.250vw;
    height: 3.125vw;
    z-index: 2;
}
.A--R a {
    width: 50%;
    text-align: center;
    background-color: rgba(0,0,0,.5);
    color: var(--cream);
    justify-content: center;
    cursor: pointer;
}
.A--R .prev {
    border-right: 1px solid var(--cream);
}
.s--t--2 {
    cursor: not-allowed;
    opacity: .75;
}
@media only screen and (min-width: 320px) and (max-width: 1600px){
	.slide--dir--lft {
		width: 25rem;
	}
	.slide--t--1 {
		font-size: 4rem;
	}
	.charity--slide--box--3 .slide--t--1 {
		max-width: 45rem;
	}
	.slide--t--2 {
		font-size: 2rem;
		padding: 0.5rem 2rem;
	}
	.charity--slide--box--2 .slide--t--2 {
		font-size: 1.7rem;
	}
	.charity--slide--box--3 .slide--t--2 {
		font-size: 1.9rem;
	}
	.slide--t--3 {
		font-size: 3.5rem;
	}
	.slide--tool > * > img, .slide--tool > * > svg {
		width: 2rem;
		height: 2rem;
		margin-right: 0.3rem;
	}
	.slide--tool > * > img + span, .slide--tool > * > svg + span{
		font-size: 1.1rem;
	}
	.A--R {
		width: 7.5rem;
		height: 3.75rem;
	}
}
@media only screen and (min-width: 320px) and (max-width: 1366px){
	.slide--t--1 {
		font-size: 3rem;
	}
	.slide--t--2 {
		font-size: 1.5rem;
	}
	.slide--t--3 {
		font-size: 2.75rem;
	}
	.slide--tool {
		left: 35%;
	}
}
@media only screen and (min-width: 1024px) and (max-width: 1440px){
	.slide--dir--lft {
		width: 20rem;
	}
}
@media only screen and (min-width: 320px) and (max-width: 1366px){
	.charity--slide {
		height: 57vh;
	}
}
/*
*@device :: iPad Pro
*@dim { 1024 X 1366 }
*/
@media only screen and (max-height: 1366px) and (max-width: 1024px){
	.charity--slide {
		height: 27vh;
	}
	.slide--dir--lft {
		width: 17rem;
	}
	.slide--t--1 {
		font-size: 2rem;
		left: 40%;
	}
	.slide--t--2 {
		font-size: 1rem;
		left: 37%;
	}
	.slide--t--3 {
		font-size: 1.75rem;
		top: 56%;
	}
	@keyframes w--3{
		50% {
			opacity: .5;
		}

		75% {
			opacity: .75;
		}
		100% {
			opacity: 1;
			left: 40%;
		}
	}
	.A--R {
		width: 5.5rem;
		height: 2.75rem;
	}
}
/*
*@device :: iPad
*@dim { 768 X 1024 }
*/
@media only screen and (max-height: 1024px) and (max-width: 768px){
	.slide--dir--lft {
		width: 10rem;
	}
	.charity--slide--box .slide--t--1 {
		font-size: 1.7rem;
		left: 36%;
	}
	.charity--slide--box .slide--t--2 {
		font-size: .9rem;
		left: 31%;
	}
	.charity--slide--box .slide--t--3 {
		font-size: 1.5rem;
	}
	@keyframes w--3{
		50% {
			opacity: .5;
		}

		75% {
			opacity: .75;
		}
		100% {
			opacity: 1;
			left: 37%;
		}
	}
	.slide--tool {
		left: 35%;
	}
	.s--t--1 {
		margin-right: 1.75rem;
	}
	.slide--tool > * > img + span, .slide--tool > * > svg + span {
		font-size: .9rem;
	}
}
/*
*@device
*@dim { 480 }
*/
@media only screen and (max-width: 480px){
	.charity--slide {
		height: 35vh;
	}
	.charity--slide--box {
		background-image: url(/templates/orgmed/icon/slider/s_mobile.jpg)!important;
	}
	.slide--dir--lft {
		display: none;
	}
	.charity--slide--box .slide--t--1 {
		left: 0;
		margin-left: 1rem;
		font-size: 1.3125rem;
	}
	.charity--slide--box .slide--t--2 {
		top: 35%;
		left: 0;
		font-size: .8rem;
	}
	.charity--slide--box .slide--t--2:before {
		transform: skew(0);
		-webkit-box-shadow: 10px 10px 0 -1px rgb(0 0 0 / 15%);
		box-shadow: 10px 10px 0 -1px rgb(0 0 0 / 15%);
	}
	.charity--slide--box .slide--t--3 {
		top: 60%;
		padding-left: 1rem;
		font-size: 1.2125rem;
		left: 0;
	}
	@keyframes w--1{
		50% {
			opacity: .5;
		}
		75% {
			opacity: .75;
		}
		100% {
			opacity: 1;
			top: 12%;
		}
	}
	@keyframes w--3{
		50% {
			opacity: .5;
		}

		75% {
			opacity: .75;
		}
		100% {
			opacity: 1;
			left: 0;
		}
	}
	.slide--tool {
		left: 0;
		padding-left: 1em;
	}
	.slide--tool > * > img, .slide--tool > * > svg {
		width: 1.25rem;
		height: 1.25rem;
		margin-right: 0.3rem;
	}
	.A--R {
		width: 4.5rem;
		height: 2.5rem;
		right: 0;
		left: initial;
	}
}