@charset "utf-8";

/* CSS Document header + footer + 側邊欄 + 廣告 + 共用 */

body { background-color:#f2f2f2; color:#111; line-height:1.3; font-family:"微軟正黑體", "新細明體", sans-serif, Arial; }
a:link, a:visited, a:active { color:#111; transition:all 0.4s ease; }
img { width:100%; transition:all 0.4s ease; }

/* 表格共用 */
table { width:90%; border-collapse:collapse; border-spacing:0; font-family:'微軟正黑體'; margin:20px auto; }
table th, table td { text-align:center; line-height:1.3; border:1px solid #d5d5d5; vertical-align:middle; padding:8px 10px; }
table th { font-family:'Noto Sans TC';font-size:16px; font-weight:400; color:#fff; background-color:#82bac6; }
table td { color:#111; font-size:18px; }

/* 手機版選單：下拉式選單 (▼) */
select { background:transparent; -webkit-appearance:none; /*Chrome*/ -moz-appearance:none; /*FF*/ appearance:none;/*CSS3*/ }
select::-ms-expand { display:none; /*IE*/}
select { display:inline-block; width:90%; height:1.8rem; line-height:1.5; font-size:16px; border:1px solid #79b5c2; border-radius:4px; padding:0 0 0 5px; margin:0; overflow:hidden; background-color:#fff; background:url(../images/arrow.png) no-repeat 100% center #fff; background-size:30px; }
form { display:block; text-align:center; margin:10px auto; }

/* 標題後加影音小圖 */
span.video { width:25px; height:20px !important; padding:0; margin:0px 0px -3px 6px !important; background:url(../images/video.svg) no-repeat center; background-size:25px;
display:inline-block !important; min-height:auto !important; }

/* 共用 */
.content { max-width:1260px; width:100%; margin:20px auto 0px; padding:0 1%; overflow:hidden; }
/* 列表、內頁 1260 用 */
section.content940 { max-width:100%; width:calc(100% - 300px - 30px); float:left; margin:0 auto; overflow:hidden; letter-spacing:1px; }
.whitecon { width:100%; background-color:#fff; border:1px solid #eaeaea; margin-bottom:30px; overflow:hidden; }
/* 列表用 */
.listEnd { text-align:center; margin:5px auto 20px; }

@media screen and (max-width:1200px) {
	section.content940 { width:calc(100% - 300px - 15px); }
}
@media screen and (max-width:1100px) { /*側邊欄隱藏*/
    .content { width:100%; margin:15px auto 0px; }
	section.content940 { float:none; width:100%; }
	.whitecon { margin:0px auto 30px; }
}
@media screen and (max-width:600px) {
    .content, section.content940 { padding:0; margin:0; }
    .whitecon { margin:0px auto 15px; padding:0px; }
}


/* ---------------------------- 廣告共用 ---------------------------- */
.suggest { max-width:1235px; }
.suggest #ad-K10 { margin-top:20px; }

@media screen and (max-width:1100px){ /* 巨橫幅廣告隱藏 */
    .suggest_pc, #ad-K1, #ad-K10 { display: none; }
}
@media screen and (max-width:700px){ /* 配合首頁300*250廣告隱藏 */
    .suggest_pc { display: none; }
}
@media screen and (max-width:600px) { /* 廣告切換電腦版手機版 */
    .suggest_m { display: block; }
}


/* ---------------------------- top ---------------------------- */
.top { display:none; width:45px; height:45px; border-radius:100%; clear:both; position:fixed; bottom:120px; right:30px; z-index:50; box-shadow:0 0 6px 1px rgba(0,0,0,0.2); }
.top a { display:block; width:45px; height:45px; line-height:0; border-radius:100%; cursor:pointer; background-color:#6e8895; }
.top a:before { content: "︿"; display: inline-block; color:#fff; font-size: 25px; font-weight: 500; position: absolute; top: 7px; left: 10px; }
.top a:after { content:"TOP"; color:#fff; font-size:15px; font-weight:600; letter-spacing:1px; position:absolute; top: 28px; left: 7px; }
.top a:hover, .top a:active { background-color:#8c9fa9; }


/* ---------------------------- header ---------------------------- */
.militaryHeader { width:100%; height:50px; background-color:#506977; position:sticky; top:0; z-index:5; }
.militaryHeader .con { max-width:1260px; width:100%; height:50px; margin:0px auto; padding:0 5px; position: relative; }
.militaryHeader .con a.militaryLogo { display:inline-block; width:140px; margin:10px 0 0; float:left; }
.militaryHeader .con a.militaryLogo img { width:140px; height:auto; }
.militaryHeader .con .printLOGO { display:none; }
.militaryHeader .con ul.level1 { display:flex; float:left; height:50px; margin:0 0 0 2.5%; }
.militaryHeader .con ul.level1 li { margin:0 25px 0 0; position:relative; }
.militaryHeader .con ul.level1 li:last-of-type { margin:0; }
.militaryHeader .con ul.level1 li:before { content:"›"; display:block; color:#fff; font-size:17px; font-family: sans-serif; font-weight:bold; position:absolute; bottom:10px; left:-6px; }
/* hover時 ›向下 */
.militaryHeader .con ul.level1 li:hover:before { transform: rotate(90deg); bottom:8px; }
.militaryHeader .con ul.level1 li:nth-child(4):hover:before, .militaryHeader .con ul.level1 li:nth-child(5):hover:before, .militaryHeader .con ul.level1 li:nth-child(7):hover:before { transform: rotate(0deg); bottom:10px;}
.militaryHeader .con ul.level1 li a.L1 { display:inline-block; color:#ffeb00; font-size:17px; height:50px; line-height:50px; padding:0px 10px 0px 5px; letter-spacing:1px; font-family:'Noto Sans TC'; font-weight:400; position:relative; }
.militaryHeader .con ul.level1 li a.L1:hover , .militaryHeader .con ul.level1 li:hover a.L1 { color:#fff; }
/*次選單*/
.militaryHeader .con ul.level1 li ul.defList { display:none; background-color:#f9f9f9; min-width:130px; border:1px solid #445660; border-top:none; box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); position:absolute; z-index:10; left:-25%; top:43px; }
.militaryHeader .con ul.level1 li ul.defList li { display:block; width:100%; padding:0px 8px; margin:0; }
.militaryHeader .con ul.level1 li ul.defList li:before { display:none; }
.militaryHeader .con ul.level1 li ul.defList li a { display:block; text-align:center; padding:10px 5px; border-bottom:1px solid #445660; }
.militaryHeader .con ul.level1 li ul.defList li:last-of-type a { border-bottom:none; }
.militaryHeader .con ul.level1 li ul.defList li:hover { background-color:#f5f6b9; }
.militaryHeader .con ul.level1 li:hover ul.defList { display:block; }
/* 搜尋 + fb */
a.icon_search, a.icon_fb { display:inline-block; width:40px; height:50px; float:right; margin:0; cursor:pointer; -webkit-tap-highlight-color:rgba(0,0,0,0); }
a.icon_search { background:url(https://cache.ltn.com.tw/images/icon/w_search.svg) no-repeat center; background-size:25px; }
a.icon_fb { background:url(https://cache.ltn.com.tw/images/icon/w_fb.svg) no-repeat center; background-size:13px; }
a.icon_fb:hover, a.icon_search:hover, .con .nav_bar:hover/*共用hover濾鏡 */{ filter:invert(10%) sepia(40%) saturate(2860%) hue-rotate(345deg) brightness(100%) contrast(95%); }
#def .militaryHeader .nav_bar { display:none; }

@media screen and (max-width:1100px) {
    .militaryHeader .con ul.level1 a.militaryLogo { display:block; }
    .militaryHeader .con ul.level1 a.militaryLogo img { width:100px; height:auto; padding:14px 0 0; }
    #def .militaryHeader .con .nav_bar { display:inline-block; -webkit-tap-highlight-color:rgba(0,0,0,0); vertical-align:middle; cursor:pointer; float:right; width:40px; height:50px; background:url(https://cache.ltn.com.tw/images/icon/w_menu.svg) no-repeat center; background-size:26px; position:static; }
    .militaryHeader .con { padding:0 1.5%; }
    .militaryHeader .con ul.level1 { display:none; }
}
@media screen and (max-width:420px) {
    .militaryHeader .con a.militaryLogo { margin:10px 0px 0px 5px; }
    .militaryHeader .con a.militaryLogo img { width: 135px; }
}

/* 搜尋 input */
::-webkit-input-placeholder { color:#fff; letter-spacing:0.5px; }
:-moz-placeholder { color:#fff; letter-spacing:0.5px; }
::-moz-placeholder { color:#fff; letter-spacing:0.5px; }
:-ms-input-placeholder { color:#fff; letter-spacing:0.5px; }
/* 搜尋 close */
.search_close { width:97%; height:45px; background:url(https://cache.ltn.com.tw/images/icon/w_close.svg) no-repeat center right; background-size:21px; cursor:pointer; }
/* 搜尋遮罩 */
.mask_search { width:500px; height:120px; position:absolute; z-index:10; top:50px; right:calc(50% - 630px); display:none; }
.mask { width:500px; height:120px; background:rgba(0,0,0,0.8); position:absolute; top:0px; }
/* 搜尋框箭頭 */
.mask:before { content:""; width:0; height:0; display:block; border-style:solid; border-color:transparent transparent rgba(0,0,0,0.8); border-width:0px 8px 10px; position:absolute; top:-9px; right:3%; }
.mask_content { width:100%; position:relative; }
/* 搜尋內容 */
.mask_search form.form-search { padding:0px; margin:0 auto; text-align:center; }
.mask_search form input[type="text"] { width:70%; height:2rem; font-size:16px; border:none; padding:0 0 0 5px; }
.mask_search form button { background-color:#6d97ae; color:#fff; font-size:16px; letter-spacing:1px; padding:5px 12px; margin:10px 0px 10px 10px; border:none; border-radius:3px; }
.mask_search form button:hover , .mask_search form button:active { color:#fff87f; }

@media screen and (max-width:1260px) {
    .mask_search, .mask { right: 0%; }
}
@media screen and (max-width:1100px) {
    .mask:before { right:13%; }
}
@media screen and (max-width:600px) {
    .mask_search { width:100%; height:100vh; z-index:200; top:0px; }
    .mask { width: 100%; height: 100vh; top: -50px; }
	.mask:before { display: none; }
    .mask_content { max-width: 600px; min-width: 300px; margin: 10px auto 0px; }
}
@media screen and (max-width:380px) {
	.mask_content { padding: 0px 15px; }
}



/* ---------------------------- footer ---------------------------- */
.military_footer { width:100%; clear:both; padding:15px; text-align:center; background-color:#e5e5e5; }
.military_footer a { width:110px; display:inline-block; margin:0px auto 5px; }
.military_footer img { height:26px; width:auto; }
.military_footer p, .military_footer p span { font-size:13px; letter-spacing:1px; line-height:1.5; }

@media screen and (max-width:600px) {
    .military_footer p span { display:block; line-height:1.3; }
}
@media screen and (max-width:380px) {
    .military_footer img { width:100px; }
}
@media screen and (max-width:330px) {
    .military_footer p, .military_footer p span { font-size:0.7rem; letter-spacing:0; }
}


/* ---------------------------- 麵包屑 ---------------------------- */
.breadcrumbs { width:100%; height:30px; margin:0 0 5px; overflow:hidden; clear:both; }
.breadcrumbs span { font-size: 16px; margin:0px 8px; }
.breadcrumbs a { color:#222; font-size:16px; }
.breadcrumbs a.breadcrumbSort { display:inline; font-family:'Noto Sans TC'; color:#506977; font-size:26px; font-weight:500; line-height:25px; }
.breadcrumbs a:hover, .breadcrumbs a.breadcrumbSort:hover { color:#01b2e2; }

@media screen and (max-width:600px) {
    .breadcrumbs { margin:15px 0px 5px 5px; }
	.breadcrumbs a.breadcrumbSort {	font-size: 23px; }
}
@media screen and (max-width:380px) {
    .breadcrumbs a, .breadcrumbs span { font-size:14px; }
	.breadcrumbs a.breadcrumbSort { font-size: 21px; }
}


/* ---------------------------- 300側邊欄 ---------------------------- */
aside { width:300px; float:right; margin: 0px 0px 30px; }
#right { width:300px; }
.fb_aside { width:300px; margin:0 0 20px; border:1px solid #ddd;  }
.asideBlock { margin-bottom:20px; }

/* 熱門新聞 */
.asideBlock p { font-size:23px; color:#506977; background-color:#f2f2f2; border-bottom:4px solid #14b8e4; font-family:'Noto Sans TC'; font-weight:500; }
.hotnews { width:100%; background-color:#def2ff; padding:0px; overflow:hidden; }
.hotnews a { display:block; border-bottom:2px solid #14b8e4; font-size:17px; line-height:1.5; padding:7px 10px; }
.hotnews a:hover { color:#00a9e2; }

/* 軍情看板 + 熱門新訊 */
.asideBlock .news, .asideBlock .news img { line-height:0; }
.asideBlock .news { height: 0; padding: 0 0 60%; background:url(../images/default.jpg) center no-repeat; background-size: cover; overflow:hidden; }
.asideBlock a.tit { display:block; font-size:23px; font-family:'Noto Sans TC'; font-weight:500; color:#506977; border-bottom:4px solid #14b8e4; }
.asideBlock a.tit:hover { color:#00a9e2; }
.asideBlock a span { padding:0px 10px; }
.asideBlock ul.trend { width:100%; background-color:#fff; padding:0px; overflow:hidden; }
.asideBlock ul.trend li , .asideBlock ul.market li { border-bottom:1px solid #ddd; padding:8px 15px; }
.asideBlock ul.trend li a , .asideBlock ul.market li a { display:block; font-size:17px; line-height:1.3; }
.asideBlock ul.trend li:hover , .asideBlock ul.market li:hover { background-color:#def2ff; }
/* 熱門新訊 */
.asideBlock ul.market { width:100%; background-color:#fff; padding:0px; overflow:hidden; }

@media screen and (max-width:1100px) { /*側邊欄隱藏*/
    aside, div#right { display:none; }
}


/* --------------------------- 瀏覽器更新提醒 --------------------------- */
.ie9{width:800px;overflow:hidden;padding:25px 0;margin:0 auto;border:1px solid #ddd;}
.ie9 p{padding:0px 55px;margin:0px;font-size:18px;color:#222;line-height:30px;}
.button{padding:15px 0; }
.button a{display:block;height:40px;line-height:40px;border:1px solid #999;background-color:#f7f7f7; float:right;text-align:center;vertical-align:middle;padding:0px 15px;margin:0 10px; color:#2052d1;}
.button a:hover{background-color:#ddd;color:#222;}
a.close {width:40px;height:40px;margin:0 40px 0px 20px; padding:0px;}
a.close img{width:35px;margin-top:3px;}