@charset "utf-8";
@import url('base.css');
@import url('swiper-bundle.css');

/* common */
.dimMask{display:none; position:fixed; top:50px; width:100%; height:100%; background:rgba(0,0,0, .3); z-index: 9;}
.goTop{display:none; position:fixed; bottom:56px; right:16px; border:1px solid #ccc; background-color:rgba(255,255,255 , 0.7); z-index: 9;}
.goTop a{display:block; padding:16px 8px;}
.goTop img{width:24px; height:14px;}

/* layerPop */
.layerPop.off{display:none;}
.layerPop.on{display:block;}
.layerPop{position:fixed; top:0; left:0; width:100%; height:100%;  z-index: 10;}
.layerPop .dim{position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0, .3);}
.layerPop .pop{display:none;}

/* background */
body#newsis{background-color:#ededed;}
.bgGray{background-color:#ededed;}
.bgWhite{background-color:#fff;}

/* color */
.red{color:#e74b3c;}
.blue{color:#4e78cf;}

/* font-size */
.f22{font-size:12px !important ;}
.f16{font-size:16px !important ;}
.f18{font-size:18px !important ;}
.f22{font-size:22px !important ;}
.f24{font-size:24px !important ;}

/* button */
.btnGroup{padding:8px 16px;}
.btnGroup2{}
.btnGroup button{font-size:14px; color:#000;}
.btnGroup2 button{border-left:none; border-right:none; color:#000; font-size:14px;}
.btnGray{display:block; width:100%; padding:8px 0; border:1px solid #dedede; background-color:#f9f9f9; color:#000; font-size:16px;}
.btnMore{display:block; width:100%; padding:8px 0; border-bottom:1px solid #dedede; background-color:#f9f9f9; color:#000; font-size:16px;}
.total{position:relative; margin-left:8px; padding-right:16px; font-size:12px; line-height:14px; color:#000; visibility:visible;}
.total>span{font-size:12px; line-height:14px; color:#000; visibility:visible;}
.total em{color:#e02631}

/* banner */
.bannerGroup{padding:8px 16px;}
.bannerGroup+.bannerGroup{padding-top:0px;}
.bannerGroup+.btnGroup{padding:0px 16px;}
.bannerGroup.ea2,.bannerGroup.ea3{display:flex; justify-content: space-between;}
.bannerGroup.ea2 a{width:49%;}
.bannerGroup.ea3 a{width:32%;}
.imgTxtBanner{overflow:hidden; display:Block; height:42px; text-align:center;}
.imgTxtBanner img{width:auto; max-width:320px; height:100%;}
.fixBanner{position:fixed; bottom:0px; width:100%; height:auto; text-align:center; z-index:10;}
.fixBanner .nbanner img{width:260px;}
.fixBanner .nbanner{position:relative; width:260px; margin:0 auto;}
.fixBanner .nbanner button{position:absolute; top:0; right:0; width:25px; height:25px; background-color:transparent;}
.fixBanner .nbanner button>img{width:25px; height:25px;}
.headtopBanner{text-align:center;}
.headtopBanner a{display:block;}
.headtopBanner img{width:100%; max-width:360px;}

/* content */
.content{padding-top:91px;}
.content.sub{padding-top:50px;}

/* linknews */
.linkNews{padding:0 16px;}
.linkNews li{margin-top:0px;}
.linkNews li:first-child{margin-top:0px;}
.linkNews li a{position:relative; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-left:12px; color:#888; font-size:14px;}
.linkNews li a.type1:after{content:''; position:absolute; top:10px; left:0; width:3px; height:3px; border-radius:50%; background-color:#e74b3c; box-sizing: border-box;}
.linkNews li a.type2:after{content:''; position:absolute; top:6px; left:0; width:8px; height:8px; border-left:2px solid #e74b3c; border-bottom:2px solid #e74b3c; box-sizing: border-box;}

/* font */
.txtBig{font-size:22px; line-height:30px; font-weight:bold;}
.txtBig.line2{max-height:60px; text-overflow: initial !important ; white-space: initial !important ;}
.txtBig2{font-size:22px; line-height:30px; font-weight:normal;}
.txtBig2.line2{max-height:60px; text-overflow: initial !important ; white-space: initial !important ;}
.txtMid{font-size:16px; line-height:22px; font-weight:bold;}
.txtMid.line2{max-height:44px; text-overflow: initial !important ; white-space: initial !important ;}
.txtMid2{font-size:16px; line-height:22px; font-weight:normal;}
.txtMid2.line2{max-height:44px; text-overflow: initial !important ; white-space: initial !important ;}
.txtSmall{font-size:14px; color:#999}
.txtBlue{margin-bottom:4px; font-size:16px; line-height:18px; color:#4e75cf}

/* tabCont */
.tabArea{background-color:#fff;}
.tabArea h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.tabArea h2.center{text-align:center;}
.tabArea h2.line{margin-bottom:8px; border-bottom:1px solid #e5e5e5;}
.tabArea .tab{display:flex; flex-wrap:wrap; justify-content: space-around; position:relative; }
.tabArea .tab span{display:block; position:absolute; left:0; bottom:0; width:33.33%; height:3px; background-color:#e74b3c; transition:.2s;}
.tabArea .tab button{width:33.33%; padding-bottom:8px; background-color:#fff; font-size:16px; color:#000;}
.tabCont{display:none;}
.tabCont.active{display:block;}

/* header */
header{position:fixed; top:0; left:0; width:100%; height:50px; border-bottom:1px solid #e5e5e5; background-color:#fff; box-sizing: border-box; z-index: 9;}
header h1{position:absolute; top:50%; left:16px; width:auto; height:24px; margin-top:-12px;}
header h1 a{display:inline-block; overflow:hidden;}
header h1 img{Width:111px; height:auto;}
header h1 span{margin-left:8px; vertical-align:bottom;}
header .btn{position:absolute; top:0; right:0; width:50px; height:50px; background-image:url(../img/btn_nav.png); background-repeat:no-repeat; background-position:50% 50%; background-size:auto 18px; background-color:#efefef;}
header .btn.active{background-image:url(../img/btn_close.png); }
.navBar{position:fixed; top:50px; left:0; width:100%; height:40px; background-color:#fff; border-bottom:1px solid #ababab; z-index: 8;}
.navBar ul{display:flex; width:100%; justify-content:space-around; }
.navBar li a{position:relative; display:block; line-height:40px; font-size:16px;}
.navBar li.active a:after{content:''; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e74b3c; z-index: 1;}

/* nav */
.mNav {position:fixed; top:50px; right:-290px; width:258px; height:calc(100% - 82px); padding:16px; background-color:#fff;  transition: .2s; z-index: 10;}
.mNav.off{right:-290px;}
.mNav .searchArea{position:relative; height:40px; margin-bottom:16px; border-bottom:1px solid #111; background:#efefef;}
.mNav .searchArea button{position:absolute; top:50%; right:12px; width:24px; height:24px; margin-top:-12px; background-color:transparent;}
.mNav .searchArea button img{width:24px; height:24px;}
.mNav .searchArea input{width:210px; height:40px; line-height:40px; padding:0 16px; background:#efefef; font-weight:600;}
.mNav .searchArea input::placeholder {font-weight:400;}
.mNav nav{overflow:hidden; position:relative; width:100%; height:calc(100% - 40px);}
.mNav nav .swiper-slide{padding-bottom:56px;}
.mNav nav li{width:100%;}
.mNav nav li.line{padding-bottom:8px; border-bottom:1px solid #efefef;}
.mNav nav li a{display:block; height:40px; font-size:16px; line-height:40px; vertical-align:middle;}
.mNav nav li.on>a{color:red;}
.mNav nav li .menuBox{overflow:hidden; margin:8px 0; border-top:1px solid #efefef; border-bottom:1px solid #efefef;}
.mNav nav li .menuBox li{float:left; width:50%; }

/* 속보 */
.quickBox{overflow:hidden; position:relative; height:32px; margin:4px; padding:0 40px 0 55px; background-color:#fff;}
.quickBox.plan{padding-left:74px;}
.quickBox span.tit{position:absolute; top:4px; left:4px; display:inline-block; height:24px; line-height:22px; padding:0 8px; background-color:#e02631; color:#fff; font-size:14px; }
.quickBox .btnStop{position:absolute; top:0; right:0; width:40px; height:32px; background-color:#fff; }
.quickBox .btnStop img{width:18px; height:auto;}
.quick{height:32px; line-height:30px;}
.quick .swiper-slide{overflow:hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px;}
/* 속보 펼침 */
.quickBox2{overflow:hidden; position:relative; max-height:226px; margin:4px; background-color:#fff;}
.quickBox2.plan{max-height:none}
.quickBox2 .btnStart{position:absolute; top:0; right:0; width:40px; height:32px; background-color:#fff; z-index: 2;}
.quickBox2 .btnStart img{width:18px; height:auto;}
.quickBox2 .date{height:32px; line-height:30px; padding-left:8px; border-bottom:1px solid #e5e5e5;  font-size: 14px;}
.quickBox2 .swiper-slide{position:relative;  height:32px; line-height:30px; }
.quickBox2 .swiper-slide a{overflow:hidden; display:block; text-overflow: ellipsis; white-space: nowrap; padding:0 72px 0 8px; font-size: 14px;}
.quickBox2 .swiper-slide span.time{position:absolute; top:0; right:8px; font-size:12px; color:#4e78cf}
.quickBox2 .btnGroup{border-top:1px solid #e5e5e5}
.quickBox2 .btnGroup button{background-color:#fff; color:#000; font-size:12px;}

/* boxStyle01 */
.boxStyle01 {padding-bottom:16px; background-color:#fff;}
.boxStyle01 .line{margin:16px 16px 0; background-color:#888; height:1px;}
.boxStyle01 h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.boxStyle01 a{display:block; overflow:hidden;}
.boxStyle01 .thumCont{margin-bottom:8px;}
.boxStyle01 .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:56.25%;}
.boxStyle01 .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.boxStyle01 .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:8px 16px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.boxStyle01 .txtCont{padding:0 16px;}
.boxStyle01 figure+.linkNews{margin-top:8px;}
/* 이미지 크기 작게 */
.boxStyle01.old .thumCont .imgCover {padding-bottom:48.4%;}
.boxStyle01.old .txtCont p{line-height:24px;}
/* imgCover 세로로 길 경우 */
.coverH-long{background-position:50% 0% !important; }

/* boxStyle02 */
.boxStyle02 {position:relative; padding-bottom:16px; background-color:#fff;}
.boxStyle02 h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.boxStyle02 a{display:block; overflow:hidden;}
.boxStyle02 .thumCont{position:relative; margin-bottom:8px;}
.boxStyle02 .thumCont .imgCover{width:100%; height:0; padding-bottom:56.25%;}
.boxStyle02 .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.boxStyle02 .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:8px 16px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.boxStyle02 .txtCont{position:relative; margin:-33px  16px 0; background-color:#fff; text-align:center;}
.boxStyle02 .txtCont p{padding:8px 16px;}
.boxStyle02 figure+.linkNews{margin-top:8px;}

/* ulive */
.ulive {}
.ulive .line{margin:16px 16px 0; background-color:#888; height:1px;}
.ulive h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.ulive a{display:block; overflow:hidden;}
.ulive .thumCont{margin:0 0 8px;}
.ulive .thumCont .imgCover{position:relative; width:100%; height:auto; }
.ulive .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.ulive .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:8px 16px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.ulive .txtCont{padding:0 16px;}
.ulive figure+.linkNews{margin-top:8px;}

/* listStyle01 - 사진 오른쪽*/
.listStyle01{padding:16px 0; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; background-color:#fff;}
.listStyle01 h2{position:relative; padding:0px 16px 16px; font-size:20px;}
.listStyle01 h2.center{text-align:center;}
.listStyle01 h2.line{margin-bottom:16px; border-bottom:1px solid #e5e5e5;}
.listStyle01 li{margin-top:16px; padding:16px 16px 0; border-top:1px solid #e5e5e5}
.listStyle01 li:first-child{margin-top:0px; padding-top:0px; border-top:0px;}
.listStyle01 .box a{display:flex;}
.listStyle01 .box a .txtCont{flex-basis:70%; max-width:70%; padding-right:24px; }
.listStyle01 .box a .txtCont .txtBlue{margin-bottom:4px; font-size:16px; line-height:18px; color:#4e75cf}
.listStyle01 .box a .thumCont{flex-basis:30%; max-width:30%; }
.listStyle01 .box a .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:70%;}
.listStyle01 .box a .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.listStyle01 .box a .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:4px 8px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.listStyle01 .box a .thumCont.square {flex-basis:27%; max-width:27%; }
.listStyle01 .box a .thumCont.square .imgCover{padding-bottom:100%;}
.listStyle01 .box .linkNews{padding:8px 0 0;}
.listStyle01 .box .linkNews li{padding: 0; margin-top:2px; border-top:none;}
/* 오른쪽 이미지 작게 */
.listStyle01.old h2{padding-bottom:8px;}
.listStyle01.old h2.line{margin-bottom:4px;}
.listStyle01.old{padding:4px 0;}
.listStyle01.old li{margin-top:4px; padding:4px 16px 0; border-top:1px solid #e5e5e5;}
.listStyle01.old li:first-child{margin-top:0px; padding-top:0px; border-top:0px;}
.listStyle01.old .box a .thumCont .imgCover{padding-bottom:76%;}
.listStyle01.old .box a .txtCont{flex-basis: 76%; max-width: 76%; padding-right: 24px;}
.listStyle01.old .box a .thumCont{flex-basis: 24%; max-width: 24%;}

/* listStyle01_1 - 사진 오른쪽 , 랭킹 왼쪽 */
.listStyle01_1{padding:16px 0; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; background-color:#fff;}
.listStyle01_1 h2{position:relative; padding:0px 16px 16px; font-size:20px;}
.listStyle01_1 h2 a{display:block;}
.listStyle01_1 h2.line{margin-bottom:16px; border-bottom:1px solid #e5e5e5;}
.listStyle01_1 ul{padding-top:16px; border-top:1px solid #e5e5e5;}
.listStyle01_1 li{margin-top:16px; padding:16px 16px 0; border-top:1px solid #e5e5e5}
.listStyle01_1 li:first-child{margin-top:0px; padding-top:0px; border-top:0px;}
.listStyle01_1 .box a{display:flex;}
.listStyle01_1 .box a .txtCont{position:relative; flex-basis:70%; max-width:70%; padding:0 24px 0 32px; }
.listStyle01_1 .box a .txtCont span{position:absolute; top:0; left:0; font-size:24px;}
.listStyle01_1 .box a .thumCont{flex-basis:30%; max-width:30%; }
.listStyle01_1 .box a .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:70%;}
.listStyle01_1 .box a .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.listStyle01_1 .box a .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:4px 8px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.listStyle01_1 .box a .thumCont.square {flex-basis:27%; max-width:27%; }
.listStyle01_1 .box a .thumCont.square .imgCover{padding-bottom:100%;}
.listStyle01_1 .box .linkNews{padding:8px 0 0;}
.listStyle01_1 .box .linkNews li{padding: 0; margin-top:2px; border-top:none;}
/* listStyle01_1 - 사진 없음 , 랭킹 왼쪽 , width100% */
.listStyle01_1.w100 .box a .txtCont{position:relative; flex-basis:100%; max-width:100%; padding:0 24px 0 32px; }

/* listStyle02 - 사진 왼쪽*/
.listStyle02{padding:16px 0; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; background-color:#fff;}
.listStyle02 h2{position:relative; padding:0px 16px 16px; font-size:20px;}
.listStyle02 h2 a{display:block;}
.listStyle02 h2.line{margin-bottom:16px; border-bottom:1px solid #e5e5e5;}
.listStyle02 li{margin-top:16px; padding:16px 16px 0; border-top:1px solid #e5e5e5}
.listStyle02 li:first-child{margin-top:0px; padding-top:0px; border-top:0px;}
.listStyle02 .box a{display:flex;}
.listStyle02 .box a .txtCont{flex-basis:70%; max-width:70%; padding-left:24px; font-size:16px; line-height:24px;}
.listStyle02 .box a .thumCont{flex-basis:30%; max-width:30%; }
.listStyle02 .box a .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:70%;}
.listStyle02 .box a .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.listStyle02 .box a .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:4px 8px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.listStyle02 .box a .thumCont.square {flex-basis:27%; max-width:27%; }
.listStyle02 .box a .thumCont.square .imgCover{padding-bottom:100%;}
.listStyle02 .box .linkNews{padding:8px 0 0;}
.listStyle02 .box .linkNews li{padding: 0; margin-top:2px; border-top:none;}
/* 메인 피플 기자수첩 인터뷰 이미지 사이즈 줄임 */
.listStyle02.old{margin-top:8px; padding:8px 0;}
.listStyle02.old li{margin-top: 8px; padding: 8px 16px 0;}
.listStyle02.old li:first-child{margin-top: 0px; padding-top: 0px; border-top: 0px;}
.listStyle02.old .box a .thumCont.square{flex-basis: 22%; max-width: 22%;}
.listStyle02.old .box a .txtCont{flex-basis:78%; max-width:78%; padding-left:16px; font-size:16px; line-height:24px;}

/* listStyle03 - 사진 없음 (많이 본 뉴스) */
.listStyle03{padding:16px 0;}
.listStyle03 h2{position:relative; padding:0px 16px 16px; font-size:20px;}
.listStyle03 h2.line{margin-bottom:16px; border-bottom:1px solid #e5e5e5;}
.listStyle03 h2 a{display:block;}
.listStyle03 li{position:relative; margin:0 16px 8px; padding-left:16px;}
.listStyle03 li:last-child{margin-bottom:0px;}
.listStyle03 li span{position:absolute; top:0; left:0; font-size:16px;}
.listStyle03 li a{flex-basis:95%; max-width:95%; font-size:16px;}

/* listStyle04 - 사진 없음  */
.listStyle04{border-top:1px solid #f0f0f0; background-color:#fff; }
.listStyle04 h2{position:relative; padding:0px 16px 16px; font-size:20px;}
.listStyle04 h2.line{margin-bottom:16px; border-bottom:1px solid #e5e5e5;}
.listStyle04 h2 a{display:block;}
.listStyle04 li{position:relative; margin-bottom:8px; padding:0 16px 8px; border-bottom:1px solid #f0f0f0}
.listStyle04 li:last-child{margin-bottom:0px;}
.listStyle04 li span{margin-right:8px; font-size:16px;}
.listStyle04 li a{font-size:16px;}
/* 텍스트 기사 한줄 */
.listStyle04.type2 .box .txtCont p{display:block; overflow:hidden; text-overflow: ellipsis; white-space: nowrap;}

/* listStyle05 - 사진 양쪽  */
.listStyle05{padding:16px 0; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; background-color:#fff;}
.listStyle05 h2{position:relative; padding:0px 16px 16px; font-size:20px;}
.listStyle05 h2 a{display:block;}
.listStyle05 h2.line{margin-bottom:16px; border-bottom:1px solid #e5e5e5;}
.listStyle05 ul{display:flex; flex-wrap:wrap; padding:0 16px;}
.listStyle05 ul li{flex-basis:50%; max-width:50%; margin-bottom:16px; }
.listStyle05 ul li:nth-child(even) .box{padding-left:8px;}
.listStyle05 ul li:nth-child(odd) .box{padding-right:8px;}
.listStyle05 .box a .thumCont{position:relative;}
.listStyle05 .box a .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:70%;}
.listStyle05 .box a .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.listStyle05 .box a .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:4px 8px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.listStyle05 .box a .thumCont .ico{position:absolute; top:8px; left:8px; border-radius:50%; box-shadow:1px 1px 5px 1px #000; z-index: 8; }
.listStyle05 .box a .thumCont.square {flex-basis:27%; max-width:27%; }
.listStyle05 .box a .thumCont.square .imgCover{padding-bottom:100%;}
.listStyle05 .box a .txtCont p {overflow:hidden; width:100%; text-overflow: ellipsis; white-space: nowrap;}
.listStyle05 .box a .txtCont p.line2{overflow:hidden; max-height:44px; text-overflow: initial; white-space: initial; }

/* listStyle06 - 인사,부고 */
.listStyle06{padding:16px 0; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; background-color:#fff;}
.listStyle06 h2{position:relative; padding:0px 16px 16px; font-size:20px;}
.listStyle06 h2.center{text-align:center;}
.listStyle06 h2.line{margin-bottom:16px; border-bottom:1px solid #e5e5e5;}
.listStyle06 li{margin-top:16px; padding:16px 16px 0; border-top:1px solid #e5e5e5}
.listStyle06 li:first-child{margin-top:0px; padding-top:0px; border-top:0px;}
.listStyle06 .box a{display:flex;}
.listStyle06 .box a .txtCont{flex-basis:75%; max-width:75%; padding-right:24px; }
.listStyle06 .box a .txtCont .txtBlue{margin-bottom:4px; font-size:16px; line-height:18px; color:#4e75cf}
.listStyle06 .box a .thumCont{flex-basis:25%; max-width:25%; }
.listStyle06 .box a .thumCont .imgCover{position:relative; overflow:hidden; width:100%; height:0; padding-bottom:100%;}
.listStyle06 .box a .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.listStyle06 .box a .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:4px 8px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.listStyle06 .box a .thumCont.square {flex-basis:27%; max-width:27%; }
.listStyle06 .box a .thumCont.square .imgCover{padding-bottom:100%;}


/* boxPhoto01 - 뉴시스 Pic*/  
.boxPhoto01 {padding-bottom:16px; background-color:#fff;}
.boxPhoto01 h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.boxPhoto01 a{display:block; overflow:hidden;}
.boxPhoto01 .thumCont{margin-bottom:8px;}
.boxPhoto01 .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:56.25%;}
.boxPhoto01 .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.boxPhoto01 .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:4px 8px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.boxPhoto01 .thumCont .ico{position:absolute; top:8px; right:8px; }
.boxPhoto01 .txtCont{padding:0 16px;}
.boxPhoto01 .txtCont p{overflow: hidden; margin-bottom: 16px; line-height: 30px; font-weight: normal; text-overflow: ellipsis; white-space: nowrap;}
.boxPhoto01 .swiper-pagination{margin-top:56.25%}
.boxPhoto01 .slideNumber{position:absolute; top:-31px; right:0; margin-top:56.25%; padding:8px; border-top-left-radius: 5px; border-bottom:1px solid #000; background-color:rgba(255,255,255 , 0.9); z-index: 2; font-size:14px; line-height:14px; text-align:center;}
.boxPhoto01 .slideNumber .num{margin-right:4px; color:#e74b3c; font-weight:bold;}
.boxPhoto01 .slideNumber .total{margin-left:4px; padding-right:0px; font-size:14px;}
:root{--swiper-theme-color:#e74b3c;}

/* boxPhoto02 - 포토 국내사진*/  
.boxPhoto02 {background-color:#fff;}
.boxPhoto02 h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.boxPhoto02 a{display:block; overflow:hidden;}
.boxPhoto02 .thumCont{margin-bottom:4px;}
.boxPhoto02 .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:56.25%;}
.boxPhoto02 .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.boxPhoto02 .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:4px 8px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100; }
.boxPhoto02 .thumCont .ico{position:absolute; top:8px; right:8px; }
.boxPhoto02 .txtCont{padding:0 16px;}
.boxPhoto02 .swiper-pagination{margin-top:56.25%}
:root{--swiper-theme-color:#e74b3c;}

/* boxPhoto03 - 포토 해외사진*/  
.boxPhoto03 {background-color:#fff;}
.boxPhoto03 h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.boxPhoto03 a{display:block; overflow:hidden;}
.boxPhoto03 .swiper-slide{width:80%;}
.boxPhoto03 .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:56.25%;}
.boxPhoto03 .thumCont .imgCover img{display:block; width:100%; height:auto; visibility: hidden; }
.boxPhoto03 .thumCont .imgCover .caption{position:absolute; top:0; left:0; padding:4px 8px; background-color:#e74b3c; color:#fff; font-size:16px; font-weight:100;}
.boxPhoto03 .thumCont .ico{position:absolute; top:8px; right:8px; }
.boxPhoto03 .txtCont{padding:0 16px;}
.boxPhoto03 .swiper-pagination{margin-top:56.25%}
:root{--swiper-theme-color:#e74b3c;}

/* boxPhoto04 - 핫키워드 */
.boxPhoto04 h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.boxPhoto04 a{display:block; overflow:hidden;}
.boxPhoto04 .swiper{margin-bottom:16px; padding:0 16px;}
.boxPhoto04 .swiper-slide{width:auto;}
.boxPhoto04 article{width:auto;}
.boxPhoto04 article figure{float:left; margin-right:16px;}
.boxPhoto04 article figure:last-child{margin-right:0px;}
.boxPhoto04 article figure .thumCont .imgCover{position:relative; width:100%; height:0; padding-bottom:56.25%;}
.boxPhoto04 article figure .thumCont .imgCover img{display:block; width:300px; height:auto; visibility: hidden; }
.boxPhoto04 article .groupLine{position:relative; margin-bottom:8px;}
.boxPhoto04 article .groupLine:before{content:''; display:block; position:absolute; bottom:13px; left:0; width:100%; height:1px; background-color:#e74b3c;}
.boxPhoto04 article .groupLine:after{content:''; display:block; position:absolute; right:0; bottom:9px; width:1px; height:9px; background-color:#e74b3c;}
.boxPhoto04 article .groupLine .keyWord{display:inline-block; position:relative; padding-right:16px; background-color:#ededed; font-size:20px; color:#e74b3c;}
.boxPhoto04 .txtCont{overflow:hidden; width:300px; height:48px; margin-top:4px;}
.boxPhoto04 .swiper-pagination{margin-top:56.25%}
:root{--swiper-theme-color:#e74b3c;}

/* boxPhoto05 - 메인 영상 */
.boxPhoto05 h2{position:relative; padding:16px 16px 8px; font-size:24px;}
.boxPhoto05 h2 .right{position:absolute; display:inline-block; bottom:8px; right:16px; }
.boxPhoto05 a{display:block; overflow:hidden;}
.boxPhoto05 .swiper{margin:8px 0 16px; padding:0 16px;}
.boxPhoto05 .swiper-slide{width:auto;}
.boxPhoto05 article{width:auto;}
.boxPhoto05 article figure{float:left; }
.boxPhoto05 article figure .thumCont{position:relative;}
.boxPhoto05 article figure .thumCont img{width:228px; height:128px;}
.boxPhoto05 article figure .thumCont span.ico{position:absolute; bottom:0; right:0; width:40px; height:40px; background-color:rgba(231,75,60, .9); text-align:center;}
.boxPhoto05 article figure .thumCont span.ico img{width:15px; height:15px;margin:13px 0 0 3px;}
.boxPhoto05 .txtCont{overflow:hidden; width:212px; height:48px; padding:16px 8px; background-color:#fff;}
.boxPhoto05 .txtCont p{overflow: hidden; height: 48px; margin-bottom: 16px; line-height: 24px; font-weight: normal;}
.boxPhoto05 .swiper-pagination{margin-top:56.25%}
:root{--swiper-theme-color:#e74b3c;}

/* boxGroup01 */
.boxGroup01{overflow:hidden; background-color:#fff; padding:16px;}
.boxGroup01 ul{position:relative; display:flex;width:100%;  flex-wrap:wrap; border:1px solid #ccc; border-bottom:none;}
.boxGroup01 ul:after{content:''; position:absolute; left:0; bottom:0; display:block; width:100%; height:1px; background-color:#ccc; }
.boxGroup01 ul li{position:relative; overflow:hidden; width:33%; height:40px; line-height:40px; border-right:1px solid #ccc; box-sizing:border-box; border-bottom:1px solid #ccc; text-align:center; font-size:14px;}
.boxGroup01 ul li:nth-child(3n){width:34%; border-right:none;}
.boxGroup01 ul li a{display:block; width:100%; height:100%;}

/* viewCont */
.viewCont *{font-family:'돋움',Dotum,'굴림',Gulim,Helvetica,sans-serif;}
.viewCont{position:relative; background-color:#fff;}
.viewCont .head{padding:16px; border-bottom:1px solid #ccc; }
.viewCont .location {overflow:hidden; margin-bottom:16px;}
.viewCont .location ul li{position:relative; float:left; margin-right:8px; padding-right:16px; line-height:21px;}
.viewCont .location ul li:after{content:''; position:absolute; top:6px; right:0; width:8px; height:11px; background:url(../img/bl_arrow4.png) no-repeat 0 0; font-size:12px;}
.viewCont .location ul li:last-child:after{display:none;}
.viewCont .location ul li:last-child a{font-weight:bold;}
.viewCont .head .tit{margin-bottom:8px; font-size:22px; font-weight:bold; letter-spacing: -1px; line-height:28px;}
.viewCont .head .txtGray{font-size:12px; color:#999;}
.viewCont .head .info{position:relative; min-height:30px; padding-right:100px;}
.viewCont .head .info .share{position:absolute; top:0; right:0;}
.viewCont .head .info .share.fix{position:fixed; top:10px; right:64px; z-index: 10;}
.viewCont .head .info ul li{float:left;}
.viewCont .head .info ul li button{display:inline-block; width:30px; height:30px; margin-left:4px; background-color:#fff; font-size:16px; color:#000 !important ;}
.viewCont .head .info ul li button em{font-size:11px;}
.viewCont .head .info ul li button img{width:auto; height: auto;}
.viewCont .cont{overflow:hidden;}
.viewCont .cont .thum img{width:100%; height:auto;}
.viewCont .cont .thum .thumInfo{padding:8px 16px; color:#999; font-size:13px;}
.viewCont .cont .article{margin:16px; font-size:18px; line-height:28px; font-family:'돋움',Dotum,'굴림',Gulim,Helvetica,sans-serif;}

/* 기사내용 요약 */
.summury_view{margin:16px; padding:10px; border:1px solid #ca7f8d;}
.summury_view .tit{margin-bottom:5px;}
.summury_view .tit strong{font-size:18px; color:#e02631}
.summury_view p{font-size:18px; line-height:24px; font-family:'돋움',Dotum,'굴림',Gulim,Helvetica,sans-serif;}

/* shareBox - 공유하기 */
.shareBox{position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); width:280px; padding:16px; border-radius:10px; background-color:#fff; z-index: 99999;}
.shareBox .head{position:relative; margin-bottom:8px; text-align:center;}
.shareBox .head button{position:absolute; top:0; right:0; width:20px; height:20px; background-color:#fff;}
.shareBox .head button img{width:100%; height:100%;}
.shareBox .inner{display:flex; flex-wrap:wrap; justify-content:flex-start; }
.shareBox .inner button{width:33.33%; padding:16px 0; background-color:#fff;}
.shareBox .inner button img{width:45px; height:45px;}
.shareBox .copyUrl{overflow:hidden; display:flex; width:100%; margin-top:8px;}
.shareBox .copyUrl input{width:220px; height:32px; line-height:32px; padding:0 8px; background-color:#efefef;}
.shareBox .copyUrl button{padding:0 8px; height:32px; background-color:#ababab; color:#000}
/* shareBox_old - 공유하기 */
.shareBox_old {position:relative; overflow:hidden; padding:8px 0 8px 5px;background:#fff;}
.shareBox_old li {float:left; width:16.6%; text-align:center;}
.shareBox_old.t2 li {width:20%;}
.shareBox_old li a img {width:35px;}

/* wordBox - 글자크기 */
.wordBox{position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); width:280px; padding:16px; border-radius:10px; background-color:#fff; z-index: 99999;}
.wordBox .head{position:relative; margin-bottom:8px; text-align:center;}
.wordBox .head button{position:absolute; top:0; right:0; width:20px; height:20px; background-color:#fff;}
.wordBox .head button img{width:100%; height:100%;}
.wordBox .inner button{display:block; width:100%; margin:16px 0; padding-left:24px; background-color:#fff; text-align:left; color:#000;}
.wordBox .inner button.on{background:url(../img/bl_arrow4.png) no-repeat 8px 50%;}
.wordBox .inner button.fs1{font-size:12px;}
.wordBox .inner button.fs2{font-size:13px;}
.wordBox .inner button.fs3{font-size:16px;}
.wordBox .inner button.fs4{font-size:17px;}
.wordBox .inner button.fs5{font-size:20px;}

/* 댓글 영역 */
.replyArea{padding:16px; background-color:#fff;}

/* 이미지 뷰어 */
.photoView {position:relative; width:100%; height:100%; background-color:rgba(45,45,45);}
.photoView .infotop{overflow:hidden; position:fixed; top:0; left:0; width:100%; height:42px; background-color:rgba(0,0,0, .8); z-index: 11;}
.photoView .infotop .mtit{overflow:hidden; margin:0 41px 0 47px; height:42px; font-size:16px; font-weight:normal; letter-spacing: -.5px; line-height:42px; color:#fff;}
.photoView .infotop .mtit a{display:block; height:42px; color:#fff;}
.photoView .infotop .mtit a span{overflow:hidden; display:inline-block; max-width:80%; text-overflow: ellipsis; white-space: nowrap;}
.photoView .infotop .mtit img{width:9px; margin-top:19px; }
.photoView .infotop .otslist{position:absolute; display:block; top:13px; left:16px; width:16px; height:16px; background:url(../img/btn_view_list_ed.gif) no-repeat 0 0; background-size:16px 16px;}
.photoView .infotop .close{position:absolute; top:7px; right:5px; width:14px; height:15px; padding:15px; background:url(../img/btn_close2.png) no-repeat 50% 50%; background-size:14px 15px; z-index: 9;}
/* 이미지뷰어 카테고리 리스트 */
.photoView .categoryBox{display:none; position:absolute; overflow:auto; top:0px; width:100%; height:100%; background:rgb(45,45,45); z-index:10;}
.photoView .categoryBox .category_list{margin-top:50px; }
.photoView .categoryBox .category_list ul li{position:relative; overflow:hidden; margin-bottom:8px;}
.photoView .categoryBox .category_list ul li:first-child{border-top:none;}
.photoView .categoryBox .category_list ul li a{display:block; overflow:hidden; position:relative; letter-spacing: -0.25px;}
.photoView .categoryBox .category_list ul li .thum{position:relative; overflow:hidden; float:left; width:35%; margin-left:16px;}
.photoView .categoryBox .category_list ul li .thum .img{display:block; width:100%; padding-bottom:63.98%; background-size:cover; font-size:0;}
.photoView .categoryBox .category_list ul li .subject{position:absolute; display:table; top:0; left:0; width:100%; height:100%;}
.photoView .categoryBox .category_list ul li .txt{display:block; overflow:hidden; max-height:84px; padding:0 72px 0 42%; font-size:16px; line-height:21px; vertical-align: middle; color:#fff;}
.photoView .categoryBox .category_list ul li .num{position:absolute; top:50%; right:16px; width:17px; height:15px; margin-top:-6px; padding-left:22px; color:#a3a3a3; background:url(../img/ico_img.gif) no-repeat 0 0; background-size:17px 15px; font-size:14px; line-height:15px;}
/* 이미지뷰어 뷰리스트 */
.viewlistBox{position:absolute; display:none; overflow:auto; top:0px; width:100%; height:100%; background:rgb(45,45,45); z-index: 9;}
.viewlistBox .row_list{display:flex; margin-top:50px; padding:0 16px 16px;}
.viewlistBox .row_list .column{flex-basis:50%; max-width:50%; }
.viewlistBox .row_list .column:first-child{padding-right:4px;}
.viewlistBox .row_list .column:last-child{padding-left:4px;}
.viewlistBox .row_list .column img{width:100%; margin-top:8px; }
/* 이미지뷰어 슬라이드부분 */
.imgBody .swiper-container {position:relative; overflow:hidden; height:100%;}
.imgBody .swiper-container .slide{position:absolute; top:0; width:100%; height:100%;}
.imgBody .swiper-container .swiper-wrapper{height:100%;}
.imgBody .swiper-container .slick-track{height:100%;}
.imgBody .swiper-container .swiper-slide{display:table; height:100%;}
.imgBody .swiper-container .frame_img{display:table-cell; height:100%; text-align: center; vertical-align: middle;}
.imgBody .swiper-container .slide div img{display:inline-block; max-width:100%; max-height:100%; vertical-align: middle;}
.imgBody .swiper-container .swiper-button-next{position:absolute; top:50%; right:0; width:36px; height:42px; margin-top:-21px; background:url(../img/next_b_on.png) no-repeat 0 0; background-size:36px 42px;; text-indent: -9999px; z-index: 5;}
.imgBody .swiper-container .swiper-button-prev{position:absolute; top:50%; left:0; width:36px; height:42px; margin-top:-21px; background:url(../img/pre_b_on.png) no-repeat 0 0; background-size:36px 42px;; text-indent: -9999px; z-index: 5;}
/* 이미지뷰어 하단 텍스트 */
.infoBottom{position:absolute; overflow:hidden; bottom:0; left:0; width:100%; height:auto; background-color:rgba(0,0,0, .8); z-index: 8;}
.infoBottom .inner{padding:0 16px;}
.infoBottom h2{display:block; margin-top:16px;}
.infoBottom h2 .txt{overflow:hidden; display:block; margin:16px 85px 16px 0px; height:100%; font-size:16px; letter-spacing: -.4px; color:#fff; font-weight:normal;}
.infoBottom .su{position:absolute; top:16px; right:40px; color:#fff;}
.infoBottom .su .now{font-weight:normal; color:#e02631;}
.infoBottom .ico_down{position:absolute; top:24px; right:16px; width:15px; height:9px; background:url(../img/btn_art_down.gif) no-repeat 0 0; background-size:15px 9px; z-index: 9;}
.infoBottom .ico_up{position:absolute; top:24px; right:16px; width:15px; height:9px; background:url(../img/btn_art_up.gif) no-repeat 0 0; background-size:15px 9px; z-index: 9;}
.infoBottom .txt_sub{display:block; overflow-y:scroll; height:auto; max-height:100px; margin-top:16px; font-size:12px; line-height:20px; color:#fff;}
.infoBottom .date{overflow:hidden; float:left; font-size:12px; line-height:17px; color:#888; margin-top:18px; padding-left:0px;}
.infoBottom .shareBtn{float:right; width:23px; height:20px; margin:18px 0 16px; background:url(../img/btn_share2.png) no-repeat 0 0;}

/* 제보하기 */
.offerBox .slogan{padding:16px; text-align:center; font-size:20px;}
.offerBox .box{margin-top:16px;}
.offerBox .box .type{margin-bottom:16px; text-align:center;}
.offerBox .box .type img{width:60px; height:auto; margin:0 32px;}
.offerBox .box .file{padding:16px;}
.offerBox .box .file .thum{position:relative; width:200px; height:200px; margin:0 auto 8px; background-color:#fff; text-align:center;}
.offerBox .box .file .thum .img{position:absolute; top:50%; left:50%; height:auto; max-width:200px; max-height:200px;
    width: auto;
    max-height: 200px;
    max-width: 100%;
    transition: .5s;
    -webkit-transform: translate(-50%, -50%) scale(1);
    -moz-transform: translate(-50%, -50%) scale(1);
    -o-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
}
.offerBox .box .file .thum button{position:absolute; top:8px; right:8px; width:15px; height:15px; background-color:transparent;}
.offerBox .box .file .thum button img{width:15px; height:15px;}
.offerBox .box .file .txt{text-align:center;}
.offerBox .box .file .size{text-align:center;}
.offerBox .box .info{padding:16px; background-color:#fff;}
.offerBox .box .info ul li {border-bottom:1px solid #ccc;}
.offerBox .box .info ul li input {display:block; width:100%; height:32px; line-height:32px; font-size:16px;}
.offerBox .box .info ul li textarea{display:block; width:100%; height:80px; padding:8px 0; resize:none; font-size:16px;}
.offerBox .box .info .tit{margin-bottom:16px; font-size:16px; color:#e02631; font-weight:bold;}
.offerBox .box .info .txt{padding:8px; border:1px solid #ccc; background-color:#f4f4f4;}
.offerBox .box .info .txt span{display:block; margin-top:8px; }
.offerBox .box .info .txt span:first-child{margin-top:0px;}
.offerBox .jeboBox {padding:16px 0 0; background-color:#fff;}
.offerBox .jeboBox ul {margin-bottom:16px;}
.offerBox .jeboBox ul li{margin-top:4px; padding:0 16px;}
.offerBox .jeboBox ul li:first-child{margin-top:0px;}
.offerBox .jeboBox ul li span{display:inline-block; width:50px;}
.offerBox .jeboBox ul li a{color:#007aff; text-decoration:underline}
.offerBox .kakaoBox{padding:8px 16px 8px 56px; border-bottom:1px solid #ccc; background-image:url(../img/ico_kakao.png); background-repeat:no-repeat; background-position:16px 50%; background-color:#fbe300; }
.offerBox .kakaoBox strong{color:red}

/* 검색 */
.content.sub .searchArea{position:relative; height:40px; padding:16px; border-bottom:1px solid #111; background:#fff;}
.content.sub .searchArea button{position:absolute; top:50%; right:16px; width:40px; height:40px; margin-top:-20px; background-color:transparent;}
.content.sub .searchArea button img{width:24px; height:24px;}
.content.sub .searchArea input{width:100%; height:40px; line-height:40px; padding:0 40px 0 16px; background:#efefef; font-weight:600;}
.content.sub .searchArea input::placeholder {font-weight:400;}

/* footer */
footer {padding:16px; background-color:#363739; text-align:center;}
footer ul{margin-bottom:8px;}
footer ul li{display:inline-block; padding:0 8px;}
footer ul li a{color:#fff; font-weight: 100;}
footer .copy{color:#fff; font-weight: 100;}
footer .copy span{color:#e74b3c;}

/* 올림픽 배너 */
/* 도쿄 올림픽 */
.mainOlympic{margin-top:8px; padding:20px 0; background:url(../img/olympic/bg_beijing.jpg) no-repeat 0 0; background-size:100% 100%; }
.mainOlympic p.tit{position:relative; height:32px;}
.mainOlympic p.tit img {width:204px; height:27px; margin-left:16px;}
.mainOlympic p.tit span{position:absolute; top:-4px; right:16px; width:84px; height:32px; background:url(../img/olympic/bg_dday.png) no-repeat 0 0; background-size:84px 32px; color:#fff; font-size:22px; text-align:center; line-height:32px;}
.mainOlympic .medal{display:flex; justify-content: flex-start; margin:8px 0; padding:0 16px;}
.mainOlympic .medal p{line-height:37px; color:#fff; font-size:20px;}
.mainOlympic .medal p span{font-size:24px; margin-top:-4px;}
.mainOlympic .medal ul{display:flex; justify-content: flex-start;}
.mainOlympic .medal ul li{width:37px; height:37px; line-height:35px; margin-left:15px; text-align:center; font-weight:bold; font-size:20px;}
.mainOlympic .medal ul li.gold{background:url(../img/olympic/ico_gold.png) no-repeat 0 0; background-size:37px 37px;}
.mainOlympic .medal ul li.silver{background:url(../img/olympic/ico_silver.png) no-repeat 0 0; background-size:37px 37px;}
.mainOlympic .medal ul li.bronze{background:url(../img/olympic/ico_bronze.png) no-repeat 0 0; background-size:37px 37px;}
.mainOlympic .th1_list{margin-top:15px; padding:0px;}
.mainOlympic .th1_list .thum{box-sizing: border-box;}
.mainOlympic .th1_list .txt{line-height:20px; height:40px !important; }
.mainOlympic .th1_list {position:relative; overflow:hidden; padding:0 16px;}
.mainOlympic .th1_list .bundle {overflow:hidden; float:left; width:50%;}
.mainOlympic .th1_list .bundle.ml a {margin-right:8px;}
.mainOlympic .th1_list .bundle.mr a {margin-left:8px;}
.mainOlympic .th1_list .bundle a {display:block}
.mainOlympic .th1_list .bundle .thum {position:relative; overflow:hidden; display:block; width:100%;}
.mainOlympic .th1_list .bundle .thum .img {display:block; width:100%; padding-bottom:66.42%; background-size:cover; font-size:0;}
.mainOlympic .th1_list .bundle a .txt {overflow:hidden; display:block; margin-top:5px; height:32px; font-size:16px; letter-spacing:-0.25px; line-height:1.23em;} /* 수정 160325 윤선 */
.mainOlympic .th1_list .bundle a .txt .cl {margin-right:4px; color:#4e78cf;}

/* 대선 배너 */
.mainElection{display:block; width:100%; background-color:#160b51;}
.mainElection a{display:block;}
.mainElection .inner{position:relative; display:block; width:320px; height:42px; margin:0 auto; background:url(../img/event/bg_election22.png?20220309) no-repeat 50% 0; background-size:320px 42px;}
.mainElection .inner p{position:absolute; top:5px; right:0; width:59px; font-size:20px; letter-spacing: -1.5px; color:#ff8a00; text-align:center;}
.mainElection .inner p span{color:#fff;}

/* 베이징 배너 */
.mainBeijing{display:block;  height:42px; background-color:#168fd8; }
.mainBeijing a{display:block;}
.mainBeijing .inner{position:relative; width:320px; margin:0 auto; height:42px; background:url(../img/olympic/bg_beijing22.jpg) no-repeat 100% 0; background-size:180px 42px;}
.mainBeijing .inner img{position:absolute; top:0; left:0; width:180px; height:22px; margin:11px 0 0 0; z-index: 2;}
.mainBeijing .inner .dday{position:absolute; top:7px; right:0; width:58px; height:27px; text-align:center; color:#ff8a00; line-height:27px; letter-spacing: -2px; font-size:20px;}
.mainBeijing .inner .dday span{color:#fff;}
.mainBeijing.after .inner{background:url(../img/olympic/bg_beijing22_2.jpg) no-repeat 100% 0; background-size:180px 42px;}
.mainBeijing.after .inner img{width:149px; height:20px;}
.mainBeijing.after .inner .medal{position:absolute; top:8px; right:0; width:170px;}
.mainBeijing.after .inner .medal p{float:left; margin-left:4px; color:#fff; font-size:14px; letter-spacing:-1px; line-height:22px;}
.mainBeijing.after .inner .medal p span{font-size:19px;}
.mainBeijing.after .inner .medal ul{float:right;}
.mainBeijing.after .inner .medal ul li{float:left; width:26px; height:26px; margin-left:5px; text-align:center; letter-spacing: -1px; text-indent: -1px; line-height:26px; font-weight:bold;}
.mainBeijing.after .inner .medal ul li:first-child{margin-left:0px;}
.mainBeijing.after .inner .medal ul li.gold{background:url(../img/olympic/ico_gold.png) no-repeat 0 0; background-size:26px 26px; } 
.mainBeijing.after .inner .medal ul li.silver{background:url(../img/olympic/ico_silver.png) no-repeat 0 0; background-size:26px 26px;} 
.mainBeijing.after .inner .medal ul li.bronze{background:url(../img/olympic/ico_bronze.png) no-repeat 0 0; background-size:26px 26px;} 

/* 오늘의 주요일정 */
.planList{padding-top:8px; border-top:1px solid #f0f0f0;}
.planList li .box{position:relative; padding:0 0 0 32px;}
.planList li .ico{position:absolute; top:2px; left:0;}
.planList li p{overflow:hidden;}

/* 제20대 대통령선거 */
.flora{font-family:'Lora','맑은고딕','Malgun Gothic','돋움',dotum,sans-serif;}
.fnanums{font-family:'NanumSquare','맑은고딕','Malgun Gothic','돋움',dotum,sans-serif;}
.fnoto{font-family:'Noto Sans KR','맑은고딕','Malgun Gothic','돋움',dotum,sans-serif;}

.election22--box{overflow:hidden; height:394px;}
.election22--box .election22--head{position:relative; background-color:#4d42dc;}
.election22--box .election22--head .logo{margin-left:2px;}
.election22--box .election22--head .logo img{width:228px; height:38px;}
.election22--box .election22--head .link{position:absolute; top:8px; right:10px; }
.election22--box .election22--head .link img{width:103px; height:22px;}
.election22--box .elecSwiper_nav{height:32px; border-bottom:1px solid #ccc; background-color:#cee0f3;}
.election22--box .elecSwiper_nav .swiper-slide{width:47px; text-align:center;}
.election22--box .elecSwiper_nav .swiper-slide .slide-inner{position:relative; font-size:16px; line-height:31px;}
.election22--box .elecSwiper_nav .swiper-slide .slide-inner:after{content:''; display:block; position:absolute; top:50%; right:0; width:1px; height:15px; margin-top:-7px; background-color:#cccccc;}
.election22--box .elecSwiper_nav .swiper-slide:last-child .slide-inner:after{display:none;}
.election22--box .elecSwiper_nav .swiper-slide.swiper-slide-thumb-active .slide-inner{font-weight:bold;}
.election22--box .elecSwiper .totalVote{position:relative; height:38px; line-height:38px; padding:0 10px; border-bottom:1px solid #ccc; background-color:#fff; font-weight:600;}
.election22--box .elecSwiper .totalVote .txt{font-size:18px;}
.election22--box .elecSwiper .totalVote .percent{font-size:22px;}
.election22--box .elecSwiper .totalVote .percent i{font-style:normal; font-size:15px;}
.election22--box .elecSwiper .totalVote .vote{font-size:22px;}
.election22--box .elecSwiper .totalVote .vote i{font-style:normal; font-size:15px;}
.election22--box .elecSwiper .totalVote .time{position:absolute; top:0; right:10px; font-size:13px; color:#666666; }

/* topRank 백그라운드 득표율 컬러 및 당 로고 사이즈 */
.election22--box .topRank.ahn1lee2{background:url(../img/election22/bg_ahn1lee2.png) no-repeat 0 0; background-size:100% auto;}
.topRank.ahn1lee2 .rank1 .percent{color:#e17531}
.topRank.ahn1lee2 .rank1 .name img{width:66px; height:14px; }
.topRank.ahn1lee2 .rank2 .percent{color:#0061a3}
.topRank.ahn1lee2 .rank2 .name img{width:72px; height:12px; }
.election22--box .topRank.ahn1yoon2{background:url(../img/election22/bg_ahn1yoon2.png) no-repeat 0 0; background-size:100% auto;}
.topRank.ahn1yoon2 .rank1 .percent{color:#e17531}
.topRank.ahn1yoon2 .rank1 .name img{width:66px; height:14px; }
.topRank.ahn1yoon2 .rank2 .percent{color:#ca4441}
.topRank.ahn1yoon2 .rank2 .name img{width:72px; height:17px; }
.election22--box .topRank.lee1ahn2{background:url(../img/election22/bg_lee1ahn2.png) no-repeat 0 0; background-size:100% auto;}
.topRank.lee1ahn2 .rank1 .percent{color:#0061a3}
.topRank.lee1ahn2 .rank1 .name img{width:72px; height:12px; }
.topRank.lee1ahn2 .rank2 .percent{color:#e17531}
.topRank.lee1ahn2 .rank2 .name img{width:66px; height:14px; }
.election22--box .topRank.lee1yoon2{background:url(../img/election22/bg_lee1yoon2.png) no-repeat 0 0; background-size:100% auto;}
.topRank.lee1yoon2 .rank1 .percent{color:#0061a3}
.topRank.lee1yoon2 .rank1 .name img{width:72px; height:12px; }
.topRank.lee1yoon2 .rank2 .percent{color:#ca4441}
.topRank.lee1yoon2 .rank2 .name img{width:72px; height:17px; }
.election22--box .topRank.yoon1ahn2{background:url(../img/election22/bg_yoon1ahn2.png) no-repeat 0 0; background-size:100% auto;}
.topRank.yoon1ahn2 .rank1 .percent{color:#ca4441}
.topRank.yoon1ahn2 .rank1 .name img{width:72px; height:17px; }
.topRank.yoon1ahn2 .rank2 .percent{color:#e17531}
.topRank.yoon1ahn2 .rank2 .name img{width:66px; height:14px; }
.election22--box .topRank.yoon1lee2{background:url(../img/election22/bg_yoon1lee2.png) no-repeat 0 0; background-size:100% auto;}
.topRank.yoon1lee2 .rank1 .percent{color:#ca4441}
.topRank.yoon1lee2 .rank1 .name img{width:72px; height:17px; }
.topRank.yoon1lee2 .rank2 .percent{color:#0061a3}
.topRank.yoon1lee2 .rank2 .name img{width:72px; height:12px; }

.election22--box .topRank{position:relative; display:flex; justify-content:space-between; height:182px;}
.election22--box .topRank .rank1{position:relative; width:50%;}
.election22--box .topRank .rank1 .pic{position:relative; margin:10px 0 0 10px; width:95px; height:105px}
.election22--box .topRank .rank1 .pic img{width:100%; height:auto;}
.election22--box .topRank .rank1 .pic .ico{position:absolute; bottom:-5px; left:-3px; }
.election22--box .topRank .rank1 .pic .ico img{width:43px; height:23px;}
.election22--box .topRank .rank1 .percent{position:absolute; top:20px; left:109px; font-size:34px; font-weight:bold; letter-spacing: -1px;}
.election22--box .topRank .rank1 .percent span{font-size:22px; }
.election22--box .topRank .rank1 .percent span i{font-size:14px; font-style: normal; font-weight:bold;}
.election22--box .topRank .rank1 .percent.novote{font-size:22px; font-weight:normal}
.election22--box .topRank .rank1 .vote{position:absolute; top:56px; left:108px; font-size:14px; color:#666; letter-spacing:-1px;}
.election22--box .topRank .rank1 .name{display:inline-block; margin:5px 0 0 10px; width:95px; font-size:22px;}
.election22--box .topRank .rank2{position:relative; width:50%; text-align:right;}
.election22--box .topRank .rank2 .pic{position:relative; float:right; width:95px; height:105px; margin:10px 10px 0 0;}
.election22--box .topRank .rank2 .pic img{width:100%; height:auto;}
.election22--box .topRank .rank2 .pic .ico{position:absolute; bottom:-5px; left:-3px; }
.election22--box .topRank .rank2 .pic .ico img{width:43px; height:23px;}
.election22--box .topRank .rank2 .percent{position:absolute; top:60px; right:108px; font-size:34px; font-weight:bold; letter-spacing: -1px;}
.election22--box .topRank .rank2 .percent span{font-size:22px;}
.election22--box .topRank .rank2 .percent span i{font-size:14px; font-style: normal; font-weight:bold;}
.election22--box .topRank .rank2 .percent.novote{font-size:22px; font-weight:normal}
.election22--box .topRank .rank2 .vote{position:absolute; top:94px; right:108px; font-size:14px; color:#666; letter-spacing:-1px;}
.election22--box .topRank .rank2 .name{clear:both; display:inline-block; float:right; width:95px; margin:5px 10px 0 0; font-size:22px;}
.election22--box .topRank .pic .ico.sure{position:absolute; top:-10px; left:-10px;}
.election22--box .topRank .pic .ico.sure img{width:35px; height:40px;}
.election22--box .topRank .pic .ico.strong{position:absolute; top:-10px; left:-10px;}
.election22--box .topRank .pic .ico.strong img{width:35px; height:40px;}
.election22--box .topRank .pic .ico.win{position:absolute; top:-10px; left:-10px;}
.election22--box .topRank .pic .ico.win img{width:49px; height:45px;}

.election22--box .topRank .gap{position:absolute; top:133px; left:50%; width:111px; height:29px; line-height:29px; margin-left:-55px; background:url(../img/election22/bg_total.png) no-repeat 0 0; background-size:111px 29px; text-align:center; font-size:17px}
.election22--box .topRank .gap span{font-size:15px;}
.election22--box .midRank{background-color:#fff;}
.election22--box .midRank .lee .name img{width:72px; height:12px;}
.election22--box .midRank .lee .percent {color:#0061a3;}
.election22--box .midRank .yoon .name img{width:72px; height:17px;}
.election22--box .midRank .yoon .percent {color:#ca4441;}
.election22--box .midRank .ahn .name img{width:66px; height:14px;}
.election22--box .midRank .ahn .percent {color:#e17531;}
.election22--box .midRank .sim .name img{width:38px; height:24px;}
.election22--box .midRank .sim .percent {color:#e1a92f;}
.election22--box .midRank .hu .name img{width:66px; height:12px;}
.election22--box .midRank .hu .percent {color:#e51f1f;}

.election22--box .midRank .rank3{display:flex; align-items: center; height:50px; border-bottom:1px solid #ccc;}
.election22--box .midRank .rank3 .ico{width:57px; text-align:center;}
.election22--box .midRank .rank3 .ico img{width:37px; height:20px;}
.election22--box .midRank .rank3 .name{width:140px; height:50px; line-height:50px; font-size:18px;}
.election22--box .midRank .rank3 .name span img{vertical-align: bottom; margin-bottom:15px;}
.election22--box .midRank .rank3 .percent {width:58px; font-size:26px; }
.election22--box .midRank .rank3 .percent span{font-size:15px;}
.election22--box .midRank .rank3 .percent span i{font-size:12px;}
.election22--box .midRank .rank3 .percent.novote{font-size:18px; letter-spacing: -1px;}
.election22--box .midRank .rank3 .vote{font-size:18px; color:#666;}
.election22--box .midRank .rank3 .vote span{font-size:15px;}
.election22--box .midRank .rank4{display:flex; align-items: center; height:50px; border-bottom:1px solid #e5e5e5;}
.election22--box .midRank .rank4 .ico{width:57px;text-align:center;}
.election22--box .midRank .rank4 .ico img{width:37px; height:20px;}
.election22--box .midRank .rank4 .name{width:140px; height:50px; line-height:50px; font-size:18px;}
.election22--box .midRank .rank4 .name span img{vertical-align: bottom; margin-bottom:15px;}
.election22--box .midRank .rank4 .percent {width:58px; font-size:26px; }
.election22--box .midRank .rank4 .percent span{font-size:15px;}
.election22--box .midRank .rank4 .percent span i{font-size:12px;}
.election22--box .midRank .rank4 .percent.novote{font-size:18px; letter-spacing: -1px;}
.election22--box .midRank .rank4 .vote{font-size:18px; color:#666;}
.election22--box .midRank .rank4 .vote span{font-size:15px;}
.election22--box .midRank .rank5{display:flex; align-items: center; height:50px; border-bottom:1px solid #e5e5e5;}
.election22--box .midRank .rank5 .ico{width:57px;text-align:center;}
.election22--box .midRank .rank5 .ico img{width:37px; height:20px;}
.election22--box .midRank .rank5 .name{width:140px; height:50px; line-height:50px; font-size:18px;}
.election22--box .midRank .rank5 .name span img{vertical-align: bottom; margin-bottom:15px;}
.election22--box .midRank .rank5 .percent {width:58px; font-size:26px; }
.election22--box .midRank .rank5 .percent span{font-size:15px;}
.election22--box .midRank .rank5 .percent span i{font-size:12px;}
.election22--box .midRank .rank5 .percent.novote{font-size:18px; letter-spacing: -1px;}
.election22--box .midRank .rank5 .vote{font-size:18px; color:#666;}
.election22--box .midRank .rank5 .vote span{font-size:15px;}
.election22--box .midRank .ico.win img{width:37px; height:33px; }
.election22--box .midRank .ico.sure img{width:28px; height:33px;}
.election22--box .midRank .ico.strong img{width:28px; height:33px;}

/* 단일화 */
.election22--box.type2{height:292px;}
/* 심상정 사퇴 */
.election22--box.type3{height:343px;}
/* 출구조사 */
.election22--box.type4{height:259px;}
.election22--box.type4 .election22--head .logo {margin-left:10px;}
.election22--box.type4 .election22--head .logo img{width:340px; height:38px;}
.election22--box.type4 .topRank{height:160px;}
.election22--box.type4 .topRank .rank1 .name{display:block; width:100%;}
.election22--box.type4 .topRank .rank1 .name img{vertical-align:initial}
.election22--box.type4 .topRank .rank2 .name{display:flex; flex-direction: row-reverse; align-items: flex-end; width:100%;}
.election22--box.type4 .topRank .rank2 .name img{margin:0 5px 5px 0;}
.election22--box.type4 .topRank .rank1 .ico img{width:57px; height:19px;}
.election22--box.type4 .topRank .rank2 .ico img{width:57px; height:19px;}
.election22--box.type4 .midRank .rank3 .ico {width:73px;}
.election22--box.type4 .midRank .rank3 .ico img{width:53px; height:18px;}
.election22--box.type4 .midRank .rank4 .ico {width:73px;}
.election22--box.type4 .midRank .rank4 .ico img{width:53px; height:18px;}

/* 출구조사 배너 */
.mainElection2{display:block; width:100%; background-color:#160b51;}
.mainElection2 a{display:block;}
.mainElection2 .inner{position:relative; display:block; width:262px; height:42px; margin:0 auto; background:url(../img/event/bg_election22_2.png) no-repeat 50% 0; background-size:262px 42px;}
.mainElection2 .inner p{position:absolute; top:5px; right:0; width:59px; font-size:20px; letter-spacing: -1.5px; color:#ff8a00; text-align:center;}
.mainElection2 .inner p span{color:#fff;}

/* 당선 배너 */
.mainElec_final{padding:0 10px; }
.mainElec_final{background-repeat:no-repeat; background-position:0 0; background-size:auto 100%; }
.mainElec_final.yoon{background-image:url(../img/election22/elec22_reg2.png); background-color:#bb2d38;}
.mainElec_final.lee{background-image:url(../img/election22/elec22_reg.png); background-color:#0b3b76;}
.mainElec_final .inner{position:relative; min-width:310px; margin:0 auto;}
.mainElec_final .inner .title{position:relative; padding-top:7px; text-align:center;}
.mainElec_final .inner .title img.slo{width:166px; height:20px}
.mainElec_final .inner .title .more{position:absolute; top:10px; right:0px; }
.mainElec_final .inner .title img.more{width:53px; height:14px;}
.mainElec_final .rank{display:flex; line-height:40px; align-items: center; justify-content: center;}
.mainElec_final .rank .ico{width:37px; margin:0 5px 0 0; text-align:center;}
.mainElec_final .rank .ico img{width:40px; height:37px;}
.mainElec_final .rank .name{margin-right:10px;}
.mainElec_final.yoon .rank .name img{width:125px; height:25px; }
.mainElec_final.lee .rank .name img{width:140px; height:25px; }
.mainElec_final .rank .name span img{vertical-align: bottom; margin-bottom:15px;}
.mainElec_final.lee .percent{color:#e6f1f8;}
.mainElec_final.yoon .percent{color:#ffe7e5;}

.mainElec_final .rank .percent {width:52px; margin-right:10px; padding-top:3px; font-size:29px; letter-spacing: -2px;}
.mainElec_final .rank .percent span{font-size:18px;}
.mainElec_final .rank .percent span i{font-size:14px;}
.mainElec_final .rank .vote{margin-top:6px; font-size:15px; color:#eee; letter-spacing:-1px;}
.mainElec_final .rank .vote span{font-size:13px;}

@media (max-width: 320px) {
    /* 대선배너 */
    .mainElection .inner{position:relative; display:block; width:320px; height:42px; margin:0 auto; background:url(../img/event/bg_election22.png) no-repeat 50% 0; background-size:300px 42px;}
    .mainElection .inner p{top:8px; right:10px; width:56px; font-size:18px;}

    /* 베이징 배너 */
    .mainBeijing .inner{width:300px;}
    .mainBeijing.after .inner .medal p{margin-left:24px; font-size:12px;}
    .mainBeijing.after .inner .medal ul li{float:left; width:22px; height:22px; margin-left:5px; text-align:center; letter-spacing: -1px; text-indent: -1px; line-height:22px; font-weight:bold; font-size:13px;}
    .mainBeijing.after .inner .medal ul li:first-child{margin-left:0px;}
    .mainBeijing.after .inner .medal ul li.gold{background:url(../img/olympic/ico_gold.png) no-repeat 0 0; background-size:22px 22px; } 
    .mainBeijing.after .inner .medal ul li.silver{background:url(../img/olympic/ico_silver.png) no-repeat 0 0; background-size:22px 22px;} 
    .mainBeijing.after .inner .medal ul li.bronze{background:url(../img/olympic/ico_bronze.png) no-repeat 0 0; background-size:22px 22px;} 

}