@import url("../style_programs/style_archives_in.css");



.pageContent {
    /* padding: clamp(1.6130rem, 2.6042vw, 3.1250rem) 0; */
    padding: unset;
}

/* banner區塊------------------------------ */

.podcast_img_banner{
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

    /* aspect-ratio: 26 / 6; */
    padding-top: 26.6%;
    display: flex;
    align-items: end;

    margin-bottom: 2.5rem;
}


/* 收聽平台----------------- */
.program_platforms_icon_area{
    display: flex;
    flex-wrap: wrap;
    gap: .625rem;
}

.program_platforms{
    position: relative;
}


.program_platforms_icon{
	position: relative;
	overflow: hidden;

	width: 2.5rem;

	background: linear-gradient(
		to top,
		rgb(80 80 80) 0%,
		rgba(40, 40, 40, 1) 100%
	);

	border: 1px solid #666;
	border-radius: 1.25rem; /* 20 */
}

/* 滑入漸層效果 ---------- */
.program_platforms_icon::before{
	content: "";
	position: absolute;
	inset: 0;

	background: linear-gradient(
		to top,
		rgb(80 80 80) 0%,
		rgba(40, 40, 40, 1) 50%
	);

	opacity: 0;

	transition: opacity .3s ease;
    pointer-events: none;
}

.program_platforms_icon:hover::before{
	opacity: 1;
}


/* 內部點擊區域 ---------- */
.program_platforms_icon a{
    padding: .5rem;
    display: block;
}

/* icon圖片 ---------- */
.program_platforms_icon .platforms_icon_img{
    display: block;
    position: relative;
    padding-top:100%
}

.program_platforms_icon .platforms_icon_img img{
    width:100%;
    height:auto;
    transition: all 0.3s ease-out;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    float: none;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    transition: all 0.3s ease-out;
}
