@charset "UTF-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:700}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
/*--- (e)normalize.css v8.0.1 ---*/

:root{
    --primary-color:#009def;
    --primary-light-color:#b8f2ff;
    --link-color:#009def;
    --hover-color:#0042ff;
}
body{
    margin:0;
    padding:0;
    background-color:#222;
    color:#666;
    font-size:16px;
    line-height:1.75rem;
    font-family:'Asap Condensed', "Microsoft JhengHei", "Helvetica Neue", "Helvetica", "微軟正黑體", Arial, sans-serif;
    text-shadow:0 .3px .3px rgba(0,0,0,.08);
    font-display:swap;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    image-rendering:-webkit-optimize-contrast;
    position:relative;
    word-wrap:break-word;
    word-break:break-word;
    padding-top:env(safe-area-inset-top);
    overflow-x:hidden;
}
*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

hr{display:block; height:1px; border:0; border-top:1px solid #ccc; margin:2em 0; padding:0;}

a{color:var(--link-color); text-decoration:none; }
a:hover, a:active, a:focus{color:var(--hover-color);}

.wrapper{
    width:1000px; min-width:1000px;
    height:100%;
    margin:0 auto; 
    position:relative;
    /*box-shadow:inset 0 0 1px rgba(0,0,0,.9);*/
}

/*-------------------------------------------
Header
-------------------------------------------*/
#headerContainer{
    position:relative;
    width:100%;
    height:300px;
    background-image:url(../images/home_header_pic_2.jpg?v=20220606);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:50% 50%;
    transition:3s;
}
    #headerContainer::before{
        content:"";
        display:block;
        position:absolute; top:0; right:0; bottom:0; left:0;
        background-color:var(--primary-color);
        opacity:.3;
    }
    #headerContainer header{
        display:flex;
        align-items:center;
        justify-content:center;
        height:100%;
        position:relative; z-index:1;
    }
        #headerContainer .headerWrapper{
            padding-top:100px;
            text-align:center;
        }
            #headerContainer .heading{
                color:#fff;
                transition:.2s;
                position:relative;
            }
                #headerContainer .heading .meetintTitle{
                    margin:0 0 15px;
                    font-size:1.65rem;
                    line-height:1;
                    text-shadow:0 3px 8px rgba(0,0,0,.2);
                }
                    #headerContainer .heading .meetintTitle sup{
                        font-size:65%;
                    }
                    #headerContainer .heading .meetintTitle br:first-of-type{
                        display:none;
                    }
                #headerContainer .heading .meetingTopic{
                    margin:10px 0;
                    font-size:2.5rem;
                    text-shadow:0 3px 8px rgba(0,0,0,.2);
                }
                #headerContainer .heading .meetingDate,
                #headerContainer .heading .meetingVenue{
                    font-size:1.25rem; font-weight:400;
                    color:var(--primary-light-color);
                    text-shadow:0 1px 5px rgba(0,0,0,.2);
                }
                    #headerContainer .heading .meetingVenue .btn{
                        display:none;
                    }
