@charset "utf-8";
/*===========================================
Homepage
===========================================*/

/*-------------------------------------------
common
-------------------------------------------*/
.itemblock{
    position:relative;
    background-color:#fff;
    padding:25px;
    border-radius:5px;
    box-shadow:0 5px 12px rgba(0,0,0,.1);
    overflow:hidden;
    -webkit-transition:.3s;transition:.3s;
}
    .itemblock::before{
        display:block;
        content:"";
        width:153px; height:147px;
        background-position:50% 50%;
        background-repeat:no-repeat;
        background-size:153px 147px;
        position:absolute; right:-50px; bottom:0; z-index:0;
    }
    .homeTitle{
        margin:0 0 25px;
        color:#000;
        font-size:1.5rem; line-height:1; font-weight:400;
    }
@media screen and (max-width:440px){/* i16 Pro Max */
    .itemblock{
        padding:25px 20px;
    }
}
@media screen and (max-width:360px){/* i12 Mini */
    .itemblock{
        padding:20px 15px;
    }
        .homeTitle{
            font-size:1.25rem;
        }
}

/*-------------------------------------------
sp buttons
-------------------------------------------*/
.spButtons{
    display:none;
}
@media screen and (max-width:992px){
    .spButtons{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        display:-webkit-flex;
        flex-wrap:wrap;
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        padding-bottom:20px;
    }
        .spButtonItem{
            -webkit-flex:1 0 25%; /* Safari 6.1+ */
            -ms-flex:1 0 25%; /* IE 10 */ 
            flex:1 0 25%;
            padding:0 5px 10px;
            text-align:center;
        }
            .spButtonItem a{
                position:relative;
                display:block;
                background-color:#fff;
                border-radius:5px;
                min-width:48px;
                color:#000;
                padding:10px 5px;
                box-shadow:0 5px 12px rgba(0,0,0,.1);
                -webkit-transition:.2s;    transition:.2s;
            }
                .spButtonItem .icon{
                    position:relative;
                    display:block;
                    width:100%;
                    height:48px;
                    background-position:50% 50%;
                    background-repeat:no-repeat;
                    background-size:48px 48px;
                    margin-bottom:5px;
                    -webkit-transition:.2s;    transition:.2s;
                }
                .spButtonItem a:hover .icon{
                    
                }
                .spNews .icon{background-image:url(../images/menu_icon-news@2x.png);}
                .spProgram .icon{background-image:url(../images/menu_icon-program@2x.png);}
                .spLive .icon{background-image:url(../images/menu_icon-live@2x.png);}
                .spFloorPlan .icon{background-image:url(../images/menu_icon-floorplan@2x.png);}
                .spTraffic .icon{background-image:url(../images/menu_icon-traffic@2x.png);}
                .spAccommodation .icon{background-image:url(../images/menu_icon-hotel@2x.png);}
                .spWebLinks .icon{background-image:url(../images/menu_icon-webLinks@2x.png);}
                .spAbstract .icon{background-image:url(../images/menu_icon-contribute@2x.png);}
                .spSubmission .icon{background-image:url(../images/menu_icon-search@2x.png);}
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .spButtonItem{
        -webkit-flex:1 0 33.3333%; /* Safari 6.1+ */
        -ms-flex:1 0 33.3333%; /* IE 10 */ 
        flex:1 0 33.3333%;
    }
}
@media screen and (max-width:375px){/* i6,i7,i8 */
    .spButtonItem a{
        font-size:.875rem;
    }
}

/*-------------------------------------------
news
-------------------------------------------*/
#news{
    float:left;
    width:50%;
    padding:0 30px 0 0;
}
    #news .itemblock{
        min-height:300px;
    }
        #news .itemblock::before{
            background-image:url(../images/bg_home-news.png);
        }
        #news .btnMore{
            color:#666;
            font-size:.875rem;
            position:absolute; top:25px; right:25px; z-index:2;
        }
        #news .btnMore:hover{
            color:#005aff;
        }
        .newsList{
            list-style:none;
            margin:0;
            padding:0;
        }
            .newsItem{
                border-bottom:2px dotted #ddd;
                position:relative;
                padding:15px 0; padding-left:70px;
                line-height:1.4;
            }
            .newsItem:nth-child(1){
                padding-top:0;
            }
            .newsItem:nth-child(n+6){
                display:none;
            }
                .newsLink{
                    color:#000;
                }
                .newsLink:hover{
                    color:#005aff;
                }
                    .newsPostDate{
                        color:#ec1616;
                        font-size:.75rem;
                        position:absolute; left:0;
                    }
@media screen and (max-width:992px){
    #news{
        width:100%;
        padding:0;
    }
        #news .itemblock{
            min-height:auto;
        }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .newsItem{
        padding-left:0;
    }
        .newsPostDate{
            display:block;
            position:static;
            padding-bottom:3px;
            font-size:.875rem;
        }
}

