@charset "utf-8";

::selection {
  color:white; /* 선택된 텍스트 색상 */
  background:#6ca3d1; /* 선택된 배경색 */
}

.color_txt{color:#6ca3d1 !important;}
.color_bg{background:#6ca3d1 !important;}
.hidden{display:none;}

/* 공통 소스 */
.t1,.t2{flex:1;display:-webkit-box;text-overflow:ellipsis;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1;word-break:break-all;}
.t2{-webkit-line-clamp:2;}
.img{width:100%;aspect-ratio:4/2.4;background:#fff;}/* 높이 기준 이미지 꽉차게 가운데정렬 */
.img img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;}
.img2{width:100%;aspect-ratio:4/2.4;background:#fff;}/* 이미지 꽉차게 가운데정렬 */
.img2 img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;}



/* 반응형 - 팝업창 */
#hd_pop{position:fixed;left:0;top:0;width:100%;box-sizing:border-box;z-index:1000 !important}
#hd_pop h2{display:none}
.hd_pops {position:absolute;border:1px solid #636363;background:#fff}
.hd_pops_footer{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#f3f3f3}
.hd_pops_footer *{font-size:13px;cursor:pointer}
.hd_pops_close{position:relative !important;line-height:24px;padding:0 10px;color:#fff;background:#444;border-radius:4px;}


/* 최상단 */
#header_top{position:relative;display:flex;align-items:center;width:100%;padding:2.9em 3.3em;box-sizing:border-box;background:#f7f7f7;transition:all .3s ease;}
#header_top.sticky{position:fixed;top:0;width:100%;height:70px;padding:0 3.3em;background:#f7f7f7;/*z-index:10000000000*/;z-index:1000000;transition:all .3s ease;}
#header_top .top_menu{display:flex;align-items:center;gap:16px;}

/* 최상단 좌측메뉴 - PC */
#header_top .top_menu .menu{flex:1;display:flex;gap:48px;margin:0 0 0 4px;padding:0;text-align:left;}
#header_top .top_menu .menu li a{font-size:15.6px;font-weight:600;font-family:'Poppins', sans-serif !important;letter-spacing:0.05em;color:#212121;}

/* 최상단 좌측메뉴 - MOBILE */
#header_top .top_menu .hamburger{display:none;position:relative;width:28px;height:24px;cursor:pointer}
#header_top .top_menu .hamburger_bar,.hamburger_bar::before,.hamburger_bar::after{position:absolute;left:0;right:0;height:3px;margin:auto;content:"";background:#212121;transition:transform .3s ease,opacity .3s ease}
#header_top .top_menu .hamburger_bar{top:50%;transform:translateY(-50%)}
#header_top .top_menu .hamburger_bar::before{top:-9px}
#header_top .top_menu .hamburger_bar::after{top:9px}
#header_top .top_menu .nav_toggle{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;padding:0;margin:-1px}
#header_top .top_menu .overlay{position:fixed;inset:0;background:#000f;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .35s ease;z-index:10000000000;}
#header_top .top_menu .overlay_inner{position:relative;width:min(90vw, 520px);max-width:100%;text-align:center}
#header_top .top_menu .overlay_menu{padding:0;margin:0}
#header_top .top_menu .overlay_menu li + li{margin-top:20px}
#header_top .top_menu .overlay_menu a{color:#fefefe;text-decoration:none;font-size:28px;font-weight:700}
#header_top .top_menu .close_btn{position:fixed;top:30px;left:30px;width:44px;height:44px;border-radius:9999px;display:grid;place-items:center;font-size:30px;color:#fefefe;transition:transform .2s ease,opacity .2s ease}
#header_top .top_menu .close_btn:hover{transform:scale(1.05);opacity:.9}

/* 최상단 가운데 멘트, 로고 */
.h_top_ment,.h_top_logo{flex:1;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-weight:400;font-size:14px;letter-spacing:.01em;text-align:center;transition:opacity .3s ease;}
.h_top_logo img{width:auto;height:35px;}

/* 최상단 우측 SNS, 검색 */
.h_top_right{flex:1;display:flex;justify-content:right;font-family:'Noto Sans KR', sans-serif;text-align:right;}
.h_top_right > *{display:inline-flex;gap:10px;}
.h_top_right .menu{margin-right:20px}
.h_top_right .menu a{font-size:1.1rem;font-weight:800;line-height:1;padding:0 2px 4px 2px;border-bottom:2px solid #6ca3d1;}

.h_top_right .sns{margin:0 40px 0 0;}
.h_top_right .sns a{display:inline-block;width:18px;height:18px;background-repeat:no-repeat;background-size:contain;background-position:center;}
.h_top_right .sns a.i1{background-image:url(../img/icon_top_y.png)}
.h_top_right .sns a.i2{background-image:url(../img/icon_top_i.png)}
.h_top_right .sns a.i3{background-image:url(../img/icon_top_f.png)}
.h_top_right .sns a.i4{background-image:url(../img/icon_top_n.png)}
.h_top_right .sns a.i5{background-image:url(../img/icon_top_b.png)}
.h_top_right .sns a.i1:hover{background-image:url(../img/icon_top_y_on.png)}
.h_top_right .sns a.i2:hover{background-image:url(../img/icon_top_i_on.png)}
.h_top_right .sns a.i3:hover{background-image:url(../img/icon_top_f_on.png)}
.h_top_right .sns a.i4:hover{background-image:url(../img/icon_top_n_on.png)}
.h_top_right .sns a.i5:hover{background-image:url(../img/icon_top_b_on.png)}
.h_top_right .search{margin:-3px 0 0 0;}
.h_top_right .search button{width:23px;height:23px;background:url(../img/icon_top_search.png);background-color:transparent;display:inline-block;cursor:pointer;background-repeat:no-repeat;background-size:contain;background-position:center top;}


/* 내려오는 검색 영역 */
.slide-down{position:fixed;top:-90px;left:0;display:flex;width:100%;height:90px;padding:15px 30px;box-sizing:border-box;background-color:#fefefe;transition:top .5s ease;z-index:1000000;}
.slide-down.show{top:0;box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.1);}
.slide-down .search_wrap{flex:1;height:100%;}
.slide-down .search_wrap form{height:100%;}
.slide-down .search_wrap input{width:100%;height:100%;font-size:22px;font-weight:400;padding:0;color:#212121;background:transparent;border:none;}
.slide-down .search_wrap input::placeholder{color:#999;}
.slide-down button.close{display:inline-block;width:auto;background:none;cursor:pointer;}
.slide-down button i{font-size:30px;font-weight:100 !important;color:#999;}


/* 상단 */
#header{position:relative;max-width:100%;background:#f7f7f7;box-sizing:border-box;padding-top:10px;padding-bottom:3.4em;z-index:100;}
#header a:hover{text-decoration:none}


/* 로고, 멘트 */
#header_mid{padding-top:3.2em;}
#header_mid,#header_btm{padding-left:11.8em;padding-right:11.8em;}
#header_mid *{font-family:'Poppins', sans-serif !important;}
#header_mid h1{line-height:1;font-size:79.6px;font-weight:800;color:#212121;}
#header_mid h1 span{font-size:62.4px;font-weight:1000;}
#header_mid h5{font-size:19.2px;font-weight:700;margin-top:15px;color:#212121;}


/* 상단 메뉴 */
#header_btm{display:flex;padding-top:0;margin-top:50px;}
.navigation{position:relative;z-index:10000 !important;}
.navigation .navbar{display:flex;align-items:center;column-gap:3rem;width:100%;height:100%}
.navigation .menu-item{position:relative;display:inline-block;max-width:none;transition:.4s ease}
.navigation .menu-item > a{letter-spacing:0.1em;font-weight:500;line-height:1.2;font-size:14.3px;font-family:'Poppins', sans-serif !important;color:#212121;cursor:pointer;padding:2rem 0;transition:color 0.8s ease;}
.navigation .menu-item:hover > a {color:#6ca3d1;}
.navigation .dropdown{position:absolute;top:150%;left:50%;transform:translateX(-50%) translateY(0);background-color:#212121;width:200px;opacity:0;visibility:hidden;padding:20px 0;transition:transform 0.4s, opacity 0.4s, top .4s}
.navigation .dropdown li{padding:0 1.5rem}
.navigation .dropdown li + li{margin-top:1rem}
.navigation .menu-item:hover .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.navigation .dropdown > li{position:relative}
.navigation .dropdown > li:hover .sub-dropdown{display:block;transform:translateY(0);opacity:1;visibility:visible}
.navigation .dropdown a{font-size:13px;font-weight:600;color:#fefefe;display:block;cursor:pointer}
.navigation .dropdown li:hover > a{color:#6ca3d1 !important;}




#footer{position:relative;width:100%;padding:8em 8em 0;box-sizing:border-box;background:#212121;}
#footer *{color:#fff;}
.footer_wrap{display:grid;grid-template-columns:repeat(2, 1fr);grid-gap:5em;}
.f_info{display:flex;justify-content:space-between;gap:8em;}
.f_info .f_logo{width:150px;}
.f_info .f_logo img{width:100%;height:auto;object-fit:contain;}
.f_info .f_menu{display:flex;flex-direction:column;gap:1em;}
.f_info .f_menu li a{font-size:2.4rem;font-weight:500;font-family:'Poppins', sans-serif !important;}
.f_info .f_menu li:first-child a{color:#6ca3d1 !important}
.f_info .f_btn{display:flex;align-items:center;gap:8px;margin-top:1.2em;}
.f_info .f_btn a{line-height:28px;font-size:1.1rem;color:#6ca3d1 !important;border-bottom:2px solid #6ca3d1}
.f_info .f_copy{margin-top:2.6em;}
.f_info .f_copy p{line-height:22px;font-size:0.9rem;font-weight:300 !important;opacity:0.3;}

.f_info .f_button{display:flex;gap:8px;margin-top:15px;}
.f_info .f_button a{line-height:26px;font-size:14px;color:#6ca3d1 !important;border-bottom:2px solid #6ca3d1}

.f_newsletter h3{font-size:3.7em;font-weight:600;font-family:'Poppins', sans-serif !important;}
.f_newsletter p{font-size:1.2rem;font-weight:300;color:#fff;opacity:0.7}
.f_newsletter .f_form{display:flex;flex-direction:column;gap:0.5em;margin-top:1em;width:100%;}
.f_newsletter .f_form input[type="text"], .f_newsletter .f_form input[type="email"]{width:100%;height:56px;line-height:56px;font-size:2em;font-weight:700;letter-spacing:-0.05em;color:#666;margin-top:0.5em;border-bottom:2px solid #ccc;background:none}
.f_newsletter .f_form .agree{display:flex;flex-direction:column;gap:1em;margin:2em 0;}
.f_newsletter .f_form .agree label{display:flex;align-items:center;line-height:1;font-size:1.1rem;color:#999 !important;font-weight:300 !important;cursor:pointer;}
.f_newsletter .f_form .agree label input{width:16px;height:16px;margin-right:8px;}
.f_newsletter .f_form .agree label i{color:#f34c4c !important;font-size:1.5rem;font-style:normal;margin-left:8px;}
.f_newsletter .f_form .agree label a{color:#6ca3d1 !important;font-weight:400;}

.rd_button{display:inline-block;align-self:flex-start;line-height:1;font-size:1.3rem;font-weight:500;text-align:center;padding:0.8em 2em;color:#6ca3d1 !important;border:1px solid #6ca3d1;border-radius:50%;transition:background-color .3s ease;background:none;cursor:pointer}
.rd_button:hover{color:#fff !important;background-color:#6ca3d1}


.copyright{display:flex;justify-content:space-between;align-items:center;height:70px;line-height:70px;border-top:1px solid rgba(255, 255, 255, 0.6);margin-top:4em;;}
.copyright p{display:flex;align-items:center;font-weight:300;color:#666 !important;}
.copyright p a{line-height:20px;font-weight:300;font-size:11px;padding:0 10px;border-radius:4px;color:#aaa !important;background:#555;margin-left:10px;}
.copyright .sns{display:flex;gap:1.6em}
.copyright .sns a{display:inline-block;width:18px;height:18px;background-repeat:no-repeat;background-size:contain;background-position:center;}
.copyright .sns a.i1{background-image:url(../img/icon_top_y_on.png)}
.copyright .sns a.i2{background-image:url(../img/icon_top_i_on.png)}
.copyright .sns a.i3{background-image:url(../img/icon_top_f_on.png)}
.copyright .sns a.i4{background-image:url(../img/icon_top_n_on.png)}
.copyright .sns a.i5{background-image:url(../img/icon_top_b_on.png)}



/* 최상단으로 */
#btnTop{position: fixed; right: 30px; bottom: 30px; text-align: center; color: #fff; z-index: 99; display: flex; width: 50px; aspect-ratio: 1 / 1; border-radius: 50%; background-color: rgba(0, 0, 0, 0.9); align-items: center; justify-content: center; margin: 0 auto; backdrop-filter: blur(4px); box-shadow: 0 0 10px rgba(63, 63, 63, 0.04); border: #eee; transition-duration: 200ms;}
#btnTop img { width: 50%; transition-duration: 200ms; filter: invert(1); }
#btnTop:hover img{transform: translateY(-4px);}
#btnTop.etc{bottom: 80px;}

/* 하단 광고 여백 */
#f_ad_box{position:relative;width:100%;height:300px;}




/*
@media (max-width:1680px) {
	#header_top{padding:2.9em 3.3em;}
	#header_mid,#header_btm{padding-left:3.3em;padding-right:3.3em;}
}


@media (max-width: 1024px) {
	#header_top.sticky{height:60px;padding:0 2em;}
	#header_top .top_menu .menu,.h_top_right .sns,.dropdown{display:none;}
	#header_top .top_menu .hamburger{display:inline-block;margin-left:auto;}
	#header_top .top_menu .nav_toggle:checked ~ .overlay{opacity:1;pointer-events:auto;}
	#header_top .top_menu .nav_toggle:checked + .hamburger .hamburger_bar{transform:translateY(-50%) rotate(45deg);}
	#header_top .top_menu .nav_toggle:checked + .hamburger .hamburger_bar::before{transform:rotate(-90deg) translateX(-8px);}
	#header_top .top_menu .nav_toggle:checked + .hamburger .hamburger_bar::after{opacity:0;}
	.h_top_right .search button{width:30px;height:30px;}
	
	#header{padding:5em 3em 2.2em 3em;}
	#header_mid,#header_btm{padding:0;margin:0;}
	#header_mid h1{font-size:57.6px;}
	#header_mid h5{font-size:19.2px;font-weight:700;margin-top:15px;color:#212121;}
	#header_btm{max-width:100%;overflow:hidden;overflow-x:scroll;margin-top:2em;}
	.navigation{min-width:940px;padding:1em 0;}
	.navigation .navbar{column-gap:2.5rem;}
	
	#footer{padding:3em 1.5em;}
	.footer_wrap{grid-template-columns:repeat(1, 1fr) !important;grid-gap:0 !important; }
	.f_info{justify-content:left;flex-direction:column !important;gap:3em 0;}
	.f_info .f_logo{width:80px;}
}


@media (max-width:768px) {
	#header_top{padding:2em 2.4em;}
	.h_top_logo{flex:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
	.h_top_logo img{height:30px;}
	
	.slide-down{top:-90px;height:90px;padding:15px 3em;}
}

@media (max-width:600px) {
	#header_top{padding:2em;}
	.h_top_right .menu{display:none;}
	
	#header{padding:2em 2em 2.2em 2em;}
	#header_mid h1{font-size:32.1px;}
}


@media (max-width:480px) {
	.slide-down{top:-80px;height:80px;padding:10px 15px;}
	.slide-down .search_wrap input{font-size:1.3rem;}
	.slide-down{top:-60px;height:60px;padding:10px 1.5em;}
	.slide-down button i{font-size:20px;}
	#header_top{padding:2em 1.2em 2em 1.4em;}
	#header_top .top_menu .hamburger{width:24px;height:18px;}
	#header_top .top_menu .hamburger_bar, .hamburger_bar::before, .hamburger_bar::after{height:2px}
	.h_top_right .search button{width:26px;height:26px;}
	#header_mid h5{font-size:17.8px;margin-top:0.4em;}
	#header_btm{margin-top:1.2em;}
	#header{padding:2em 1.5em;}
	
	.pd{padding:0;}
	.main_title{font-size:40px !important}
	#today_post,#tags,#most_read{padding:4em 1.5em !important;}
	
	.f_info,.f_newsletter{width:100% !important;}
	.f_newsletter h3{font-size:2.6em;margin-top:1em;}
	.f_newsletter p{font-size:0.9rem;}
	.f_newsletter .f_form input[type="text"]{height:42px;line-height:42px;font-size:1.3rem;letter-spacing:-0.03em;}
	.f_newsletter .f_form .agree{gap:0.5em;margin:1em 0 2em 0;}
	.f_newsletter .f_form .agree label{font-size:0.95rem;}
	.f_newsletter .f_form .agree label input{width:15px;height:15px;margin-right:5px;}
	.f_newsletter .f_form .agree label i{font-size:1.1rem;margin-left:5px;}

	.copyright{flex-direction:column;height:50px;line-height:50px;margin-top:4em;}
	.copyright .sns{gap:0.6em}
}


@media (max-width:360px) {
	#header_top .top_menu .hamburger{width:24px;height:18px;}
	#header_top .top_menu .hamburger_bar,.hamburger_bar::before,.hamburger_bar::after{height:2px;}
	#header_top .top_menu .hamburger_bar::before{top:-8px}
	#header_top .top_menu .hamburger_bar::after{top:8px}	
	.h_top_right .search button{width:24px;height:24px;}
	
	#header_mid h1{font-size:29.6px;}
	#header_mid h5{font-size:16.8px;}

	.copyright p{font-size:11px !important;}
	.copyright p a{line-height:18px;font-size:11px;padding:0 7px;border-radius:3px;margin-left:4px;}
	.copyright .sns{gap:0.8em}

}

*/

/* ========================= 매거진/미디어B ========================= */
:root{
	--pop-purple:#d169f1;
	--pop-green: #24d56d;
	--pop-navy: #01011d;
	--pop-pink: #ff639b;
	--pop-blue: #2f89ff;
	--pop-yellow: #ffdf51;

	--padding: calc((100vw - 1600px)/2);
	--gap: 50px;
	--grid-gap: 40px 30px;
	--logo-move: calc(-100% - 25px);

	--title-size: 6rem;
	--page-title: 5rem;
	--font-size-l: 1.3rem;
	--font-size-m: 1.2rem;
	--font-size-s: 1.1rem;
}

/* ======== media ======== */
@media screen and (max-width:1700px) {
	:root{
		--padding: 50px;

		--title-size: 5.5rem;
		--page-title: 4rem;
	}
}

@media screen and (max-width:1280px) {
	:root{
		--grid-gap: 30px 20px;
		--gap: 30px;

		--title-size: 5rem;
		--page-title: 3rem;
		--font-size-l: 1.1rem;
		--font-size-m: 1rem;
		--font-size-s: 0.9rem;
	}
}

@media screen and (max-width:768px) {
	:root{
		--padding: 20px;
		--gap: 20px;
		--grid-gap: 20px 10px;

		--title-size: 4rem;
		--page-title: 2.4rem;
	}
}

@media screen and (max-width:478px){
	:root{
		--title-size: 3rem;
		--page-title: 2rem;
	}
}

/* ============================================================== */
input[type="checkbox"]{position: relative; appearance: none; -webkit-appearance: none; width: 1.1em; height: 1.1em; border: 1px solid #ddd; border-radius: 50%; cursor: pointer; background-color: #fff;}
input[type="checkbox"]:checked{background: #111; border-color: #111;}
input[type="checkbox"]:checked::after{ content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; aspect-ratio: 1/1; background: url('../img/icon/icon_check_white.svg') no-repeat center / contain; }
input[type="checkbox"]:focus-visible{outline: 2px solid #111; outline-offset: 2px;}
label > input[type="checkbox"]{vertical-align: middle; margin-right: 0.5em;}


input[type=text], input[type=password], input[type=email], input[type=tel]{padding: 0.6em; line-height: 1; background-color: #fbfbfb; border: 1px solid #eee; border-radius: 5px; text-align: left; font-size: inherit;}
textarea{padding: 0.6em; background-color: #fbfbfb; border: 1px solid #eee; border-radius: 5px; font-family: inherit; font-size: inherit; width: 100%; resize: none;}
select { background: url(../img/icon/select_arrow.svg) no-repeat calc(100% - 0.5rem) center / 1rem; padding: 0.6em; padding-right: 2em; line-height: 1.25; background-color: #fbfbfb; border: 1px solid #eee; border-radius: 5px; text-align: left; font-size: inherit;}

input[type=file]:focus, input[type=checkbox]:focus, input[type=radio]:focus { outline: none; outline-offset: 0; }
label > input[type=checkbox], label > input[type=radio]{margin-right: 5px;}

input[type=radio]{width:1em; height:1em; border:1px solid #ddd; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius: 50%; background-color: #fbfbfb; box-sizing: content-box !important; vertical-align: text-top; padding: 2px;}
input[type=radio]:checked{content: ""; font-weight:600; color: #fff; background:#fff url('../img/icon/dot.png') no-repeat center / cover; border:1px solid #666;}


/* ========== 애니메이션 ========== */
.wow + .wow{animation-delay: 200ms;}
.wow + .wow + .wow{animation-delay: 300ms;}
.wow + .wow + .wow + .wow{animation-delay: 400ms;}


/* ========= 헤더 ========= */
#header2{position: fixed; top: 0; left: 0; right: 0; display: flex; justify-content: space-between; padding: 25px 50px 0 50px; z-index: 100; align-items: center; }
#header2 .logo{max-width: 15%; transition-duration: 400ms;}
#header2 .logo > a{display: block;}
#header2 .logo img{display: block; height: 50px; object-fit: contain;}
#header2.is-scrolled .logo{ transform: translateY(var(--logo-move));}


.menu_wrap button:hover{cursor: pointer;}
.menu_wrap button{background-color: transparent;}
.menu_wrap button > img{display: block; height: 30px; filter: invert(1);}

.menu_wrap .open_btn, .menu_wrap .close_btn{padding: 10px; border-radius: 50%;}
.menu_wrap .open_btn{background-color: var(--deep-color);}


/* 메뉴 */
.nav_wrap{position: absolute; display: flex; flex-direction: column; gap: 20px; top: 0; right: -50vw; width: 50vw; height: 100vh; background-color: #111; transition-duration: 600ms; color: #fff; padding: 50px; padding-top: 25px; z-index: 100;}
.nav_wrap.on{right: 0;}

.nav_top{display: flex; align-items: center; justify-content: space-between; font-size: 1.1rem; font-weight: 500;}
.nav_top .left{width: 20%;}
.nav_top .left > a{display: block; width: 100%; height: 50px;}
.nav_top .left > a > img{display: block; width: 100%; height: 100%; object-fit: contain;}
.nav_top .right{display: flex; align-items: center; gap: 20px;}
.nav_top .right > ul{display: flex; gap: 10px; align-items: center;}
.nav_top .right li{position: relative;}
.nav_top .right li + li::before{position: absolute; left: -5px; top: 50%; transform: translateY(-50%); width: 1px; height: 0.8em; background-color: rgba(255,255,255,0.4); content:""; display: block;}
.nav_top .right a{padding: 10px;}
.nav_top .right a.point{color: var(--main-color)}
.nav_top .close_btn{background-color: #272727;}


/* 배경 오버레이 */
.nav_bg{position: absolute; left: 0; top: 0; right: 0; height: 100vh; background-color: rgba(255,255,255,0.4); opacity: 0; visibility: hidden; transition: 600ms; z-index: 99; backdrop-filter: blur(2px);}
.nav_bg.on{opacity: 1; visibility: visible;}

#nav{font-size: 1.3rem; flex: 1; overflow-y: scroll;}
#nav::-webkit-scrollbar {width: 5px;}
#nav::-webkit-scrollbar-track {background: transparent;}
#nav::-webkit-scrollbar-thumb {background: #272727; border-radius: 5px;}

.search_box{font-size: 1.1rem; padding: 10px; padding-right: 20px; background-color: #272727; border-radius: 1em;}
.search_box > form{display: flex; gap: 10px; align-items: center; color: #fff;}
.search_box input[type="text"]{border: none; flex: 1; padding: 10px; background-color: transparent; color: inherit; font-size: inherit;}
.search_box button{width: 2em; height: 2em; background: url('../img/icon/icon_search.svg') no-repeat center / contain;}

.gnb_item{display: flex; gap: 20px; align-items: flex-start;}
.gnb_item > a, .gnb_button{display: block; width: 30%; padding: 15px 0; font-weight: 600; font-size: 1.2em; color: #fff; text-align: left; transition-duration: 200ms;}
.gnb_item a:hover, .gnb_button:hover{color: var(--main-color);}

.gnb_sub{display: none; flex: 1; padding: 10px 0 30px 0;}
.gnb_sub > li + li{margin-top: 5px;}
.gnb_sub a{display: block; line-height: 2; transition-duration: 100ms;}


.gnb_button{display: flex; justify-content: space-between; transition-duration: 100ms;}
.gnb_button::after{content:"+"; opacity: 0.8; font-weight: 200; transition-duration: 200ms;}
.gnb_button.on{color: var(--main-color);}
.gnb_button.on::after{opacity: 0;}



/* ========= 푸터 ========= */
#footer2{background-color: #111; color: #999;}

/* ===== 푸터 메뉴 ===== */
.footer_menu{display: flex; align-items: center; justify-content: space-between; padding: 15px 50px; gap: 30px; background-color: var(--main-color); color: var(--bg-text);}
.footer_menu > ul{display: flex; align-items: center; font-size: 1.1rem; gap: 20px; font-weight: 600; }
.footer_menu a{transition-duration: 100ms;}
.footer_menu a:hover{opacity: 0.6;}

.f_menu{flex: 1; font-family: 'Poppins', sans-serif;}
.footer_menu .f_sns{gap: 10px;}
.f_sns a{display:block; width: 30px; height: 30px; background-repeat:no-repeat; background-size:contain; background-position:center;}
.f_sns a.i1{background-image:url(../img/icon_top_y.png)}
.f_sns a.i2{background-image:url(../img/icon_top_i.png)}
.f_sns a.i3{background-image:url(../img/icon_top_f.png)}
.f_sns a.i4{background-image:url(../img/icon_top_n.png)}
.f_sns a.i5{background-image:url(../img/icon_top_b.png)}


/* ===== 푸터 정보 + 뉴스레터 ===== */
.footer_contnet{display: flex;}
.footer_contnet > div{flex: 1; padding: 50px; padding-bottom: 20px;}
.footer_contnet .f_tit{display: block; font-size: 2em; color: var(--main-color); font-family: 'Poppins', sans-serif; font-weight: 600; margin-bottom: 20px;}

/* 푸터 정보 */
.f_copy .info > span{display: block; line-height: 2;}
.f_copy .info > span.copy{margin-top: 30px;}
.powered{display: block; width: fit-content; filter: invert(1); margin-top: 20px;}


/* 뉴스레터 */
.f_letter > p{font-size: 1.2em; color: #eee; margin-bottom: 10px;}
.f_letter .f_form > * + *{margin-top: 20px;}
.f_letter .f_form input[type="email"]{width: 100%; padding: 10px; border: none; border-bottom: 2px solid #fff; background-color: transparent; color: #fff; font-size: 1.5rem; font-weight: 500; border-radius: 0;}
.f_letter .f_form .agree > label{display: block;}
.f_letter .f_form .agree > label + label{margin-top: 10px;}
.f_letter .f_form .agree > label input{width: 1.2em; height: 1.2em; margin-right: 0.5em;}
.f_letter .f_form .agree > label > a{color: var(--pop-yellow); font-weight: 500;}
.f_letter i{font-weight: 600; color: var(--main-color); font-style: initial; margin-left: 0.2em;}

.f_letter .f_form > button{display: block; width: 100%; font-size: 1.3em; line-height: 3; background-color: #272727; border-radius: 1rem; color: #fff; font-weight: 600; font-family: 'Poppins', sans-serif; }
.f_letter .f_form > button:hover{cursor: pointer; color: var(--main-color);}


/* 푸터 로그인 */
.footer_contnet .f_login{flex: initial; width: 240px; font-size: 1.1rem;}
.f_login li + li{margin-top: 10px;}
.f_login a{display: block; width: fit-content; margin-left: auto; font-family: 'Poppins', sans-serif; font-weight: 600; transition-duration: 100ms;}
.f_login a.point{color: var(--pop-yellow)}
.f_login a + a{margin-top: 0.5em;}
.f_login a:hover, .f_login a.point:hover{color: var(--main-color);}



/* ===== 푸터 빅 로고 ===== */
.footer_logo{text-align: right;}
.footer_logo > img{max-width: 100%; max-height: 200px;}




/* ===== 단일페이지 로그인 등 헤더 + 푸터 ===== */

/* 단일 페이지 : 헤더 */
#simple_header{position: sticky; top: 0; left:0; right: 0; display: flex; height: 60px; justify-content: space-between; align-items: center; background-color: #111; color: #fff; z-index: 100; padding: 0 var(--padding);}
.back_btn{padding: 10px; background-color: transparent; color: #fff;}


/* 단일 페이지 : 푸터 */
#simple_footer{background-color: #333; color: #fff; text-align: center; padding: 20px 0;}
#simple_footer .fnb_sub{display: flex; gap: 1em; justify-content: center; padding: 10px var(--padding);}
#simple_footer .copy{padding: 10px var(--padding); opacity: 0.5; margin-top: 10px;}







/* ========= 공통 ========= */
.container{width: calc(100% - 100px); max-width: 1600px; margin-left: auto; margin-right: auto;}

/* 제목 hover 밑줄 */
.tit > span{background: -webkit-gradient(linear, left top, right top, from(currentColor), to(currentColor)); background: -webkit-linear-gradient(left, currentColor 0%, currentColor 100%); background: linear-gradient(to right, currentColor 0%, currentColor 100%); background-size: 0px 2px; background-repeat: no-repeat; background-position: left 100%; -webkit-transition-duration: 500ms; transition-duration: 500ms; display: inline; word-break: keep-all;}
a:hover .tit > span{background-size: 100% 2px;}

/* 카테고리 */
p.category{display: flex; gap: 0.5em; flex-wrap: wrap; font-family: 'Poppins', sans-serif; line-height: 1.2;}
b.category{display: inline-block; font-family: 'Poppins', sans-serif; line-height: 1.2;}
p.category > span, b.category{font-weight: 700; transform: skewX(-6deg); color: #fff;}
p.category > span.color, b.category.color{position: relative; font-weight: 800; padding: 0 0.4em; z-index: 1; background-color: var(--deep-color);}
p.category > span > i{margin: 0 0.3em 0 0.4em;}
p.category + .tit{margin-top: 10px;}

/* 썸네일 */
.thumb{position: relative; display: block; aspect-ratio: 4/5; overflow: hidden; color: #fff; padding: 40px 30px; border-radius: 20px; z-index: 0;}
.thumb::after{position: absolute; left: 0; right: 0; top: 0; bottom: 0;  background-color: rgba(0,0,0,0.4); content:""; display: block; z-index: -1;}
.thumb img{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: block; width: 100%; height: 100%; object-fit: cover; transition-duration: 800ms; z-index: -2;}
.thumb:hover img{transform: translate(-50%, -50%) scale(1.1);}
.thumb .tit{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; font-size: 1.8rem; line-height: 1.4;}


/* 매거진 리스트 */
.magazine_list{display: grid;}
.magazine_list .category{font-size: 1.2rem;}

.magazine_item{position: relative;}
.magazine_item a:not(.profile){display: block;}
.magazine_item:hover .thumb img{transform: translate(-50%, -50%) scale(1.1);}

.magazine_item .thumb{display: flex; flex-direction: column; justify-content: space-between;}
.magazine_item .text{font-size: var(--font-size-l); padding-top: 1em;}
.magazine_item .text > p{line-height: 1.6; min-height: 3.2em; font-weight: 500; margin-bottom: 1em;}
.magazine_item .btm_text{display: flex; font-size: 0.9em; opacity: 0.6; justify-content: space-between;}
.magazine_item .btm_text .view::before{content: ""; display: inline-block; width: 0.9em; height: 0.9em; background: url('../img/icon/icon_view_bk.svg') no-repeat center / contain; margin-right: 0.5em; vertical-align: middle;}

.magazine_item .profile{position: absolute; right: 20px; top : 20px; color: #fff; flex-direction: column-reverse; gap: 10px;}
.magazine_item .profile .p_img{width: 50px; height: 50px;}
.magazine_item .profile .p_name{font-size: 1.1rem;}



/* 프로필 */
.profile{display: flex; gap: 20px; align-items: center; width: fit-content; margin-left: auto;}
.profile .p_img{width: 60px; height: 60px; overflow: hidden; border-radius: 50%; background-color: #ddd;}
.profile .p_img > img{width: 100%; height: 100%; object-fit: cover; transition-duration: 400ms;}
.profile .p_name{opacity: 0; transform: translateX(10px); transition-duration: 400ms; font-size: 1.4rem; font-weight: 600; text-align: center; transition-duration: 400ms;}

.profile:hover .p_img > img{transform: scale(1.2); opacity: 0.8;}
.profile:hover .p_name{opacity: 1; transform: translateX(0);}



/* 버튼 */
.btn_box{display:flex; align-items: center; justify-content: center; gap: 10px;}
.btn_big{display: block; width: fit-content; padding: 1em; text-align: center; font-weight: 500; background-color: #999; color: #fff; border-radius: 8px; line-height: 1; max-width: 320px; font-size: 1rem;}
.btn_box .btn_big{flex: 1;}
.btn_box .btn_big:hover{cursor: pointer;}
.btn_big.btn_b01{background-color: #111; color: #fff;}


/* 페이징 */
.paging{width: fit-content; margin: 30px auto 0 auto;}
.paging, .btn_pagenum{display: flex; align-items: center; gap: 4px;}
.btn_pagenum a{display: block; width: 20px; height: 20px; line-height: 20px; font-size: 0.8em;  border-radius: 50%; text-align: center; color: #666;}
.btn_pagenum a.on{background-color: var(--bg-text); color: #fff; font-weight: 600;}
.btn_p{font-size: 0;}
.btn_p::before{font-family: "Font Awesome 7 Free"; font-size: 1rem; font-weight: 900; opacity: 0.4; transition-duration: 100ms;}
.pg_start::before{content: "\f100";}
.pg_prev::before{content: "\f104";}
.pg_next::before{content: "\f105";}
.pg_end::before{content: "\f101";}
.btn_p:hover::before{opacity: 1;}


/* 캡쳐 */
.captcha_wrap{display: flex; gap: 5px; align-items: center; flex-wrap: wrap;}
.captcha_img{width: 40%; max-width: 140px; aspect-ratio: 3/1; border: 1px solid #eee;}
.captcha_img img{display: block; width: 100%; height: 100%; object-fit: contain;}
.captcha_btns button{display: block; background-color: #111; border-radius: 50%; padding: 4px; width: 24px; height: 24px;}
.captcha_btns button + button{margin-top: 2px;}
.captcha_btns button img{display: block; width: 100%; height: 100%; object-fit: contain;}
.captcha_input{flex: 1;}
.captcha_input input{display: block; width: 100%;}



/* ============================================================== */

/* ======== media ======== */
@media screen and (max-width:1700px) {
	/* 헤더 */
	#header2{padding: 20px var(--padding) 0 var(--padding);}
	.nav_wrap{padding-left: var(--padding); padding-right: var(--padding);}
	.menu_wrap .close_btn{right: var(--padding);}

	/* 푸터 */
	.footer_contnet .f_login{width: fit-content;}

	/* 공통 */
	.tit > span, .thumb .tit{word-break: break-all;}
	.thumb .tit{font-size: 1.6rem; -webkit-line-clamp: 2;}

	.profile .p_img{width: 50px; height: 50px;}
	.profile .p_name{font-size: 1.1rem;}

	.magazine_list .category{font-size: 1rem;}
	.magazine_item .profile{top: 16px;}
	.magazine_item .profile .p_name{font-size: 0.8rem;}
	.magazine_item .profile .p_img{width: 40px; height: 40px;}
	.magazine_item .thumb{padding: 30px 20px;}
}

@media screen and (max-width:1280px) {
	/* 팝업 */
	.hd_pops{left:0 !important;top:0 !important;width:auto !important;height:auto !important;z-index:1000000 !important}
	.hd_pops *{z-index:1000000 !important}
	.hd_pops_con{width:auto !important;min-height:0 !important;height:auto !important}
	.hd_pops_con *{width:100% !important;object-fit:contain !important}
	.hd_pops:nth-child(1){margin:55px 0 0 !important;z-index:111}
	.hd_pops:nth-child(2){margin:110px 0 0 50px  !important;z-index:1111}
	.hd_pops:nth-child(3){margin:150px 0 0 100px  !important;z-index:11111}

	/* 헤더 */
	#header2 .logo{max-width: 20%;}
	.nav_wrap{right: -100vw; width: 100vw; max-width: 800px;}
	.search_box{font-size: 1rem; padding: 0.5em; padding-right: 1em; border-radius: 10px;}
	.search_box input[type="text"]{padding: 0.5em;}
	#nav{font-size: 1rem;}

	/* 푸터 */
	.footer_menu{flex-wrap: wrap; padding: 0; background-color: transparent; gap: 0; color: #fff; border-bottom: 1px solid rgba(255,255,255,0.1);}
	.footer_menu > ul{font-size: 1rem; font-weight: 500;}
	.f_menu{flex: initial; width: 100%; padding: 15px var(--padding); background-color: var(--main-color); text-align: center; color: var(--bg-text);}
	.footer_menu .f_sns{filter: initial !important; padding-right: var(--padding);}
	.f_menu > li{flex: 1;}
	.f_btns{padding: 15px 0 15px var(--padding);}

	.footer_contnet{flex-direction: column; gap: 0;}
	.footer_contnet > div{padding: 30px var(--padding);}
	.footer_contnet > div + div{padding-top: 0;}
	.f_copy .info > span.copy{margin-top: 10px;}
	.footer_contnet .f_login{width: 100%; padding-top: 10px; padding-bottom: 40px; font-size: 1rem;}
	.f_login > ul{display: flex; width: 100%;  gap: 20px; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.1);}
	.f_login li + li{margin-top: 0;}


	/* 공통 */
	.thumb .tit{font-size: 1.4rem;}
	p.category > span:not(.color){display: none;}
}


@media screen and (max-width:960px) {
	/* 공통 */
	.thumb{border-radius: 14px;}
	.thumb .tit{font-size: var(--font-size-l);}
	.magazine_item .text{font-size: var(--font-size-m);}
}

@media screen and (max-width:768px) {
	/* 팝업 */
	.hd_pops_con{height:auto !important;max-height:none !important}
	.hd_pops_con img{width:100% !important;height:auto !important;object-fit:contain !important}
	.hd_pops{max-width:70% !important;height:auto !important}

	/* 공통 */
	.container{width: calc(100% - 40px);}
	.magazine_item .thumb{padding: 20px 15px; border-radius: 10px;}
	.magazine_item .profile{top: 15px; right: 15px; gap: 5px;}
	.magazine_item .profile .p_img{width: 30px; height: 30px;}
	.magazine_list .category{font-size: 0.9rem;}


	/* 헤더 */
	#header2{padding-top: 10px;}
	#header2 .logo{max-width: 25%;}
	#header2 .logo img{height: 30px;}
	.menu_wrap .open_btn, .menu_wrap .close_btn{padding: 8px;}
	.menu_wrap button > img{height: 20px;}
	.search_box{font-size: 0.9rem;}
	.search_box button{width: 1.6em; height: 1.6em;}
	.nav_wrap{padding-bottom: 30px; padding-top: 20px;}
	.nav_top{flex-direction: column; gap: 10px;}
	.nav_top .right{gap: 10px;}
	.nav_top .right > ul{font-size: 0.85rem;}
	.nav_top .right .close_btn{position: absolute; top: 10px;}
	.nav_top .left{width: 25%;}
	.nav_top .left > a{height: 30px;}

	.gnb_item > a, .gnb_button{width: 40%; padding: 10px 0; font-size: 1.1em;}
	#btnTop{width: 36px;}
	#btnTop:hover img{transform: initial;}


	/* 푸터 */
	.footer_menu > ul, .footer_contnet, .footer_contnet .f_login{font-size: 0.9rem;}
	.f_sns a{width: 1.6em;}
	.footer_contnet .f_tit{font-size: 1.6em; margin-bottom: 10px;}
	.f_letter .f_form input[type="email"]{font-size: 1.2em;}
	.f_letter .f_form > button{font-size: 1.1em; border-radius: 10px;}
	.f_copy .info > span{line-height: 1.8;}
	
}

@media screen and (max-width:478px){
	/* 팝업 */
	.hd_pops{max-width:90% !important}
	.hd_pops:nth-child(1){margin:50px 0 0 !important;z-index:111;}
	.hd_pops:nth-child(2){margin:100px 0 0 20px !important;z-index:1111;}
	.hd_pops:nth-child(3){margin:150px 0 0 50px !important;z-index:11111;}

	/* 헤더 */
	#nav{font-size: 0.9rem;}

	/* 푸터 */
	.footer_menu > ul, .footer_contnet, .footer_contnet .f_login{font-size: 0.8rem; gap: 10px;}
	.f_sns a{width: 1.4em;}
	.footer_contnet .f_tit{font-size: 1.4em;}
	.f_letter > p{font-size: 1.1em;}


	/* 공통 */
	.magazine_item .thumb{border-radius: 6px;}
	.magazine_item .text{font-size: var(--font-size-s);}
	.magazine_item .text > p{margin-bottom: 10px;}
	.magazine_item .btm_text{font-size: 0.8em;}

	/* 캡쳐 */
	.captcha_input{width: 100%; flex: initial;}
}