/*-------------------------------------------
Nav
-------------------------------------------*/
#menuContainer{
    position:absolute; top:0; right:0; z-index:90;
    width:100%;
    height:95px;
    transition:.2s;
}
#menuContainer.active{
    /* 內頁狀態 */
}
    #menuContainer::before{
        content:"";
        display:block;
        background:rgba(0,0,0,0.4);
        background:-moz-linear-gradient(top, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
        background:-webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.4)), color-stop(100%, rgba(0,0,0,0)));
        background:-webkit-linear-gradient(top, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
        background:-o-linear-gradient(top, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
        background:-ms-linear-gradient(top, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
        background:linear-gradient(to bottom, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
        filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
        position:absolute; top:0; left:0;
        width:100%;
        height:100%;
        opacity:.6;
    }
    #menuContainer.active::before{
        opacity:1;
    }
    #menuHeader{
        border-bottom:1px solid rgba(255,255,255,.2);
        list-style:none;
        margin:0 auto;
        padding:0;
        position:absolute; top:5px; right:0;
        display:flex;
    }
        #menuHeader > li{
            flex:1;
            position:relative;
            color:#fff;
            line-height:1;
            transition:.2s;
            white-space:nowrap;
        }
        #menuHeader > li:nth-child(n+2){
            padding-left:30px;
        }
            #menuHeader > li > a{
                display:inline-block;
                color:#fff;
                padding:10px 0;
                transition:.2s;
            }
            #menuHeader > li a:hover{
                opacity:.65;
            }
                #menuHeader > li a::before{
                    display:inline-block;
                    font-family:'Material Icons Round';
                    font-size:1.25rem;
                    vertical-align:top;
                    margin:-2px 4px 0 0;
                }
                #menuHeader > li .btnLogin::before{
                    content:'\e7fd';
                }
                #menuHeader > li .btnContact:before{
                    content:'\e158';
                }
                #menuHeader > li .btnTmaso:before{
                    content:'\e895';
                }
        /*--- Logined ---*/
        #menuHeader > li.logined{
            
        }
            #menuHeader > li .name{
                opacity:.7;
            }
            #menuHeader > li .btnAccount{
                
            }
                #menuHeader > li .btnAccount:before{
                    content:'\e8a6';
                }
            #menuHeader > li .btnLogout{
                background-color:rgba(0,0,0,.2);
                border-radius:5px;
                margin-left:5px;
                padding:5px 10px;
            }
                #menuHeader > li .btnLogout:before{
                    content:'\e9ba';
                }
    #menu{
        list-style:none;
        margin:0 auto;
        padding:0;
        position:absolute; left:0; right:0; bottom:0;
        display:flex;
        justify-content:space-between;
        border-bottom:1px solid rgba(255,255,255,.6);
    }
        #menu > li{
            flex:1 1 auto;
            position:relative;
            transition:.2s;
            text-align:center;
        }
            #menu > li > a{
                display:block;
                color:#fff;
                font-size:1.25rem;
                line-height:50px;
                position:relative; z-index:10;
                transition:.2s;
                white-space:nowrap;
            }
            #menu > li:hover > a{
                opacity:.65;
            }
            #menu > li > a::after{
                display:inline-block;
                font-family:'Material Icons Round';
                content:'\e5cf';
                font-size:.875rem;
                line-height:1;
                position:absolute; bottom:0; left:calc(50% - 0.5em);
            }
            #menu > li > .nav-home::after,
            #menu > li > .nav-abstract::after,
            #menu > li > .nav-register::after,
            #menu > li > .nav-sponsors::after{
                display:none;
            }
/*-------------------------------------------
Nav Sub
-------------------------------------------*/
#menu .sub{
    list-style:none;
    margin:0; padding:0;
    position:absolute; top:100%; left:0;
    min-width:100%;
    background-color:#fff;
    box-shadow:0 8px 20px rgba(0,0,0,.2);
    display:none;
}
#menu li:hover .sub{
    display:block;
    animation-duration:.3s;
}
    #menu .sub li{
        box-shadow:0 1px 0 rgba(0,0,0,.1);
        line-height:1.3;
        text-align:left;
    }
    #menu .sub li:last-child{
        box-shadow:none;
    }
        #menu .sub li a{
            display:block;
            padding:15px; padding-right:30px;
            color:#000;
            font-size:1.125rem;
            white-space:nowrap;
            transition:.1s;
        }
        #menu .sub li a:hover{
            background-color:var(--primary-color);
            color:#fff;
        }
        #menu .sub li a::after{
            display:inline-block;
            font-family:'Material Icons Round';
            content:'\e5cc';
            color:var(--primary-color);
            position:absolute; right:10px;
            margin-top:1px;
        }
        #menu .sub li a:hover::after{
            color:#111;
        }
        #menu .sub li a[href|='#']{
            background-color:transparent;
            cursor:default;
            pointer-events:none;
            opacity:.4;
        }
        #menu .sub li a[target='_blank']{
            padding-right:40px;
        }
        #menu .sub li a[target='_blank']::after{
            display:inline-block;
            font-family:'Material Icons Round';
            content:'\e895';
            color:var(--primary-color);
            position:absolute; right:10px;
            margin-top:1px;
        }
        #menu .sub li a[target='_blank']:hover::after{
            color:#111;
        }