/*-------------------------------------------
side information
-------------------------------------------*/
.sideInfo{
    float:right;
    width:50%;
    padding:0 0 0 30px;
}
@media screen and (max-width:992px){
    .sideInfo{
        width:100%;
        padding:30px 0 0;
    }
}

/*-------------------------------------------
program
-------------------------------------------*/
#programInfo{
    margin-top:0;
}
    #programInfo .itemblock::before{
        background-image:url(../images/bg_home-program.png);
    }
    .btnProgram,
    .btnDownload{
        background-color:#ec1616;
        white-space:nowrap;
        line-height:24px;
        padding:12px 20px;
        z-index:2;
    }
    .btnProgram{
        /* width:30%; */
    }
    .btnDownload{
        float:right;
        width:65%;
        font-size:.875rem;
    }
        .btnDownload::before{
            display:inline-block;
            vertical-align:top;
            content:"";
            width:24px; height:24px;
            background:url(../images/icon-download.svg) no-repeat 0 -1px;
            background-size:24px 24px;
            margin-right:5px;
        }
@media screen and (max-width:440px){/* i16 Pro Max */
    .btnProgram,
    .btnDownload{
        width:100%;
        font-size:1rem;
    }
    .btnDownload{
        margin-top:10px;
    }
}
@media screen and (max-width:320px){/* i5, SE */
    .btnDownload{
        font-size:.875rem;
    }
}

/*-------------------------------------------
important date
-------------------------------------------*/
#importantDate{
    margin-top:30px;
    color:#ec1616;
}
    #importantDate .itemblock::before{
        background-image:url(../images/bg_home-date.png);
    }
    .deadline{
        font-size:1.5rem; font-weight:700;
        display:block;
    }
    .btnSubmission{
        background-color:#3cad04;
        font-size:1.125rem; line-height:24px;
        padding:12px 25px;
        position:absolute; right:25px; bottom:25px; z-index:2;
    }
@media screen and (max-width:1024px){
    .deadline{
        font-size:1.25rem;
    }
}
@media screen and (max-width:440px){/* i16 Pro Max */
    .deadline{
        font-size:6vw;
    }
    .btnSubmission{
        position:relative; right:auto; bottom:auto;
        margin-top:10px;
        width:100%;
    }
}

/*-------------------------------------------
venue
-------------------------------------------*/
#venueContainer{
    position:relative; z-index:2;
    height:257px;
    background:url(../images/bg_home-map.png?v=20251125) no-repeat 50% 50%;
    background-size:auto 257px;
    /* overflow-x:hidden; */
}
    .venueInfo{
        background:url(../images/home_venue-pic.png) no-repeat 50% 50%;
        background-size:331px auto;
        width:331px;
        height:319px;
        position:absolute; top:-60px; left:15px;
        transition:.2s;
    }
    .venueLink:hover .venueInfo{
        transform:rotate(2deg);
    }
        .venueInfo p{
            margin:0;
            color:#777;
            font-size:.875rem; line-height:1.4;
            transform:rotate(-4deg);
            position:absolute; left:35px; bottom:30px;
        }
            .venueInfo strong{
                color:#333;
                font-size:1.125rem;
            }
    .venuePin{
        display:inline-block;
        background:url(../images/icon-location-red.svg) no-repeat 0 0;
        background-size:auto 54px;
        height:54px;
        color:#111;
        font-weight:700;
        line-height:1;
        --text-shadow-color:#fff;
        text-shadow:1px 0 var(--text-shadow-color), 1px 1px var(--text-shadow-color), 0 1px var(--text-shadow-color), -1px 1px var(--text-shadow-color), -1px 0 var(--text-shadow-color), -1px -1px var(--text-shadow-color), 0 2px 5px rgba(0,0,0,.4);
        padding:22px 0 0 36px;
        position:absolute; top:90px; left:50%;
        margin-left:112px;
    }
        .venuePin a{
            display:inline-block;
            color:#111;
        }
        .venuePin a:focus,
        .venuePin a:hover{
            color:#005aff;
        }
@media screen and (max-width:440px){/* i16 Pro Max */
    #venueContainer{
        overflow:hidden;
        background-position:calc(50% - 60px) 50%;
    }
        .venueInfo{
            transform-origin:left center;
            transform:scale(.75);
            top:-35px; left:-10px;
        }
        .venuePin{
            font-size:.875rem;
            margin-left:45px;
            padding-right:1em;
        }
}
@media screen and (max-width:375px){/* i6,i7,i8,iX,XS */
    #venueContainer{
        background-position:calc(50% - 80px) 50%;
    }
        .venueInfo{
            transform:scale(.7);
        }
        .venuePin{
            font-size:.875rem;
            margin-left:40px;
            padding-left:0;
        }
}
@media screen and (max-width:320px){/* i5, SE */
    .venueInfo{
        transform:scale(.6);
    }
    .venuePin{
        margin-left:30px;
    }
}