@charset "utf-8";

:root{
	--main-color: #161616;
	--point-color: #ed3648;
	--red: #ff2020;
	--blue: #4067ff;
}


/* 팝업레이어 */
#hd_pop { position:relative; }
#hd_pop .hd_pops { position: fixed; z-index: 99999999; }
.hd_pops_footer > * { color:white; }
.hd_pops_close { float:right; }
#hd_pop .hd_pops { top: 50% !important; left:50% !important; transform: translate(-50%, -50%);}
.hd_pops_con {max-width:90vw !important; height: 100% !important;}
.hd_pops_con br {display:none !important; }
.hd_pops_con img {width:100% !important; height: auto !important;}
.hd_pops_footer{ background-color:black; color:white; padding:10px; font-size: 10px; transform: translateY(-1.15rem);}


/* ==================================== pc와 동일한 부분 ==================================== */
.blind{position: absolute; visibility: hidden; z-index: -1; }
.sound_only{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;}
.flex{display: flex; align-items: center; gap: 30px;} /* 사이가 30으로 고정된 것 */
.row{display: flex;} /* 글씨 한줄 나열 */
.wrapper{max-width: 1170px; margin-left: auto; margin-right: auto;}
.list_empty{text-align: center; padding: 60px 0 !important; color: #999;}

.column{display: flex;}
.column .box{padding-left: 15px; padding-right: 15px;}
.column > .col{flex: 1; max-width: 50%; padding-top: 30px; padding-bottom: 60px;}
.column > .col + .col{border-left: 1px solid #eee;}
.column > .col_wide{flex: 1; padding-top: 30px; padding-bottom: 60px;}

.main{min-height: calc(100vh - 220px);}
.main .col > section:first-child{margin-top: 0;}
.main .col > section + section{margin-top: 40px;}
.main .col > section + .banner_wrap, .main .col > .banner_wrap + section,
.main .col > section + .main_headline,
.main .col > section + .main_top,
.main .col > section + .main_middle_01{margin-top: 30px;}

.main .col > section + .main_headline + .main_btm_headline{margin-top: 0;}
.main .col .main_middle_01 + .main_middle_02{margin-top: 15px;}


.margin_box > * + *{margin-top: 60px;}
.col_wide > section + section{margin-top: 30px;}



/* 타이틀 */
.tit_box{margin-bottom: 15px;}
.tit_box.flex{justify-content: space-between; gap: 15px;}
.deco_tit{position: relative; width: fit-content; color: #666; font-family: 'SUITE', sans-serif; font-size: 18px; font-weight: 500;}
.deco_tit > b{color: #222; font-weight: 700;}
.deco_tit::after{width: 20px; height: 1px; margin-left: 10px; vertical-align: middle; background-color: #333; display: inline-block; clear: both; content:"";}
.tit_box_search .deco_tit::after{display: none;}
.tit_box_search .red{color: var(--red);}

/* 말줄임표 */
.line1, .line2, .line3, .line4, .line5{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; word-break: break-all; text-align: justify;}
.line1{-webkit-line-clamp: 1;}
.line2{-webkit-line-clamp: 2;}
.line3{-webkit-line-clamp: 3;}
.line4{-webkit-line-clamp: 4;}
.line5{-webkit-line-clamp: 5;}
.tit.line1, .tit.line2, .tit.line3, .tit.line4, .tit.line5{word-break: keep-all; text-align: left;}


/* 텍스트 */
.news_text {font-size: 13px;}
.news_text .cate{font-size: 0.85em; font-weight: 700; margin-bottom: 10px;}
.news_text .cate > .date{display: inline-block; color: #666; font-weight: 400; vertical-align: top;}
.news_text .tit{font-weight: 700; line-height: 1.3; font-size: 1.1em !important; word-break: break-all;}
.news_text .tit + .sub_tit{margin-top: 5px;}
.news_text .sub_tit{font-size: 1.1em; line-height: 1.3; font-weight: 600; color: #666;}
.news_text .con{line-height: 1.3; color: #666;}
.news_text .tit + .con, .news_text .sub_tit + .con{margin-top: 10px;}

.news_label{position: absolute; left: 0; top: 20px; padding-right: 1.2em; padding-left: 0.5em; line-height: 2.6; background-color: #fff; width: fit-content; color: #333; border-radius: 0 1.2em 1.2em 0; font-size: 10px; font-weight: 600; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .15);}

.my_menu{font-size: 13px; font-weight: 500;}
.my_menu li + li{border-left: 1px solid #ddd;}
.my_menu li > a{display: block; padding: 0 10px; transition-duration: 100ms;}
.my_menu li:hover > a{opacity: 0.5;}

/* 퀵 메뉴 */
.quick_btn_wrap{position: fixed; display: none; bottom: 30px; right: 20px; z-index: 99;}
.quick_btn{display: flex; align-items: center; justify-content: center; width: 34px; aspect-ratio: 1/1; border-radius: 50%; background-color: #fff; border: 1px solid #dadcdf; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .15); transition-duration: 100ms;}
.quick_btn + .quick_btn{margin-top: 5px;}
.quick_btn img{width: 60%; transition-duration: 100ms;}
.quick_btn:hover{cursor: pointer; background-color: var(--main-color); border-color: var(--main-color);}
.quick_btn:hover img{width: 60%; filter: invert(1);}


/* 스와이퍼 공통 */
.white-pagination .swiper-pagination-bullet{border: 1px solid #fff; vertical-align: top; opacity: 1; background-color: transparent; margin: 0 4px;}
.white-pagination .swiper-pagination-bullet-active{background-color: #fff;}
.black-pagination .swiper-pagination-bullet{border: 1px solid #000; vertical-align: top; opacity: 1; background-color: transparent; margin: 0 4px;}
.black-pagination .swiper-pagination-bullet-active{background-color: #000;}

/* 배너 공통 */
.banner_wrap { margin: 30px auto; }

.ba_img + .ba_img{margin-top: 10px;}
.ba_img img{display: block; width: 100%; height: auto !important; margin-left: auto; margin-right: auto;}
.ba_list > .list + .list{margin-top: 10px;}
.slide_banner{margin-top: 10px;}

/* 버튼 */
a.btn, .btn {display: inline-block; line-height: 2.5em; height: 2.5em; padding:0 10px; text-align:center; font-size:13px; border:1px solid #eee; background-color: #fbfbfb; color: #666; border-radius: 5px; font-weight: 500;
-webkit-transition:background-color 0.1s ease-out; -moz-transition:background-color 0.1s ease-out; -o-transition:background-color 0.1s ease-out; transition:background-color 0.1s ease-out;}
.btn svg{display: inline-block; margin-right: 5px;}
.btn_box{display:flex; align-items: center; justify-content: center; gap: 5px;}
.btn_big{display: block; width: fit-content; padding: 1em; text-align: center; border: 1px solid #eee; max-width: 240px; background-color: #fbfbfb; color: #666; border-radius: 2em; font-size: 0.9em; font-weight: 500;}
.btn_box .btn_big{flex: 1;}
.btn:hover, .btn_big:hover{cursor: pointer;}

/* 버튼 컬러 */
.btn.btn_b01, .btn_big.btn_b01{/*border-color: #333; background-color: #333;*/ color: #fff;}
.btn.btn_b02, .btn_big.btn_b02{border-color: var(--main-color); background-color: var(--main-color); color: #fff;}
.btn.btn_b03, .btn_big.btn_b03{border-color: var(--point-color); background-color: var(--point-color); color: #fff;}

.btn.btn_adm{border-color: var(--point-color); background-color: var(--point-color); color: #fff;}


/* 페이징 */
.paging{display: flex; margin: 30px auto; width: fit-content; gap: 3px;}
.btn_pagenum {display: flex; gap: 3px;}
.paging a{display:block; font-weight: 500; height: 1.5rem; line-height: 1.4rem; width: 1.5rem; border-radius:50%; font-size: 0.8rem; vertical-align:middle; background-color:#eee; border:1px solid #eee; color: #999; text-align:center;}

.pg_start, .pg_prev, .pg_end, .pg_next{text-indent:-999px; overflow:hidden; background-size: 70%; background-repeat: no-repeat; background-position: center;}
.paging .pg_start{background-image: url('../img/icon/btn_first.svg');}
.paging .pg_prev{background-image: url('../img/icon/btn_prev.svg');}
.paging .pg_end{background-image: url('../img/icon/btn_end.svg');}
.paging .pg_next{background-image: url('../img/icon/btn_next.svg');}

.paging a.on {background-color: #161616; border-color: #161616; color:#fff;}


/* 모바일 2차 메뉴 */
.scroll_menu{overflow-x: scroll; -ms-overflow-style: none; scrollbar-width: none; margin: 15px auto;}
.scroll_menu::-webkit-scrollbar { display: none; }
.scroll_menu > ul{display: flex; gap: 5px; font-size: 12px;}
.scroll_menu > ul a{display: block; padding: 0 1em; line-height: 2.2; border: 1px solid #eee; border-radius: 2em; white-space: nowrap; color: #999;}
.scroll_menu > ul a.on{/*background-color: #222; border-color: #222;*/ color: #fff; font-weight: 600;}






/* ==================================== 모바일 시작 ==================================== */
/* ===== 모바일 헤더 ===== */
/* 상단 */
#header_logo{padding: 12px 15px;}
#header_logo img{display: block; max-width: 80%; margin: 0 auto;}
#header{position: sticky; top: 0; padding: 10px 0; border: 1px solid #eee; border-style: solid none; z-index: 100; background-color: #f0f0f0;}
#header .wrapper{padding-left: 15px; padding-right: 15px;}
.header_bar{display: flex; align-items: center; justify-content: flex-end;}
.header_bar .logo img{max-height: 30px;}
.header_bar > button{display: flex; align-items: center; font-size: 1.2em; gap: 0.5rem;}
.header_bar > button > small{font-size: 12px; font-weight: 800;}


/* 메뉴창 */
#nav{position: fixed; top: 0; bottom: 0; right: -400px; width: 100%; min-height: 100vh; max-width: 400px; background-color: #fbfbfb; z-index: 10;  padding-bottom: 50px; box-shadow: -10px 0 10px 0 rgba(0, 0, 0, .05); transition-duration: 400ms;}
#nav.on{right: 0;}
#nav_bg{position: fixed; top: 0; right: 0; left: 0; background: rgba(0,0,0,0.5); content:""; display: block; opacity: 0; clear: both; z-index: 9; transition-duration: 200ms;}
#nav.on + #nav_bg{bottom: 0; opacity: 1;}

/* 메뉴창 상단 */
.nav_top{position: relative; padding: 40px 15px 15px 15px; height: 160px; /*background-color: #222;*/}
.nav_top > p{font-size: 1.2em; line-height: 1.4; margin-bottom: 15px; color: #fff; font-family: 'SUITE', sans-serif;}
.nav_top .search_bar{position: relative;}
.nav_top .search_bar input[type="text"]{width: 100%; font-size: 13px; padding-right: 2.5em;}
.nav_top .search_bar .search_btn{position: absolute; top: 50%; right: 10px; transform: translateY(-50%); font-size: 1.2em;}
.nav_top > button{position: absolute; top: 15px; right: 15px; color: #fff; font-size: 1.5em;}

/* 마이페이지 로그인 */
.nav_top_menu{display: flex; align-items: center; text-align: center; padding: 15px; font-size: 13px; border-bottom: 5px solid #eee; background-color: #fff; height: 50px;}
.nav_top_menu > li{flex: 1;}
.nav_top_menu > li > a{display: block; padding: 0 5px;}
.nav_top_menu > li + li{border-left: 1px solid #ddd;}

/* 메뉴 출력 */
.nav_menu{height: calc(100vh - 260px); overflow-y: scroll;}
.nav_menu::-webkit-scrollbar {width: 5px;}
.nav_menu::-webkit-scrollbar-track {background: transparent;}
.nav_menu::-webkit-scrollbar-thumb {background: #ddd; border-radius: 5px;}

.mo_gnb a{display: block; padding: 15px; font-weight: 500;}
.mo_gnb ul a{font-size: 13px;}
.mo_gnb .have > div {position: relative;}
.mo_gnb .have > div > a{width: fit-content;}
.mo_gnb .gnb_more{ position: absolute; top: 50%; right: 0; transform: translateY(-50%); padding: 15px;}
.mo_gnb .gnb_more::after {content: ""; display: block; width: 0; height: 0; border-left: 3px solid transparent; border-right: 3px solid transparent; border-bottom: 4px solid #161616; transition-duration: 100ms;}
.mo_gnb .gnb_more.on::after{ border-bottom: transparent; border-top:  4px solid #161616;}
.mo_gnb > li.have > ul{display: none; background-color: #f0f0f0; color: #444; padding: 5px 0;}

/* 메뉴창 하단 sns */
.nav_bottom {background-color: #fbfbfb; color: #999; font-size: 1.5em; border-top: 5px solid #eee;}
.nav_bottom .row{height: 45px; align-items: center; justify-content: center; gap: 5px;}



/* ===== 모바일 푸터 ===== */
#footer{position: relative; padding: 30px 15px 15px 15px; font-size: 0.9rem; background-color: #f0f0f0; color: #999;}
#login_footer{display: none;}
.fnb{display: flex; flex-wrap: wrap; justify-content: center; font-weight: 500; color: #666; gap: 10px 0;}
.fnb > li + li{border-left: 1px solid #ddd;}
.fnb > li > a{display: block; padding: 0 1em; transition-duration: 100ms;}
.fnb > li:hover > a{opacity: 0.5;}

.copy_wrap{text-align: center; margin: 20px auto;}
.copyright{position: absolute; left: 0; right: 0; bottom: 0; line-height: 40px; background-color: #161616; color: #ddd; font-size: 13px;}
.copy > span {display: inline-block; line-height: 1.6;}
.powered_by{text-align: right; margin-top: 5px;}

#device_change{margin: 15px auto 0 auto;}
#device_change > a{display: block; max-width: 360px; padding: 1em;  background-color: #ebebeb; border: 1px solid #ccc; transition-duration: 100ms; text-align: center; border-radius: 2em; font-weight: 600; color: #666; margin: 0 auto;}



/* ==================================== 모바일 출력스타일 ==================================== */

.grid{display: grid; gap: 15px;}
.grid2{grid-template-columns: repeat(2,1fr);}
.grid3{grid-template-columns: repeat(3,1fr);}
.grid4{grid-template-columns: repeat(4,1fr);}
.grid5{grid-template-columns: repeat(5,1fr);}
.grid6{grid-template-columns: repeat(6,1fr);}



/* 출력스타일 01 : 포토 타입 */
.photo_type > li{width: 100%; aspect-ratio: 3/2; color: #fff; overflow: hidden;}
.photo_type.grid2 > li{aspect-ratio: 1/1;}
.photo_type a{position: relative; display: flex; align-items: flex-end; width: 100%; height: 100%; padding: 20px 15px;}
.photo_type a::after{position: absolute; left: 0; right: 0; bottom: 0; height: 80%; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(24, 24, 24, 1) 100%); content:""; display: block; clear: both; z-index: -1;}
.photo_type a > img{position: absolute; display: block;  left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1;}
.photo_type .news_text .con{color: #fff;}
.photo_type .text{}



/* 출력스타일 02 : 홈박스 타입 */
/*.homebox_type{display: grid; grid-template-columns: repeat(2,1fr); gap: 15px;}
.homebox_type a{display: flex; gap: 15px; align-items: center; padding: 20px 10px; border: 1px solid #eee; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .05);}
.homebox_type .img{width: 25%; aspect-ratio: 1/1; overflow: hidden; border-radius: 50%; max-width: 80px;}
.homebox_type .img > img{display: block; width: 100%; height: 100%; object-fit: cover;}
.homebox_type .text{flex: 1;}
.homebox_type .news_text .tit {font-size: 1.2em;}*/
.homebox_type{display:flex;gap:15px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}
.homebox_type li{flex:0 0 300px}
.homebox_type a{display:flex;gap:15px;align-items:center;padding:1.2em;background:var(--color-basic2);height:100%}
/*.homebox_type .img{width:80px;aspect-ratio:1/1;overflow:hidden;border-radius:50%;flex-shrink:0}
.homebox_type .img img{width:100%;height:100%;object-fit:cover}*/
.homebox_type .img{display:none;}
.homebox_type .text{flex:1}
.homebox_type .news_text .tit{font-size:1.2em}


/* 출력스타일 03 : 카드 타입 */
.card_type li {background-color: #f0f0f0;}
.card_type li > a{display: block;}
.card_type .img{position: relative; width: 100%; aspect-ratio: 4/3; overflow: hidden;}
.card_type .img > img{display: block; width: 100%; height: 100%; object-fit: cover;}
.card_type .text{padding: 20px 15px;}

.card_type.horizontal > li{background-color: transparent;}
.card_type.horizontal a{display: flex; align-items: center; overflow: hidden; border-radius: 10px; background-color: #f0f0f0;}
.card_type.horizontal .img{width: 40%;}
.card_type.horizontal .text{flex: 1;}


/* 출력스타일 04 : 텍스트 타입 */
.text_type{/*border-top: 2px solid #222;*/}
.text_type > li{border-bottom: 1px solid #eee;}
.text_type .news_text .tit{font-size: 1.2em;}
.text_type .news_text .cate{margin-top: 5px; margin-bottom: 0;}
.text_type a{display: flex; gap: 10px; padding: 15px 0; align-items: center;}
.text_type .num{width: 1.6em; font-size: 1.8em; font-weight: 800; color: #ddd;}
.text_type .num.black{color: #161616;}
.text_type .news_text{flex: 1;}

/* 출력스타일 05 : 이미지 타입 */
.img_type .img{position: relative; width: 100%; aspect-ratio: 4/3; overflow: hidden;}
.img_type .img > img{display: block; width: 100%; height: 100%; object-fit: cover;  transition-duration: 500ms;}
.img_type .text{padding: 20px 0;}



/* 출력스타일 06 : 웹진 타입 */
.webzine_type a{display: flex; gap: 10px; align-items: center;}
.webzine_type .img{width: 30%; aspect-ratio: 1/1; overflow: hidden; overflow: hidden;}
.webzine_type .img > img{display: block; width: 100%; height: 100%; object-fit: cover; transition-duration: 500ms;}
.webzine_type .text{flex: 1;}
.webzine_type li:hover img{transform: scale(1.1);}





/* =================== 메인 { ===================*/
.main_headline .swiper-pagination, .main_middle_04 .swiper-pagination{ width: fit-content; top: 20px; bottom: initial; left: initial; right: 15px; }

#main_line_news{padding: 15px; /*background-color: #161616;*/ color: #fff; margin-top: 30px;}
.line_news{display: grid; grid-template-columns: 60px 1fr; gap: 15px; line-height: 1.2}
.line_news > strong{border-right: 1px solid rgba(256,256,256,0.2);}
.line_news .flash_swiper{width: 100%; height: 1.2em;}

.change_type .swiper-pagination{position: initial; margin-top: 30px;}
.change_type .photo_swiper .swiper-pagination{margin-top: 10px;}

.change_type .text_type li > a + a{border-top: 1px solid #eee;}
.change_type .text_swiper .text_type {border-top: none;}
/*.change_type .text_swiper {border-top: 2px solid #222;}*/

.webzine_swiper .card_type li > a + a{margin-top: 15px;}


/* 구독하기 */
.subscribe_wrap{background-color: #161616; color: #fff; padding: 50px 0; text-align: center;}
.subscribe_wrap .tit{font-size: 1.6rem; font-weight: 700; margin-bottom: 15px;}
.subscribe_wrap .text{font-size: 1.1rem; color: #999;}
.subscribe_wrap form{width: 95%; max-width: 500px; margin: 15px auto 0 auto;}
.subscribe_bar{display: flex; margin: 10px auto; color: #222; box-shadow: 0 0 8px 0 rgba(0, 0, 0, .4); font-size: 0.9rem; overflow: hidden; border-radius: 2em; border: 3px solid #fbfbfb; background-color: #fbfbfb}

.subscribe_bar > label{flex: 1;}
.subscribe_bar > label > input{display: block; width: 100%; border: none; border-radius: 0; background-color: transparent; height: 32px; line-height: 32px;}
.subscribe_bar > input[type="button"]{width: 80px; padding: 0 0.5em; text-align: center; background-color: #222; border: 1px solid #222; color: #fff; font-size: 0.8rem; font-weight: 600; border-radius: 2em; transition-duration: 100ms; height: 32px; line-height: 32px;}
.subscribe_agree{font-size: 0.8rem; color: #999; font-weight: 500; margin: 15px auto;}
.subscribe_wrap .btn_big{max-width: initial; width: 100%; border-radius: 2em; font-weight: 600;}


.main_headline .grid > li{aspect-ratio: 3/2; grid-column: 1 / 3;}

.main_top_headline .photo_type > li{aspect-ratio: 4/5;}
.main_middle_02 .grid > li:first-child{aspect-ratio: 3/2; grid-column: 1 / 3;}
.main_middle_03 .box > div + div{margin-top: 15px;}
.main_middle_03 .card_type li + li{margin-top: 15px;}
.main_middle_03 .card_type a{border-radius: 0;}
.main_middle_03 .card_type .img{aspect-ratio: 1/1;}


.main_middle_04{background-color: #161616; color: #fff;}
.main_middle_04 .card_type a{background-color: transparent;}
.main_middle_04 .card_type .img{aspect-ratio: 1/1;}
.main_middle_04 .card_type .news_text .con{color: #ddd;}
.main_middle_05 .grid{gap: 0;}


/* 포토&영상 */
.main_middle_05 .card_type li{background-color: #f0f0f0;}
.main_middle_05 .card_type li:nth-child(3n+1){grid-column: 1 / 3; background-color: #161616; color: #fff;}
.main_middle_05 .card_type li:nth-child(3n+1) .news_text .con{color: #ddd;}
.main_middle_05 .card_type li:nth-child(3n+1) .img{aspect-ratio: 1/1;}

.main_middle_05 .card_type a{border-radius: 0; background-color: transparent; height: 100%;}
.main_middle_05 .card_type .img{position: relative; aspect-ratio: 1/2;}
.main_middle_05 .card_type .img::after{position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 8px solid #f0f0f0; content:""; display: block; clear: both; }
.main_middle_05 .card_type li:nth-child(odd) .img::after{border-left-color: #161616;}

/* =================== } 메인 ===================*/



/* =================== 서브 { ===================*/
/* 서브 리스트 */
.change_btn{display: flex; gap: 5px;}
.change_btn > a{display: flex; width: 28px; height: 28px; border-radius: 50%; align-items: center; justify-content: center; font-size: 14px; background-color: #eee; color: #999;}
.change_btn > a.on{/*background-color: #161616;*/ color: #fff;}

.news_type_change .text_type .img, .news_type_change .text_type .cate{display: none;}
.news_type_change .text_type .tit{-webkit-line-clamp: 1;}

.news_type_change .img_type{display: grid; grid-template-columns: repeat(2,1fr); gap: 15px;}
.news_type_change .card_type li + li{margin-top: 15px;}
.news_type_change .card_type a{flex-direction: row-reverse;}

.news_more_btn{text-align: center; margin: 30px auto; color: #999; }
.news_more_btn a{display: block; padding: 0.75em; border: 1px solid #eee; display: block; border-radius: 5px; background-color: #fbfbfb;}
.news_more_btn svg{display: inline-block; margin-left: 10px; vertical-align: text-top; font-size: 0.8em;}

.photo_news .box > ul + ul , 
.video_news .box > ul + ul {margin-top: 15px;}
.video_bg{position: relative;}
.video_bg .play_icon{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 2.4em; color: #fff; z-index: 2;}
.video_bg.img::before { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.4); content: ""; display: block; clear: both; z-index: 1; }
#movie_tags iframe{border: 0;}

.search_right > div + div{margin-top: 60px;}

/* ================ 서브뷰 ================ */
.column > .col.view_col{padding-top: 0;}
.section_top_tit{border-bottom: 5px solid #eee; padding-top: 20px; padding-bottom: 20px;}
.section_top_tit .tit_box{margin-bottom: 0;}
.view_skin > section + section{border-top: 5px solid #eee;}

/* 기사 공유 */
#sns_layer, .scrap_layer{position: fixed; left: 20px; bottom: 30px; z-index: 99;}
.btn_share, .btn_scrap{display: flex; align-items: center; justify-content: center; width: 34px; aspect-ratio: 1 / 1; border-radius: 50%; background-color: #fff; border: 1px solid #dadcdf; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .15); transition-duration: 100ms;  color: #444;}
.btn_share span.fa_close{display: none;}
.btn_share.on{background-color: #222; color: #fff; border-color: #222;}
.btn_share.on span.fa_share{display: none;}
.btn_share.on span.fa_close{display: block;}
#sns_layer + .scrap_layer{bottom: 68px;}

.sns_share{display: none;}
.sns_share a{ display: block; width: 34px; height: 34px; background: url("../img/icon/btn_share.png") no-repeat 0 0; text-indent: -9999px; margin: 0 auto; background-color: pink; border-radius: 50%; margin-bottom: 5px;}
.sns_share a.sns_fa { background-position: 0 0;}
.sns_share a.sns_tw { background-position: -40px 0;}
.sns_share a.sns_ka { background-position: -120px 0;}
.sns_share a.sns_blog { background-position: -240px 0; }
.sns_share a.sns_ba { background-position: -280px 0;}
.sns_share a.sns_url{ background: url("../img/icon/btn_url.png") no-repeat center / cover;}

/* 뷰페이지 상단 */
.view_tit{font-size: 1.4em; line-height: 1.4; font-weight: 700; word-break: keep-all; margin-top: 10px;}
.view_header{padding-bottom: 15px;}
.view_header .tit_box{padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #eee;}

.view_header .flex{justify-content: space-between; gap: 15px;}
.view_header .info{display: flex; font-size: 0.8rem; color: #666;}
.view_header .info li + li{border-left: 1px solid #ddd; padding-left: 10px;}
.view_header .info li{padding-right: 10px;}
.view_header .signature{font-size: 0.8rem; margin-top: 10px; text-align: right; color: #666;}

.news_font{font-size: 12px;}
.news_font button {padding: 0 10px;}
.news_font button + button{border-left: 1px solid #ddd;}


/* 뷰페이지 내부 */
.view_body img{max-width: 100%; height: auto !important; margin: 0;}
.view_body{padding: 15px 0 30px 0;}
.imageWrap > figure{width: initial !important;}


/* 하단 배너 첨부파일 구독 등 */
.view_add .box{padding: 20px 15px;}
.view_file {font-size: 12px;}
.view_file a{display: block;}

.view_file a + a{border-top: 1px dashed #eee; margin-top: 8px; padding-top: 8px;}
.view_file a > strong{display: block; font-weight: 600;}
.view_file a > * + span{display: block; text-align: right; font-size: 0.9em; color: #999; margin-top: 5px;}

.view_support{background-color: #fbfbfb;}
.view_support p{line-height: 1.6;}
.view_support .account_info{margin-top: 10px; color: #161616; font-weight: 700; text-decoration: underline;}

/* 관련기사 */
.related_news{margin: 30px 0;}
.related_news li{padding: 15px 0;}
.related_news .text_type a{display: -webkit-box; padding: 0;}



/* 뷰페이지 하단 */
.news_writer{padding: 20px 15px;}
.news_writer > .flex{gap: 15px;}
.news_writer .img{width: 15%; max-width: 60px; aspect-ratio: 1/1; border-radius: 50%; overflow: hidden;}
.news_writer .img img{display: block; width: 100%; height: 100%; object-fit: cover;}
.news_writer .text{flex: 1;}
.news_writer .text strong{display: block; margin-bottom: 10px;}
.news_copy{background-color: #222; color: #999; font-size: 11px; line-height: 1.4; padding: 10px 15px; text-align: center;}


/* 뷰페이지 댓글 */
.view_comment{border-top: 5px solid #eee; padding: 30px 15px;}


/* ===== 댓글 ===== */
.reply_wrap textarea, .reply_wrap input[type="text"], .reply_wrap input[type="password"]{display: block; width: calc(100% - 1px);}
.reply_form .c_input{flex: 1;}
.reply_wrap .deco_tit > small{margin-left: 0.5em; color: #222; font-weight: 600;}
.reply_captcha input[type="text"]{margin-top: 0 !important;}

.reply_form{font-size: 13px;}
.reply_form > * + *{margin-top: 5px;}
.reply_form .row dt{max-width: 120px;}

.guest_info{gap: 5px;}
.guest_info > li{flex: 1;}
.guest_info > li > input{width: 100%;}

.reply_text > small{display: block; text-align: right; margin: 10px 0; color: #666; font-weight: 500;}
.reply_input{position: relative;}
.reply_input #btn_submit{position: absolute; right: 5px; bottom: 5px; display: flex; width: 34px; height: 34px; border-radius: 50%; /*background-color: #161616;*/ color: #fff; align-items: center; justify-content: center; }

.reply_list_wrap {/*border-top: 2px solid #222;*/ margin-top: 30px;}
.reply_list > li{padding: 15px 0; border-bottom: 1px solid #eee; border-style: solid none;}
.re_reply_box .reply_list > li{padding-bottom: 0; border-bottom: none; border-top: 1px solid #eee; margin-top: 15px;}

/* 댓글 메뉴 */
.reply_top{position: relative; display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;}
.reply_top .name{font-weight: 600;}
.reply_bot{margin-top: 10px;}
.reply_row{font-size: 12px; color: #999; align-items: center;}
.reply_row li + li{padding-left: 8px; margin-left: 10px;border-left: 1px solid #eee;}

.reply_row .black{color: #222;}
.reply_row .red{color: #df0000;}
.reply_row .gray{color: #ccc;}


/* 댓글 내용 */
.reply_content{margin: 15px 0; line-height: 1.6;}
.news_view{align-items: flex-start;}
.news_view > .col_02{margin-bottom: 60px;}

.comment_delete_box{position: absolute; top: 1.5em; right: 0; width: 90%; background-color: #eee; z-index: 10; border-radius: 10px; }
.comment_delete_box .comment_delete{position: relative; display: none; border: 5px solid #eee; border-radius: 10px;}
.comment_delete_box .comment_delete::after{position: absolute; right: 5px; top: -10px; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 6px solid #eee; content:""; display: block;}
.comment_btn_box {display: flex; margin: 5px 0; gap: 5px;}
.comment_btn_box > button{flex: 1; text-align: center; padding: 10px; border-radius: 5px; background-color: #fff; color: #666; font-size: 12px;}
.comment_btn_box > button + button{background-color: #222; color: #fff;}
.comment_reply_reply .reply_list > li{padding-bottom: 0; border-bottom: none; border-top: 1px solid #eee; margin-top: 15px;}

.reply_list .comment_empty{text-align: center; padding: 50px 0; color: #999;}


.delete_form{position: absolute; right: 1px; top: 1.2em; z-index: 1;}
.comment_delete{background-color: #fff; padding: 10px; border: 1px solid #eee; border-radius: 10px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .15);}
.comment_delete input{font-size: 13px;}
.comment_delete .btn_box, .board_wrap .comment_delete .btn_box{gap: 5px; margin-top: 5px; margin-bottom: 0;}
.comment_delete .btn_box .btn_big{font-size: 11px; padding: 0.75em; border-radius: 5px;}


/* 연관기사 */
.related_post{padding: 30px 0;}
.related_post .img{position: relative;}


.community_list {display: grid; grid-template-columns: repeat(2,1fr); margin-top: 0 !important;}
.community_list > div{padding: 30px 15px;}
.community_list > div:nth-child(2n){border-left: 1px solid #eee;}



/* ===== 작성페이지 ===== */
.write_skin .btn_box{margin: 30px auto;}
.write_form{/*border-top: 2px solid #222;*/}
.add_text{display: block; font-weight: 600; color: #161616; font-size: 0.9em; margin-top: 10px;}
dl.row{align-items: center; gap: 10px; min-height: 3em; padding: 10px 0;}
dl.row + dl.row{padding-top: 0;}
dl.row dt{font-weight: 600; width: 20%; max-width: 140px;}
dl.row dd{flex: 1;}
dl.row dd > input:not([type="checkbox"]) {width: 100%;}
dl.row dd > select{min-width: 30%;}

.write_form .inputs{display: flex; gap: 5px; align-items: center;}
.write_form .inputs > li{flex: 1;}
.write_form .inputs > li > select{display: block; width: 100%;}
.write_form .inputs > li > select:hover{cursor: pointer;}

.write_form .btn_row{position: relative;}
.write_form .btn_row input{padding-right: 80px; width: 100%;}
.write_form .btn_row .btn{position: absolute; top: 50%; right: 5px; transform: translateY(-50%); width: 70px; font-size: 10px; line-height: 2.3em; height: 2.4em; padding: 0;}
.write_form > legend { background-color: #fff; padding: 0 15px; margin: 0 auto; font-family: 'SUITE', sans-serif; font-weight: 700; font-size: 1.1em; }

/* 고객센터 작성 */
.write_agree {border-top: 1px solid #eee; padding-top: 15px;}
.terms_wrap{padding: 15px; background-color: #fbfbfb; border-radius: 10px; line-height: 1.4; height: 140px; overflow-y: scroll; font-size: 0.9rem; margin: 15px 0;}
.terms_wrap::-webkit-scrollbar {width: 5px;}
.terms_wrap::-webkit-scrollbar-track {background: transparent;}
.terms_wrap::-webkit-scrollbar-thumb {background: #aaa; border-radius: 5px;}
.terms_wrap > p{font-weight: 500;}
.terms_box > p{font-size: 0.9em; color: #666; margin-top: 15px;}
.terms_box > p > b{display: block; margin-bottom: 5px; color: #333; font-size: 14px;}
.terms_agree{padding: 1em 0; border: 1px solid #eee; border-style: solid none; font-weight: 600; font-size: 0.9rem;}

/* 출처 */
.view_source{padding: 20px 15px;}
.news_source{display: flex; gap: 0.5em; font-size: 0.9em;}
.news_source a{flex: 1;}

.news_tag{padding: 20px 15px;}
.news_tag > * + *{margin-top: 20px;}
.tag-group{display: flex; background-color: #fff; gap: 5px;}
.tag-group strong{display: block; width: 3.5em; font-weight: 800;}
.tag-group .row{flex: 1; gap: 5px; flex-wrap: wrap;}
.tag-group a:hover{text-decoration: underline;}

.other_news{display: flex; border: 1px solid #eee; border-radius: 15px;}
.other_news > li{flex: 1; padding: 20px 10px;}
.other_news > li + li{text-align: right; border-left: 1px solid #eee;}
.other_news strong{display: block; color: #999; margin-bottom: 10px; font-size: 14px; font-weight: 800;}
.other_news .tit{font-weight: 600; font-size: 1.1rem; line-height: 1.4;}
.other_news > li + li .tit{text-align: right;}


/* =================== } 서브 ===================*/

/*@media*/
@media screen and (max-width:768px) {
	.main{margin-top:30px;}
	.column{display: block;}
	.column > .col{max-width: initial; padding:0px;}

	.community_list {display: block;}
	.community_list > div:nth-child(2n){border-left: none;}

	dl.row{flex-direction: column; align-items: flex-start;}
	dl.row dt, dl.row dd{width: 100%; max-width: initial;}

	.grid3, .grid4{grid-template-columns: repeat(2,1fr);}
	
}

@media screen and (max-width: 600px) {
	.news_text .tit{font-size: 1.2em;}
	.news_text .tit + .con, .news_text .sub_tit + .con{margin-top: 5px;}
	.homebox_type{grid-template-columns: repeat(1,1fr); gap: 10px;}
	.homebox_type a{padding: 15px;}

	.card_type .img{aspect-ratio: 1/1;}

	.main_btm_headline .grid, .main_middle_05 .grid{grid-template-columns: repeat(1,1fr); gap: 10px;}
	.main_middle_05 .card_type li:nth-child(3n+1){grid-column: initial; background-color: #f0f0f0; color: #161616;}
	.main_middle_05 .card_type li:nth-child(3n+1) .news_text .con{color: #666;}
	.main_middle_05 .card_type li:nth-child(odd){background-color: #161616; color: #fff;}
	.main_middle_05 .card_type li:nth-child(odd) .news_text .con{color: #ddd;}

	.main_middle_05 .card_type .img{aspect-ratio: 1 / 1;}
}






/* 25-12-08 검수 수정 */
.main_top .grid.grid2.photo_type .tit.line1{-webkit-line-clamp:3 !important;}
.card_type .news_text .tit.line1{-webkit-line-clamp:2 !important;}
.card_type.horizontal a{border-radius:0 !important}
.news_more_btn{padding:0 !important;border:none !important}

.homebox_type > li{position:relative;min-height:110px;overflow:hidden}
.homebox_type > li::before,.homebox_type > li::after{content:"";position:absolute;top:0;right:0;width:22px;height:22px}
.homebox_type > li::after{background:linear-gradient(45deg,#00000014 0 50%,transparent 50%);z-index:2}
.homebox_type > li::before{background:linear-gradient(225deg,#fffffff2 0 50%,transparent 50%);z-index:1}

#header{background-color:var(--color-basic);}
.gnb_open *{color:#fff !important}
.banner_wrap{margin-top:20px !important;}
#gall_ul .gall_cate{border:none !important;}