﻿html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;-webkit-text-rendering:optimizeLegibility;-moz-text-rendering:optimizeLegibility;-ms-text-rendering:optimizeLegibility;-o-text-rendering:optimizeLegibility;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased;-ms-font-smoothing:antialiased;-o-font-smoothing:antialiased;font-smoothing:antialiased}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;font-size:2rem;margin:.67rem 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
html{height:100%;}
html, button, input, select, textarea {color:#333;}
body{font-size:23px; color:#666; font-weight:400;
	font-family: "微軟正黑體", "Microsoft JhengHei", "Microsoft JhengHei UI", 'Droid Sans', 'Noto Sans TC', "Nanum Gothic", "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "\5FAE\8F6F\96C5\9ED1", "微软雅黑体", "Microsoft YaHei", Arial, sans-serif;
	-webkit-font-smoothing:antialiased;
	height:auto!important;min-height:100%;height:100%;
	background-color:#fff;
	overflow-x:hidden;
}
*{box-sizing:border-box;-webkit-box-sizing:border-box;}

/* 反白 */
::-moz-selection{background:#bce8ff; color:#000; text-shadow:none;}
::selection {background:#bce8ff; color:#000; text-shadow:none;}

/* font-family */
@import url(https://fonts.googleapis.com/css?family=Archivo+Black);
@font-face {
    /*圓體*/
    font-family: 'cwTeXYen';
    src:url(//fonts.gstatic.com/ea/cwtexyen/v3/cwTeXYen-zhonly.eot);
    src:url(//fonts.gstatic.com/ea/cwtexyen/v3/cwTeXYen-zhonly.eot?#iefix) format('embedded-opentype'),
        url(//fonts.gstatic.com/ea/cwtexyen/v3/cwTeXYen-zhonly.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/cwtexyen/v3/cwTeXYen-zhonly.woff) format('woff'),
        url(//fonts.gstatic.com/ea/cwtexyen/v3/cwTeXYen-zhonly.ttf) format('truetype');
}

/* 設置提示文字顏色 */
::-webkit-input-placeholder{color:#aaa;}
::-moz-placeholder{color:#aaa;}
:-ms-input-placeholder{color:#aaa;}
.placeholder{color:#aaa;}

hr{display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;}

/* 移除圖片底下間隙 */
img{vertical-align:middle; max-width:100%;}

/* 移除fieldset預設樣式 */
fieldset{border:0; margin:0; padding:0;}

/* 只允許文字區域垂直調整大小 */
textarea{resize:vertical;}

a{color:#009bee; text-decoration:none;}
a:hover, a:active, a:focus{outline:0; color:#009cff;}

.wrapper{
    width:100%; min-width:100%; max-width:100%;
    margin:0 auto;
    padding:0 20px;
    position:relative;
}

/*-----------------------------------------------------------------------------*/
h1.title a#soundBtn{/*音樂Btn*/
        display:inline-block;
        height:100%;
        padding:0 28px;
        box-shadow:0 1px 3px rgba(0, 0, 0, 0.05);
        position:absolute; right:56px; top:0;
    }
    h1.title a#soundBtn:hover{
        opacity:.85;
    }
        h1.title a#soundBtn.open{
            background:url('../images/icon_soundO.png') #00b3ff 50% 50% no-repeat;
        }
        h1.title a#soundBtn.close{
            background:url('../images/icon_soundX.png') #00b3ff 50% 50% no-repeat;
        }
h1.title a#goHome{/*HomeBtn*/
    display:inline-block;
    height:100%;
    padding:0 28px;
    box-shadow:0 1px 3px rgba(0, 0, 0, 0.05);
    position:absolute; right:0; top:0;
    background:url('../images/home.png?20180119') #4ecaff 50% 50% no-repeat;
}
ul.selectBox{
    margin:0;
    padding:0;
    list-style:none;
}
    ul.selectBox li{
        display:inline-block;
        width:24%;
    }
        ul.selectBox li a{
            display:inline-block;
        }
        ul.selectBox li a:hover{
            opacity:.85;
        }
            ul.selectBox li a img{
                width:160px;
                border-radius:5px;
            }
#resultBox{
    /*border-top:1px solid #ddd;
    padding:20px 0 0;
    margin-top:25px;*/
    font-size:20px;
}
    div.resultAnswers{
        display:none;
        padding:10px 0;
        /*border-bottom:1px solid #ddd;*/
        font-size: 20px;
    }
    a#nextQABtn,
    a#okBtn{
        display:inline-block;
        padding:10px 20px;
        margin-top:20px;
        background-color:#019cdf;
        color:#fff;
        border-radius:5px;
    }
 
#footer{
    font-size:15px;
    text-align:center;
    margin:25px 0 0;
    padding:20px 10px;
    border-top:1px solid #ddd;
}
    #footer #language select{
        font-size:15px;
        color:#666;
        border-radius:5px;
        padding:2px 6px;
    }
    #footer a#soundBtn{
        display:inline-block;
        padding:22px 25px;
        border-radius:5px;
        background:url('../images/icon_soundO.png') #ddd 50% 50% no-repeat;
        margin-bottom:15px;
        box-shadow:0 1px 3px rgba(0, 0, 0, 0.05);
    }
    #footer a#soundBtn:hover{
        opacity:.85;
    }
        #footer a#soundBtn.close{
            background:url('../images/icon_soundX.png') #ddd 50% 50% no-repeat;
        }

/*-----------------------------------------------------------
    Media Device Size
-----------------------------------------------------------*/
/* i pad - landscape */
@media screen and (max-width:1024px){
}
/* i pad*/
@media screen and (max-width:768px){
}
/* iX - landscape */
@media screen and (max-width:812px){
}
/* i6 Plus - landscape */
@media screen and (max-width:736px){
    /*h1.title a#soundBtn{
        right:58px;
        padding:0 27px;
    }*/
}
/* i6 - landscape */
@media screen and (max-width:667px){
}
/* i5 - landscape */
@media screen and (max-width:568px){
}
/* i6 Plus */
@media screen and (max-width:414px){
}
/* i6 */
@media screen and (max-width:375px){
}
/* i5 */
@media screen and (max-width:320px){
}