@charset "UTF-8";
/*===========================================
Homepage
===========================================*/
#content-container{
    --section-py:80px;
}

/*-------------------------------------------
Hero
-------------------------------------------*/
.header-theme{
    padding:0;
    background-color:#d89ba0;
    background-image:url(../images/hero_pic.jpg);
    background-position:center top;
    background-repeat:repeat-x;
}
    .hero{
        --max-height:calc(100svh - var(--header-height));
        --min-height:calc(600px - var(--header-height));
        font-family:var(--hero-font-family);
        min-height:calc(100vh - var(--header-height));
        min-height:calc(100svh - var(--header-height));
        max-height:calc(970px - var(--header-height));
        height:max(var(--max-height), var(--min-height));
        position:relative; z-index:0;
    }
        .hero__text{
            position:absolute; top:3%; left:2%; z-index:5;
        }
            .hero__text h3{
                margin:0;
                font-size:1.4vw;
                font-weight:400;
                line-height:1.2;
            }
                .hero__text .trc2027{
                    margin-top:5px;
                }
        .hero__title{
            margin:0;
            aspect-ratio:31 / 18;
            width:28%;
            background:url(../images/ASCI_TRC2027_p.svg) no-repeat center top;
            background-size:contain;
            position:absolute; top:13%; left:4%; z-index:5;
            /* overflow:hidden; */
        }
            .hero__title span{
                opacity:0;
                pointer-events:none;
            }
        .hero__date{
            aspect-ratio:63 / 20;
            background:url(../images/hero_date_2.svg) no-repeat center bottom;
            background-size:contain;
            width:20%;
            position:absolute; top:64%; left:7.5%; z-index:4;
            transform:translateY(-50%);
            margin:0;
        }
            .hero__date span{
                opacity:0;
                pointer-events:none;
            }
            .hero__date .exhibits{
                font-size:1.5rem;
                line-height:1.2;
                position:absolute; top:calc(100% + 20px); left:50%;
                transform:translateX(-50%);
                white-space:nowrap;
                text-align:center;
                display:none;
            }
                .hero__date .exhibits span{
                    opacity:1;
                }
        .hero__topic{
            display:inline-block;
            background-color:var(--secondary-color);
            color:#fff;
            font-size:1.5rem; font-weight:500;
            line-height:1;
            padding:.5em 1.2em;
            position:absolute; bottom:3%; left:0%; z-index:4;
            margin-bottom:50px;
            display:none;
        }
        .hero__main{
            aspect-ratio:50 / 47;
            width:50%;
            background:url(../images/hero_heart_compressed.png) no-repeat left top;
            background-size:contain;
            position:absolute; top:8%; left:45%; z-index:3;
            pointer-events:none;
        }
        .hero__bg__yellow{
            aspect-ratio:1;
            width:20%;
            background:url(../images/hero_bg_yellow_compressed.png) no-repeat center;
            background-size:contain;
            position:absolute; bottom:-6%; left:36%; z-index:1;
            pointer-events:none;
        }
        .hero__bg__white{
            aspect-ratio:50 / 47;
            width:39.5%;
            background:url(../images/hero_bg_white_compressed.png) repeat left top;
            background-size:contain;
            position:absolute; top:0; right:0; z-index:0;
            height:100%;
            pointer-events:none;
        }
        .hero__copyright{
            color:var(--secondary-color);
            font-size:.75rem;
            text-shadow:none;
            position:absolute; bottom:40px; right:10px; z-index:6;
            margin:0;
            opacity:.6;
        }
