@charset "utf-8";
/* CSS Document */

/*----------------------------------------------------------------------*/
/*共用區塊*/
.IndexBlock{ max-width:1280px; margin:auto;}
.indexTitle h3{ font-weight:normal; }

/*動畫在一起*/
.IndexTopNews .info_box .img, .IndexExamForm .btn_list li a,.IndexExamForm .btn_list li a::after, .btn a,
.IndexCareer .btn_box a, .IndexProposition .btn_box a, .IndexNewsletter .right_col .list-box li a,.list_publish_box .item .img-box .tt
, .list_publish_box .item .img-box a img, .list_publish_box .item .img-box a, .list_publish_box .item .img-box a:hover .tt, .IndexLinks .list-box li a img{
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/*----------------------------------------------------------------------*/
/* IndexCenter */
/*----------------------------------------------------------------------*/
/* 焦點訊息 */
.IndexTopNews::after{ content:''; display:block; clear:both; }
.IndexTopNews > div{
    width:100%;
    max-width:1100px; 
    margin:auto;
    padding:15px 4rem;
    position:relative;
    box-shadow:0 5px 10px rgba(0,0,0,0.1);
    background-color:#fff; 

    -webkit-border-radius:120px;
    -moz-border-radius:120px;
    border-radius:120px; 
}
.IndexTopNews > div::before, .IndexTopNews > div::after{
    content:''; display:block; width:15px; height:15px; position:absolute;
    box-shadow: 2px 3px 10px rgba(0,0,0,0.3) inset;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%; 
}
.IndexTopNews > div::before{ top:50%; left:25px; margin-top:-7px; }
.IndexTopNews > div::after{ top:50%; right:25px; margin-top:-7px; }

.IndexTopNews .indexTitle .text1{ color:#cf4747; }
.IndexTopNews .indexTitle .text2{ color:#545454; } 
.IndexTopNews .info_box{overflow: hidden; padding:5px;}
.IndexTopNews .info_box .img{
    border:4px solid #eaeaea;
    box-shadow:0 0 15px #eaeaea;
    overflow: hidden;
    position:relative;

    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}
.IndexTopNews .info_box .img a{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-indent: -10000px;
}
.IndexTopNews .info_box .img:hover{ opacity:0.7; }
.IndexTopNews .info_box .cont span{ width:100%; display:inline-block; position:relative; padding-left:15px; 
    margin-bottom:8px; line-height: 24px; color:#444;
}
.IndexTopNews .info_box .cont span::before{ content:''; display:inline-block; width:10px; height:10px;
    background-color:#cf4747; position:absolute; top:8px; left:0; 
}
.IndexTopNews .info_box .cont a{ line-height: 24px;}


/*----------------------------------------------------------------------*/
/* 最新訊息 */
.IndexNews::after{ background-image:url('../images/icon_news.png'); width:160px; height:160px; 
    position:absolute; bottom:10px; right:12px; opacity:0.6; background-repeat:no-repeat;
}
.IndexNews > div{
    background: #d18359 url('../images/bg5.jpg'); position:relative;
    -webkit-border-radius:15px;
    -moz-border-radius:15px;   
    border-radius:15px;  
}
.IndexNews > div::before, .IndexNews > div::after{ top:15px; 
    display: block; width: 20px; height: 20px;
    position: absolute; box-shadow: 2px 2px 6px rgba(0,0,0,0.3) inset;
    background-color:#f0f0ed; border:3px solid #9f5b37;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.IndexNews > div::before{ left:20px; }
.IndexNews > div::after{ right:20px; }
.IndexNews .indexTitle{ text-align:center; }
.IndexNews .indexTitle::before, .IndexNews .indexTitle::after{ width:10px; height:38px;
    background-color:#8a5639; border-radius:30px; position:absolute; top:-12px; z-index:99;
}
.IndexNews .indexTitle::before{ left:28px; }
.IndexNews .indexTitle::after{ right:28px; }
.IndexNews .indexTitle h3{ color: #fff; text-align: center; letter-spacing: 0.02em;
    display: inline-block; position: relative;  
}
.IndexNews .tabStyle{ max-width:900px; margin:auto; }
.IndexNews .tabStyle .tabs{ background-color:#efe5df; text-align:center;    
    -webkit-border-radius:5px;
    -moz-border-radius:5px;   
    border-radius:5px;
}
.IndexNews .tabStyle .tabs ul{ display:inline-block; }
.IndexNews .tabStyle .tabs ul li{ display:inline-block; margin-right:30px; }
.IndexNews .tabStyle .tabs ul li:last-child{ margin-right:0; }
.IndexNews .tabStyle .tabs ul li a{ color:#555555; font-weight:bold; 
    border-right:1px solid #999; padding-right: 30px;
}
.IndexNews .tabStyle .tabs ul li:last-child a{ border-right:0;  }
.IndexNews .tabStyle .tabs ul li.active a{ color:#c84a19; position:relative;}
.IndexNews .tabStyle .tabs ul li.active a::before, .tabStyle .tabs ul li.active a::after{
    content:''; 
    display:block;
    position:absolute;
    left:50%;
    margin-left:-25px;
    width: 0;
    height: 0;
    border-style: solid;
}
.IndexNews .tabStyle .tabs ul li.active a::before{ 
    bottom:-22px;
    z-index:99;
    border-width: 10px 10px 0 10px;
    border-color: #efe5df transparent transparent transparent;  
}
.IndexNews .tabStyle .tabs ul li.active a::after{
    display:none;
    bottom:-22px;
    border-width: 10px 10px 0 10px;
    border-color: #ad643c transparent transparent transparent;  
}
.IndexNews .cont_box li{ overflow:hidden; }
.IndexNews .cont_box .date{ color:#fff; font-size:0.938em;}
.IndexNews .cont_box .cont{ color:#fff; }
.IndexNews .cont_box .cont a{ display:block; width:100%; color:#fff; font-size:0.938em; line-height:22px;}
.IndexNews .cont_box .cont a:hover{ text-decoration:underline; }
.IndexNews .btn a{ border-color:#fff; color:#fff; }
.IndexNews .btn a:hover{ background-color:#fff; color:#333; border-color:#fff; }


/*----------------------------------------------------------------------*/
/* 年度考試簡章+英聽+學測+指考 */
.IndexMain > div{ background-color:#fff; box-shadow: 0 5px 10px rgba(0,0,0,0.1);
    -webkit-border-radius:15px;
    -moz-border-radius:15px;
    border-radius:15px; 
}

/* 年度考試簡章 */
.IndexExamForm{ 
    background-color:#4ac3cb; 
    -webkit-border-radius:15px;
    -moz-border-radius:15px;
    border-radius:15px; 
}

.IndexExamForm .indexTitle h3{ display:inline-block; color:#fff; letter-spacing:.02em; position:relative;}
.IndexExamForm .btn_list li{ display:inline-block; margin-right:15px; margin-bottom:15px; }
.IndexExamForm .btn_list li a{ display:block; padding:8px 20px 8px 15px; position:relative; background-color:#fff;
    box-shadow:4px 5px 0 rgba(0,0,0,0.15); font-size:0.938em; border: 2px solid #fff; box-sizing: border-box;
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    border-radius:50px;  
}
.IndexExamForm .btn_list li a::after{ content:''; display:block; 
    width: 5px;
    height: 5px;
    border-bottom: 1px solid #333;
    border-left: 1px solid #333;
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top:-2px;
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
    transform: rotate(225deg);
}
.IndexExamForm .btn_list li a:hover{ background-color:#f5f5d0; color:#0ca9b3; border-color: #f5f5d0; }
.IndexExamForm .btn_list li a:hover::after{ border-color:#0ca9b3; }

.IndexExamForm .btn_list .media_btn a{ background-color: #fff793; 
    border-color: #d1c424; padding-left: 15px; padding-right: 15px; color: #000; 
}
.IndexExamForm .btn_list .media_btn a::before{ content: "\f144"; display: inline-block; 
    font-family: 'Font Awesome 5 Pro'; font-weight: 900; font-size: 1.125em; vertical-align: baseline;
    margin-right: 3px; color:#df6108; 
}
.IndexExamForm .btn_list .media_btn a::after{ display: none; }
.IndexExamForm .btn_list .media_btn a:hover{ background-color:#df6108; color: #fff; border-color: #fff; }
.IndexExamForm .btn_list .media_btn a:hover::before{ color: #fff; }


/* 三個測驗大區塊 */
.IndexExamPoint{ width:100%; overflow:hidden; }
.IndexExamPoint::after{ content:''; display:block; clear:both;}
.IndexExamPoint .item{
    -webkit-border-radius:15px;
    -moz-border-radius:15px;
    border-radius:15px;   
}
.IndexExamPoint .item:nth-child(3n+3){margin-right:0;}
.IndexExamPoint .indexTitle{ border-top-left-radius:10px; border-top-right-radius:10px; }
.IndexExamPoint .indexTitle h3{ color:#fff; text-align:center;}
.IndexExamPoint .news-box{ 
    background-color:#f7f7f7; 
    border-style:solid; 
    border-left-width:3px;
    border-right-width:3px;
    border-top:0;  
}
.IndexExamPoint .news-box .title{ color:#444; }
.IndexExamPoint .news-box .date, .IndexExamPoint .news-box .cont{ font-size:0.875em; }
.IndexExamPoint .news-box .date{ color:#999; }
.IndexExamPoint .news-box .cont{ color:#333; width:100%; line-height:22px; }

.IndexExamPoint .info_box::after{ content:''; display:block; clear:both; }
.IndexExamPoint .media-wrap a{ width:100%; display:block; position:relative; 
    box-shadow:0 0 0 rgba(0,0,0,0.0);
}
.IndexExamPoint .media-wrap a:hover{ box-shadow:0 0 10px rgba(0,0,0,0.3); }
.IndexExamPoint .media-wrap a::after{ content:''; display:block; width:40px; height:40px;
  /*background-image:url('../images/icon_play.png'); background-repeat:no-repeat;  */
    position:absolute; top:50%; left:50%; margin-left:-20px; margin-top:-20px; background-size:contain;
}
.IndexExamPoint .media-wrap img{ width:100%; height:auto; 
    border:1px solid #f5f5f5;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;  
}
.IndexExamPoint .media-wrap iframe{ width:100%; height:100%; }
.IndexExamPoint .tag-list li a{ color:#fff; display:inline-block; margin-right:8px; position:relative; padding-left:12px;}
.IndexExamPoint .tag-list li a::before{ content:'#'; color:#ede5a4; margin-right:2px; position:absolute;
    top:2px; left:0;
}
.IndexExamPoint .tag-list li a:hover{ color:#fcf4b5; }


/* 高中英聽測驗 */
.listen_text{ background-color:#4da7e0; }
.listen_text .indexTitle { background-color:#006baf; }
.listen_text .news-box{ border-color:#4da7e0; }
.listen_text .news-box .cont a:hover{ color:#196dbc; }
.listen_text .btn a:hover{ border:1px solid #4da7e0; background-color:#4da7e0; color:#fff;}

/* 學科能力測驗 */
.subject_text{ background-color:#db7e89; }
.subject_text .indexTitle { background-color:#ca4757; }
.subject_text .news-box{ border-color:#db7e89; }
.subject_text .news-box .cont a:hover{ color:#c74252; }
.subject_text .btn a:hover{ border:1px solid #db7e89; background-color:#db7e89; color:#fff;}

/* 指定科目考試 */
.appoint_text{ background-color:#9281cb; }
.appoint_text .indexTitle { background-color:#715cb7; }
.appoint_text .news-box{ border-color:#9281cb; }
.appoint_text .news-box .cont a:hover{ color:#644cb4; }
.appoint_text .news-box .cont.line a{ text-decoration:underline; } 
.appoint_text .btn a:hover{ border:1px solid #9281cb; background-color:#9281cb; color:#fff;}


/*----------------------------------------------------------------------*/
/* 生涯輔導 + 素養命題 + 選才育才*/
.IndexMain2::after{ content:''; display:block; clear:both; }
.IndexMain2 .indexTitle { text-align:center; }
.IndexMain2 .indexTitle h3{ color:#fff; text-align:center; letter-spacing:0.02em; display:inline-block; position:relative;}
/*.IndexMain2 .indexTitle h3::before, .IndexMain2 .indexTitle h3::after{ content:''; display:block; 
    position:absolute; width:20px; height:2px; background-color:#f1f1f1; top:50%; margin-top:-1px;
}
.IndexMain2 .indexTitle h3::before{ left:-30px; }
.IndexMain2 .indexTitle h3::after{ right:-30px; }*/

.IndexMain2 .item {    
    -webkit-border-radius:15px;
    -moz-border-radius:15px;
    border-radius:15px; 
}
.IndexMain2 .item > div{overflow:hidden; }
.IndexMain2 .item .desc{ font-size:0.938em; letter-spacing:0.02em; line-height:24px; text-align:center; }
.IndexMain2 .item .btn_box a{ display:block; 
    text-align:center;
    color:#444; 
    width:100%;
    height:100%;
    -webkit-border-radius:15px;
    -moz-border-radius:15px;
    border-radius:15px; 
}
.IndexMain2 .item .btn_box a:hover{ background-color:#f5f5d0; }
.IndexMain2 .item .btn_box a img{ max-width:50px; height:auto; }
.IndexMain2 .item .btn_box a span{ display:block; font-family:'Noto Sans TC', "Microsoft JhengHei", "微軟正黑體", sans-serif; }

/* 生涯輔導 */
.IndexCareer{ background-color:#617bed; }
.IndexCareer .desc{ color:#cfd5f2; }
.IndexCareer .btn_box a{ background-color:#e5e8f7; }
.IndexCareer .btn_box a:hover span{ color:#3857df; }

/* 素養命題 */
.IndexProposition{ background-color:#38aa91; }
.IndexProposition .desc{ color:#bfeae1;}
.IndexProposition .btn_box a{ background-color:#e7f5f2; }
.IndexProposition .btn_box a:hover span{ color:#02886b; }

/* 選才育才 */
.IndexCultivate{ background-color:#d18359; }
.IndexCultivate .desc{ color:#fff; }
.IndexCultivate .btn_box a{ background-color:#efe5df; }
.IndexCultivate .btn_box a:hover span{ color:#d56326; }


/*----------------------------------------------------------------------*/
/*選才電子報*/
.IndexNewsletter::after{ content:''; display:block; clear:both; }
.IndexNewsletter > div{ 
    background-color:#fff; 
    box-shadow: 0 5px 10px rgba(0,0,0,0.1);
    overflow:hidden; 
    -webkit-border-radius:15px;
    -moz-border-radius:15px;
    border-radius:15px;
}
.IndexNewsletter .indexTitle h3{ color:#333; }
.IndexNewsletter .indexTitle img{ width:100%; height:auto; }

.IndexNewsletter .issue .img{ width:100%; }
.IndexNewsletter .left_col { margin-right:-1px; border-right:1px solid #e5e5e5;  }
.IndexNewsletter .left_col .issue .img img{ width:100%; height:auto; }
.IndexNewsletter .left_col .issue .list-box ul{ overflow:hidden; }

.IndexNewsletter .right_col{ border-left:1px solid #e5e5e5; }
.IndexNewsletter .right_col::after{ content:''; display:block; clear:both; }
.IndexNewsletter .right_col .desc{ color:#606060; font-size:0.875em; line-height:24px; }
.IndexNewsletter .right_col .list-box li a{
    position:relative; 
    display:inline-block;
    box-sizing:border-box;
    background-color:#db7e89;
    color:#fff;
    vertical-align:middle; 
    box-shadow: 4px 5px 0 rgba(0,0,0,0.12);
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    border-radius:50px;
}
.IndexNewsletter .right_col .list-box ul li a:hover{ opacity:0.85; }
.IndexNewsletter .right_col .list-box ul li a img{ max-width:35px; height:auto; vertical-align:middle; }


/*----------------------------------------------------------------------*/
/*熱門出版品*/
.IndexPublication{ background-image:url(../images/bg3.jpg); }
.IndexPublication > div{ max-width:1280px; margin:auto; }
.IndexPublication .indexTitle h3{ color:#505050; }
.IndexPublication .indexTitle .item li{ display:inline-block; }
.IndexPublication .indexTitle .item li:last-child{ margin-right:0; }
.IndexPublication .indexTitle .item li a{ color:#444; position:relative; 
     font-family:'Noto Sans TC', "Microsoft JhengHei", "黑體-繁", 'Arial',  sans-serif; 
 }
.IndexPublication .indexTitle .item li a img{ width:15px; height:auto; margin-left:3px; }

.list_publish_box .item{ text-align:center; }
.list_publish_box .item .img-box a{ display:block; width:100%; height:100%; overflow:hidden; }
.list_publish_box .item .img-box a .tt{
    position:relative;
    z-index:99; 
    display:inline-block; 
    font-size:0.938em; 
    color:#fff; 
    background-color:#cf4747;
    padding:5px 8px;
    margin-top:-15px;
    margin-bottom:10px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
 }
.list_publish_box .item .img-box a img{ margin:auto; }
.list_publish_box .item .img-box a:hover .tt{ box-shadow:0 0 20px rgba(0,0,0,0.2); }
.list_publish_box .item .img-box a:hover img{  box-shadow:0 0 20px rgba(0,0,0,0.2); }
.list_publish_box .item .img-box img{ width:auto; }
.list_publish_box .item .img-box .cont{ color:#000; font-size:0.938em; line-height:24px; letter-spacing:0.02em; }


.list_publish_box .owl-carousel .owl-nav .owl-prev, .list_publish_box .owl-carousel .owl-nav .owl-next{ 
    position:absolute;
    top:50%;
    margin-top:-16px;
    background-image:url("../images/arrow_slider.png");
    background-repeat:no-repeat;
    width:18px;
    height:32px;
    text-indent:-99999px;
}
.list_publish_box .owl-carousel .owl-nav .owl-prev{ left:0; background-position:0 0;}
.list_publish_box .owl-carousel .owl-nav .owl-next{ right:0; background-position:-40px 0;}


.IndexPublication .btn{ text-align:center; }
.IndexPublication .btn a{ border-color: #cf4747; background-color:#cf4747; color:#fff; box-shadow: 3px 4px 0 rgba(0,0,0,0.12);}
.IndexPublication .btn a:hover{ opacity:0.8; }



/*----------------------------------------------------------------------*/
/*相關網站*/
.IndexLinks::after{ content:''; display:block; clear:both; }
.IndexLinks > div{ overflow:hidden; }
.IndexLinks .indexTitle h3{ color:#505050; }

.IndexLinks .list-box{ margin-bottom:10px; }
.IndexLinks .list-box li{ display:inline-block; padding-left:8px; padding-right:8px; margin-bottom:15px; 
    vertical-align:middle; box-sizing:border-box;
}

.IndexLinks .list-box li a{ display:block; width:100%; height:100%; }
.IndexLinks .list-box li a img{ width:100%; height:auto; }
.IndexLinks .list-box li a:hover img{ transform:scale(1.03); opacity:0.8;}