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

/* ---------------------------- 新聞標題 + 分隔線 + 作者 + 時間 ---------------------------- */
.whitecon h1, .whitecon h2 { width:90%; font-size:27px; line-height:35px; padding:0 0 10px; margin:5px auto; font-family:'Noto Sans TC'; font-weight:500; }
/* 分享+功能鍵 */
.whitecon .function { width:90%; height:55px; margin:20px auto; padding:0; overflow:hidden; border-top:1px solid #e7e7e7; border-bottom:1px solid #e7e7e7; }
.whitecon .function a { display:inline-block; width:35px; height:35px; margin:9px 5px 0px 0px; float:right; }
.function a.sharefbnice { background-color:#1877f2; border-radius:100%; position:relative; }
.function a.sharefbnice iframe { transform:scale(0.8); position:absolute; top:6px; left:-3px; }
.function a.sharefb { background:url(https://cache.ltn.com.tw/images/icon/innerPages_fb.svg) center no-repeat; background-size:35px; }
.function a.sharetwitter { background:url(https://cache.ltn.com.tw/images/icon/innerPages_X.svg) center no-repeat; background-size:35px; }
.function a.shareline { background:url(https://cache.ltn.com.tw/images/icon/innerPages_line.svg) center no-repeat; background-size:35px; }
.whitecon .function a:hover { opacity:0.8; }

/* 無作者，只有時間 */
.function a.writer { min-width:200px; height:60px; display:inline-block; float:left; margin:0; }
.function a.writer span.time { display:inline-block; font-size:14px; color:#59493f; line-height:55px; }/* 時間 */
.function a.writer div, .function a.writer p { display:none; }
.function a.writer { background-color:transparent; cursor:text; }
/* 作者 + 時間 */
.function.author { height:60px; }
.function.author a.writer { min-width:200px; width:auto; margin:0; padding:6px 3px; }
.function.author a.writer div { width:45px; height:45px; border-radius:100%; display:inline-block; float:left; overflow:hidden; margin:0 10px 0 0; }
.function.author a.writer div img { width:45px; height:45px; }
.function.author a.writer p { color:#e3602e; font-size:17px; display:table; font-weight:300;}
.function.author a.writer span.time { line-height:1; }/* 時間 */
.function.author a.writer:hover { background-color:#f3f3f3; cursor:pointer; }
.function.author a { margin:12px 5px 0px 0px; }

@media screen and (max-width:1139px) {
    .whitecon h1, .whitecon h2, .whitecon .function { width:100%; }
}    
@media screen and (max-width:500px) {
    .whitecon h1, .whitecon h2 { padding:5px 15px 10px; margin:0px auto; font-size:24px; font-weight:500; line-height:1.2; }
    .whitecon .function { width:95%; margin:10px auto; }
    /* 作者 + 時間 */
    .function a.writer { min-width:135px; height:58px; padding:0px 0px 0px 3px; }
    .function.author a.writer { min-width:auto; }
    .function.author a.writer div { display:none; }
    .function.author a.writer p { font-size:15px; padding:5px 0; }
    .function.author a.writer span.time, .function a.writer span.time { font-size:13px; }
    .function.author a.writer span.time { display:table; }
}
@media screen and (max-width:380px) {   
    .function.author a.writer { width:135px; height:58px; padding:2px 0px 0px 3px; }
    .function.author a.writer p { font-size:15px; line-height:1.2; display:table-cell; vertical-align:middle; height:28px; padding:0px 0px 4px; }
    .function.author a.writer span.time { display:table; } 
}
@media screen and (max-width:330px) {
    .whitecon h1, .whitecon h2 { font-size:23px; }
    /* 作者 + 時間 */
    .function a.writer { min-width:90px; padding:0 0 0 5px; }
    .function a.writer span.time { line-height:1.2; padding:11px 0 0; font-size:12px; }
    .function.author a.writer { min-width:110px; width:110px; padding:4px 0px 0px 3px; }
    .function.author a.writer span.time { line-height:1; padding:0; font-size:12px; letter-spacing:normal; }
    .function.author a.writer p { font-size:13px; padding-bottom:5px; }
}    

/* ---------------------------- 導言 - 專欄、媒體用 ---------------------------- */
.foreword { width:89%; margin:0 auto; padding:0 0 0 80px; color:#8c7861; font-size:17px; line-height:1.65; position:relative; }
.foreword:before { content:""; display:block; width:70px; height:1px; background-color:#bfac98; position:absolute; top:15px; left:0; }

@media screen and (max-width:1139px) {
    .foreword { width:100%; }
} 
@media screen and (max-width:500px) {
    .foreword { padding:0 15px 0 75px; margin:0 auto; }
    .foreword:before { width:45px; left:15px; }
}   
@media screen and (max-width:330px) { 
    .foreword { line-height:1.6; }
}    

/* ---------------------------- 內文 ---------------------------- */
.whitecon .text { width:90%; margin:0px auto 20px; }
.whitecon .text p, .whitecon .text p b, .whitecon .text p strong, .whitecon .text p a, .whitecon .text p span
{ font-size:var(--textFontSize); line-height:var(--textLineHeight); word-wrap:break-word; margin-bottom:var(--textMarginBottom); letter-spacing:var(--textLetterSpacing); /*text-align:justify; text-justify:inter-ideograph;*/ }
.whitecon .text p b, .whitecon .text p strong { font-weight:bold; }
/*小標*/
.text h2, .text h3, .text h4, .text h5, .text h6 { font-size:22px; font-weight:bold; margin:0px 0px 30px; line-height:35px; }
.text h2 span, .text h3 span, .text h4 span, .text h5 span, .text h6 span { font-size:20px; font-weight:bold; }
.whitecon .text p a { color:#e3602e; }
.whitecon .text p a:hover { background-color:#f5f5f5; }

/* 內文大圖 */
.text .photOut { width:100%; margin:20px auto 35px; padding:10px 10px 0px; }
.text .photo { display:table; margin:auto; caption-side:bottom; }
.text .photo a { margin:0px auto; }
.text .photo a img { width:auto; margin:0px auto; display:block; line-height:0; }
.text .photo p { display:table-caption; width:auto; font-size:17px; color:#666; line-height:1.5; text-align:left; padding:7px 0px 8px; margin:0; word-wrap:break-word; }

@media screen and (max-width:1139px) {
    .whitecon .text { width:100%; }
}
@media screen and (max-width:500px) {
    /* 廣告用 width:100%; */
    .whitecon .text { width:100%; margin:0 auto; } 
    /* 標題內縮 */
    .text h2, .text h3, .text h4, .text h5, .text h6 { line-height:1.5; padding:0 15px; } 
    /* 內文 */
    .whitecon .text p { padding:0 15px; } 
    /* 大圖內縮 */
    .whitecon .text .photOut { padding:10px 15px 0px; }
    /* 圖說不內縮 */
    .whitecon .text .photOut .photo p { width:100%; line-height:1.5; padding:3px 0px 5px; }
    /* 影音內縮 */
    .whitecon .text .v_container, .whitecon .text p.v_container { width:93%; margin:10px auto 35px; padding:0 15px 55%; } 
}    


/* ---------------------------- 引用文 ---------------------------- */
.text blockquote { width:85%; margin:30px auto; }

@media screen and (max-width:500px) {
    .text blockquote { width:100%; padding:0px 20px; position:relative; quotes:"\201C""\201D""\2018""\2019"; }
    .whitecon .text blockquote p { margin-bottom:20px; }
    .text blockquote:before, .text blockquote:after { font-size:3rem; color:#ddd; font-family:"Noto Sans TC"; position:absolute; }
    .text blockquote:before { content:open-quote; top:-12px; left:-18px; }
    .text blockquote:after { content:close-quote; bottom:-40px; right:-15px; }
}   
@media screen and (max-width:330px) { 
    .whitecon .text blockquote p { padding:0px 9px; }
    .text blockquote:before, .text blockquote:after { font-size:2.5rem; }
    .text blockquote:before { top:-12px; left:-12px; }
    .text blockquote:after { bottom:-25px; right:-10px; }
} 

/* ---------------------------- 內文影音 YOUTUBE RWD ---------------------------- */
.v_container, .v_containerTOP { width:90%; height:0; padding-bottom:50.25%; position:relative; overflow:hidden; margin:0 auto 30px; }
.v_container iframe, .v_container object, .v_container embed , .v_containerTOP iframe, .v_containerTOP object, .v_containerTOP embed
 { width:100%; height:100%; position:absolute; top:0; left:0; }
.v_containerTOP { margin:0 auto; } /* 影音專用，H1上 */

@media screen and (max-width:1139px) {
    .v_containerTOP, .v_container { width:100%; }
    .v_containerTOP, .v_container { padding-bottom:55.25%; }
}
@media screen and (max-width:380px) {
    .whitecon .text .v_container { width:92%; }
}    
@media screen and (max-width:330px) {
    .whitecon .text .v_container { width:91%; }
}

/* ---------------------------- 文末 自由共和國 徵稿 ---------------------------- */
.text .solicit { width:90%; margin:30px auto; padding:20px; border-top:1px dashed #e3602e; border-bottom:1px dashed #e3602e; background-color:rgba(229,113,86,0.05); }
.text .solicit strong { display:block; text-align:center; font-size:16px; padding:5px 0px; }
.text .solicit p { font-size:16px; margin:12px auto; padding:0px; line-height:1.5; }
.text .solicit p a { color:#e3602e; font-size:16px; }
.text .solicit p a:hover { background-color:#eee; }

@media screen and (max-width:500px) {
    .text .solicit { width:95%; padding:15px 10px 0px; }
    .text .solicit p, .text .solicit strong, .text .solicit p a { font-size:0.95rem; padding:0; line-height:1.4; }
}    
@media screen and (max-width:330px) { 
    .text .solicit p { line-height:1.3; }
}

/* ---------------------------- 相關新聞 + 編輯精選 標題 ---------------------------- */
.caption { width:100%; margin:20px auto 0px; background-color:#f5f5f5; clear:both; }
.caption p { font-size:26px; text-align:center; color:#996c33; padding:10px 0; border-bottom:1px solid #eee; font-family:'Noto Sans TC'; }

@media screen and (max-width:1139px) {
    .caption { width:100%; }
}
@media screen and (max-width:500px) {
    .caption { width:95%; }
    .caption p { font-size:22px; padding:8px 0; }
}

/* ---------------------------- 內文頁相關新聞用 (接在內文框內) ---------------------------- */
ul.related { width:100%; margin:0px auto 20px; padding:0 0 20px 0; overflow:hidden; background-color:#f9f9f9; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
ul.related li { width:100%; margin:0px auto; padding:12px 5px 14px; }
ul.related div { width:100%; } /* 廣告div插入使用 */
ul.related li a { margin:0; padding:0; }
ul.related li a p { width:90%; font-weight:300; margin:0px auto; font-size:18px; line-height:1.2; overflow:hidden; color:#222; padding:0 0 0 20px; letter-spacing:1px; position:relative; }
ul.related li a p:before { content:""; display:block; width:6px; height:6px; border-radius:100%; background-color:#ff692f; position:absolute; top:8px; left:0; }
ul.related li:hover { background-color:#f2f2f2; }
ul.related li:hover a p { color:#e3602e; }

@media screen and (max-width:1139px) {
    ul.related { width:100%; }
    ul.related li a p { width:94%; }
}
@media screen and (max-width:500px) {
    ul.related { width:95%; margin:0px auto 20px; } 
    ul.related li { width:100%; margin:0 auto; padding:10px 0; }
    ul.related li a p { width:95%; font-size:1.2rem; line-height:1.3; padding:0 0 0 30px; } 
    ul.related li a p:before { left:10px; }
} 
@media screen and (max-width:380px) { 
    ul.related { width:95%; margin:0px auto 10px; } 
}    

/* ---------------------------- 編輯精選 ---------------------------- */
ul.todaynews { width:100%; padding:0px 0px 15px; overflow:hidden; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; background-color:#f9f9f9; }
ul.todaynews li { width:49%; border-bottom:1px dotted #ccc; margin:0px; padding:12px 5px 14px; position:relative; }
ul.todaynews li a { padding:0; margin:0; }
ul.todaynews li a p { font-size:18px; line-height:24px; height:45px; overflow:hidden; color:#222; padding:0 5px 0 26px; font-weight: 300;}/* 標題 */
ul.todaynews li a p:before { content:""; display:block; width:6px; height:6px; border-radius:100%; background-color:#ff692f; position:absolute; top:20px; left:15px; }
ul.todaynews li:hover, ul.todaynews li:active { background-color:#f2f2f2; }
ul.todaynews li:hover a p, ul.todaynews li:active a p { color:#e3602e; }

@media screen and (max-width:500px) {
    ul.todaynews { width:95%; margin:0px auto 20px; } 
    ul.todaynews li { width:100%; margin:0 auto; padding:10px 0; }
    ul.todaynews li a p { width:95%; font-size:1.2rem; padding:0 0 0 30px; margin:0 auto; height:auto; }
    ul.todaynews li a p:before { left:20px; }
}   
@media screen and (max-width:380px) { 
    ul.todaynews { width:95%; margin:0px auto 10px; } 
} 
@media screen and (max-width:330px) { 
    .whitecon ul.todaynews li a p { font-size:18px; margin-bottom:5px; }
}

/* 網友回應 */
.fb-comments { width:100%; text-align:center; }