@media screen and (max-width:1680px){
    .hero__text h3{
        font-size:1.25vw;
    }
    .hero__main{
        width:45%;
        top:12%; left:38.4%;
    }
    .hero__bg__yellow{
        width:20%;
        bottom:8%; left:32%;
    }
}
@media screen and (min-width:1440px) and (max-height:640px){
    .hero__title{
        width:25%;
        top:15%; left:7%;
    }
    .hero__date{
        width:18%;
        top:65%; left:10%;
    }
    .hero__main{
        width:48%;
        top:2%; left:45%;
    }
    .hero__bg__yellow{
        bottom:-16%; left:36%;
    }
}
@media screen and (max-width:1440px){
    .hero__text{
        bottom:5%;
    }
        .hero__text h3{
            font-size:1.5vw;
        }
    .hero__title{
        width:35%;
        top:16%;
    }
    .hero__date{
        width:25%;
        top:66%; left:9%;
    }
    .hero__main{
        width:52%;
        top:10%; left:46%;
    }
    .hero__bg__yellow{
        width:24%;
        bottom:7%; left:36%;
    }
}
@media screen and (max-width:1024px){
    .hero__text h3{
        font-size:2vw;
        text-shadow:0 2px 8px rgba(0,0,0,.3);
    }
    .hero__title{
        width:38%;
        top:16%;
    }
        .hero__title::before{
            aspect-ratio:110 / 65;
            background-image:url(../images/ASCI_TRC2027_p.svg);
        }
    .hero__date{
        top:58%; left:11%;
    }
        .hero__date .exhibits strong{
            display:block;
        }
    .hero__topic{
        font-size:1.25rem;
    }
    .hero__main{
        width:62%;
        top:16%; left:42%;
    }
    .hero__bg__yellow{
        width:28%;
        bottom:0; left:30%;
    }
}
@media screen and (max-width:992px){
    .hero__topic{
        margin-bottom:30px;
    }
    .hero__copyright{
        right:auto; left:10px;
        opacity:.4;
    }
}
@media screen and (max-width:820px) and (min-height:640px){
    .hero__text{
        
    }
        .hero__text h3{
            font-size:2.25vw;
        }
    .hero__title{
        top:18%;
    }
    .hero__date{
        width:26%;
        top:52%; left:10%;
    }
    .hero__topic{
        margin-bottom:55px;
    }
    .hero__main{
        width:62%;
        top:18.5%;
    }
    .hero__bg__yellow{
        bottom:14%;
    }
    .hero__copyright{
        font-size:.7rem;
        left:10px; right:auto;
    }
}
@media screen and (max-width:820px) and (orientation:portrait){/* iPad Air and Portrait */
    .hero{
        background-image:url(../images/hero_pic_sp.jpg);
    }
        .hero__text{
            top:20px; bottom:auto; right:20px; left:auto;
            transform:rotate(90deg) translateX(100%);
            transform-origin:right top;
        }
        .hero__title{
            aspect-ratio:75 / 13;
            background-image:url(../images/ASCI_TRC2027.svg);
            width:83%;
            top:auto; bottom:58px; left:auto; right:20px;
        }
        .hero__date{
            aspect-ratio:14 / 11;
            background-image:url(../images/hero_date.svg);
            width:28%;
            top:8%; left:40px;
            transform:none;
        }
        .hero__topic{
            font-size:1.125rem;
            bottom:12%; left:auto; right:0;
        }
        .hero__main{
            width:100%;
            top:42%; left:0%;
            transform:translateY(-50%);
            aspect-ratio:15 / 17;
            background-size:84% auto;
            background-position:center;
        }
        .hero__bg__yellow{
            width:40%;
            bottom:8%; left:-4%;
        }
        .hero__bg__white{
            width:48%;
            background-repeat:no-repeat;
            right:70px;
        }
        .hero__copyright{
            left:auto; right:10px;
            opacity:.4;
        }
}
@media screen and (max-width:768px){
    .hero__text h3{
        font-size:2vh;
    }
    .hero__date{
        width:24%;
        top:5%;
    }
        .hero__date .exhibits{
            font-size:1.25rem;
        }
    .hero__topic{
        bottom:14%;
    }
    .hero__main{
        background-size:75% auto;
        background-position-x:62%;
        top:42%;
    }
    .hero__bg__yellow{
        width:35%;
        bottom:3%; left:-2%;
    }
    .hero__bg__white{
        width:48%;
        right:80px;
    }
}
@media screen and (max-width:667px) and (orientation:landscape){/* i6, i7, i8 Landscape */
    .hero{
        height:100vh;
        height:100svh;
        height:calc(var(--vh, 1svh) * 100);
        transition:height 0s !important;
    }
        .hero__text h3{
            font-size:1rem;
        }
        .hero__title{
            aspect-ratio:31 / 18;
            width:30%;
            top:18%; left:7%;
        }
        .hero__date{
            width:22%;
            top:64%; left:11%;
        }
            .hero__date .exhibits{
                font-size:1.125rem;
                top:calc(100% + 10px);
            }
        .hero__topic{
            font-size:1rem;
            bottom:4%;
        }
        .hero__main{
            width:56%;
            top:5%; left:42%;
            background-size:contain;
        }
        .hero__bg__yellow{
            width:26%;
            bottom:-8%; left:33%;
        }
        .hero__bg__white{
            width:38%;
            right:0;
        }
}
@media screen and (max-width:576px){
    .hero__text{
        font-size:2.5vw;
    }
    .hero__title{
        top:22%;
    }
    .hero__date{
        top:58%;
    }
    .hero__topic{
        font-size:.9rem;
        bottom:14%;
    }
    .hero__main{
        top:50%;
        transform:translateY(-50%);
    }
    .hero__bg__yellow{
        bottom:-3%;
    }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .hero{
        height:100vh;
        height:100svh;
        height:calc(var(--vh, 1svh) * 100);
        transition:height 0s !important;
    }
        .hero__text{
            background-color:rgba(var(--primary-light-rgb),.5);
            padding:3px 5px;
            bottom:auto; top:15px; right:7px;
        }
            .hero__text h3{
                text-shadow:0px 0px 8px rgba(0,0,0,.4);
                white-space:nowrap;
            }
                .hero__text .trc2027{
                    margin-top:2px;
                }
        .hero__title{
            width:93%;
            top:auto; bottom:90px; left:auto; right:10px;
        }
            .hero__title::after{
                content:"Aspiring．Synergistic．Collaborative．Illuminating";
                background-color:var(--secondary-color);
                font-size:3.5vw; font-weight:400;
                line-height:1;
                padding:.6em 1em;
                position:absolute; right:-10px; bottom:calc(100% + 3px);
            }
        .hero__date{
            width:30%;
            top:30px; left:20px;
            transform:none;
        }
            .hero__date .exhibits{
                font-size:4vw;
            }
                .hero__date .exhibits span{
                    display:block;
                    font-size:1.5rem;
                }
        .hero__topic{
            font-size:3.25vw;
            bottom:16.5%;
            display:none;
        }
        .hero__main{
            width:100%;
            top:46%; left:0%;
            aspect-ratio:15 / 17;
            background-size:110% auto;
            background-position:left 15px center;
        }
        .hero__bg__yellow{
            width:54%;
            bottom:21%; left:-5%;
        }
        .hero__bg__white{
            aspect-ratio:10 / 18;
            width:45%;
            background-image:url(../images/hero_bg_white_text_compressed.png);
            background-position-x:left;
            background-repeat:no-repeat;
            background-size:64vw auto;
            right:7vh;
        }
        .hero__copyright{
            transform:scale(.85);
            transform-origin:right;
        }
}
@media screen and (max-width:375px) and (max-height:667px){/* i6, i7, i8, SE, iX, XS, i11 Pro, i12-i13 Mini */
    .hero__main{
        background-size:95% auto;
        background-position:center;
    }
    .hero__bg__yellow{
        width:46%;
        bottom:15%;
    }
}
@media screen and (max-height:600px) and (orientation:portrait){
    .hero{
        min-height:600px; /* 防禦性設計：當視窗被拉得太扁時，強制設定一個最小高度，避免內容重疊 */
        height:auto;
    }
        .hero__title{
            top:auto; bottom:80px;
        }
}
@media screen and (max-height:360px){
    .hero{
        min-height:360px; /* 防禦性設計：當視窗被拉得太扁時，強制設定一個最小高度，避免內容重疊 */
    }
        .hero__bg__yellow{
            bottom:15%;
        }
}

