@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike,
strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, 
section, summary, time, mark, audio, video { margin:0; padding:0; border:0; font-size:100%; } 
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; } 
html { font-size: 10px; } 
body { font-family: "Pretendard Variable",'Pretendard','Noto Serif KR', 'Roboto', 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', '맑은 고딕', Dotum, 돋움, Arial, Helvetica, sans-serif; font-style:normal; font-size:1.6rem; color:#111; line-height:normal; letter-spacing:0; position:relative; } 
ol, ul { list-style:none; }
blockquote, q { quotes:none; } 
blockquote:before, blockquote:after, q:before, q:after { content: ''; content:none; } 
table { border-collapse:collapse; border-spacing:0; } 
legend { display:none; } 
em, address { font-style:normal; font-weight:normal; } 
button { cursor:pointer; border:0; background: transparent; font: inherit; padding:0; box-shadow:none; } 
img { vertical-align:top; border:0; } 
a { color:#111; text-decoration:none; } 
a:active, a:focus, a:link, a:visited { text-decoration:none; } 
a:hover { text-decoration:underline; } 
a:hover,a:active:hover, a:focus:hover, a:link:hover, a:visited:hover { text-decoration:none; color:#4fa9b5; } 
input[type="text"] { padding: 0; border: none; border-radius: 0; box-sizing: border-box; font-family: inherit; outline: none; } 
.hide, .blind { width:0; height:0; margin:0; padding:0; position:absolute; left:0; top:0; font-size:0; text-indent:-9999px; overflow:hidden; visibility:hidden; } 

.hide { position: absolute; clip: rect(0 0 0 0); width: 1px; height: 1px; margin: -1px; overflow: hidden; }
.thumb { position: relative; height: auto; box-sizing: border-box; overflow: hidden; display: block; width: 100%; }
.thumb img { width: 100%; height: 100%; position: absolute; top: 0; left: 50%; bottom: 0; transform: translate(-50%, 0); transition: 0.5s; object-fit: cover; }
.thumb:after { clear: both; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #000; opacity: 0.1; box-sizing: border-box; }
.tit { overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; color: #111; font-weight: 800; letter-spacing:-0.5px; font-family:'Noto Serif KR'; }
.tit:hover { color: #4fa9b5; }
.desc { overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; font-size: 14px; line-height: 21px; color: #333; }
.inner { position: relative; width: 1250px; margin: 0 auto; }

.footer { margin-top:100px; }
.footer .f_menu_area { border-top:1px solid #ccc; border-bottom:1px solid #eee; }
.footer .f_menu_area .inner { display: flex; justify-content: space-between; align-items: center; height:59px; }
.footer .f_menu_area .f_menu { display: flex; }
.footer .f_menu_area .f_menu li + li { margin-left:30px; }
.footer .f_menu_area .f_menu li a { font-size:15px; font-weight:500; }
.footer .f_menu_area .f_sns { display: flex; }
.footer .f_menu_area .f_sns li { width: 35px; height: 35px; }
.footer .f_menu_area .f_sns li + li { margin-left:7px; }
.footer .f_menu_area .f_sns li a { display:block; width: 100%; height: 100%; }
.footer .f_menu_area .f_sns li.fb a { background: url(../img/v2/icon_facebook.png) no-repeat; }
.footer .f_menu_area .f_sns li.yt a { background: url(../img/v2/icon_youtube.png) no-repeat; }
.footer .f_menu_area .f_sns li.ig a { background: url(../img/v2/icon_instagram.png) no-repeat; }
.footer .f_copyright { display: flex; justify-content: center; align-items: center; height:94px; }
.footer .f_copyright .copyright { font-size:14px; }

.hd_menu { width:100%; height:35px; text-align:center; background-color:#231815; }
.hd_menu .inner { display:flex; justify-content: space-between; }
.hd_menu .family_site { display:flex; align-items: center; height:35px; position:absolute; left:0; top:0; }
.hd_menu .family_site li a { display:block; }
.hd_menu .family_site li.kor a { width:68px; height:15px; background: url(../img/v2/logo_kor.png) no-repeat; }
.hd_menu .family_site li.jpn a { width:64px; height:16px; background: url(../img/v2/logo_jpn.png) no-repeat; }
.hd_menu .family_site li.jpn { position:relative; margin-left:15px; padding-left:15px; }
.hd_menu .family_site li.jpn:before { content:""; position:absolute; left:0; top:1px; display:block; width:1px; height:15px; background-color:#555; }
.hd_menu .date { font-size:13px; color:#aaa; line-height:35px; letter-spacing:-0.5px; margin:0 auto; }
.hd_menu .btn_signin { position:absolute; right:0; top:0; }
.hd_menu .btn_signin a { display: block; font-size:13px; color:#fff; line-height:35px; }

.header { position:relative; }
.header .inner { display:flex; justify-content: center; flex-direction: column; padding-top:30px; }
.header .logo { width:278px; height:56px; margin:0 auto; }
.header .logo2 { display:none; width:172px; height:34px; }
.header .nav_list { display:flex; margin:16px auto 0; }
.header .nav_list li + li { margin-left:58px; }
.header .nav_list li { height:48px; }
.header .nav_list li a { position: relative; font-size:17px; line-height:48px; font-weight:600; }
.header .nav_list li.asia a { color:#f54c01; background: url(../img/v2/icon_etc_01.png) 0 2px no-repeat; padding-left:20px; }
.header .nav_list li.on a { color:#4fa9b5; }
.header .nav_list li.on a::after { content: ""; clear: both; display: block; width: 100%; height: 3px; background-color: #4fa9b5; position: absolute; left: 0; bottom: -30px; }


.header .btn_search { position:absolute; right:0; bottom:10px; width:30px; height:30px; background: url(../img/v2/btn_search.png) center no-repeat; }
.header .btn_search.active { background: url(../img/v2/btn_close.png) center no-repeat; }
.header .btn_signin { display:none; width:75px; height:28px; line-height:26px; font-size:13px; box-sizing:border-box; border:1px solid #dfdfdf; border-radius:14px; text-align:center; }
.header .btn_signin button { width:100%; height:100%; }
.header .search_layer { display:none; }

.search_layer { width: 100%; height: 100px; position: absolute; bottom:-101px; background: rgb(255 255 255 / 95%); z-index: 9; align-items: center; border-top:1px solid #a9a9a9; box-shadow: rgba(100, 100, 111, 0.2) 0px 10px 29px 0px; display: none; }
.search_layer.active { display: flex; }
.search_layer form { position:relative; margin: 0 auto; width: 500px; height: 44px; border: 1px solid #4fa9b5; display: flex; align-items: center; } 
.search_layer form input { border: none; width: 100%; height: 100%; padding: 0 17px; font-size: 14px; } 
.search_layer form input::placeholder { color:#333; } 
.search_layer .btn_search { background: url(../img/btn_search.png) no-repeat; background-size: 100%; width: 20px; height: 20px; bottom: 11px; margin-right: 17px; } 

.header.fixed { position:fixed; left:0; top:0; width:100%; height:59px; background-color:#fff; border-bottom:1px solid #333; z-index:999; }
.header.fixed .inner { height:100%; padding-top:0; align-items: center; flex-direction: unset; justify-content: normal; }
.header.fixed .logo { display:none; }
.header.fixed .logo2 { display:block; }
.header.fixed .nav_list { margin:0 0 0 40px; }
.header.fixed .nav_list li + li { margin-left: 33px; }
.header.fixed .btn_search { position:relative; right:unset; bottom:unset; margin-left:auto; }
.header.fixed .btn_signin { display:block; margin-left:15px; }

.header.header_sub { position: sticky; top:0; width:100%; height:80px; background-color:#fff; border-bottom:1px solid #dfdfdf; z-index:999; }
.header.header_sub .inner { height:100%; padding-top:0; align-items: center; flex-direction: unset; justify-content: normal; }
.header.header_sub .logo { display:none; }
.header.header_sub .logo2 { display:block; }
.header.header_sub .nav_list { margin:0 0 0 40px; }
.header.header_sub .nav_list li + li { margin-left: 33px; }
.header.header_sub .btn_search { position:relative; right:unset; bottom:unset; margin-left:auto; }
.header.header_sub .btn_signin { display:block; margin-left:15px; }



/*
.header.fixed .search_layer { display:block; }
.header.fixed .search_layer { display: flex; }
*/