@import url('../css/fontawesome.css');
@import url('../css/NotoSans.css');
@import url('../css/NotoSerif.css');
@import url('../css/MyriadPro.css');
@import url('../css/Roboto.css');
@import url('../css/common.css');

.main_title h1{color: #000; font-size: 24px; line-height: 1; gap:16px; position:relative; padding-bottom:16px;}
.main_title h1 *{font-family:'NotoSans-Bold', sans-serif;}
.main_title h1:before{content:''; display: block; margin-top: 10px; width: 45px; height: 4px; background-color: #006CB7; position:absolute; bottom:0; left:0;}
.main_title_slick_ul a{height: 24px; box-sizing: border-box; border-radius: 24px; border: 1px solid #dbdbdb; line-height: 22px; text-align: center; color: #000; text-decoration: none; display: block; padding: 0 12px; font-weight: 600; font-size:12px; transition-duration:0s;}

.main_title_slick_ul a:hover{background:#00ADBD; color:#fff;}
.main_title_slick_ul .prev a:before{content:''; width:12px; height:12px; display:inline-block; background:url('../image/title_arrow01.png') center center no-repeat; vertical-align:middle; margin-top:-2px; margin-right:3px;}
.main_title_slick_ul .prev a:hover:before{background:url('../image/title_arrow01_on.png') center center no-repeat;}
.main_title_slick_ul .next a:after{content:''; width:12px; height:12px; display:inline-block; background:url('../image/title_arrow02.png') center center no-repeat; vertical-align:middle; margin-top:-2px; margin-left:3px;}
.main_title_slick_ul .next a:hover:after{background:url('../image/title_arrow02_on.png') center center no-repeat;}
.main_top_wrap{gap:20px;}

.main_visual_slide01{width:500px; background:#F2F2F2; padding:15px; box-sizing:border-box; flex-grow: 0; flex-shrink: 0; position:relative;}
.main_visual_slide01 img{width:100%;cursor: zoom-in;}
.main_visual_slide01 .swiper-slide{padding:15px; box-sizing:border-box;}
.main_visual_controller{position:absolute; bottom:15px; right:15px; z-index:2; gap:10px;}
.main_visual_pagination{gap:10px;}
.main_visual_pagination span{cursor:pointer; width:10px; height:10px; background:#000; opacity:1;}
.main_visual_pagination span.swiper-pagination-bullet-active{background:#808080;}
.main_visual_buttons{}

.play_controller button{font-size:0; border:0; background:transparent; width:12px; height:12px;}
.play_controller button:before{font-size:11px;}
.play_controller #play-button{display:none;}
.play_controller.stop #play-button{display:block;}
.play_controller.stop #stop-button{display:none;}
.slider_playt_f button:before, .slider_playt_a button:before{font-family: "Font Awesome 6 Free"; display:block;width: 10px; font-size: 13px; line-height: 10px; text-align: center; color:#000; position:absolute; left:0; top:0;}
.play_controller #play-button:before{content: "\f04b";}
.play_controller #stop-button:before{content: "\f04c";}

.hot_list .slick-dots {position: absolute !important; right: 37px; bottom: 20px; padding-left: 20px; display:flex; gap:10px;}
.hot_list .slick-dots li button {display: block; width: 10px; height: 10px; border-radius: 50%; background-color: #000; font-size: 0; border: 0; padding: 0; cursor: pointer;}
.main_txt_link{display:block; padding:20px;}
.hot_list .tit{font-size: 24px; line-height:32px; font-family: 'NotoSerif-Bold', sans-serif; color:#000;}
.hot_list .writer{}
.main_txt_info{padding:30px 5px 0; font-size: 15px; line-height: 25px; color:#000;}
.main_txt_info > div + div{padding-top:10px;}
.main_txt_info h3{font-size:15px; margin-right:10px; padding-right:10px; position:relative;}
.main_txt_info h3:before{content:''; display:block; position:absolute; width:1px; right:0; height:10px; top:50%; margin-top:-5px; background:#000;}

.slider_playt_a button{position:absolute; bottom:10px; right:15px; width:10px; height:10px; display: none; line-height: 10px; text-align: center;font-size: 0;line-height: 0;font-weight: 900; border:0; background:transparent; cursor:pointer;}
.slider_playt_f .pasue, .slider_playt_a .pasue{display:block;}
.slider_playt_f button.active, .slider_playt_a button.active{display:block;}
.slider_playt_f button.nactive, .slider_playt_a button.nactive{display:none;}
.slider_playt_f button:before, .slider_playt_a button:before{font-family: "Font Awesome 6 Free"; display:block;width: 10px; font-size: 13px; line-height: 10px; text-align: center; color:#000; position:absolute; left:0; top:0;}
.slider_playt_f .play:before, .slider_playt_a .play:before{content: "\f04b";}
.slider_playt_f .pasue:before, .slider_playt_a .pasue:before{content: "\f04c";}

/*.article_list{flex-wrap:wrap; gap:14px;}
.article_list a{display:block; position:relative;}
.article_list li{width:calc(33% - 10px); border-bottom:1px solid #e2e2e2; padding-bottom:25px;}
.article_list li span{display:block;}
.article_list li img{display:block ;width:100%; cursor: zoom-in;}*/

.article_list_cate{padding-bottom:12px; gap:10px;}
.article_list_cate > div{font-size:13px; color:#333; line-height:1; font-family: 'Roboto', 'NotoSans-Bold', sans-serif;}
.article_list_cate > div:nth-child(1){color: #00ADBD; padding-right:10px; position:relative;}
.article_list_cate > div:nth-child(1):before{position: absolute; right: 0; top: 50%; width: 1px; height: 10px; margin-top: -5px; content: ""; background-color: #333;}
.article_list h3, .main_thesis h3{font-size: 16px; line-height: 22px; font-family: 'NotoSerif-Bold', sans-serif; color:#000;}
.main_thesis h3{padding-top:10px;}
.article_list li .thumb{margin-top: 0; border: 1px solid #d5d5d5; min-height: 110px; display:block; margin-bottom:13px; }
.article_list li .thumb img{display:block;}
.article_list li .writer, .article_list li .info, .main_thesis span.writer{color: #000; font-size: 13px; line-height: 20px; font-family: 'Roboto', sans-serif; display:block;}
.article_list li .writer, .main_thesis span.writer{padding:10px 0 5px;}
.more a{color: #000; font-size: 16px; line-height:1; font-family: 'NotoSans-Medium', sans-serif;}
.more a:after{display: inline-block; vertical-align: top; padding-left: 10px; content: ">";}

.article_list a{display:block; position:relative;}
.article_list li span{display:block;}
.article_list li img{display:block ;width:100%; cursor: zoom-in;}
.article_list_cate{padding-bottom:12px; gap:10px;}
.article_list_cate > div{font-size:13px; color:#333; line-height:1; font-family: 'Roboto', 'NotoSans-Bold', sans-serif;}
.article_list_cate > div:nth-child(1){color: #00ADBD; padding-right:10px; position:relative;}
.article_list_cate > div:nth-child(1):before{position: absolute; right: 0; top: 50%; width: 1px; height: 10px; margin-top: -5px; content: ""; background-color: #333;}
.article_list h3{font-size: 16px; line-height: 22px; font-family: 'NotoSerif-Bold', sans-serif; color:#000;}
.article_list li .thumb{margin-top: 0; border: 1px solid #d5d5d5; min-height: 110px; display:block; margin-bottom:13px; }
.article_list li .thumb img{display:block;}
.article_list li .writer, .article_list li .info{color: #000; font-size: 13px; line-height: 20px; font-family: 'Roboto', sans-serif;}
.article_list li .writer{padding:10px 0 5px;}
.more a{color: #000; font-size: 16px; line-height:1; font-family: 'NotoSans-Medium', sans-serif;}
.more a:after{display: inline-block; vertical-align: top; padding-left: 10px; content: ">";}

.main_middle_content{}
.submitstat{gap:20px; }
.submitstat .indexdIn{width:calc(25% - 15px); background:#fff; padding:27px 0; text-align:center;}
.submitstat .indexdIn:nth-child(1){border-top:4px solid #b83385;}
.submitstat .indexdIn:nth-child(2){border-top:4px solid #6241a7;}
.submitstat .indexdIn:nth-child(3){border-top:4px solid #1765c3;}
.submitstat .indexdIn:nth-child(4){border-top:4px solid #283541;}

.submitstat .indexdIn:nth-child(1) .indexdIn1{color:#b83385;}
.submitstat .indexdIn:nth-child(2) .indexdIn1{color:#6241a7;}
.submitstat .indexdIn:nth-child(3) .indexdIn1{color:#1765c3;}
.submitstat .indexdIn:nth-child(4) .indexdIn1{color:#283541;}

.submitstat .indexdIn1{font-weight: bold; font-size:32px; line-height:1;}
.submitstat .indexdIn2{margin-top:12px; font-size:16px; color:#000; line-height:1;}
.last_months{line-height:1;}
.last_months span{font-size:15px; color:#000;}

.main_title_style{line-height:1; color: #000; font-size: 20px; line-height:1; position:relative; padding-bottom:16px; font-family: 'NotoSans-Bold', sans-serif;}
.main_title_style:before{display:block; position:absolute; left:0; bottom:0; width: 45px; height: 4px; content: ""; background-color: #335070;}

.ranking .column{gap:19px;}
.ranking .column > div{flex-grow: 0; /* 컨테이너가 커져도 크기 유지 */ flex-shrink: 0; /* 컨테이너가 작아져도 크기 유지 */ width:calc(33.3333% - 13px); box-sizing:border-box;}
.main_board_list{background:#fff; padding:24px;}
.main_board_list li{padding:15px 0; border-bottom:1px solid #ddd;}
.main_board_list li a{font-size: 15px; line-height: 22px; font-family: 'Roboto', 'NotoSans-Regular', sans-serif; color: #000; gap:10px;}
.main_board_list li a div:nth-child(1){width:50px; flex-shrink: 0;}

.ranking_quick_menu a{display:block;}
.ranking_quick_menu a:nth-child(1){background:#03ADBE; color:#fff; padding:25px; position:relative; height:calc(100% - 139px); box-sizing:border-box;}
.ranking_quick_menu a:nth-child(2){background:#5A5A5A url('../image/submission_bg.png') center center no-repeat; color:#fff; margin-top:15px; font-size:16px; padding:36px 30px; line-height:18px;}
.ranking_quick_menu a:nth-child(2) h2{display:block; font-family: 'MyriadPro-Bold', sans-serif; line-height:1; font-size: 34px;}
.ranking_quick_menu a:nth-child(1) h2{font-family: 'MyriadPro-Bold', sans-serif; font-size: 24px; line-height: 30px;}
.ranking_quick_menu a:nth-child(1) div{font-size: 14px; line-height: 19px; color: #fff; font-family: 'Roboto', 'NotoSans-Regular', sans-serif; padding-top:20px;}
.ranking_quick_menu a:nth-child(1) i{font-style:normal; display:block;}
.ranking_quick_menu a:nth-child(1) img{position:absolute; right:25px; bottom:0; border:1px solid #fff;border-bottom:none; width:158px;}
.ranking_quick_menu a:nth-child(1) .issue_content{width:180px; }
.main_board_list .more a{font-size:14px;}

.gallery_col4 li{width:calc(25% - 23px);}
.gallery_col4 li img{width:100%; cursor: zoom-in;}
.gallery_col4 li a{display:block;}
.gallery_col4 h3{font-size: 16px; line-height: 22px; color: #000; font-family: 'NotoSerif-Bold', sans-serif; font-weight:600; margin-top:5px;margin-bottom:7px;}
.gallery_col4 .writer{display: block; font-size: 13px; line-height: 20px; color: #000; font-family: 'Roboto', 'NotoSans-Regular', sans-serif; font-weight:400;}
.gallery_col4 .thumb{display:block;}

.main_flex_wrap{}
.main_flex_list{width:calc(50% - 24px);}
.main_flex_list li{padding-bottom:30px; border-bottom:1px solid #e2e2e2;}
.main_flex_list li + li{margin-top:30px;}
.main_flex_list li a{display:block;}
.main_flex_list li img{display:block; max-width:100%; cursor: zoom-in; max-height:100%;}
.main_flex_list li .thumb {width:250px; height:140px; box-sizing:border-box; border:1px solid #d6d6d4; flex-shrink: 0; flex-grow: 0;}
.main_flex_list li h3{font-size: 16px; line-height: 22px; font-family: 'NotoSerif-Bold', sans-serif; color: #000;}
.main_flex_list li h3 + div{color: #000; font-size: 13px; line-height: 20px; margin-top: 20px; font-family: 'Roboto', 'NotoSans-Regular', sans-serif;}

.main_link_banner > .dp_flex > div:nth-child(1){background:#f0f0f0;}
.main_link_banner > .dp_flex > div:nth-child(1) a{display:flex; justify-content: center; align-items: center; height:100%;}

.video_list a{display:block; font-size: 15px; line-height: 22px; color: #000; font-family: 'Roboto', 'NotoSans-Regular', sans-serif; margin-top:8px;}

.recent_slide_wrap{padding:0 108px; position:relative;}
.recent_img_wrap{border:1px solid #cfd1d4; }
.recent_img_wrap img{display:block; width:100%;}
.recent_img_wrap + div{font-size: 14px; line-height:1; color: #000; text-align: center; margin-top:10px;}
.recent_controller > div{position:absolute; top:50%; width:26px; height:26px; margin-top:-13px; background-size:8px !important; cursor:pointer; font-size:0;}
.recent_controller > div.swiper-prev{background:url('../image/recent_prev.png') center center no-repeat; left:0;}
.recent_controller > div.swiper-next{background:url('../image/recent_next.png') center center no-repeat; right:0;}

.bnrzone_slide_wrap{padding:0 77px; position:relative;}
.bnrzone_wrap{border-top:1px solid #d5d5d5;}
.bnrzone_slide a{display:block; border:1px solid #cfd1d4;}
.bnrzone_slide a img{display:block; width:100%;}

.bnrzone_controller > div{position:absolute; top:50%; width:48px; height:48px; margin-top:-24px; background-size:8px !important; border-radius:50%; border:1px solid #9da0a8; cursor:pointer; font-size:0;}
.bnrzone_controller > div.swiper-prev{background:#f9f9f9 url('../image/bnr_prev.png') center center no-repeat; left:0;}
.bnrzone_controller > div.swiper-next{background:#f9f9f9 url('../image/bnr_next.png') center center no-repeat; right:0;}

.rec_category{padding: 20px 35px; border-radius: 10px; background-color: #00ADBD; box-shadow: 0 0 15px rgba(0, 0, 0, .4); box-sizing: border-box; margin-top:40px;}
.rec_category h2{color:#fff; font-family: 'MyriadPro-Bold', sans-serif; font-size: 24px; line-height: 30px; color: #FFFFFF; margin-bottom: 10px;}
.rec_category a{width: calc(25% - 5px); text-align: center; border: 1px solid #fff; color:#fff; border-radius: 5px; line-height: 1.5; padding: 5px 0; font-size:15px; font-family: 'Noto Sans KR', sans-serif;}

@media screen and (max-width:1360px){
.article_list li{width:calc(50% - 10px);}
.ranking_quick_menu a:nth-child(1) img{width:108px;}

.main_link_banner img{max-width:100%;}
.main_link_banner .dp_flex{gap:10px;}

}

@media screen and (max-width:1080px){
.ranking .column{display:block;}
.ranking .column > div{width:100%;}
.ranking .column > div + div{margin-top:10px;}
.ranking_quick_menu a:nth-child(1) .issue_content{width:calc(100% - 120px);}

}

@media screen and (max-width:960px){
.main_title{margin-top:24px;}
.main_title > .dp_flex{display:block;}
.main_title .dp_flex_wauto{display:block;}
.main_title .dp_flex_wauto > div + div{margin-top:6px;}

.main_title_slick{margin-top:20px; }
.main_title_slick_ul{justify-content: flex-end;}

.main_visual_slide01{width:auto;}
.main_visual_slide01 img{max-width:100%;}

.article_list.thum_style li .thumb{position:static; width:100%; height:auto;}
.article_list.thum_style li a{padding-right:0;}

.mainArticle_wrap.thum_style .main_thesis .cc__img_wrap{position:static; width:100%; height:auto; min-height:none;}
.mainArticle_wrap.thum_style .main_thesis .cc__img_wrap img{ max-height:none;}
.mainArticle_wrap.thum_style .main_thesis > a{padding-bottom:20px;}
.mainArticle_wrap.thum_style .main_thesis h3{padding-right:0; margin-top:12px;}

.hot_list .tit{font-size:16px;}
.main_txt_info{padding-left:0; padding-right:0; padding-top:20px;}
.main_txt_info, .main_txt_info h3{font-size:14px;}
.main_txt_info > div + div{padding-top:0px;}
.main_txt_info > div + div.type{padding-top:24px;}

.article_list{display:block;}
.article_list li{padding:20px 0; width:auto;}
.article_list li a{padding-right:135px;}
.article_list li .thumb{position:absolute; right:0; top:0; width: 120px; height: 65px; min-height: auto;}
.article_list li .thumb img{width:100%; height:100%;}
.article_list h3, div.main_con .gallery_col4 h3 {font-size:14px; line-height:18px;}

.main_top_wrap{display:block; width:auto; margin-top:12px;}

.gallery_col4{flex-wrap:wrap; gap:24px;}
.gallery_col4 li{width:calc(50% - 12px); }

.main_flex_wrap{display:block;}
.main_flex_wrap > div{margin-top:24px;}
.main_flex_list{width:100%; }
.main_flex_list li + li{margin-top:0;}
.main_flex_wrap ul{display:flex; justify-content: space-between; gap:20px;}
.main_flex_wrap ul li{width:calc(50% - 10px);}

.main_flex_list li .dp_flex{display:block; width:100%;}
.main_flex_list li .thumb{width:100%; height:auto;}

.main_link_banner .dp_flex{flex-wrap:wrap;}
.main_link_banner .dp_flex > div{width:calc(50% - 5px);}
.main_link_banner .dp_flex > div img{width:100%;}

.submitstat{flex-wrap:wrap;}
.submitstat .indexdIn{width:calc(50% - 10px);}
.ranking_quick_menu a:nth-child(2){background:#5A5A5A; padding:24px 15px; height:auto;}
.video_list a{font-size:14px;}
.recent_slide_wrap{padding:0 40px;}
.ranking_quick_menu a:nth-child(1){min-height:240px;}

}

@media screen and (max-width:640px){
.bnrzone_controller > div{width:30px; height:30px; margin-top:-15px;}
.rec_category  > div{flex-wrap: wrap; gap: 10px;}
.rec_category  a{width:100%;}

}


.text_filed{padding:15px 22px; font-family: 'Noto Sans KR', sans-serif; padding-bottom:0px;}
.text_filed h3{margin:0; padding:0; font-size:20px; color:#020006; font-weight:500;font-family: 'Roboto', 'NotoSans-Regular', sans-serif; font-weight:bold;}
.text_filed div{font-size:15px; color:#020006;font-weight:500;line-height:140%;font-family: 'Roboto', 'NotoSans-Regular', sans-serif;}
.text_filed span{color:#3963af;}