/*-------------------------------------------
Please Scroll
-------------------------------------------*/
.please__scroll{
    /* display:block; */
    display:none;
    position:absolute; left:50%; z-index:2;
    pointer-events:none;
}
    .please__scroll::before{
        content:"";
        display:inline-block;
        background-color:var(--secondary-color);
        width:1px;
        height:100px;
        position:absolute; bottom:-50px;
        opacity:.2;
    }
    .please__scroll::after{
        content:"";
        display:inline-block;
        background-color:var(--secondary-color);
        border-radius:10px;
        width:7px;
        height:15px;
        position:absolute; bottom:50px;
        transform:translateX(-50%);
        margin-left:1px;
        animation:scrollAni 2s 0s infinite;
    }
    .please__scroll span{
        color:var(--secondary-color);
        font-size:.75rem;
        line-height:1;
        position:absolute; bottom:50px;
        margin-left:2px;
        transform:rotate(90deg);
        opacity:0;
        animation:scrollAniText 2s 0s infinite;
    }
    @keyframes scrollAni{
        0% { opacity:0; bottom:50px;}
        20% { opacity:1; background-color:var(--secondary-color);}
        50% { opacity:1;}
        80% { opacity:1; background-color:#fff;}
        100% { opacity:0; bottom:-50px;}
    }
    @keyframes scrollAniText{
        0% { opacity:0; bottom:50px;}
        20% { opacity:1; color:var(--secondary-color);}
        50% { opacity:1;}
        80% { opacity:1; color:#fff;}
        100% { opacity:0; bottom:-50px;}
    }
@media screen and (max-width:1024px){
    .please__scroll{
        left:auto; right:40px;
    }
}
@media screen and (max-width:820px) and (orientation:portrait){/* iPad Air and Portrait */
    .please__scroll{
        left:15px;
        /* margin-top:-20px; */
    }
        .please__scroll span{
            font-size:.75rem;
        }
}

/*-------------------------------------------
Common
-------------------------------------------*/
.home__title{
    margin-top:0; margin-bottom:.85em;
    background:var(--gradient-color);
    font-size:3rem;
    font-family:var(--title-font-family);
    font-weight:700;
    line-height:1;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}
    .home__title span{
        display:inline-block;
        position:relative;
    }
        .home__title span::after{
            content:"";
            display:block;
            background:var(--gradient-color2);
            height:2px;
            width:100%;
            margin:10px auto 0;
            
        }
.btn-more{
    font-size:1rem;
    line-height:1;
    padding:.6em 1em .5em;
}
@media screen and (max-width:1024px){
    .home__title{
        font-size:2.5rem;
    }
}
@media screen and (max-width:992px){
    .home__title{
        text-align:center;
    }
}
@media screen and (max-width:768px){

}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .home__title{
        font-size:8vw;
    }
}

/*-------------------------------------------
News
-------------------------------------------*/
.news-container{
    background-color:var(--primary-color);
    /* background:var(--linear-gradient); */
    position:relative; top:-50px; z-index:2;
    padding:40px 30px 45px;
    box-shadow:0 -5px 12px rgba(0,0,0,.1);
}
    .news-container .home__title{
        color:#fff;
        -webkit-text-fill-color:#fff;
    }
        .news-container .home__title::after{
            margin-left:0;
        }
    .news-list{
        list-style:none;
        margin:0;
        padding:0;
    }
        .news__item{
            display:flex;
            margin-bottom:20px;
        }
        .news__item:nth-of-type(n+6){
            display:none;
        }
        .news__item:last-of-type{
            margin-bottom:0;
        }
            .news__date{
                width:150px;
                color:#fff;
                line-height:18px;
                opacity:.7;
                padding-right:20px;
                white-space:nowrap;
            }
            .news__title{
                flex:1;
                font-size:1.125rem;
                line-height:18px;
                position:relative;
                padding-left:26px;
            }
                .news__link{
                    display:inline-block;
                    color:#fff;
                    transition:.2s;
                }
                .news__link:focus,
                .news__link:hover{
                    color:#fff;
                    opacity:.65;
                }
                .sticky .news__link{
                    font-weight:700;
                }
                    .sticky .news__link::before{
                        display:inline-block;
                        content:"";
                        aspect-ratio:1 / 1;
                        background:url(../images/icon-star.svg) 50% 50% no-repeat;
                        background-size:contain;
                        width:20px;
                        position:absolute; left:0;
                        margin-top:-2px;
                    }
    .news-container .btn-more{
        position:absolute; top:40px; right:30px;
        color:var(--primary-color);
        background-color:#fff;
    }
@media screen and (max-width:992px){
    .news-container{
        top:-30px;
        margin:0 auto;
    }
}
@media screen and (max-width:768px){
    .news__item{
        flex-wrap:wrap;
    }
    .news__item:last-of-type{
        margin-bottom:15px;
    }
        .news__date{
            width:100%;
            font-size:.875rem;
            padding:0 0 5px;
        }
        .news__title{
            padding-left:0;
        }
            .news__link{
                line-height:1.3;
            }
                .sticky .news__link::before{
                    margin:1px 0 0 -22px;
                }
    .news-container .btn-more{
        position:static;
        margin-top:10px;
    }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .news-container{
        padding:35px 30px 40px;
    }
        .news__link{
            font-size:1rem;
        }
            .sticky .news__link::before{
                margin-top:-1px;
            }
}

/*-------------------------------------------
Info Container
-------------------------------------------*/
.info-container{
    padding:30px 30px 80px;
    display:flex;
    flex-wrap:wrap;
}
    .aside-container{
        width:40%;
        padding-left:5%;
    }
@media screen and (max-width:992px){
    .info-container{
        padding-left:20px; padding-right:20px;
    }
        .aside-container{
            width:100%;
            margin-bottom:80px;
            padding-left:0;
        }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .info-container{
        padding-left:0; padding-right:0;
    }
}
@media screen and (max-width:320px){/* i5, SE */
    .info-container{
        padding-left:10px; padding-right:10px;
    }
}

/*-------------------------------------------
Welcome Message
-------------------------------------------*/
.welcome-container{
    width:60%;
    min-height:200px;
    padding-right:40px;
}
    .welcome-container .home__title::after{
        margin-left:0;
    }
    .welcome__content{
        background-color:#f7f7f7;
        min-height:11em;
    }
        .welcome__content p{
            line-height:1.7;
        }
    .welcome-container .btn-more{
        margin-top:10px;
    }
@media screen and (max-width:992px){
    .welcome-container{
        order:1;
        width:100%;
        padding-right:0;
    }
}
@media screen and (max-width:768px){
    .welcome-container{
        
    }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .welcome-container p{
        
    }
}

/*-------------------------------------------
Important Date
-------------------------------------------*/
.date-container{
    position:relative;
}
    .date-container .home__title::after{
        margin-left:0;
    }
    .important-date{
        list-style:none;
        margin:0;
        padding:0;
        display:flex;
        flex-wrap:wrap;
    }
        .important-date__item{
            width:100%;
            border-bottom:1px solid #ddd;
            font-size:1.25rem;
            line-height:1;
            padding:0 0 15px 38px;
            margin-bottom:15px;
            position:relative;
            overflow:hidden;
        }
        .important-date__item:nth-child(1){
            /* background-color:var(--primary-color); */
        }
        .important-date__item:nth-child(2){
            /* background-color:var(--primary-color); */
        }
        .important-date__item:nth-child(3){
            /* background-color:#D8AEB2; */
        }
            .important-date__item::before{
                content:"";
                display:block;
                background:url(../images/icon-date.svg) no-repeat 0 0;
                background-size:contain;
                aspect-ratio:1 / 1;
                height:32px;
                position:absolute; top:-4px; left:0;
                /* transform:translateY(-50%); */
                /* opacity:.2; */
                pointer-events:none;
            }
            .important-date__item time{
                display:block;
                color:var(--primary-color);
                font-size:1.75rem;
                line-height:1;
                margin-bottom:5px;
            }
@media screen and (max-width:1280px){/* Air Mac */
    .important-date__item{
        font-size:1.125rem;
    }
        .important-date__item time{
            font-size:1.5rem;
        }
}
@media screen and (max-width:992px){
     .important-date__item{
        width:33.3333%;
    }
}
@media screen and (max-width:768px){
    .important-date__item{
        flex-basis:50%;
    }
    .important-date__item:first-of-type{
        flex-basis:100%;
    }
        .important-date__item time{
            font-size:1.5rem;
        }
}
@media screen and (max-width:576px){
    .important-date__item,
    .important-date__item:first-of-type{
        flex-basis:100%;
    }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .important-date__item{
        font-size:5vw;
    }
        .important-date__item time{
            font-size:6.5vw;
        }
}

/*-------------------------------------------
Download
-------------------------------------------*/
.download-container{
    position:relative;
}
    .download-list{
        list-style:none;
        margin:0;
        padding:0;
        font-size:1.75rem;
        line-height:1.2;
    }
        .download__item{
            color:#fff;
            position:relative;
            text-align:center;
            margin-bottom:10px;
        }
            .download__item a{
                display:flex;
                background-color:var(--primary-color);
                border-radius:5px;
                color:#fff;
                height:100%;
                justify-content:center;
                align-items:center;
                padding:40px 15px;
                position:relative; z-index:2;
                outline:none;
            }
            .download__item:nth-child(1) a{
                background-color:#eb8a2a;
            }
            .download__item:nth-child(2) a{
                background-color:#D44A87;
            }
            .download__item:nth-child(3) a{
                background-color:#7853BE;
            }
            .download__item a[href="#"]{
                background-color:#e3e3e3 !Important;
                pointer-events:none;
            }
                .download__item a strong{
                    position:relative; z-index:2;
                }
                .download__item a::before{
                    content:"";
                    display:block;
                    background:url(../images/icon-download-white.svg) no-repeat 0 0;
                    background-size:contain;
                    aspect-ratio:1 / 1;
                    height:70%;
                    position:absolute; top:15%; left:-18px;
                    opacity:.3;
                    pointer-events:none;
                }
                .download__item a::after{
                    content:"";
                    display:block;
                    background-color:#000;
                    position:absolute; top:0; left:0; z-index:0;
                    width:100%;
                    height:100%;
                    opacity:0;
                    transition:.3s;
                }
                .download__item a:focus::after,
                .download__item a:hover::after{
                    opacity:.15;
                }
@media screen and (max-width:992px){
    .download-list{
        display:flex;
        margin:-10px;
        font-size:1.25rem;
    }
        .download__item{
            flex:1;
            padding:10px;
        }
            .download__item a{
                padding:30px 10px;
            }
}
@media screen and (max-width:768px){
    .download-list{
        margin:-5px;
    }
        .download__item{
            padding:5px;
        }
            .download__item a{
                padding:40px 10px;
            }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .download-list{
        flex-wrap:wrap;
        margin:0;
    }
        .download__item{
            flex-basis:100%;
            padding:0;
        }
            .download__item a{
                padding:30px 10px;
            }
}

/*-------------------------------------------
Shortcut Buttons
-------------------------------------------*/
.shortcut-buttons{
    background:var(--primary-color);
    background:-moz-linear-gradient(left, var(--gradient-start-color) 0%, var(--gradient-end-color) 100%);
    background:-webkit-gradient(left top, right top, color-stop(0%, var(--gradient-start-color)), color-stop(100%, var(--gradient-end-color)));
    background:-webkit-linear-gradient(left, var(--gradient-start-color) 0%, var(--gradient-end-color) 100%);
    background:-o-linear-gradient(left, var(--gradient-start-color) 0%, var(--gradient-end-color) 100%);
    background:-ms-linear-gradient(left, var(--gradient-start-color) 0%, var(--gradient-end-color) 100%);
    background:linear-gradient(to right, var(--gradient-start-color) 0%, var(--gradient-end-color) 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='var(--gradient-start-color)', endColorstr='var(--gradient-end-color)', GradientType=1 );
    position:relative;
    padding:80px 0;
}
    .shortcut-buttons::before{
        content:"";
        display:block;
        background-size:cover;
        position:absolute; top:0; left:0;
        width:100%;
        height:100%;
        opacity:.4;
        pointer-events:none;
    }
    .shortcut-list{
        list-style:none;
        margin:0 -15px;
        padding:0;
        display:flex;
        flex-wrap:wrap;
    }
        .shortcut__item{
            width:25%;
            padding:15px;
            text-align:center;
        }
            .shortcut__link{
                display:block;
                margin:0 auto;
                border-radius:5px;
                background-color:#fff;
                padding:30px;
                color:#111;
                font-size:1.5rem;
                font-weight:700;
                line-height:64px;
                white-space:nowrap;
                transition:.2s;
            }
            .shortcut-list:hover .shortcut__link,
            .shortcut-list:focus-within .shortcut__link{
                opacity:.65;
            }
            .shortcut-list:hover .shortcut__link:focus,
            .shortcut-list .shortcut__link:focus,
            .shortcut-list:hover .shortcut__link:hover{
                opacity:1;
            }
                .shortcut__link::before{
                    display:inline-block;
                    vertical-align:top;
                    content:"";
                    aspect-ratio:1 / 1;
                    width:64px;
                    background-position:50% 50%;
                    background-repeat:no-repeat;
                    background-size:contain;
                    margin-right:5px;
                }
                .shortcut__item:nth-child(1) .shortcut__link::before{
                    background-image:url(../images/icon-speakers.svg);
                }
                .shortcut__item:nth-child(2) .shortcut__link::before{
                    background-image:url(../images/icon-program.svg);
                }
                .shortcut__item:nth-child(3) .shortcut__link::before{
                    background-image:url(../images/icon-eposter.svg);
                }
                .shortcut__item:nth-child(4) .shortcut__link::before{
                    background-image:url(../images/icon-submission.svg);
                }
@media screen and (max-width:1280px){/* Air Mac */
    .shortcut__link{
        font-size:1.25rem;
        line-height:48px;
    }
        .shortcut__link::before{
            width:48px;
        }
}
@media screen and (max-width:1024px){
    .shortcut-list{
        margin:0 -10px;
    }
        .shortcut__item{
            padding:0 10px;
        }
}
@media screen and (max-width:992px){
    .shortcut-buttons{
        padding:60px 0;
    }
        .shortcut-list{
            margin:0 -10px;
        }
            .shortcut__item{
                padding:0 10px;
            }
                .shortcut__link{
                    line-height:1.2;
                    padding:20px 10px;
                }
                    .shortcut__link::before{
                        display:block;
                        margin:0 auto 5px;
                    }
}
@media screen and (max-width:667px){/* i6, i7, i8 Landscape */
    .shortcut__item{
        width:50%;
        padding:10px;
    }
}
@media screen and (max-width:576px){
    .shortcut__link{
        
    }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .shortcut-buttons{
        padding:50px 0;
    }
        .shortcut__link{
            font-size:4.5vw;
        }
            .shortcut__link::before{
                width:14vw;
            }
}

/*-------------------------------------------
Organized by
-------------------------------------------*/
.organized-by-container{
    background-color:#fff;
}

/*-------------------------------------------
Banners
-------------------------------------------*/
#banners{
    background-color:#f1f1f1;
}

