@charset "UTF-8";
/*===========================================
活動剪影/花絮
===========================================*/

/*-------------------------------------------
list
-------------------------------------------*/
.album__list{
    display:flex;
    flex-wrap:wrap;
    list-style:none;
    margin:-20px -20px 0;
    padding:0;
}
    .album__item{
        flex:0 0 25%;
        position:relative;
        padding:20px;
    }
    .album__item:nth-of-type(-n+2){
        flex-basis:50%;
    }
        .album__link{
            display:block;
            background-color:#fff;
            height:100%;
            transition:.2s;
        }
        .album__link:hover{
            box-shadow:0 8px 20px rgba(0,0,0,.1);
        }
            .album__cover{
                margin:0 auto;
                position:relative;
            }
                .album__cover__img{
                    background-color:#8497B0;
                    background-repeat:no-repeat;
                    background-position:50% 50%;
                    background-size:contain;
                    width:100%;
                    height:0;
                    padding-bottom:75%; /* 16:9 56.25% or 4:3 75% */
                }
                .album__cover__img[style*="default"]{
                    background-size:40%;
                }
            .album__info{
                padding:20px;
            }
                .album__type{
                    border-bottom:1px solid rgba(0,0,0,.1);
                    color:#666;
                    font-size:.875rem;
                    line-height:1;
                    margin-bottom:10px;
                    padding-bottom:10px;
                }
                .album__date{
                    color:#666;
                    font-size:.875rem;
                }
                .album__title{
                    margin:5px 0 0;
                    color:#111;
                    line-height:1.3;
                }
                .album__item:nth-of-type(-n+2) .album__title{
                    font-size:1.25rem;
                }
                .album__link .album__title{
                    color:#111;
                    transition:.2s;
                }
                .album__link:hover .album__title{
                    color:var(--hover-color);
                }
@media screen and (max-width:992px){
    .album__item{
        flex-basis:50%;
    }
        .album__item:nth-of-type(-n+2) .album__title{
            font-size:1rem;
        }
}
@media screen and (max-width:736px){/* i6,i7,i8 Plus Landscape */
    .album__list{
        margin:-20px -10px 0;
    }
        .album__item{
            padding-left:10px; padding-right:10px;
        }
}
@media screen and (max-width:576px){
    .album__item,
    .album__item:nth-of-type(-n+2){
        flex-basis:100%;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .album__list{
        margin:-15px -15px 0;
    }
        .album__item{
            padding:15px 0;
        }
            .album__info{
                padding:15px 15px 20px;
            }
                .album__type{
                    margin-bottom:6px;
                    padding-bottom:6px;
                }
}

/*-------------------------------------------
內容
-------------------------------------------*/
.album__header{
    border-bottom:2px solid var(--main-color);
    padding-bottom:30px;
    margin-bottom:30px;
	position:relative;
}
    .album__header .album__type{
        
    }
    .album__header .album__date{
        color:#333;
        font-size:1rem;
    }
	.album__header .album__title{
		color:#000;
		font-size:2rem; line-height:1.3;
        margin-top:10px;
	}
    .album__header .album__organizer{
        color:#333;
        font-size:1rem;
        margin-top:10px;
    }
.album__body{
	padding-bottom:30px;
	word-break:break-word;
}
	.album__body a{
		word-break:break-all;
	}
	.album__body img{
        display:block;
		max-width:100%;
		height:auto !important;
		margin:10px auto;
	}
	.album__body img[src*='emoji']{
		box-shadow:none;
	}
	.iframe__wrap{
		position:relative;
		padding-bottom:56.25%;
		overflow:hidden;
		margin:18px 0;
	}
		.iframe__wrap iframe,
		.iframe__wrap object,
		.iframe__wrap embed{
			position:absolute; top:0; left:0;
			width:100%;
			height:100%;
		}
	.album__body table{
		border-collapse:collapse;
		border:1px solid #aaa;
		width:100% !important;
		margin:1rem 0;
	}
		.album__body table th,
		.album__body table td{
			padding:.25rem .5rem;
			border-color:#aaa !important;
            line-height:1.3;
		}
@media screen and (max-width:1024px){
	.album__header .album__title{
		font-size:1.5rem;
	}
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .album__header{
        padding-bottom:20px;
        margin-bottom:20px;
    }
        .album__header .album__title{
            font-size:5vw;
        }
            .album__body table th,
            .album__body table td{
                font-size:.875rem;
            }
}

/*-------------------------------------------
相片
-------------------------------------------*/
.photo__list{
    border-top:1px solid rgba(0,0,0,.1);
    display:flex;
    flex-wrap:wrap;
    padding:15px 0;
    font-size:.875rem; line-height:1.3;
    word-break:break-all;
}
    .photo__item{
        flex:0 0 20%;
        padding:15px;
    }
        .photo__link{
            display:block;
            position:relative;
            background-color:#fff;
            border-radius:5px;
            box-shadow:0 5px 12px rgba(0,0,0,.05);
            overflow:hidden;
            transition:.2s;
        }
        .photo__link:hover{
            box-shadow:0 3px 5px rgba(0,0,0,.1);
        }
            .photo__cover{
                position:relative;
                margin:0 auto;
                background-color:#333;
                overflow:hidden;
            }
                .photo__cover__img{
                    background-position:50% 50%;
                    background-repeat:no-repeat;
                    /* background-size:contain; */
                    background-size:cover;
                    width:100%;
                    height:0;
                    padding-bottom:56.25%;
                    transition:.5s;
                }
                .photo__link:hover .photo__cover__img{
                    transform:scale(1.05);
                }
                .photo__desc{
                    color:#666;
                    font-size:.875rem;
                    line-height:1.2;
                    padding:15px;
                    transition:.2s;
                }
                .photo__link:hover .photo__desc{
                    color:var(--hover-color);
                }
@media screen and (max-width:1024px){
    .photo__item{
        flex-basis:25%;
    }
}
@media screen and (max-width:992px){
    .photo__item{
        flex-basis:33.3333%;
    }
        .photo__desc{
            font-size:.75rem;
            padding:10px;
        }
}
@media screen and (max-width:667px){/* i6,i7,i8 Landscape */
    .photo__item{
        flex-basis:50%;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .photo__list{
        margin:0 -15px;
        padding-left:5px; padding-right:5px;
    }
        .photo__item{
            padding:10px;
        }
}