/*-------------------------------------------
Container
-------------------------------------------*/
#contentContainer{
    background-color:#fff;
    height:auto!important;min-height:400px;height:400px;
    padding:70px 0;
}
    #pageHeader{
        position:relative; z-index:2;
        text-align:center;
        padding-bottom:40px;
    }
        #pageHeader .pageTitle{
            margin:0;
            display:inline-block;
            color:#111;
            font-size:2.5rem; font-weight:700;
            line-height:1;
            position:relative;
        }
            #pageHeader .pageTitle::after{
                content:"";
                display:block;
                background-color:var(--primary-light-color);
                border-radius:3px;
                margin:15px auto;
                height:10px;
                width:calc(100% + 20px);
                position:absolute; top:15px; left:-10px; z-index:-1;
            }
    #contentContainer #mainContent{
        position:relative; z-index:0;
        height:auto!important;min-height:250px;height:250px;
        font-size:1.125rem;
        line-height:1.5;
        padding:0 20px;
    }
        #contentContainer .partTitle{
            color:var(--primary-color);
            font-size:2rem;
            line-height:1;
            padding-bottom:10px;
            border-bottom:2px solid #ddd;
        }
        #contentContainer .partTitle:nth-of-type(1){
            margin-top:0;
        }
            #contentContainer .partTitle .material-icons-round{
                vertical-align:top;
                margin-right:8px;
                font-size:30px; line-height:26px;
            }

/*-------------------------------------------
Clearfix: contain floats
-------------------------------------------*/
.clearfix:before, .clearfix:after{
    content:""; /* 1 */
    display:block; /* 2 */
}
.clearfix:after{clear: both;}
/* For IE 6/7 only */
.clearfix{*zoom: 1;}