/*-------------------------------------------
Participate
-------------------------------------------*/
.participate{
    background-color:rgba(var(--primary-rgb),.04);
    padding:80px 0;
    position:relative;
    overflow:hidden;
}
    .participate__bg{
        position:absolute; top:0; left:0;
        width:100%;
        height:100%;
        overflow:hidden;
    }
        .participate__bg::before,
        .participate__bg::after{
            content:"";
            display:block;
            background-color:var(--primary-color);
            -webkit-mask-repeat:no-repeat;
            -webkit-mask-position:center center;
            -webkit-mask-size:contain;
                    mask-repeat:no-repeat;
                    mask-position:center center;
                    mask-size:contain;
            aspect-ratio:1 / 1;
            width:400px;
            position:absolute; z-index:0;
            transform:rotate(-10deg);
            opacity:.08;
            pointer-events:none;
        }
        .participate__bg::before{
            -webkit-mask-image:url(../images/icon-mail_white.svg);
                    mask-image:url(../images/icon-mail_white.svg);
            bottom:-30%;
        }
        .participate__bg::after{
            -webkit-mask-image:url(../images/icon-at_white.svg);
                    mask-image:url(../images/icon-at_white.svg);
            top:-30%; right:0;
        }
    .participate__inner{
        position:relative; z-index:3;
        text-align:center;
    }
        .participate__desc{
            color:#111;
            font-size:1.25rem; font-weight:700;
            line-height:1.3;
            padding-bottom:15px;
        }
        .participate__inner form{
            position:relative;
            width:400px;
            margin:0 auto;
            text-align:left;
        }
            .participate__inner .form__row{
                margin-bottom:8px;
                position:relative;
            }
                .participate__inner [type="text"]{
                    margin:0;
                }
                .participate__inner [type="submit"]{
                    font-size: 1.125rem;
                    margin:0;
                    padding: 12px 10px;
                }
