@charset "utf-8";

#wrap{background-color:#EBEDF5;}
.container .box-content{margin-bottom:200px;}

.subRsp-style1{display:flex; justify-content: flex-start; width:1200px; margin:0 auto; padding-top:30px;}

.titStyle1{margin-bottom:12px; padding-left:16px; background:url(../images/ico_tit.png) no-repeat 0 55%; font-size:24px; line-height:1.5; font-weight:bold;}
.titStyle1 a{padding-right:20px; background:url(../images/ico_arrow.png) no-repeat 100% 55%; }

.titStyle2{margin-bottom:12px; font-size:20px; line-height:1.5; font-weight:bold;}
.titStyle2 a{padding-right:18px; background:url(../images/ico_arrow.png) no-repeat 100% 8px; background-size:10px 15px}

.header{background:transparent linear-gradient(97deg, #0C1143 0%, #202364 52%, #6B1657 100%) 0% 0% no-repeat padding-box;}
.header .box-inner{width:1200px; margin:0 auto; padding:20px 0; background:url(../images/img_header.png) no-repeat 100% 100%;}
.header .box-inner .newsis-logo .logo a{margin-right:13px;}
.header .box-inner .newsis-logo .logo span{color:#657AED; font-size:15px; line-height:1.2; font-weight:bold;}
.header .box-inner .worldcup-logo{margin-bottom:30px;}
.header .box-inner nav .swiper-slide{width:auto; padding:8px 28px 9px; border-radius:22px; color:#fff; font-size:22px; line-height:1.2;}
.header .box-inner nav .swiper-slide.active{background:transparent linear-gradient(270deg, #D91A5B 0%, #6200E9 100%) 0% 0% no-repeat padding-box;}

.box-mainTop{margin-bottom:60px; background:transparent linear-gradient(118deg, #7510B1 0%, #101449 40%, #CF1766 100%) 0% 0% no-repeat padding-box;}
.box-mainTop .box-inner{width:1200px; margin:0 auto; padding:30px 0;}
.box-mainTop .box-inner .box-schedule{margin-bottom:30px;}
.box-mainTop .box-inner .box-schedule .tit{margin-bottom:20px; font-size:24px; font-weight:bold; color:#fff; line-height:1.5; text-align:center;}
.box-mainTop .box-inner .box-schedule .inner{display:flex; justify-content: space-between;}
.box-mainTop .box-inner .box-schedule .inner .schedule{flex:0 0 calc(30.83% - 60px); display: flex; justify-content: space-between; padding:16px 30px; border-radius:8px; background-color:#EBEDF5;}
.box-mainTop .box-inner .box-schedule .inner .schedule .left{flex:0 1 74px; text-align: center; font-weight:bold; }
.box-mainTop .box-inner .box-schedule .inner .schedule .left img{width:100%; margin-bottom:4px;}
.box-mainTop .box-inner .box-schedule .inner .schedule .right{flex:0 1 74px; text-align: center; font-weight:bold; }
.box-mainTop .box-inner .box-schedule .inner .schedule .right img{width:100%; margin-bottom:4px;}
.box-mainTop .box-inner .box-schedule .inner .schedule .info{flex:0 0 40%; text-align:center; }
.box-mainTop .box-inner .box-schedule .inner .schedule .info .time span{position:relative; padding:0 8px; font-size:16px; font-weight:bold; color:#000; line-height:1; z-index: 2;}
.box-mainTop .box-inner .box-schedule .inner .schedule .info .time span:before{content:''; position:absolute; left:0; bottom:-2px; width:100%; height:60%; border-radius:6px; background-color:#BDC4F1; z-index: -1;}
.box-mainTop .box-inner .box-schedule .inner .schedule .info .stadium{overflow:hidden; font-size:13px; color:#777; line-height:1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}   
.box-mainTop .box-inner .box-schedule .inner .schedule .name{position:relative; overflow:hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.box-mainTop .box-inner .box-schedule .inner .schedule .score{margin-top:8px; font-weight:bold; font-size:20px; text-align:center;}
.box-mainTop .box-inner .box-schedule .inner .schedule .score span.end{margin:0 12px; padding:4px 8px; border-radius:4px; border:1px solid #ccc; background-color:#fff; color:#777; font-size:12px; line-height:1; font-weight:normal;}
.box-mainTop .box-inner .box-schedule .inner .schedule .score span.ing{margin:0 12px; padding:4px 8px; border-radius:4px; border:1px solid #657AED; background-color:#fff; color:#657AED;; font-size:12px; line-height:1; font-weight:normal;}

/*  */
.box-mainTop .box-inner .box-topNews .swiper-wrapper{display:grid; grid-template-columns: 61.404% 33.334%; grid-template-rows: auto auto 1fr; column-gap: 5.3%; align-items: start;}
.box-mainTop .box-inner .box-topNews .swiper-wrapper .num1{grid-row:1 / 4; grid-column: 1}
.box-mainTop .box-inner .box-topNews .swiper-pagination{display:none;}
.box-mainTop .box-inner .box-topNews .swiper-pagination-bullet{background-color:#ccc; opacity: 1;}
.box-mainTop .box-inner .box-topNews .swiper-pagination-bullet-active{width:24px; border-radius:4px; background-color:#C41573;}
.box-mainTop .box-inner .box-topNews{padding:30px; border-radius:8px; background-color:#EBEDF5;}
.box-mainTop .box-inner .box-topNews .thumCont{overflow:hidden; position:relative; width:100%; height:0; margin-bottom:8px;  border-radius:8px;}
.box-mainTop .box-inner .box-topNews .thumCont img{position:absolute; top:0; left:0; width:100%; min-height:100%; object-fit: cover;}

.box-mainTop .box-inner .box-topNews .num1 .thumCont{padding-bottom:62.43%;}
.box-mainTop .box-inner .box-topNews .num1 .titCont .tit{overflow:hidden; margin-bottom:8px; font-size:38px; line-height:1.4; font-weight:bold; text-align:center;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.box-mainTop .box-inner .box-topNews .num1 .txtCont .txt{overflow:hidden; font-size:15px; line-height:1.5; color:#555;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.box-mainTop .box-inner .box-topNews .num1 .linkNews li{overflow:hidden; position:relative; padding-left:12px; font-size:15px; line-height:1.5; color:#555;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.box-mainTop .box-inner .box-topNews .num1 .linkNews li:after{content:''; position:absolute; top:0; left:0; top:8px; width:4px; height:4px; border-radius:50%; background-color:#4B5564}


.box-mainTop .box-inner .box-topNews .num2{grid-column: 2; grid-row: 1; margin-bottom:30px;}
.box-mainTop .box-inner .box-topNews .num2 .thumCont{padding-bottom:62.1%;}
.box-mainTop .box-inner .box-topNews .num2 .titCont .tit{overflow:hidden; font-size:20px; line-height:1.4; font-weight:bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.box-mainTop .box-inner .box-topNews .num3{grid-column: 2; grid-row: 2;}
.box-mainTop .box-inner .box-topNews .num3 .thumCont{padding-bottom:62.1%;}
.box-mainTop .box-inner .box-topNews .num3 .titCont .tit{overflow:hidden; font-size:20px; line-height:1.4; font-weight:bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.box-listArticle{width:1200px; margin:0 auto 30px;}
.box-listArticle .listArticle{display:flex; flex-wrap:wrap; }
.box-listArticle .listArticle .box-article{flex:0 0 31.667%; margin-right:2.5%; margin-bottom:30px;}
.box-listArticle .listArticle .box-article:nth-child(3n){margin-right:0px;}
.box-listArticle .listArticle .box-article .thumCont{overflow:hidden; position:relative; width:100%; height:0; margin-bottom:8px; padding-bottom:62.106%; border-radius:8px;}
.box-listArticle .listArticle .box-article .thumCont img{position:absolute; top:0; left:0; width:100%; min-height:100%; object-fit:cover;}
.box-listArticle .listArticle .box-article .titCont .cate{font-size:13px; line-height:1.2; font-weight:bold; color:#657AED;}
.box-listArticle .listArticle .box-article .titCont .tit{overflow:hidden; font-size:18px; line-height:1.5; font-weight:bold; color:#000;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.box-visualList{display:flex; justify-content:space-between; width:1200px; margin:0 auto;}
.box-visualList .photoList {position:relative; overflow:hidden; flex:0 0 47.5%; margin-right:5%;}
.box-visualList .photoList .thumCont{overflow:hidden; position:relative; width:100%; height:0; margin-bottom:8px; padding-bottom:62.106%; border-radius:8px;}
.box-visualList .photoList .thumCont img{position:absolute; top:0; left:0; width:100%; min-height:100%; object-fit:cover;}
.box-visualList .photoList .titCont .tit{overflow:hidden; font-size:18px; line-height:1.5; font-weight:bold; 
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.box-visualList .photoList .photoSwiper{overflow:visible}
.box-visualList .photoList .swiper-pagination{position:absolute; top:-36px; height:8px; text-align:right;}
.box-visualList .photoList .swiper-pagination-bullet-active{width:24px; border-radius:4px; background-color:#C41573;}

.box-visualList .graphicList {overflow:hidden; flex:0 0 47.5%;}
.box-visualList .graphicList .thumCont{overflow:hidden; position:relative; width:100%; height:0; margin-bottom:8px; padding-bottom:62.106%; border-radius:8px;}
.box-visualList .graphicList .thumCont img{position:absolute; top:0; left:0; width:100%; min-height:100%; object-fit:cover;}
.box-visualList .graphicList .titCont .tit{overflow:hidden; font-size:18px; line-height:1.5; font-weight:bold; 
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.box-visualList .graphicList .graphSwiper{overflow:visible}
.box-visualList .graphicList .swiper-pagination{position:absolute; top:-36px; height:8px; text-align:right;}
.box-visualList .graphicList .swiper-pagination-bullet-active{width:24px; border-radius:4px; background-color:#C41573;}

/* 서브페이지 */
.box-content .box-inner.subRsp-style1 .aside-left{overflow:hidden; flex:1 0 70%;}
.box-content .box-inner.subRsp-style1 .aside-right{overflow:hidden; flex:0 0 calc(30% - 30px); margin-left:30px; padding:0 0 30px 29px; border-left:1px solid #ccc; box-sizing: border-box;}

.box-subTit {margin-bottom:20px;}
.box-subTit .subtitSwiper{height:34px;}
.box-subTit .subtitSwiper .swiper-wrapper{align-items: center;}
.box-subTit .subtitSwiper .swiper-slide {width:auto; height:auto; margin-right:8px;}
.box-subTit .subtitSwiper .swiper-slide.active a{border:none; background-color:#C41573; color:#fff;}
.box-subTit .subtitSwiper .swiper-slide:last-child{margin-right:0px;}
.box-subTit .subtitSwiper .swiper-slide a{padding:3px 16px; border-radius:17px; border:1px solid #ccc; background:#fff; font-size:16px; line-height:24px; color:#777777; font-weight:bold;}

/* 뉴스페이지 */
.box-listArticle2 .listArticle .box-article{margin-bottom:16px; padding-bottom:16px; border-bottom:1px solid #ccc;}
.box-listArticle2 .listArticle .box-article article{display:flex; justify-content: flex-start;}
.box-listArticle2 .listArticle .box-article article .thumCont{flex:0 0 23.81%; overflow:hidden; position:relative; height:0; margin-right:20px; padding-bottom:15%; border-radius:4px; }
.box-listArticle2 .listArticle .box-article article .thumCont img{position:absolute; top:0; left:0; width:100%; min-height:100%; object-fit: cover;}
.box-listArticle2 .listArticle .box-article article .layCont{overflow:hidden; flex:1 0 0;}
.box-listArticle2 .listArticle .box-article article .titCont{margin-bottom:8px;}
.box-listArticle2 .listArticle .box-article article .titCont .tit{overflow:hidden; font-size:20px; line-height:1.5; color:#000; font-weight:bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.box-listArticle2 .listArticle .box-article article .txtCont .txt{overflow:hidden; margin-bottom:8px; font-size:15px; line-height:1.5; color:#555; 
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
} 
.box-listArticle2 .listArticle .box-article article .txtCont .info{font-size:13px; line-height:1.2; color:#555;}

/* aside 많이 본 기사 */
.asideR-box1{margin-bottom:30px;}
.box-mostView article{padding:16px 0; border-bottom:1px solid #ccc;}
.box-mostView article:first-child{padding-top:0px;}
.box-mostView article:last-child{border-bottom:none;}
.box-mostView article{display:flex; justify-content: flex-start; align-items: center;}
.box-mostView article:hover {text-decoration:none;}
.box-mostView article:hover .txtCont {text-decoration: underline;}
.box-mostView article p.rank{flex:0 0 28px; font-size:24px; font-weight:bold; line-height:24px; text-align:left;}
.box-mostView article p.rank.c{color:#C41573;}
.box-mostView article .titCont{flex:1 0 51.33%; margin:0 20px 0 11px;}
.box-mostView article .titCont .tit{overflow:hidden; font-size:16px; font-weight:bold; line-height:25px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.box-mostView article .thumCont{overflow:hidden; position:relative; flex:1 1 28.33%; height:0; padding-bottom:21.334%; border-radius:4px;}
.box-mostView article .thumCont img{position:absolute; top:0; left:0; width:100%; min-height:100%; object-fit: cover;}

/* aside 현장포토 */

.box-asidePhotoG{margin-bottom:30px;}
.box-asidePhotoG article{margin-bottom:16px;}
.box-asidePhotoG article:last-child{margin-bottom:0px;}
.box-asidePhotoG .thumCont{overflow:hidden; position:relative; width:100%; height:0; margin-bottom:8px; padding-bottom:72%; border-radius:4px;}
.box-asidePhotoG .thumCont img{position:absolute; top:0; left:0; width:100%; min-height:100%; object-fit: cover;}
.box-asidePhotoG .titCont .tit{overflow:hidden; font-size:18px; font-weight:bold; line-height:1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* 포토페이지,그래픽뉴스페이지 */
.box-listArticle3{width:100%;}
.box-listArticle3 .listArticle{display:flex; justify-content: flex-start; flex-wrap:wrap}
.box-listArticle3 .listArticle .box-article{flex:0 0 calc(25% - 18px); margin:0 24px 24px 0;}
.box-listArticle3 .listArticle .box-article:nth-child(4n){margin-right:0px;}
.box-listArticle3 .listArticle .box-article .thumCont{overflow: hidden; position: relative; width: 100%; height: 0; margin-bottom: 8px; padding-bottom: 74.17%; border: 1px solid #ccc; border-radius: 4px;  box-sizing: border-box;}
.box-listArticle3 .listArticle .box-article .thumCont img{max-width: 100%; width: auto; height: auto; max-height: 100%; margin: 0 auto;}
.box-listArticle3 .listArticle .box-article .thumCont figure{position: absolute; top: 0; left: 0; overflow: hidden; width: 100%; height: 100%;}
.box-listArticle3 .listArticle .box-article .thumCont a{display: flex; width: 100%; height: 100%; text-align: center; align-items: center;}
.box-listArticle3 .listArticle .box-article .titCont .tit{overflow:hidden; font-size:18px; line-height:1.5; font-weight:bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* 페이징 */
.box-page{display:flex; justify-content: center; align-items: center; padding-bottom:30px; }
.box-page button{opacity:.5;}
.box-page button:hover{opacity: 1;}
.box-page button.prev{margin-right:18px;}
.box-page button.pprev{margin-right:18px;}
.box-page button.next{margin-left:18px;}
.box-page button.nnext{margin-left:18px;}
.box-page a{display:block; width:34px; height:34px; margin:0 4px; line-height:32px; text-align:center; color:#555; font-size:14px;}
.box-page a.active{background-color:#C41573; color:#fff; border-radius:50%;}


footer{background:transparent linear-gradient(95deg, #0C1143 0%, #202364 43%, #9E0040 100%) 0% 0% no-repeat padding-box; color:#fff; font-size:13px; line-height:1;}
footer .box-inner{display:flex; justify-content: flex-start; align-items: center; width:1200px; margin:0 auto; padding:30px 0;}
footer .box-inner .logo{margin-right:64px;}
footer .box-inner .info ul {display:flex; justify-content: flex-start; flex-wrap: wrap;}
footer .box-inner .info ul li{position:relative; margin:0 12px 12px 0; padding-right:12px;} 
footer .box-inner .info ul li:after{content:''; position:absolute; top:50%; right:0; width:1px; height:12px; margin-top:-6px; background-color:#ccc;}
footer .box-inner .info p{width:100%; padding-top:12px; border-top:1px solid #ccc;}
