@charset "utf-8";

/*隱藏SchemaDIV*/
.boxhide {display: none;}
.boxhide p {margin: 0;padding: 0;}
/*==========================單欄網頁內容==================*/
.conmain {width: 100%;height: auto;margin: 0;padding: 40px 42px;border-radius: 5px;background-color: #FFF;overflow: hidden;}
.conmain .title {margin: 0 0 10px 0;padding: 0;font-size: 2em;font-weight: normal;color: #213040;}
.conmain .title i {color: #00aaaa;}
.conmain .title h1 {display: none;}
/*選單切換*/
.conmain-menu {clear: both;margin: 0 0 30px 0;padding: 0;width: 100%;border-bottom: 1px solid #58d5dd;text-align: right;}
.conmain-menu ul {margin: 0;padding: 0;width: 100%;}
.conmain-menu li {display: inline-block;margin: 0 4px 0 0;padding: 0;width: 120px;height: 40px;border-radius: 5px 5px 0 0;font-size: 1.1em;color: #FFF;background-color: #00aaaa;text-align: center;}
.conmain-menu li a {display: block;width: 120px;height: 40px;line-height: 40px;text-decoration: none;color: #FFF;}
/*影音專區首頁大影片*/
.conmain .media-box {margin: 0;padding: 0;width: 100%;overflow: hidden;}
.conmain .media-box-youtube {float: left;margin: 0;padding: 0;width: 640px;height: 360px;}
.conmain .media-box-youtube iframe {height: 360px;}
.conmain .media-box-info {float: right;margin: 0;padding: 15px;width: 300px;height: 360px;overflow: hidden;border: 1px solid #eaf2f2;}
.conmain .media-box-info .htag {margin: 0;padding: 0;font-size: 1.1em;color: #ff9600;}
.conmain .media-box-info .htag a {color: #ff9600;text-decoration: none;}
.conmain .media-box-info h1 {margin: 0;padding: 15px 0;font-size: 1.4em;color: #00aaaa;}
.conmain .media-box-info h3 {margin: ;padding: 0;font-size: 16px;color: #15202d;line-height: 1.6;font-weight: normal;}
.conmain .media-box-info p {margin: 0;padding: 10px 0 0 0;font-size: 1em;color: #00bfcb;}
/*搜尋影音*/
.conmain .media-search {margin: 10px 0;padding: 0;width: 100%;}
.conmain .media-search div {padding: 10px 0;font-size: 1.2em;color: #213040;font-weight: bold;}
.conmain .media-search input,select,textarea {display: inline-block;margin: 0;padding: 0;outline: none;background-color: #FFF;vertical-align: middle;}
.conmain .media-search input,textarea {border-radius: 0;}
.conmain .media-search button {display: inline-block;}
.conmain .media-search .formstyle {width: 50%;height: 30px;border: 1px solid #CCC;font-family: Arial, Helvetica, "微軟正黑體", sans-serif;font-size: 14px;color: #333;}
.conmain .media-search .sumbit {appearance: none;-webkit-appearance: none;padding: 0;width: 10%;height: 30px;line-height: 30px;background-color: #213040;text-align: center;font-family: Arial, Helvetica, "微軟正黑體", sans-serif;font-size: 14px;color: #FFF;border: none;border-radius: 5px;cursor: pointer;}
/*搜尋影音結果標題*/
.conmain .media-result {font-size: 1.3em;color: #00aaaa;}

/*熱門影音*/
.conmain .media-htag {margin: 30px 0;padding: 20px 0;width: 100%;font-size: 1.1em;color: #213040;border: 1px dashed #CCCCCC;border-left: 0px;border-right: 0px;}
.conmain .media-htag a {margin: 0 5px 0 0;padding: 0;width: 100%;color: #f1501d;text-decoration: none;}
.conmain .media-htag a:hover {text-decoration: underline;}

/*影片列表*/
.conmain .media-list {margin: 0;padding: 0;width: 100%;display: flex;flex-wrap: wrap;}
.conmain .media-list dl {margin: 20px 1%;padding: 10px 0;border-bottom: 1px dashed #d1d7e7;width: 23%;display: flex;flex-flow:column;}
.conmain .media-list dl img {width: 100%;width: 100%;text-align: center;}
/*圖片尺寸預設215x121px*/
.conmain .media-list dl dt {margin: 0;padding: 5px 0;font-size: 16px;color: #00aaaa;flex-grow: 1;}
.conmain .media-list dl dt a {color: #00aaaa;text-decoration: none;}
.conmain .media-list dl dd.htag {margin:20px 0 5px 0;padding: 0;font-size: 1em;text-align:left;color: #ff9600;}
.conmain .media-list dl dd.htag a {text-decoration: none;color: #ff9600;}
.conmain .media-list dl dd.htag a:hover {text-decoration: underline;color: #ff9600;}
.conmain .media-list dl dd.text {margin: 0;padding: 0;font-size: 1em;text-align: center;color: #4a617a;text-align: left;}

/*頁碼*/
.conmain .page {margin: 20px auto 0 auto;padding: 0;width: 100%;text-align: center;}
.conmain .page ul {margin: 0 auto;padding: 0;width: 100%;text-align: center;}
.conmain .page li {display: inline-block;font-size: 13px;color: #a9b1b1;}

/*頁碼在本頁的顯示狀態*/
.conmain .page li.in {margin: 0;padding: 5px;font-size: 13px;color: #FFF;border: 1px solid #4a617a;background-color: #4a617a;}
.conmain .page li.in a {font-size: 13px;color: #FFF;}
.conmain .page li a {text-decoration: none;margin: 0;padding: 5px;font-size: 13px;color: #4a617a;border: 1px solid #4a617a;}
.conmain .page li a:hover {color: #FFF;background-color: #4a617a;border: 1px solid #4a617a;}
.conmain .page li:first-child {margin: 0 5px 0 0;}
.conmain .page li:first-child a {margin: 0 -5px 0 0;text-decoration: none;font-size: 13px;color: #4a617a;border: 0px solid #4a617a;}
.conmain .page li:first-child a:hover {text-decoration: underline;font-size: 13px;color: #4a617a;border: 0px solid #4a617a;background-color: #FFF;}
.conmain .page li:last-child a {text-decoration: none;font-size: 13px;color: #4a617a;border: 0px solid #4a617a;}
.conmain .page li:last-child a:hover {text-decoration: underline;font-size: 13px;color: #4a617a;border: 0px solid #4a617a;background-color: #FFF;}

/*影音專區左欄----------------------------------------------------------------------*/
.conleft {margin: 0;padding: 40px;width: 780px;height: auto;overflow: hidden;float: left;background-color: #FFF;border-radius: 5px;}
/*影音專區-第二層標題*/
.conleft .conleft-highlight {margin: 0;padding: 0 0 20px 0;font-size: 1.4em;color: #213040;}
.conleft .conleft-highlight i {color: #00aaaa;}
/*影片標題+上傳時間*/
.conleft .conleft-info {margin: 0;padding: 0;width: 100%;overflow: hidden;border: 1px dashed #c7cfcf;border-left: 0px;border-right: 0px;}
.conleft .conleft-info-title{float: left;margin: 0;padding: 0;font-size: 1.6em;color: #00aaaa;font-weight: normal;}
.conleft .conleft-info-time {float: right;margin: 0;padding: 0;width: 20%;height: 50px;line-height: 50px;font-size: 1em;color: #4a617a;text-align: right;}
.conleft .conleft-vedio {margin: 20px 0;padding: 0;width: 100%;}
.conleft .conleft-vedio iframe {width: 100%;height: 360px;}

/*影片內容*/
.conleft .conleft-text {margin: 20px 0;padding: 0;width: 100%;overflow: hidden;}
.conleft .conleft-text p {margin: 0;padding: 0;font-size: 1.1em;line-height: 1.8;text-align: justify;color: #15202d;}
/*預留連結版位*/
.conleft .conleft-exlink {margin: 0;padding: 20px;width: 100%;font-size: 1em;color: #999;text-align: center;border: 1px dashed #c2cfcf;}
.conleft .conleft-exlink a {padding: 0 5px;font-size: 1.1em;color: #f0501d;}
.conleft .conleft-exlink a:hover {text-decoration: none;}
/*社群回應*/
.conleft .conleft-social {margin: 40px 0 0 0;padding: 0;width: 100%;}
.conleft .conleft-social .title {font-size: 1.5em;color: #00aaaa;}
/*右欄的廣告區---------------------*/
.conright {margin: 0;padding: 0;width: 230px;height: auto;float: right;}
.conright-bn01 {margin: 0 0 15px 0;width: 230px;height: 230px;background-color: #FFF;}
.conright-bn02 {display: block;margin: 20px auto;width: 230px;height: 120px;background-color: #FFF;}
/*相關影片*/
.conright-vedio {margin: 0 0 15px 0;padding: 0;width: 230px;height: auto;overflow: hidden;background-color: #FFF;border-radius: 5px;}
.conright-vedio h2 {display: block;padding: 10px 0;margin: 0;width: 230px;font-size: 1.2em;font-weight: normal;text-align: center;border-radius: 5px 5px 0 0;background-color: #6a8be4;color: #FFF;}
.conright-vedio .box {padding: 15px 0 0 0;border-top-width: 0px;}
.conright-vedio dl {margin: 0;padding: 0 20px 15px 20px;width: 100%;/*實際寬190px*/}
.conright-vedio dl img {margin: 0;width: 190px;height: 107px;/*190x107縮放*/background-color: #CCC;}
.conright-vedio dl dt {text-align: center;font-size: 1.1em;line-height: 1.6;color: #556fb5;}
.conright-vedio dl dt a {color: #556fb5;}
.conright-vedio dl dd {line-height: 1.6;text-align: center;color: #4a617a;}
/*==============================================行動裝置選單(手機)========================================*/
@media screen and (max-width:1024px) {
/*單欄網頁內容-------------------------------------------------------------*/
    .conmain {width: 100%;height: auto;margin: 0;padding: 0 10px 20px 10px;border-radius: 0px;background-color: #FFF;}
    .conmain .title {margin: 0;padding: 0;font-size: 1.6em;font-weight: normal;color: #213040;}
    .conmain .title i {color: #00aaaa;}
    .conmain .title h1 {display: none;}
    /*選單切換*/
    .conmain-menu {clear: both;margin: 10px 0;padding: 0;width: 100%;border-bottom: 1px solid #00aaaa;text-align: left;}
    .conmain-menu ul {margin: 0;padding: 0;width: 100%;}
    .conmain-menu li {display: inline-block;margin: 0 4px 0 0;padding: 0;width: 95px;height: 40px;border-radius: 5px 5px 0 0;font-size: 1em;color: #FFF;background-color: #00aaaa;text-align: center;}
    .conmain-menu li a {display: block;width: 95px;height: 40px;line-height: 40px;text-decoration: none;color: #FFF;}
    /*影音專區首頁大影片*/
    .conmain .media-box {margin: 0;padding: 0;width: 100%;overflow: hidden;}
    .conmain .media-box-youtube {float: none;margin: 0;padding: 0;width: 100%;height: auto;}
    .conmain .media-box-youtube iframe {height: auto;}
    .conmain .media-box-info {float: none;margin: 0;padding: 15px;width: 100%;height: auto;overflow: hidden;border: 1px solid #eaf2f2;}
    .conmain .media-box-info .htag {margin: 0;padding: 0;font-size: 1.1em;color: #F90;}
    .conmain .media-box-info .htag a {color: #F90;text-decoration: none;}
    .conmain .media-box-info h1 {margin: 10px 0;padding: 10px 0;font-size: 1.3em;color: #00bfcb;}
    .conmain .media-box-info h3 {margin: 10px 0;padding: 0;font-size: 15px;color: #15202d;line-height: 1.5;font-weight: normal;}
    .conmain .media-box-info p {margin: 0;padding: 0;font-size: 14px;color: #00bfcb;}
    /*搜尋影音*/
    .conmain .media-search {margin: 10px 0;padding: 0;width: 100%;}
    .conmain .media-search div {padding: 10px 0;font-size: 1.2em;color: #213040;font-weight: bold;}
    .conmain .media-search input,
    select,
    textarea {display: inline-block;margin: 0;padding: 0;outline: none;background-color: #FFF;vertical-align: middle;}
    .conmain .media-search input,
    textarea {border-radius: 0;}
    .conmain .media-search button {display: inline-block;}
    .conmain .media-search .formstyle {width: 80%;height: 30px;border: 1px solid #CCC;font-size: 14px;font-family: Arial, Helvetica, "微軟正黑體", sans-serif;color: #333;}
    .conmain .media-search .sumbit {appearance: none;-webkit-appearance: none;padding: 0;width: 15%;height: 30px;line-height: 30px;background-color: #213040;text-align: center;font-size: 14px;color: #FFF;border: none;border-radius: 5px;font-family: Arial, Helvetica, "微軟正黑體", sans-serif;}
    /*搜尋影音-篩選考試標題*/
    .conmain .media-tagresult {margin: 0 0 10px 0;padding: 0;font-size: 1.3em;color: #213040;}
    .conmain .media-tagresult span {color: #f1501d;}
    /*搜尋影音結果標題*/
    .conmain .media-result {font-size: 1.1em;color: #00aaaa;}
    /*熱門影音*/
    .conmain .media-htag {margin: 20px 0;padding: 10px 0;width: 100%;font-size: 15px;color: #213040;border: 1px dashed #CCC;border-left: 0px;border-right: 0px;}
    .conmain .media-htag a {margin: 0 5px 0 0;padding: 0;width: 100%;color: #f2511e;text-decoration: none;}
    .conmain .media-htag a:hover {text-decoration: underline;}
    /*影片列表*/
    .conmain .media-list {margin: 0;padding: 0;width: 100%;overflow: hidden;}
    .conmain .media-list dl {margin: 10px 2%;padding: 0;width:46%;border-bottom: 1px dashed #d1d7e7;}
    .conmain .media-list dl dd.htag {margin:10px 0;}

    /*頁碼*/
    .conmain .page {margin: 20px auto 0 auto;padding: 0;width: 100%;text-align: center;}
    .conmain .page ul {margin: 0 auto;padding: 0;width: 100%;text-align: center;}
    .conmain .page li {display: inline-block;}
    /*頁碼在本頁的顯示狀態*/
    .conmain .page li.in {margin: 0;padding: 5px;font-size: 13px;color: #FFF;border: 1px solid #4a617a;background-color: #4a617a;}
    .conmain .page li.in a {font-size: 13px;color: #FFF;}
    .conmain .page li a {text-decoration: none;margin: 0;padding: 5px;font-size: 13px;color: #4a617a;border: 1px solid #4a617a;}
    .conmain .page li a:hover {color: #FFF;background-color: #4a617a;border: 1px solid #4a617a;}
    .conmain .page li:first-child {margin: 0 5px 0 0;}
    .conmain .page li:first-child a {margin: 0 -5px 0 0;text-decoration: none;font-size: 13px;color: #4a617a;border: 0px solid #4a617a;}
    .conmain .page li:first-child a:hover {text-decoration: underline;font-size: 13px;color: #4a617a;border: 0px solid #4a617a;background-color: #FFF;}
    .conmain .page li:last-child a {text-decoration: none;font-size: 13px;color: #4a617a;border: 0px solid #4a617a;}
    .conmain .page li:last-child a:hover {text-decoration: underline;font-size: 13px;color: #4a617a;border: 0px solid #4a617a;background-color: #FFF;}


    /*影音專區左欄-------------------------------------------*/
    .conleft {margin: 0;padding: 0 10px 20px 10px;width: 100%;height: auto;overflow: hidden;float: none;background-color: #FFF;border-radius: 5px;}
    /*影音專區-第二層標題*/
    .conleft .conleft-highlight {margin: 0;padding: 0 0 20px 0;font-size: 1.3em;color: #213040;}
    .conleft .conleft-highlight i {color: #00aaaa;}
    /*影片標題+上傳時間*/
    .conleft .conleft-info {margin: 0;padding: 10px 0 5px 0;width: 100%;overflow: hidden;border: 1px dashed #c7cfcf;border-left: 0px;border-right: 0px;}
    .conleft .conleft-info-title{float: none;margin: 0;padding: 0;width: 100%;height: auto;line-height: 1.5;font-size: 1.4em;color: #00aaaa;}
    .conleft .conleft-info-time {float: none;margin: 0;padding: 0;width: 100%;height: 30px;line-height: 30px;font-size: 14px;color: #4a617a;text-align: left;}
    .conleft .conleft-vedio {margin: 20px 0;padding: 0;width: 100%;height: auto;}
    .conleft .conleft-vedio iframe {width: 100%;height: auto;}
    /*影片內容*/
    .conleft .conleft-text {margin: 20px 0;padding: 0;width: 100%;overflow: hidden;}
    .conleft .conleft-text p {margin: 0;padding: 0;font-size: 1em;line-height: 1.6;text-align: justify;color: #15202d;}
    /*預留連結版位*/
    .conleft .conleft-exlink {margin: 0;padding: 20px;width: 100%;font-size: 1em;color: #999;text-align: center;border: 1px dashed #c2cfcf;}
    .conleft .conleft-exlink a {padding: 0 5px;font-size: 1em;color: #f0501d;}
    .conleft .conleft-exlink a:hover {text-decoration: none;}
    /*社群回應*/
    .conleft .conleft-social {margin: 20px 0;padding: 0;width: 100%;}
    .conleft .conleft-social .title {font-size: 1.3em;color: #556fb5;}
    /*廣告右側欄----------------------------------------------------------*/
    .conright {margin: 0 auto;padding: 0;width: 100%;height: auto;float: none;}
    .conright-bn01 {margin: 20px auto;width: 230px;height: 230px;background-color: #CCC;}
    .conright-bn02 {display: none;margin: 20px auto;width: 230px;height: 120px;background-color: #CCC;}
    /*相關經驗談*/
    .conright-vedio {margin: 0;padding: 0 10px 20px 10px;width: 100%;height: auto;overflow: hidden;background-color: #FFF;border-radius: 5px;}
    .conright-vedio h2 {display: block;padding: 10px 0;margin: 0;width: 100%;font-size: 1.2em;font-weight: normal;text-align: center;border-radius: 5px 5px 0 0;background-color: #6a8be4;color: #FFF;}
    .conright-vedio .box {padding: 15px 0 0 0;border-top-width: 0px;}
    .conright-vedio dl {margin: 0 0 15px 0;padding: 0;width: 100%;text-align: center;}
    .conright-vedio dl img {margin: 0;width: 100%;height: auto;max-width: 215px;background-color: #CCC;}
    .conright-vedio dl dt {font-size: 1.1em;line-height: 1.8;color: #556fb5;}
    .conright-vedio dl dt a {color: #556fb5;}
    .conright-vedio dl dd {line-height: 1.6;}
}