@media screen and (max-width:1440px){
    .participate__bg::before{
        left:-5%;
    }
    .participate__bg::after{
        right:-4%;
    }
}
@media screen and (max-width:1024px){
    .participate__bg::before,
    .participate__bg::after{
        width:300px;
    }
    .participate__bg::before{
        bottom:-13%;
    }
    .participate__bg::after{
        top:-13%;
    }
}
@media screen and (max-width:768px){
    .participate__bg::before,
    .participate__bg::after{
        width:200px;
    }
    .participate__bg::before{
        left:-8%; bottom:-20%;
    }
    .participate__bg::after{
        right:-8%; top:-20%;
    }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .participate{
        padding:50px 0;
    }
        .participate__desc{
            font-size:4.7vw;
            text-align:left;
        }
        .participate__inner form{
            width:100%;
        }
}

/*-------------------------------------------
Place
-------------------------------------------*/
.place{
    background-color:var(--primary-color);
    padding:var(--section-py) 0;
    position:relative;
    color:#fff;
}
    .place::before{
        content:"";
        display:block;
        background:url(../images/congress_venue.jpg) center/cover no-repeat;
        opacity:.2;
        position:absolute; top:0; left:0; z-index:0;
        height:100%;
        width:100%;
        pointer-events:none;
    }
    .place::after{
        content:"";
        display:block;
        background:url(../images/hero_bg_texture.png) center/contain;
        opacity:.3;
        position:absolute; top:0; left:0; z-index:1;
        height:100%;
        width:100%;
        pointer-events:none;
    }
    .place__inner{
        position:relative; z-index:2;
    }
        .place .home__title{
            color:#fff;
            -webkit-text-fill-color:#fff;
            text-align:center;
        }
        .place p{
            font-size:1.5rem;
            text-align:center;
        }
            .place a{
                display:inline-block;
                color:#fff;
                outline:0;
            }
            .place a:focus,
            .place a:hover{
                opacity:.65;
            }
                .place a::before{
                    display:inline-block;
                    aspect-ratio:1;
                    content:"";
                    background:url(../images/icon_gmap.png) no-repeat center / contain;
                    width:32px;
                    margin-right:3px;
                    vertical-align:-.15em;
                }
@media screen and (max-width:768px){
    .place p span{
        display:block;
    }
        .place a::before{
            display:block;
            margin:0 auto 3px;
            vertical-align:middle;
        }
}
@media screen and (max-width:440px){/* i16-17 Pro Max */
    .place p{
        font-size:5vw;
    }
}