/*-------------------------------------------
Common
-------------------------------------------*/
.floatL{float:left;}
.floatR{float:right;}
.hidden{display:none;}
.pcHidden{display:none;}
.explanation{color:#C60; font-weight:400; font-size:14px; padding:3px 0;}
.required{color:#f00 !important; font-weight:normal;}
.paddingNone{padding:0;}
.important{color:#f00 !important;}
#twzipcode{display:inline-block; vertical-align:top;}
#twzipcode div{float:left;}
.zipcode{width:70px;}
.col-noneData{padding:0 !important;}
.noneData{color:#333; text-align:center; clear:both; padding:15px; background-color:#fdf8ea;}

/*-------------------------------------------
Input, Select, Textarea
-------------------------------------------*/
[type=text],
[type=password],
[type=email],
[type=date],
select,
textarea{
    -webkit-appearance:none; appearance:none;
    background-color:#fff;
    border:1px solid #bbb;
    font-size:16px;
    line-height:1;
    min-height:40px;
    margin:0; 
    padding:8px 10px;
    transition:.2s;
}
select{
    padding:8px 25px 8px 10px;
    background-image:url(../images/select_arrow.svg);
    background-repeat:no-repeat;
    background-position:right center;
    background-size:24px auto;
    box-shadow:0 1px 5px rgba(0,0,0,.2);
    vertical-align:top;
}
select::-ms-expand{
    display:none;
}
textarea{
    width:100%;
    resize:vertical;
}
input.datepicker,
input.date{
    background-image:url(../images/icon_date.svg);
    background-size:24px auto;
    background-position:right 5px center;
    background-repeat:no-repeat;
    width:120px;
}
[type=text]:focus,
[type=password]:focus,
[type=email]:focus,
[type=date]:focus,
select:focus,
textarea:focus{
    outline:0;
    background-color:#ebf9fe;
    border:1px solid var(--primary-color); 
}
/*-------------------------------------------
Radio, Checkbox
-------------------------------------------*/
[type=radio],
[type=checkbox]{
    vertical-align:-1px; margin:0 3px;
}
[type=radio],
[type=checkbox]{
    display:none;
}
[type=radio] + label{
    display:inline-block;
    /* line-height:40px; */
    background-image:url(../images/icon-radio.svg);
    background-repeat:no-repeat;
    background-position:0 50%;
    background-size:24px auto;
    padding-left:26px; padding-right:5px;
    transition:.1s;
    vertical-align:top;
}
[type=radio]:checked + label{
    background-image:url(../images/icon-radio-checked.svg);
}
[type=radio]:disabled + label{
    opacity:.4;
}
[type=checkbox] + label{
    display:inline-block;
    /* line-height:40px; */
    background-image:url(../images/icon-checkbox.svg);
    background-repeat:no-repeat;
    background-position:0 50%;
    background-size:24px auto;
    padding-left:28px;padding-right:15px;
    transition:.1s;
    vertical-align:top;
}
[type=checkbox]:checked + label{
    background-image:url(../images/icon-checkbox-checked.svg);
}
[type=checkbox]:disabled + label{
    opacity:.4;
}

/*-------------------------------------------
Buttons
-------------------------------------------*/
[type=submit], [type=button], [type=reset],
.btn, .field-file{
    display:inline-block;
    -webkit-appearance:none; appearance:none;
    cursor:pointer; 
    color:#fff;
    font-size:16px; font-weight:700;
    line-height:1;
    background-color:var(--primary-color);
    border:none;
    box-shadow:0 2px 10px rgba(0,0,0,.3);
    min-height:40px;
    padding:10px 15px;
    border-radius:5px;
    transition:.2s;
    outline:none;
    vertical-align:top;
    text-align:center;
    text-decoration:none;
}
[type=submit]:hover, [type=button]:hover, [type=reset]:hover,
.btn:hover, .field-file:hover,
[type=submit]:focus, [type=button]:focus, [type=reset]:focus,
.btn:focus, .field-file:focus{
    text-decoration:none;
    color:#000 !important;
    background-color:var(--primary-color);
    border-color:var(--primary-color);
    box-shadow:0 0 0 rgba(0,0,0,0), inset 0 2px 2px rgba(0,0,0,.3);
}
.btnSecondary{
    background-color:#9fa6b3;
    font-weight:400;
}
.btnDel{
    background-color:#df2626;
    font-weight:400;
}
.btnSmall{
    font-size:.875rem;
}

.buttons{
    text-align:center; 
    margin:30px 0 0; 
    position:relative;
}
    .buttons [type=submit], .buttons [type=button], .buttons [type=reset],
    .buttons .btn{
        padding:15px 30px; 
        font-size:20px; line-height:1;
        margin-left:10px; margin-right:10px;
    }

/*-------------------------------------------
table List
-------------------------------------------*/
.tableList{
    border-collapse:collapse;
    /* box-shadow:0 1px 5px rgba(0,0,0,.2); */
}
    .tableList thead th{
        background-color:rgba(100%,100%,100%,.4);
        border-bottom:2px solid rgba(0,0,0,.4);
        font-size:16px; line-height:1;
        color:#111;
    }
    .tableList th, .tableList td{
        padding:8px;
        border-bottom:1px solid #e1e1e1;
    }
    .tableList tbody th{
        background-color:rgba(100%,100%,100%,.7);
    }
    .tableList tbody td{
        background-color:#fff;
        border-left:1px solid #e1e1e1;
    }
    .tableList tbody td:nth-child(1){
        border-left:0;
    }
        .tableList .btnDel{
            padding:6px;
        }
            .tableList .btn .material-icons-round{
                vertical-align:top;
                font-size:24px;
            }
/*-------------------------------------------
table content
-------------------------------------------*/
.tableContent{
    border-collapse:collapse;
}
    .tableContent th, .tableContent td{
        padding:8px 12px;
    }
    .tableContent th{
        text-align:right;
        color:#111;
        background-color:rgba(100%,100%,100%,.4);
        border-bottom:1px solid rgba(0,0,0,.1);
        border-right:1px solid rgba(0,0,0,.1);
    }
    .tableContent tr:nth-child(1) th{
        border-top:1px solid rgba(0,0,0,.1);
    }
    .tableContent tr:nth-child(1) td{
        border-top:1px solid #e1e1e1;
    }
    .tableContent td{
        background-color:#fff;
        border-bottom:1px solid #e1e1e1;
    }
    .tableContent .before{
        font-size:.875rem;
        color:green;
    }
    .tableContent .after{
        font-size:.875rem;
        color:red;
    }
    .tableContent .required{
        margin:0 3px;
    }

/*-------------------------------------------
Files Format
-------------------------------------------*/
.fileFormat a{
    display:inline-block;
    background-image:url(../images/icon_file.svg);
    background-repeat:no-repeat;
    background-position:0 0;
    padding-left:24px;
    margin:2px 0;
    line-height:18px;
    transition:.1s;
}
.fileFormat a:hover{
    
}
.fileFormat a[href *='.pdf']{background-image:url(../images/icon_file_pdf.svg);}
.fileFormat a[href *='.xls']{background-image:url(../images/icon_file_excel.svg);}
.fileFormat a[href *='.doc']{background-image:url(../images/icon_file_word.svg);}
.fileFormat a[href *='.ppt']{background-image:url(../images/icon_file_powerpoint.svg);}
.fileFormat a[href *='.jpg'], .fileFormat a[href *='.png']{background-image:url(../images/icon_file_img.svg);}
.fileFormat a[href *='.gif']{background-image:url(../images/icon_file_gif.svg);}
.fileFormat a[href *='.rar']{background-image:url(../images/icon_file_rar.svg);}
.fileFormat a[href *='.zip']{background-image:url(../images/icon_file_zip.svg);}

/*-------------------------------------------
Alert Information
-------------------------------------------*/
.alertInfo{
    background:#fdf8ea; 
    border-radius:5px;
    font-size:1.25rem;
    color:#000;
    text-align:center;
    padding:15px 15px 20px;
    margin:10px 0 20px;
}
.alertInfo.alertOnly{
    padding:40px 20px;
}
    .alertInfo a{
        color:var(--link-color);
    }
    .alertInfo .btn{
        padding:5px 10px;
    }
    .alertInfo .material-icons-round{
        background-color:#fff;
        width:80px; height:80px;
        line-height:80px;
        font-size:48px;
        border-radius:50%;
        margin-bottom:10px;
        box-shadow: 0 0 0 2px rgba(0%,0%,0%,.05);
    }
    .alertInfo h1,
    .alertInfo h2,
    .alertInfo h3,
    .alertInfo h4{
        margin:0;
    }


/*-------------------------------------------
Shortcut Buttons
-------------------------------------------*/
#shortcutButtons{
    display:none;
}
/*-------------------------------------------
Footer
-------------------------------------------*/
footer{
    background-color:#222;
    color:#fff;
    font-size:.875rem;
    line-height:1;
    margin:0 auto 0;
    padding:35px 0;
    position:relative;
    text-align:center;
}
    footer .orgLogo{
        height:60px;
        background:url(../images/footer_logo@2x.png) no-repeat 50% 50%;
        background-size:60px 60px;
    }
    footer .contactInfo{
        font-size:1.125rem;
        color:#fff;
        margin-top:15px;
    }
        footer .contactInfo span{
            color:var(--primary-color);
        }
    footer .copyright{
        margin-top:20px;
        opacity:.8;
    }
    footer .recommend{
        margin-top:10px;
        opacity:.4;
    }
    footer .huaweb{
        display:block;
        color:#000; 
        margin-top:5px;
    }

/*-------------------------------------------
Scroll Up
-------------------------------------------*/
.scrollUp{
    width:40px; height:40px; 
    border-radius:50%;
    position:fixed; bottom:45px; right:3%; z-index:50;
    background-color:#fff;
    background-size:40px auto;
    box-shadow:0 5px 20px rgba(0,0,0,.2);
    display:none;
}
    .scrollUp span{
        display:block;
        width:0; height:0; font-size:1;
        overflow:hidden;
    }
    .scrollUp::after{
        display:block;
        font-family:'Material Icons Round';
        color:var(--primary-color);
        content:"\f1e0";
        font-size:1.5rem;
        position:absolute; top:0; left:0; right:0;
        text-align:center;
        line-height:40px;
    }
