@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%; font: inherit;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; } html{font-size: 10px;} body { font-family:'Pretendard','맑은고딕',Arial,Helvetica,sans-serif; font-size: 1.4rem; color:#1a1a1a; background-color:#fff; line-height:1; position:relative; letter-spacing: -0.5px; font-weight: 500; } 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: #666; } input{padding: 0; border: none;border-radius: 0; box-sizing: border-box; font-family: inherit; outline: none; } .hide { position: absolute; clip: rect(0 0 0 0); width: 1px; height: 1px; margin: -1px; overflow: hidden; } .blind { position: absolute; clip: rect(0 0 0 0); width: 1px; height: 1px; margin: -1px; overflow: hidden; } .inner { max-width: 1220px; margin:0 auto; display:flex; } .inner.inner2 { display: block; } .overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); z-index: 90; } .overlay.active { display: block; } body.blocking { overflow: hidden; } .main_top_banner { display: block; width: 100%; position: relative; } .main_top_banner a { display: block; width: 100%; height: 60px; } .main_top_banner .close_btn { position: absolute; right: 30px; top: 21px; cursor: pointer; width: 19px; height: 19px; background: url(../img/btn_close_top_bn.png) no-repeat; } .main_top_banner_m { display: none; } /* stock_market */ .stock_market { position: relative; height: 40px; background: #f4f9ff; overflow: hidden; z-index: 91; display: none; } .stock_market .today { flex-grow: 0; position: relative; width: 114px; font-size: 13px; height: 40px; line-height: 40px; letter-spacing: -0.2px; } .stock_market .today::before { content: ''; position: absolute; right: 0; top: 14px; width: 1px; height: 12px; background: #d4deeb; z-index: 10; } .stock_market .today + a { flex-grow: 1;position: relative; max-width: calc(100% - 114px); } .stock_market .stock_scroll::before { content: ''; position: absolute; left: 0; top: 0; z-index: 9; height: 40px; background: #f4f9ff; padding-right: 13px; box-shadow: 13px 0px 20px 20px #f4f9ff; } .stock_market .stock_scroll::after { content: ''; position: absolute; right: 0; top: 0; z-index: 9; height: 40px; background: #f4f9ff; padding-right: 13px; box-shadow: -13px 0px 20px 20px #f4f9ff; } .stock_market .stock_scroll .simply-scroll { height: 40px; } .stock_market .stock_scroll .simply-scroll .simply-scroll-clip { position: relative; overflow: hidden; } #scroller { display: flex; height: 40px; overflow: hidden; } #scroller ul { display: flex; } #scroller li { height: 40px; padding: 0; margin: 0; list-style: none; margin-right: 20px; } #scroller li .txt_area { display: flex; align-items: center; justify-content: center; height: 40px; width: 100%; } #scroller li .txt_area .tit { display: block; font-size: 12px; color: #333333; border: 1px solid #d4deeb6e; border-radius: 12px; width: 55px; padding: 0 10px; height: 24px; line-height: 22px; text-align: center; box-sizing: border-box; letter-spacing: -0.5px; margin-right: 11px; font-weight: 500; background: #fff; } #scroller li .txt_area .num { font-size: 15px; font-weight: bold; letter-spacing: -0.5px; display: flex; align-items: center; } #scroller li .txt_area .num2 { font-size: 12px; font-weight: 500; margin-left: 11px; letter-spacing: -0.5px; display: flex; align-items: center; } #scroller li .txt_area .num2 .arr { margin-right: 7px; } #scroller li .txt_area .num2.red { color: #f94040; } #scroller li .txt_area .num2.blue { color: #1e81ff; } #scroller li .txt_area .num2.gray { color: #555; } #scroller li .txt_area .num2.red::before { content: ''; display: inline-block; width: 11px; height: 7px; background: url(../img/ico_up.png) no-repeat center / 100%; margin-right: 3px; } #scroller li .txt_area .num2.blue::before { content: ''; display: inline-block; width: 11px; height: 7px; background: url(../img/ico_down.png) no-repeat center / 100%; margin-right: 3px; } #scroller li .txt_area .num2.gray::before { content: ''; display: inline-block; width: 11px; height: 7px; background: url(../img/ico_same.png) no-repeat center / 100%; margin-right: 3px; } #scroller2 { display: flex; } #scroller2 ul { display: flex; } .stock_market a:hover #scroller li .txt_area .num { color:#111; } /* basic */ .thumb { position: relative; height: auto; box-sizing: border-box; overflow: hidden; display: block; } .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; } .thumb img { width: 100%; height: 100%; position: absolute; top: 0; left: 50%; bottom: 0; transform: translate(-50%, 0px); transition: 0.5s; object-fit: cover; } .thumb:hover img { transition: all 0.5s; transform: translate(-50%, 0px) scale(1.1); } .badge { display: inline-block; width: 40px; height: 22px; line-height: 22px; font-size: 13px; color: #fff; text-align: center; font-weight: 400; vertical-align: text-bottom; box-sizing: border-box; margin-right: 8px; } .badge.badge1 { background-color: #f93939; } .badge.badge2 { background-color: #20d0cc; } .badge.badge3 { color: #20d0cc; background-color: #fff; border: 1px solid #20d0cc; } /* header */ .header { position: relative; z-index: 91; background-color: #fff; border-bottom: 1px solid #ccc; } .header .inner { position: relative; height:120px; justify-content: space-between; } .header .logo { width: 214px; height: 70px; display:flex; align-self: center; flex-shrink: 0; } .header .logo a { display: block; width: 100%; height: 100%; } .header .logo a span img { width:100%; } .header .logo a .default_pc { display:block; width:100%; } .header .logo a .default_mo { display:none; width: auto; height:100%; } .header .logo a .event_pc { display:none; width:100%; } .header .logo a .event_mo { display:none; width: auto; height:100%; } .header .logo.logo2 { width:auto; height:100%; flex-shrink: 0; } .header .logo.logo2 a { width:100%; } .header .logo.logo2 a .default_pc { display: none; } .header .logo.logo2 a .event_pc { display: block; } .header .hd_nav { align-self: flex-end; width: 100%; display:flex; justify-content: flex-end; margin-bottom: 20px; } .header .hd_nav .family_site { position: absolute; right: 0; top: 20px; display:flex; justify-content: flex-end; } .header .hd_nav .family_site li { position: relative; height: 36px; } .header .hd_nav .family_site li::before { content: ''; display: inline-block; width: 1px; height: 11px; background-color: #eaeff5; margin-right: 7px; } .header .hd_nav .family_site li:first-child::before { display: none; } .header .hd_nav .family_site li + li { margin-left: 7px; } .header .hd_nav .family_site li a { color: #888; font-size: 13px; } .header .hd_nav .nav_lst { display:flex; justify-content: space-between; width: 70%; } .header .hd_nav .nav_lst li a { height: 36px; line-height: 36px; font-size: 17px; } .header .hd_nav .btn_area { width:115px; margin-left: 30px; display:flex; } .header .hd_nav .btn_area .btn_search { width: 36px; height: 36px; background: url(../img/btn_search.png) center center no-repeat; background-size: 50% auto; } .header .hd_nav .btn_area .btn_menu_all { width: 36px; height: 36px; background: url(../img/btn_menuall.png) center center no-repeat; background-size: 50% auto; } .header .hd_nav .btn_area .link_login { width: 36px; height: 36px; margin-left: 7px; background: url(../img/ico_login.png) no-repeat; background-size: 36px auto; } .header .hd_nav .btn_area .link_login.on { background: url(../img/ico_login_2.png) no-repeat; background-size: 36px auto; } .header .hd_nav .btn_area .btn_search.on { background: url(../img/btn_close.png) center center no-repeat; background-size: 50% auto; } .header .hd_nav .btn_area .btn_menu_all.on { background: url(../img/btn_close.png) center center no-repeat; background-size: 50% auto; } .layer_search { position: absolute; left:0; top: 120px; width: 100%; height: 550px; background-color: #fff; z-index: 99; box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.1); border-top: 1px solid #dfdfdf; display: none; } .layer_search.active { display: block; } .layer_search .inner { width: 61.47%; max-width: 750px; height: auto; flex-direction: column; } .layer_search .search_box { width: 100%; height: 78px; border:4px solid #20d0cc; border-radius: 40px; margin-top: 80px; box-sizing: border-box; display:flex; justify-content: center; align-items: center; } .layer_search .search_box .form_sch { width: 90%; display: flex; align-items: center; } .layer_search .search_box .search_text { width:100%; height: 50px; font-size: 20px; flex-grow: 1; } .layer_search .search_box .btn_search { width: 32px; height: 32px; background: url(../img/btn_search_2.png) no-repeat; flex-shrink: 0; margin-left: 20px; } .layer_search .news_box { width: 100%; border-top: 1px solid #ddd; margin-top: 50px; padding-top: 40px; } .layer_search .news_box h3 { font-size: 19px; } .layer_search .news_box .h3 { font-size: 19px; } .layer_search .news_box ol { display: flex; flex-direction: column; flex-wrap: wrap; height: 240px; margin-top: 18px; } .layer_search .news_box li { width: 50%; margin-bottom: 10px; } .layer_search .news_box li a { display:flex; align-items: center; } .layer_search .news_box li a .num { width: 26px; font-size: 20px; } .layer_search .news_box li:nth-child(1) a .num, .layer_search .news_box li:nth-child(2) a .num, .layer_search .news_box li:nth-child(3) a .num { color: #20d0cc; } .layer_search .news_box li a .thumb { width: 100px; height: 65px; margin-right: 15px; } .layer_search .news_box li a .tit { width:55%; font-size: 16px; line-height: 25px; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .layer_nav_all { position: absolute; left:0; top: 120px; width: 100%; padding-bottom:36px; background-color: #fff; z-index: 99; box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.1); border-top: 1px solid #dfdfdf; display: none; } .layer_nav_all.active { display: block; } .layer_nav_all .inner { height: auto; } .layer_nav_all .nav_01 { width: 75%; display: flex; margin-top: 40px; } .layer_nav_all .nav_02 { width: 12.5%; margin-top: 40px; } .layer_nav_all .nav_03 { width: 12.5%; margin-top: 40px; } .layer_nav_all .nav_01 .group_1 { width: 83.33333%; display: flex; flex-wrap: wrap; } .layer_nav_all .nav_01 .group_2 { width: 16.66666%; } .layer_nav_all .nav_01 .group_1 ul { width: 20%; height: auto; } .layer_nav_all .nav_01 .group_1 ul:nth-child(-n+5) { margin-bottom: 40px; } .layer_nav_all .nav_01 .group ul { box-sizing: border-box; border-right: 1px solid #eee; padding-left: 14px; } .layer_nav_all .nav_01 .group.group_1 ul:nth-child(1), .layer_nav_all .nav_01 .group.group_1 ul:nth-child(6) { padding-left: 0; } .layer_nav_all .nav_01 .group ul li + li { margin-top: 16px; } .layer_nav_all .nav_01 .group ul li a { font-size: 15px; font-weight: 400; letter-spacing:0; } .layer_nav_all .nav_01 .group ul li a strong { font-size: 17px; font-weight: 700; } .layer_nav_all .nav_01 .group_2 ul { height: 100%; } .layer_nav_all .nav_02 ul, .layer_nav_all .nav_03 ul { box-sizing: border-box; padding-left: 14px; } .layer_nav_all .nav_02 ul { border-right: 1px solid #eee; height: 100%; } .layer_nav_all .nav_02 ul li a, .layer_nav_all .nav_03 ul li a { font-size: 15px; } .layer_nav_all .nav_02 ul li + li { margin-top: 24px; } .layer_nav_all .nav_03 ul li + li { margin-top: 24px; } .layer_nav_all .nav_03 { display: flex; flex-direction: column; justify-content: space-between; } .layer_nav_all .nav_03 ul:nth-child(2) li a { font-size: 14px; color: #888; font-weight: 400; } .layer_nav_all .nav_03 ul:nth-child(2) li + li { margin-top: 14px; } .layer_nav_all .nav_01_m { display: none; } .layer_nav_all .nav_04_m { display: none; } .header.fixed { position: fixed; left: 0; top: 0; width: 100%; background: #fff; z-index: 99; border-bottom: 1px solid #eee; } .header.fixed .inner { height: 68px; } .header.fixed .hd_nav .family_site { display: none; } .header.fixed .logo { width: 126px; height: 28px; } .header.fixed .logo a { background: url(../img/logo/logo.png) no-repeat; background-size: 100% auto; } .header.fixed .logo a img { display: none; } .header.fixed .logo.logo2 { width:126px; } .header.fixed .logo.logo2 a .default_pc { display: block; } .header.fixed .logo.logo2 a .event_pc { display: none; } .header.fixed + .layer_search { position: fixed; top: 68px; } .header.fixed + .layer_search + .layer_nav_all { position: fixed; top: 68px; } .header.fixed + .layer_search + .layer_nav_all .inner { height: auto; } .header.fixed .layer_search { top: 68px; } .header.fixed .layer_nav_all { top: 68px; } .header.fixed .layer_nav_all .inner { height: auto; } /* main */ main { position: relative; } .serial_news { height: 80px; border-top: 1px solid #ccc; border-bottom:1px solid #e0e0e0; display: none; } .serial_news .inner { height: 80px; align-items: center; } .serial_news ul { width:100%; display: flex; } .serial_news ul li { position: relative; width: 23.5%; height: 80px; display: flex; align-items: center; box-sizing: border-box; padding-left: 58px; } .serial_news ul li + li { margin-left: 2%; } .serial_news ul li i { position: absolute; left: 0; top: 15px; display: block; width: 50px; height: 50px; } .serial_news ul li:nth-child(1) i { background: url(../img/ico_issue_nav_1.png) no-repeat; } .serial_news ul li:nth-child(2) i { background: url(../img/ico_issue_nav_2.png) no-repeat; } .serial_news ul li:nth-child(3) i { background: url(../img/ico_issue_nav_3.png) no-repeat; } .serial_news ul li:nth-child(4) i { background: url(../img/ico_issue_nav_4.png) no-repeat; } .serial_news ul li:nth-child(5) i { background: url(../img/ico_issue_nav_5.png) no-repeat; } .serial_news ul li.s_focuslab i { background: url(../img/ico_issue_nav_6.png) no-repeat; } .serial_news ul li.s_deepinsight i { background: url(../img/ico_issue_nav_1.png) no-repeat; } .serial_news ul li.s_digitallab i { background: url(../img/ico_issue_nav_2.png) no-repeat; } .serial_news ul li.s_newsquick i { background: url(../img/ico_issue_nav_5.png) no-repeat; } .serial_news ul li .txt_area { display: block; width: 100%;} .serial_news ul li .txt_area a { display: block; width: 100%; } .serial_news ul li .txt_area .ctg { font-size:14px; font-weight: 500; line-height: 16px; text-overflow: ellipsis; white-space: nowrap; } .serial_news ul li:nth-child(1) .txt_area .ctg { color: #794b81; } .serial_news ul li:nth-child(2) .txt_area .ctg { color: #20d0cc; } .serial_news ul li:nth-child(3) .txt_area .ctg { color: #31abd9; } .serial_news ul li:nth-child(4) .txt_area .ctg { color: #eb3fa6; } .serial_news ul li:nth-child(5) .txt_area .ctg { color: #297ed3; } .serial_news ul li.s_focuslab .txt_area .ctg { color: #6717cd; } .serial_news ul li.s_deepinsight .txt_area .ctg { color: #794b81; } .serial_news ul li.s_digitallab .txt_area .ctg { color: #20d0cc; } .serial_news ul li.s_newsquick .txt_area .ctg { color: #297ed3; } .serial_news ul li .txt_area .tit { font-size:15px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-top: 8px; letter-spacing: 0.1px; } /* secw */ .secw .inner { justify-content: space-between; } .secw .col_01 { width: 70.491803%; box-sizing: border-box; } .secw .col_02 { width: 26.229508%; } .secw + .secw { margin-top: 50px; } .serial_news + .secw { margin-top: 30px; } .secw + .secw .col_01 { border-top: 1px solid #000; padding-top: 25px; } .secw + .secw .col_02 { border-top: 1px solid #000; padding-top: 25px; } .secw h3 { font-size: 19px; font-weight: 600; } .secw h3 i { display: inline-block; width: 9px; height: 18px; margin-left: 7px; vertical-align: middle; overflow: hidden; text-indent: -99999px; background: url(../img/btn_more.png) no-repeat; background-size: 100% auto; } .secw .h3 { font-size: 19px; font-weight: 600; } .secw .h3 i { display: inline-block; width: 9px; height: 18px; margin-left: 7px; vertical-align: middle; overflow: hidden; text-indent: -99999px; background: url(../img/btn_more.png) no-repeat; background-size: 100% auto; } .secw.first { margin-top: 40px; } .tit { display: block; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-weight:600; } .s_tit { display: block; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .desc { display: block; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .main_top > .tit { display: block; font-size: 38px; font-weight: 700; letter-spacing: -1.5px; text-align: center; text-overflow: ellipsis; white-space: nowrap; } .main_top .sub_tit {font-size:20px; text-align: center; padding-top:17px;} .main_top .w_news { display: flex; justify-content: space-between; margin-top: 25px; } .main_top .w_news .thumb { width: 63.955%; padding-bottom:38.373%; } .main_top .w_news .news_data { width: 33.722%; } .main_top .w_news .news_data .tit { display: none; } .main_top .w_news .news_data .s_tit { font-size: 20px; line-height: 27px; letter-spacing: 0px; font-weight:600; } .main_top .w_news .news_data .desc { font-size: 15px; line-height: 22px; letter-spacing:0; color: #777; -webkit-line-clamp: 10; margin-top: 12px; letter-spacing: 0px; font-weight:400; max-height: 135px; overflow: hidden; } .main_top .w_news .news_data .add { width: 100%; margin-top: 20px; } .main_top .w_news .news_data .add li a { position: relative; display: block; font-size: 17px; line-height: 29px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; box-sizing: border-box; padding-left: 12px; letter-spacing: 0px; font-weight:600; } .main_top .w_news .news_data .add li a:before { content: ''; display: block; width: 7px; height: 7px; border: 1px solid #1ea9a6; border-width: 0 0 2px 2px; box-sizing: border-box; position: absolute; left: 0; top: 10px; } .main_top_sogbo { width: 100%; padding-bottom: 20px; } .main_top_sogbo .thumb { width: 100%; padding-bottom:52.326%; } .main_top_sogbo .tit { width: 100%; font-size: 33px; font-weight:700; letter-spacing:-1px; line-height: 42px; -webkit-box; -webkit-line-clamp: 2; margin-bottom:15px; text-align: center; } .main_top_sogbo .tit .badge { width: 62px; height: 32px; line-height: 32px; font-size: 20px; margin-right: 15px; vertical-align: top; margin-top:5px; } /* main_top_v2 */ .main_top_v2 { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 30px; } .main_top_v2 .title { width: 100%; flex-basis: 100%; font-size: 34px; font-weight: 600; text-align: center; margin-bottom: 20px; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .main_top_v2 .s_title { width: 100%; flex-basis: 100%; font-size: 20px; text-align: center; margin-bottom: 29px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .main_top_v2 .thumb { width: 61.628%; padding-bottom:40.699%; } .main_top_v2 .news_data { width: 36.047%; } .main_top_v2 .news_data .desc { font-size: 14px; line-height: 21px; color: #777; font-weight: 400; -webkit-line-clamp: 9; } .main_top_v2 .news_data .add { width: 100%; margin-top: 14px; } .main_top_v2 .news_data .add li a { position: relative; display: block; font-size: 17px; line-height: 30px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; box-sizing: border-box; padding-left: 14px; letter-spacing: -0.8px; } .main_top_v2 .news_data .add li a:before { content: ''; display: block; width: 7px; height: 7px; border: 1px solid #1ea9a6; border-width: 0 0 2px 2px; box-sizing: border-box; position: absolute; left: 0; top: 11px; } .main_top_v2.n_type2 { margin-bottom: 30px; } .main_top_v2.n_type2 .title { order:2; margin-top: 18px; margin-bottom: 14px; } .main_top_v2.n_type2 .s_title { display: none; } .main_top_v2.n_type2 .thumb { order:1; width: 100%; padding-bottom:44.187%; } .main_top_v2.n_type2 .news_data { order:3; width: 100%; } .main_top_v2.n_type2 .news_data .desc { -webkit-line-clamp: 1; font-size: 15px; color: #333; } .main_top_v2.n_type2 .news_data .add { display: none; } .main_top_v2.n_type3 { margin-bottom: 30px; } .main_top_v2.n_type3 .title { margin-bottom: 24px; } .main_top_v2.n_type3 .title .badge { width: 60px; height: 30px; line-height: 30px; font-size: 18px; vertical-align: middle; margin-top: -5px; } .main_top_v2.n_type3 .s_title { display: none; } .main_top_v2.n_type3 .thumb { width: 100%; padding-bottom:46.513%; } .main_top_v2.n_type3 .news_data { display: none; } @media screen and (max-width: 899px) { .main_top_v2 { flex-direction: column; margin-bottom: 20px; } .main_top_v2 .title { order:2; font-size: 23px; line-height: 33px; text-align: left; margin-top: 15px; -webkit-box; -webkit-line-clamp: 2; margin-bottom: 10px; } .main_top_v2 .s_title { display: none; } .main_top_v2 .thumb { order:1; width: 100%; padding-bottom:67.165%; } .main_top_v2 .news_data { order:3; width: 100%; } .main_top_v2 .news_data .desc { display: none; } .main_top_v2 .news_data .add { margin-top: 0; } .main_top_v2 .news_data .add li a { font-size: 16px; line-height: 26px; } .main_top_v2 .news_data .add li a:before { top: 9px; } .main_top_v2.n_type2 { margin-bottom: 20px; } .main_top_v2.n_type2 .title { order:1; margin-top: 0; } .main_top_v2.n_type2 .s_title { display: none; } .main_top_v2.n_type2 .thumb { order:3; padding-bottom:59.703%; margin-top: 10px; } .main_top_v2.n_type2 .news_data { order:2; } .main_top_v2.n_type2 .news_data .desc { display: -webkit-box; -webkit-line-clamp: 3; } .main_top_v2.n_type2 .news_data .add { display: none; } .main_top_v2.n_type3 { margin-bottom: 25px; } .main_top_v2.n_type3 .title { order:1; display: flex; margin-top: 0; } .main_top_v2.n_type3 .title .badge { width: 35px; height: 18px; line-height: 18px; font-size: 12px; flex-shrink: 0; margin-top: 7px; } .main_top_v2.n_type3 .s_title { display: none; } .main_top_v2.n_type3 .thumb { order:2; padding-bottom:59.703%; } .main_top_v2.n_type3 .news_data { display: none; } } .main_atc_01 { border-top: 1px solid #ddd; padding-top: 25px; margin-top: 25px; } .main_atc_01 .nty_1 { display: flex; justify-content: space-between; } .main_atc_01 .nty_1 li { width: 31.3953488%; } .main_atc_01 .nty_1 li a { display: flex; flex-direction: column-reverse; } .main_atc_01 .nty_1 li .t_area { display: flex; } .main_atc_01 .nty_1 li .t_area .badge { flex-shrink: 0; margin-top: 15px; } .main_atc_01 .nty_1 li .t_area .tit { font-size: 18px; line-height: 25px; margin-top: 10px; letter-spacing:-0.6px; } .main_atc_01 .nty_1 li .t_area .tit em { flex-grow: 1; display:block; width: 27%; margin-top:4px; } .main_atc_01 .nty_1 li .thumb { padding-bottom:66.67%; } .main_atc_02 { display: flex; flex-wrap: wrap; margin-top: 25px; padding-top: 34px; border-top: 1px solid #ddd; } .main_atc_02 .nty_2 { flex-grow: 1; padding-right: 30px; width:calc(47.3% - 30px); } .main_atc_02 .nty_2 li + li { margin-top:30px; } .main_atc_02 .nty_2 li a { display: flex; justify-content: space-between; align-items: center; } .main_atc_02 .nty_2 li .t_area { display: flex; width: 61.845%; } .main_atc_02 .nty_2 li .t_area .badge { flex-shrink: 0; margin-top: 8px; } .main_atc_02 .nty_2 li .tit { font-size: 18px; line-height: 25px; -webkit-line-clamp: 2; } .main_atc_02 .nty_2 li .thumb { width: 34.578947%; padding-bottom:23.055%; } .main_atc_02 .nty_3 { flex-grow: 1; border-left: 1px solid #ddd; padding-left: 29px; width: calc(52.3% - 30px); } .main_atc_02 .nty_3 ul:nth-child(1) li + li { margin-top: 14px; } .main_atc_02 .nty_3 ul:nth-child(1) li .tit { font-size: 18px; line-height: 35px; -webkit-line-clamp: 1; } .main_atc_02 .nty_3 ul:nth-child(2) { display: flex; justify-content: space-between; margin-top: 20px; } .main_atc_02 .nty_3 ul:nth-child(2) li { width: 47.62%; } .main_atc_02 .nty_3 ul:nth-child(2) li .thumb { padding-bottom:65.999999%; } .main_atc_02 .nty_3 ul:nth-child(2) li .tit { font-size: 18px; line-height: 25px; margin-top: 10px; } .main_global { margin-top: 40px; } .main_global .h_area { display: flex; justify-content: space-between; } .main_global .h_area .tab_area { display: flex; } .main_global .h_area .tab_area button { height: 22px; line-height: 22px; font-size: 15px; color: #999; font-weight: 500; } .main_global .h_area .tab_area button + button { margin-left: 6px; } .main_global .h_area .tab_area button.on { color: #111; } .main_global .h_area .tab_area button:before { content: ''; display: inline-block; width: 22px; height: 22px; background-color: #f55; margin-right: 4px; vertical-align: bottom; border-radius: 50%; } .main_global .h_area .tab_area button:nth-child(1):before { background: url(../img/ico_global_cn.png) no-repeat; background-size: 100% auto; } .main_global .h_area .tab_area button:nth-child(2):before { background: url(../img/ico_global_jp.png) no-repeat; background-size: 100% auto; } .main_global .h_area .tab_area button:nth-child(3):before { background: url(../img/ico_global_vn.png) no-repeat; background-size: 100% auto; } .main_global .tab_lst { margin-top: 8px; } .main_global .tab_lst .tab_box { display: none; } .main_global .tab_lst .tab_box.on { display: block; } .main_global .tab_lst .tab_box ul {margin:10px 0px 5px; } .main_global .tab_lst .tab_box ul li { border-top: 1px solid #eee; padding: 15px 0; } .main_global .tab_lst .tab_box ul li a { display: flex; justify-content: space-between; } .main_global .tab_lst .tab_box ul li .t_area { width: calc(100% - 78px); align-content: center; } .main_global .tab_lst .tab_box ul li .t_area .tit { font-size: 16px; line-height: 25px; letter-spacing: -0.8px; } .main_global .tab_lst .tab_box ul li .thumb { width: 60px; height: 60px; border-radius: 5px; } .main_global .tab_lst .tab_box .btn_more { width: 100%; height: 44px; line-height: 42px; font-size: 15px; font-weight: 400; text-align: center; box-sizing: border-box; border: 1px solid #dfdfdf; border-radius: 5px; position: relative; } .main_global .tab_lst .tab_box .btn_more a { display: block; width: 100%; height: 100%; } .main_global .tab_lst .tab_box .btn_more a:hover{ color: #111; } .main_global .tab_lst .tab_box .btn_more span { color: #ee1c25; font-weight:600; } .main_global .tab_lst .tab_box .btn_more i { display: inline-block; width: 8px; height: 16px; margin-left: 7px; vertical-align: middle; overflow: hidden; text-indent: -99999px; background: url(../img/btn_more_2.png) no-repeat; } .main_global_2 ul { margin-top: 10px; } .main_global_2 ul li {border-top: 1px solid #eee; padding: 15px 0; display: flex; align-items: center; } .main_global_2 ul li .t_area { width: calc(100% - 155px); } .main_global_2 ul li .t_area .ctg { display: block; font-size: 15px; color: #ff3000; margin-bottom: 5px; font-weight:600; letter-spacing:0;} .main_global_2 ul li .t_area .tit { font-size: 17px; line-height: 25px; letter-spacing: -0.8px; } .main_global_2 ul li .thumb { position: relative; width: 140px; height: 90px; margin-left: 15px; border-radius: 5px; } .main_global_2 ul li .thumb i { position: absolute; right: 5px; bottom: 5px; display: block; width: 27px; height: 27px; border-radius: 50%; } .main_global_2 ul li .thumb i.ico_cn { background: url(../img/ico_global_cn.png) center / 100% no-repeat; } .main_global_2 ul li .thumb i.ico_jp { background: url(../img/ico_global_jp.png) center / 100% no-repeat; } .main_global_2 ul li .thumb i.ico_vn { background: url(../img/ico_global_vn.png) center / 100% no-repeat; } .main_focuslab { margin-top: 30px; } .main_focuslab .news { margin-top: 10px; } .main_focuslab .news .img_area { position: relative; display: block; width: 100%; } .main_focuslab .news .img_area .thumb { padding-bottom: 53.125%; border-radius: 15px; } .main_focuslab .news .img_area .ctg { position: absolute; left: 0; bottom: 0; height: 36px; line-height: 36px; font-size: 15px; color: #fff; padding: 0 15px; background-color: #6717cd; } .main_focuslab .news .tit { font-size: 18px; -webkit-line-clamp: 2; margin-top: 10px; line-height:25px; min-height:50px;} .main_ajutv { margin-top: 20px; } .main_ajutv h3 a { position: relative; } .main_ajutv h3 a em { float: left; width: 58px; height: 20px; background: url(../img/logo/logo_abc.png) no-repeat; background-size: 100% auto; overflow: hidden; text-indent: -9999px; } .main_ajutv .h3 a { position: relative; } .main_ajutv .h3 a em { float: left; width: 58px; height: 20px; background: url(../img/logo/logo_abc.png) no-repeat; background-size: 100% auto; overflow: hidden; text-indent: -9999px; } .main_ajutv .video_box { position: relative; width: 100%; padding-bottom: 56.41%; overflow: hidden; margin-top: 10px; border-radius: 10px; } .main_ajutv .video_box iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .main_ajutv_shorts { margin-top: 15px; } .main_ajutv_shorts ul { display: flex; justify-content: space-between; } .main_ajutv_shorts li { width: calc(50% - 10px); overflow: hidden; border-radius: 15px; } .main_ajutv_shorts li .thumb { padding-bottom: 177.9%; } .tooltip { position: absolute; right: 0; top: 0; width: 16px; height: 16px; background: url(../img/ico_tooltip.png) no-repeat; overflow: hidden; text-indent: -99999px; } .ly_tooltip { position: absolute; right: 0; top: 26px; width: 270px; height: auto; font-size: 13px; font-weight: 500; line-height: 19px; box-sizing: border-box; padding: 14px 20px; background-color: #fff; border: 1px solid #20d0cc; box-shadow: 0px 0px 10px 5px rgb(0, 0, 0,.05); z-index: 1; display: none; } .ly_tooltip.on { display: block; } .main_a_ele { position: relative; } .main_a_ele h3 { font-size: 19px; } .main_a_ele h3 span { font-size: 21px; color: #9660d1; margin-left: 5px; } .main_a_ele .h3 { font-size: 19px; } .main_a_ele .h3 span { font-size: 21px; color: #9660d1; margin-left: 5px; } .main_a_ele ul { margin-top: 10px; } .main_a_ele ul li + li { margin-top: 15px; } .main_a_ele ul li a { display: flex; justify-content: space-between; } .main_a_ele ul li .t_area { width: 63.125%; align-content: center; } .main_a_ele ul li .t_area .tit { font-size: 16px; line-height: 22px; } .main_a_ele ul li .thumb { width: 31.25%; padding-bottom:20.315%; border-radius: 5px; } .main_expand { position: relative; margin-top: 35px; } .main_expand ul { margin-top: 10px; } .main_expand ul li + li { margin-top: 15px; } .main_expand ul li a { display: flex; justify-content: space-between; } .main_expand ul li .t_area { width: 63.125%; align-content: center; } .main_expand ul li .t_area .tit { font-size: 16px; line-height: 22px; } .main_expand ul li .thumb { width: 31.25%; padding-bottom:20.315%; border-radius: 5px; } .main_pick { position: relative; } .main_pick ul { display: flex; flex-wrap: wrap; margin-top: 15px; } .main_pick ul li { width: calc(50% - 5px); } .main_pick ul li:nth-child(odd) { padding-right: 5px; } .main_pick ul li:nth-child(even) { padding-left: 5px; } .main_pick ul li:nth-child(-n+2) { margin-bottom: 20px; } .main_pick ul li .thumb { width: 100%; padding-bottom: 64.52%; border-radius: 10px; } .main_pick ul li .tit { font-size: 16px; line-height: 22px; margin-top: 5px; } .main_insight ul { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 15px; } .main_insight ul li { flex: 1 1 30%; } .main_insight ul li a { display: flex; } .main_insight ul li .thumb { width: 70px; height: 70px; border-radius: 50%; flex-shrink: 0; } .main_insight ul li .t_area { box-sizing: border-box; padding:0 9.3% 0 14px; flex-grow: 1; align-content: center; } .main_insight ul li .t_area .name { font-size: 15px; color: #794b81; font-weight:600; letter-spacing:0; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;} .main_insight ul li .t_area .tit { font-size: 18px; line-height: 25px; margin-top: 8px; } .main_insight ul li:nth-child(4) { display: none; } .main_shorts { margin-top: 50px; } .main_shorts h3 a { position: relative; } .main_shorts h3 a em { float: left; width: 129px; height: 20px; background: url(../img/logo/logo_abc_shorts.png) no-repeat; background-size: 100% auto; overflow: hidden; text-indent: -9999px; } .main_shorts .h3 a { position: relative; } .main_shorts .h3 a em { float: left; width: 129px; height: 20px; background: url(../img/logo/logo_abc_shorts.png) no-repeat; background-size: 100% auto; overflow: hidden; text-indent: -9999px; } .main_shorts .shorts_swiper { width: 100%; } .main_shorts .shorts_swiper ul { display: flex; justify-content: space-between; margin-top: 10px; } .main_shorts .shorts_swiper li { width: 22.09302325581395%; } .main_shorts .shorts_swiper .thumb { padding-bottom:177.9%; border-radius: 15px; } .main_digitallab { width: 100%; margin-top: 30px; border-radius: 15px; display: flex; justify-content: space-between; box-sizing: border-box; padding: 40px 5.8% 40px 3.4%; background: url(../img/bg_digitallab.png) no-repeat; } .main_digitallab .h3_area { width:23.052%; position: relative; } .main_digitallab .h3_area h3 { font-size: 24px; color: #fff; font-weight: 400; } .main_digitallab .h3_area h3 strong { font-weight: 600; } .main_digitallab .h3_area .h3 { font-size: 24px; color: #fff; font-weight: 400; } .main_digitallab .h3_area .h3 strong { font-weight: 600; } .main_digitallab .h3_area .tooltip { position: absolute; right: 0; top: 0; width: 16px; height: 16px; background-color: #ddd; border-radius: 50%; } .main_digitallab .h3_area .ly_tooltip { display: none; } .main_digitallab .h3_area .stit { display: block; font-size: 15px; line-height: 21px; color: #99c7eb; font-weight: 300; letter-spacing: -1.1px; margin-top: 19px; } .main_digitallab .h3_area .btn_more { display: block; width: 90px; height:32px; font-size: 14px; color: #fff; line-height: 30px; text-align: center; box-sizing: border-box; border: 1px solid #fff; border-radius: 16px; margin-top: 15px; } .main_digitallab .h3_area .btn_more i { display: inline-block; width: 7px; height: 12px; margin-left: 7px; vertical-align: middle; overflow: hidden; text-indent: -99999px; background: url(../img/btn_more_3.png) no-repeat; } .main_digitallab .digitallab_swiper { width:71.714%; display: flex; margin:0; } .main_digitallab .digitallab_swiper li a { display: flex; flex-direction: column; } .main_digitallab .digitallab_swiper li .thumb { width: 100%; height: auto; padding-bottom:65.9%; } .main_digitallab .digitallab_swiper li .thumb .ctg { position: absolute; left:0; bottom: 0; display: inline-block; height: 27px; line-height: 27px; font-size: 14px; color: #fff; padding: 0 10px; background-color: #20d0cc; } .main_digitallab .digitallab_swiper li .tit { font-size: 18px; line-height: 25px; color: #fff; display: flex; align-items: center; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-top: 10px; } .global_parther h4 { position: relative; font-size: 19px; z-index: 10; } .global_parther .h4 { position: relative; font-size: 19px; z-index: 10; } .global_parther .global_scroll { position:relative; margin-top: 15px; } .global_parther .global_scroll::before { content: ''; position: absolute; left: 0; top: 0; z-index: 9; height: 40px; background: #fff; padding-right: 13px; box-shadow: 13px 0px 20px 20px #fff; } .global_parther .global_scroll::after { content: ''; position: absolute; right: 0; top: 0; z-index: 9; height: 40px; background: #fff; padding-right: 13px; box-shadow: -13px 0px 20px 20px #fff; } .global_parther .global_scroll .simply-scroll-clip { position:relative; overflow:hidden; } .global_parther .global_scroll ul { margin-right:10px; } .global_parther .global_scroll ul li { box-sizing:border-box; width: 140px; height: 56px; border:1px solid #f1f1f1; } .global_parther .global_scroll ul li a { display:flex; width: 100%; height: 100%; justify-content: center; align-items: center; } .global_parther .global_scroll ul li + li { margin-left:10px; } .global_parther .global_scroll ul li a.ico_people { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_people.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_xinhuanet { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_xinhuanet.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_wenweipo { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_wenweipo.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_cctv { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_cctv.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_people1 { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_people1.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_china { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_china.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_nna { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_nna.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_vna { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_vna.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_samaylive { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_samaylive.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_n1 { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_n1.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_gang { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_gang.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_presskorea { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_presskorea.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_journalist { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_journalist.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_kona { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_kona.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_editor { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_editor.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_naver { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_naver.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_daum { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_daum.png) center no-repeat; } .global_parther .global_scroll ul li a.ico_google { background: url(https://image.ajunews.com/images/site/news/kr/v2/img/parther/gp_google.png) center no-repeat; } .main_realtime { position: relative; margin-top: 35px; } .main_realtime .h_area { display: flex; } .main_realtime .h_area h3 { float: left; } .main_realtime .h_area .h3 { float: left; } .main_realtime .h_area .tooltip { position: relative; right: auto; top: auto; float: left; margin-left: 4px; } .main_realtime .h_area .ly_tooltip { width: 200px; height: auto; left: 85px; } .main_realtime .update_area { position: absolute; right: 0; top: 0; } .main_realtime .update_area .current { font-size: 12px; color: #888; } .main_realtime .update_area .btn_update { display: inline-block; width: 80px; height: 23px; line-height: 23px; font-size: 11px; text-align: center; box-sizing: border-box; border: 1px solid #ccc; border-radius: 12px; margin-left: 5px; } .main_realtime .update_area .btn_update i { display: inline-block; width: 13px; height: 13px; background: url(../img/ico_update.png) no-repeat; background-size: 100% auto; vertical-align: text-bottom; margin-left: 4px; } .main_realtime ul { margin:15px 0 0 5px; box-sizing: border-box; padding: 15px 0 20px; border-left:4px double #ddd; } .main_realtime ul li { position: relative; padding-left: 15px; } .main_realtime ul li::before { content: ''; display: block; width: 14px; height: 14px; margin-right: 5px; position: absolute; left: -9px; top: 5px; background: url(../img/ico_realtime_14.png) no-repeat; background-size: 100% auto; } .main_realtime ul li + li { margin-top: 15px; } .main_realtime ul li .time { display: inline-block; min-width: 48px; height: 23px; line-height: 22px; font-size: 12px; color: #20d0cc; font-size: 12px; text-align: center; box-sizing: border-box; padding: 0 10px; border: 1px solid #20d0cc; border-radius: 12px; } .main_realtime ul li .tit { font-size: 17px; line-height: 25px; font-weight: 600; margin-top: 5px; } .main_trend { position: relative; margin-top: 50px; } .main_trend .ly_tooltip { height: auto; } .main_trend ol { margin-top: 15px; } .main_trend ol li + li { margin-top: 15px; } .main_trend ol li a { display: flex; justify-content: space-between; align-items: center; } .main_trend ol li .t_area { width: 63.15%; } .main_trend ol li .t_area .tit_wrap { display: flex; align-items: center; } .main_trend ol li .t_area .tit_wrap .num { width: 25px; flex-shrink: 0; font-size: 20px; } .main_trend ol li:nth-child(-n+3) .t_area .tit_wrap .num { color: #20d0cc; } .main_trend ol li .t_area .tit_wrap .tit { font-size: 16px; line-height: 22px; flex-grow: 1; } .main_trend ol li .thumb { width: 31.25%; padding-bottom:20.315%; } .main_invite { width: 100%; } .main_invite ul { margin-top: 15px; display: flex; justify-content: space-between; } .main_invite ul a { display: flex; justify-content: space-between; align-items: center; } .main_invite ul li { width: 31.148%; } .main_invite ul li .t_area { width: 53.95%; } .main_invite ul li .t_area .tit { font-size: 18px; line-height: 25px; } .main_invite ul li .t_area .name { display: block; font-size: 15px; color: #14afac; font-weight: 500; margin-top: 10px; } .main_invite ul li .thumb { width: 43.423%; padding-bottom:28.95%; } .main_photo { width: 100%; margin-top: 70px; background-color: #333; padding:50px 0; display: flex; justify-content: center; } .main_photo .inner { display: block; width:100%; max-width: 1220px; } .main_photo .inner h3 a { font-size: 20px; color: #fff; margin-bottom: 14px; } .main_photo .inner h3 i { display: inline-block; margin-left: 7px; vertical-align: middle; overflow: hidden; text-indent: -99999px; background: url(../img/btn_more_4.png) no-repeat; background-size: 100% auto; } .main_photo .inner .h3 a { font-size: 20px; color: #fff; margin-bottom: 14px; } .main_photo .inner .h3 i { display: inline-block; margin-left: 7px; vertical-align: middle; overflow: hidden; text-indent: -99999px; background: url(../img/btn_more_4.png) no-repeat; background-size: 100% auto; } .accordion-slider { display: flex; width: 100%; height: 500px; max-height: 400px; overflow: hidden; margin-top: 10px; } .accordion-slider .slide { flex:20.5%; position: relative; transition: flex 0.5s ease-in-out; cursor: pointer; } .accordion-slider .slide + .slide { margin-left: 0.8%; } .accordion-slider .slide.active { flex:57.4%; } .accordion-slider .slide .img { width: 100%; height: 100%; overflow: hidden; object-fit: contain; } .accordion-slider .slide .img img { width: 100%; height: 100%; object-fit: cover; } .accordion-slider .slide .slide-content { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center; transition: height 0.4s ease-in-out; } .accordion-slider .slide .slide-content span { display: block; width:80%; font-size: 20px; color: #fff; font-weight: 500; line-height: 30px; transition: display 0.4s ease-in-out; text-align:center; } .accordion-slider .slide .slide-content a { display: none; font-size: 22px; color: #fff; font-weight: 500; text-decoration: none; transition: display 0.4s ease-in-out; } .accordion-slider .slide .slide-content a:hover { text-decoration: underline; } .accordion-slider .slide.active .slide-content { height: 70px; background-color: rgba(0, 0, 0, 0.5); } .accordion-slider .slide.active .slide-content span { display: none; } .accordion-slider .slide.active .slide-content a { display: block; } .main_photo + .inner { margin-top: 50px; } .m_photo_swiper { display: none; } .main_category { display: flex; flex-flow: row wrap; justify-content: space-between; } .main_category .ctg_news { width: 21.312%; border-top: 1px solid #000; padding-top: 18px; } .main_category .ctg_news:nth-child(n+5) { margin-top: 45px; } .main_category .ctg_news h3 { height: 28px; font-size: 19px; } .main_category .ctg_news .h3 { height: 28px; font-size: 19px; } .main_category .ctg_news ul li + li { border-top: 1px solid #eee; } .main_category .ctg_news ul li .tit { padding: 11px 0; } .main_category .ctg_news ul li .tit em { font-size: 18px; font-weight: 600; line-height: 25px; min-height: 44px; display: block; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; } .main_category .ctg_news ul li .thumb { padding-bottom:57.698%; } .dasuk_koiners { display: flex; width: 100%; justify-content: space-between; } .dasuk { width: 37.705%; display: flex; justify-content: space-between; } .dasuk .h_area { width: 26.09%; } .dasuk .h_area h4 { font-size: 19px; font-weight:600; } .dasuk .h_area .h4 { font-size: 19px; font-weight:600; } .dasuk .h_area span { display: block; font-size: 15px; line-height: 21px; margin: 16px 0 0; } .dasuk .h_area .btn_area { display: flex; flex-direction: column; margin-top: 15px; } .dasuk .h_area .btn_area a { display: block; width: 100%; max-width:110px; height: 32px; line-height: 32px; font-size: 13px; color: #fff; text-align: center; background-color: #001913; box-sizing: border-box; border-radius: 16px; } .dasuk .h_area .btn_area a + a { color: #333; background-color: #fff; border:1px solid #c9c9c9; margin-top: 7px; } .dasuk .m_tit { display: none; } .dasuk .video_box { position: relative; width: 69.566%; max-height: 180px; overflow: hidden; } .dasuk .video_box iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .dasuk .btn_area_m { display: none; } .koiners { width: 34.427%;display: flex; justify-content: space-between; } .koiners .h_area { width: 33.3333%;} .koiners .h_area h4 { font-size: 19px; font-weight:600; } .koiners .h_area .h4 { font-size: 19px; font-weight:600; } .koiners .h_area .btn_more { display: block; width: 100%; max-width: 80px; height: 30px; line-height: 30px; text-align: center; font-size: 13px; color: #333; box-sizing: border-box; border:1px solid #c9c9c9; border-radius: 15px; margin-top: 10px; } .koiners .h_area .m_tit { display: none; } .koiners .upbit { display: block; font-size: 12px; color: #888; margin-top: 20px; } .koiners .upbit em { display: inline-block; width: 56px; height: 13px; background: url(../img/logo_upbit.png) no-repeat; background-size: 100% auto; overflow: hidden; text-indent: -99999px; margin-left: 6px; vertical-align: bottom; } .koiners > .upbit { display: none; } .koiners .price_lst { width: 76.1904%; max-height: 205px; } .koiners .koiners_swiper { width: 100%; height: 100%; } .koiners .koiners_swiper li { width: 100%; text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; } .koiners .koiners_swiper li > div { width: 100%; display: flex; padding-top: 10px; } .koiners .koiners_swiper li .name { position: relative; display: flex; width: 42.857%; align-items: center; } .koiners .koiners_swiper li .name i { width: 40px; height: 40px; margin-right: 10px; flex-shrink: 0; } .koiners .koiners_swiper li .name strong { font-size: 16px; } .koiners .koiners_swiper li .name strong em { display: block; font-size: 12px; color: #888; margin-top: 5px; } .koiners .koiners_swiper li .num { position: relative; display: flex; flex-direction: column; text-align: right; width: 49.999%; } .koiners .koiners_swiper li .num strong { font-size: 17px; font-weight:600; } .koiners .koiners_swiper li .num span { font-size: 13px; margin-top: 5px; } .koiners .koiners_swiper li .num span em { margin-left: 10px; font-weight:500; } .koiners .koiners_swiper li .num span.red { color: #f94040; } .koiners .koiners_swiper li .num span.red::before { content: ''; display: inline-block; width: 9px; height: 7px; background: url(../img/ico_up.png) no-repeat center / 100%; margin-right: 3px; } .koiners .koiners_swiper li .num span.blue { color: #1e81ff; } .koiners .koiners_swiper li .num span.blue::before { content: ''; display: inline-block; width: 9px; height: 7px; background: url(../img/ico_down.png) no-repeat center / 100%; margin-right: 3px; } .koiners .koiners_swiper li .num span.gray { color: #777; } .koiners .koiners_swiper li .num span.gray::before { content: ''; display: inline-block; width: 9px; height: 7px; background: url(../img/ico_same.png) no-repeat center / 100%; margin-right: 3px; } .koiners .koiners_swiper li .btc .name i { background: url(../img/ico_coin_btc.png) 0 0 no-repeat; background-size: 100% auto; } .koiners .koiners_swiper li .eth .name i { background: url(../img/ico_coin_eth.png) 0 0 no-repeat; background-size: 100% auto; } .koiners .koiners_swiper li .usdt .name i { background: url(../img/ico_coin_usdt.png) 0 0 no-repeat; background-size: 100% auto; } .koiners .koiners_swiper li .xrp .name i { background: url(../img/ico_coin_xrp.png) 0 0 no-repeat; background-size: 100% auto; } .newspaper_bn {width: 19.673%; } .newspaper_bn img { width: 100%; } .newspaper_bn .img { display: block; } .newspaper_bn .img_m { display: none; } .family_news { display: flex; justify-content: space-between; width: 100%; margin-top: 50px; border-top: 1px solid #ddd; padding-top: 50px; } .family_news > div { width: 30%; } .family_news > div .h_area { height: 30px; display: flex; justify-content: space-between; align-items: flex-end; } .family_news > div .h_area h4 { width: 150px; height: 30px; } .family_news .ajudaily .h_area h4 { background: url(../img/logo_ajudaily.png) 0 0 no-repeat; background-size: auto 100%; } .family_news .economidaily .h_area h4 { background: url(../img/logo_economidaily.png) 0 0 no-repeat; background-size: auto 100%; } .family_news .ajupress .h_area h4 { background: url(../img/logo_ajupress.png) 0 0 no-repeat; background-size: auto 100%; } .family_news > div .h_area .h4 { width: 150px; height: 30px; } .family_news .ajudaily .h_area .h4 { background: url(../img/logo_ajudaily.png) 0 0 no-repeat; background-size: auto 100%; } .family_news .economidaily .h_area .h4 { background: url(../img/logo_economidaily.png) 0 0 no-repeat; background-size: auto 100%; } .family_news .ajupress .h_area .h4 { background: url(../img/logo_ajupress.png) 0 0 no-repeat; background-size: auto 100%; } .family_news > div .h_area .btn_more { font-size: 13px; color: #999; } .family_news ul { margin-top: 15px; } .family_news ul li + li { margin-top: 15px; } .family_news ul li a { display: flex; justify-content: space-between; } .family_news ul li .thumb { width: 30%; padding-bottom:20%; } .family_news ul li .t_area { width: 65%; align-content: center; } .family_news ul li .t_area .tit { font-size: 16px; line-height: 25px; } .family_news .ajudaily ul li .t_area .tit { font-family:"Noto Sans SC",'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', '맑은 고딕', Dotum, 돋움, Arial, Helvetica, sans-serif; } .board_w { display: flex; justify-content: space-between; width: 100%; margin-top: 50px; border-top: 1px solid #ddd; padding-top: 50px; } .board_w .notice { width: 29.509%; display: flex; } .board_w .notice h4 { width: 16.666%; font-size: 19px; line-height:47px; font-weight:600; } .board_w .notice .h4 { width: 16.666%; font-size: 19px; line-height:47px; font-weight:600; } .board_w .notice ul { width: 83.333%; } .board_w .notice ul li { border-bottom: 1px solid #eee; } .board_w .notice ul li a { display: block; font-size: 16px; line-height: 46px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .board_w .event { width: 34.427%; display: flex; } .board_w .event h4 { width: 28.571%; font-size: 19px; line-height:47px; font-weight:600; } .board_w .event .h4 { width: 28.571%; font-size: 19px; line-height:47px; font-weight:600; } .board_w .event ul { width: 71.428%; } .board_w .event ul li { border-bottom: 1px solid #eee; } .board_w .event ul li a { display: block; font-size: 16px; line-height: 46px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .board_w .paper { width: 31.148%; background-color: #f9f9f9; display: flex; box-sizing: border-box; padding: 10px 0 10px 30px; align-items: center; } .board_w .paper h4 { display: none; } .board_w .paper .h4 { display: none; } .board_w .paper .img { width: 130px; box-shadow: 0px 0px 8px 4px rgba(0,0,0,0.08); } .board_w .paper .img img { width: 100%; } .board_w .paper .h_area { margin-left: 24px; align-content: center; } .board_w .paper .h_area .h4 { display: block; font-size: 19px; font-weight:600; } .board_w .paper .h_area .txt { display: block; font-size: 15px; margin-top: 8px; } .board_w .paper .btn_area { display: flex; flex-direction: column; margin-top: 18px; } .board_w .paper .btn_area a { width: 110px; height: 32px; font-size: 13px; line-height: 32px; text-align:center; box-sizing: border-box; border-radius: 16px;; } .board_w .paper .btn_area a.btn_day { background-color: #20d0cc; color: #fff; } .board_w .paper .btn_area a.btn_subscribe { background-color: #fff; color: #333; line-height: 30px; border:1px solid #c9c9c9; margin-top: 5px;; } .global_parther { margin-top: 50px; } .nav_all_bottm { display: flex; width: 100%; border-top: 4px double #aaa; margin-top: 100px; margin-bottom: 50px; } .nav_all_bottm .inner { height: auto; } .nav_all_bottm .nav_01 { width: 75%; display: flex; margin-top: 40px; } .nav_all_bottm .nav_02 { width: 12.5%; margin-top: 40px; } .nav_all_bottm .nav_03 { width: 12.5%; margin-top: 40px; } .nav_all_bottm .nav_01 .group_1 { width: 83.33333%; display: flex; flex-wrap: wrap; } .nav_all_bottm .nav_01 .group_2 { width: 16.66666%; } .nav_all_bottm .nav_01 .group_1 ul { width: 20%; height: auto; } .nav_all_bottm .nav_01 .group_1 ul:nth-child(-n+5) { margin-bottom: 40px; } .nav_all_bottm .nav_01 .group ul { box-sizing: border-box; border-right: 1px solid #eee; padding-left: 14px; } .nav_all_bottm .nav_01 .group.group_1 ul:nth-child(1), .nav_all_bottm .nav_01 .group.group_1 ul:nth-child(6) { padding-left: 0; } .nav_all_bottm .nav_01 .group ul li + li { margin-top: 16px; } .nav_all_bottm .nav_01 .group ul li a { font-size: 15px; font-weight: 400; letter-spacing:0; } .nav_all_bottm .nav_01 .group ul li a strong { font-size: 17px; font-weight: 500; } .nav_all_bottm .nav_01 .group_2 ul { height: 100%; } .nav_all_bottm .nav_02 ul, .nav_all_bottm .nav_03 ul { box-sizing: border-box; padding-left: 14px; } .nav_all_bottm .nav_02 ul { border-right: 1px solid #eee; height: 100%; } .nav_all_bottm .nav_02 ul li a, .nav_all_bottm .nav_03 ul li a { font-size: 15px; } .nav_all_bottm .nav_02 ul li + li { margin-top: 24px; } .nav_all_bottm .nav_03 ul li + li { margin-top: 24px; } .nav_all_bottm .nav_03 { display: flex; flex-direction: column; justify-content: space-between; } .nav_all_bottm .nav_03 ul:nth-child(2) li a { font-size: 13px; color: #888; font-weight: 400; } .nav_all_bottm .nav_03 ul:nth-child(2) li + li { margin-top: 14px; } .nav_all_bottm .nav_01_m { display: none; } .nav_all_bottm .nav_04_m { display: none; } .btn_top { position: fixed; bottom: 0px; right: 50px; opacity: 0; width: 65px; height: 65px; box-sizing: border-box; border:1px solid #eee; border-radius: 50%; background:#fff url(../img/btn_top.png) center/50% no-repeat; box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px; z-index: 99; } .btn_top button { width: 100%; height: 100%; } .btn_top.show { opacity: 1; bottom: 50px; transition: all 0.2s; } .ai_wrap { position: fixed; display: flex; justify-content: flex-end; align-items: center; bottom: 0px; right: 125px; opacity: 0; width: 65px; height: 65px; box-sizing: border-box; border-radius: 33px; background:url(../img/bg_translation.png) center/100% no-repeat; box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px; overflow: hidden; transition: all 0.2s; z-index: 99; } .ai_wrap ul { display: flex; margin-right: 15px; opacity: 0; } .ai_wrap ul li { width: 30px; height: 30px; } .ai_wrap ul li + li { margin-left: 10px; } .ai_wrap ul li a { display: block; width: 100%; height: 100%; } .ai_wrap ul li.cn a { background:url(../img/ico_ai_cn.png) center/100% no-repeat; } .ai_wrap ul li.en a { background:url(../img/ico_ai_en.png) center/100% no-repeat; } .ai_wrap ul li.jp a { background:url(../img/ico_ai_jp.png) center/100% no-repeat; } .ai_wrap ul li.vn a { background:url(../img/ico_ai_vn.png) center/100% no-repeat; } .ai_wrap:hover { width:240px; background:url(../img/bg_translation_2.png) center/100% no-repeat; border-radius: 33px; transition: all 0.2s; } .ai_wrap:hover ul { opacity: 1; transition: all 0.2s; } .ai_wrap.show { opacity: 1; bottom: 50px; } .f_menu { border-top: 1px solid #e0e0e0; border-bottom: 1px solid #ccc; } .f_menu .lst { display: flex; width: 100%; justify-content: space-between; } .f_menu .lst li a { display: block; width: 100%; font-size: 15px; height: 50px; line-height: 50px; } .f_menu .lst li a strong { font-weight:600; } .f_menu .lst li.rss a i { content: ''; background: url(../img/ico_rss.png) no-repeat; width: 15px; height: 15px; display: inline-block; margin-left: 5px; vertical-align: text-bottom; } .f_menu .lst li.inec { align-content: center; } .f_menu .lst li.inec a { display: block; width: 133px; height: 25px; background: url(../img/inec.png) no-repeat; } .f_menu .lst_m { display: none; } .address_w { padding: 40px 0 30px; width: 100%; } .address_w .f_logo { width: 120px; height: 26px; margin-right: 40px; flex-shrink: 0; background: url(../img/logo/logo.png) no-repeat; background-size: 100% auto; } .address_w .address { flex-grow: 1; } .address_w .address ul { width: 100%; display: flex; flex-wrap: wrap; } .address_w .address ul li { position: relative; font-size: 14px; margin-bottom: 17px; } .address_w .address ul li::after { content: ''; display: inline-block; width: 1px; height: 11px; background-color: #eaeff5; margin: 0 15px; } .address_w .address ul li:last-child::after { display: none; } .address_w .address .info { display: block; } .address_w .address .copyright { display: block; margin-top: 30px; } /* ad */ .atc_ad_wing { position: relative; left: 0; top: 0; width: 1220px; margin:0 auto; z-index: 90; } .atc_ad_wing .wing_left { position: absolute; left: -140px; top: 1000px; width: 120px; height: 600px; } .atc_ad_wing .wing_left a { display: block; width:100% } .atc_ad_wing .wing_left a + a { margin-top:20px; } .atc_ad_wing .wing_right { position: absolute; right: -140px; top: 1000px; width: 120px; height: 600px; } .atc_ad_main { width: 100%; max-width: 860px; overflow: hidden; margin-top: 54px; } .atc_ad_main img { width: 100%; } .atc_ad_main_2 { margin-top: 48px; } .atc_ad_main_2 img { width: 100%; } .atc_ad_main_3 { margin-top: 15px; } .atc_ad_main_3 img { width: 100%; } .atc_ad_main_3 .m_banner {display:none;} .atc_ad_main_m { display: none; } .icon_new {position:absolute; top:10px;} .nav_02 .icon_new {top:65px;} @media screen and (max-width: 899px) { .atc_ad_main_3 { margin-top: 15px; } .atc_ad_main_3 img { width: 100%; } .atc_ad_main_3 .m_banner {display:block;} .atc_ad_main_3 .pc_banner {display: none;} } /* media query */ @media screen and (max-width: 1220px) { .header .inner { box-sizing: border-box; padding: 0 40px; } .stock_market .inner { box-sizing: border-box; padding: 0 40px; } .header .hd_nav .family_site { right: 40px; } .serial_news .inner { box-sizing: border-box; padding: 0 40px; } .secw { box-sizing: border-box; padding: 0 40px; } .atc_ad_wing { display: none; } } @media screen and (max-width: 1110px) { .main_global .h_area { flex-direction: column; } .main_global .h_area .tab_area { margin-top: 10px; } .koiners .koiners_swiper li .name strong { font-size: 14px; } .koiners .koiners_swiper li .name strong em { font-size: 11px; } .koiners .koiners_swiper li .num strong { font-size: 15px; } .koiners .koiners_swiper li .num span { font-size: 11px; } } @media screen and (max-width: 899px) { .main_top_banner { display: none!important; } .main_top_banner_m { display: block; width: 100%; position: relative; } .main_top_banner_m a { display: block; width: 100%; } .main_top_banner_m a img { display: block; width: 100%; } .main_top_banner_m .close_btn { position: absolute; right: 10px; top: 10px; cursor: pointer; width: 19px; height: 19px; background: url(https://image.ajunews.com/images/site/news/kr/v2/img/btn_close_img.png) center / 20px 20px no-repeat; } .header .inner { height: 65px; padding: 0 20px; } .stock_market .inner { padding: 0; } .stock_market .today { display: none; } .stock_market .today em { display: none; } .stock_market .stock_scroll { max-width: 100%; } .stock_market .stock_scroll::before { left: -20px; } .stock_market .stock_scroll::after { right: -20px; } #scroller li .txt_area .tit { font-size: 13px; width: 64px; } #scroller li .txt_area .num2 { font-size: 13px; } .blocking .stock_market { display: none; } .blocking .header .hd_nav .btn_area { width: auto; } .blocking .header .hd_nav .btn_area .link_login { display: none; } .header .logo { width: 118px; height: 42px; } .header .logo a { background-size: 100% auto; } .header .logo a .default_pc { display:none;} .header .logo a .default_mo { display:block; } .header .logo.logo2 a .default_pc { display:none; } .header .logo.logo2 a .default_mo { display:none; } .header .logo.logo2 a .event_pc { display:none; } .header .logo.logo2 a .event_mo { display:block; margin-left: -20px; } .header .logo.logo2 a span img { width: auto; height: 100%; } .header.fixed .inner { height: 60px; } .header.fixed .logo { width: 96px; height: 21px; } .header.fixed .logo.logo2 { width:96px; } .header.fixed .logo.logo2 a .default_pc { display: none; } .header.fixed .logo.logo2 a .default_mo { display: block; } .header.fixed .logo.logo2 a .event_pc { display: none; } .header.fixed .logo.logo2 a .event_mo { display: none; } .blocking .header .logo.logo2 { width: 96px; height: 21px; } .blocking .header .logo.logo2 a { background: url(../img/logo/logo.png) no-repeat; background-size: 100% auto; } .blocking .header .logo.logo2 a .event_mo { display: none; } .blocking .header .logo.logo2 a .default_mo { display: block; } .blocking .header.fixed .logo.logo2 a .default_mo { display: block; } .blocking .header .logo.logo2 a span img { width: auto; height: 100%; } .header .hd_nav { margin-bottom: 18px; } .header .hd_nav .family_site { display: none; } .header .hd_nav .nav_lst { display: none; } .header .hd_nav .btn_area { width: auto; } .header .hd_nav .btn_area .btn_menu_all { width: 30px; height: 30px; background-size: 60% auto; } .header .hd_nav .btn_area .btn_search { width: 30px; height: 30px; background-size: 60% auto; } .header .hd_nav .btn_area .btn_search.on { background-size: 60% auto; } .header .hd_nav .btn_area .link_login { width: 30px; height: 30px; background-size: 100% auto; } .header .hd_nav .btn_area .link_login.on { background-size: 30px auto; } .header.fixed .hd_nav { margin-bottom: unset; align-self: center; } .layer_search { top: 65px; height: auto; border-top: 1px solid #ccc; } .layer_search .inner { width:100%; padding: 0 20px 50px; height: 100%!important; } .layer_search .search_box { padding:0 2px; box-sizing: border-box; height: 45px; border-width: 2px; width: 90%; margin:50px auto 0; } .layer_search .search_box .search_text { height: 35px; font-size: 18px; } .layer_search .search_box .btn_search { width: 20px; height: 20px; background-size: 100% auto; } .layer_search .news_box { padding-top: 0; margin-top: 50px; border-top: 0; } .layer_search .news_box h3 { font-size:20px; border-bottom: 1px solid #ddd; padding-bottom: 15px; } .layer_search .news_box .h3 { font-size:20px; border-bottom: 1px solid #ddd; padding-bottom: 15px; } .layer_search .news_box ol { margin-top: 20px; flex-wrap: nowrap; height: auto; } .layer_search .news_box li { width: 100%; } .layer_search .news_box li a .thumb { width: 50px; height: 50px; } .layer_search .news_box li a .tit { -webkit-line-clamp: 1; flex-grow: 1; } .layer_nav_all { top: 65px; border-top: 1px solid #ccc; } .layer_nav_all .nav_01 { display: none; } .layer_nav_all .nav_01_m { display: block; padding-top: 20px; } .layer_nav_all .nav_04_m { display: flex; margin-top: 30px; } .layer_nav_all .nav_04_m a { width: 135px; height: 40px; line-height: 40px; font-size: 16px; text-align: center; box-sizing: border-box; border:1px solid #c9c9c9; border-radius: 20px; } .layer_nav_all .nav_04_m a + a { color: #fff; margin-left: 10px; border:0; background-color: #20d0cc; } .layer_nav_all .inner { display: block; height: calc(100vh - 65px)!important; overflow-x: scroll; padding-bottom: 120px; box-sizing: border-box; padding:0px 20px 120px; } .layer_nav_all .nav_01_m ul { display: flex; flex-direction: column; flex-wrap: wrap; height: 300px; } .layer_nav_all .nav_01_m ul li a { font-size: 20px; font-weight: 500; line-height: 50px; } .layer_nav_all .nav_02 { border-top: 1px solid #333; margin-top: 24px; padding-top: 24px; } .layer_nav_all .nav_02, .layer_nav_all .nav_03 { width: 100%; box-sizing: border-box; } .layer_nav_all .nav_02 ul, .layer_nav_all .nav_03 ul { padding-left: 0; display: flex; flex-direction: column; flex-wrap: wrap; height: 300px; } .layer_nav_all .nav_02 ul { border-right: 0 none; } .layer_nav_all .nav_02 ul li a { font-size: 18px; font-weight: 500; line-height: 50px; } .layer_nav_all .nav_02 ul li + li { margin-top: 0; } .layer_nav_all .nav_03 ul { background: #f4f9ff; border: 1px solid #ececec; box-sizing: border-box; padding: 15px 25px; height: 230px; } .layer_nav_all .nav_03 ul + ul { display: none; } .layer_nav_all .nav_03 ul li + li { margin-top: 0; } .layer_nav_all .nav_03 ul li a { font-size: 18px; font-weight: 500; line-height: 50px; } .layer_nav_all .nav_04_m a { width: 40%; } .header.fixed .layer_search { top:60px; } .header.fixed .layer_nav_all { top:60px; } .tit { font-size:19px; line-height:28px; font-weight:500; } .serial_news { height: auto; } .serial_news .inner { width: 100%; height: auto; padding: 0 20px; } .serial_news .serial_swiper { width: 100%; } .serial_news ul li { padding-left: 0; height: 45px; } .serial_news ul li + li { margin-left: 0; } .serial_news ul li i { display: none; } .serial_news ul li .txt_area { height: 100%; } .serial_news ul li .txt_area .tit { display:none; } .serial_news ul li .txt_area .ctg { font-size: 15px; height: 100%; line-height: 45px; display: block; } .serial_news ul li .txt_area .ctg::before { content: ''; float: left; width: 1px; height: 10px; background-color: #d4deeb; margin-top: 21px; } .serial_news ul li { width:auto; text-align: center; } .serial_news ul li:nth-child(1) { width:21.6%; } .serial_news ul li:nth-child(2) { width:20.1%; } .serial_news ul li:nth-child(3) { width:28%; } .serial_news ul li:nth-child(4) { width:16.8%; } .serial_news ul li:nth-child(5) { width:13.5%; } .serial_news ul li:nth-child(1) .txt_area .ctg::before { display: none; } .serial_news + .secw { margin-top: 30px; } .secw { box-sizing: border-box; padding: 0 20px; } .secw .inner { flex-direction: column; } .secw .col_01 { width:100%; } .secw .col_02 { width: 100%; margin-top: 50px; } .secw h3 { font-size: 20px; font-weight:700; } .secw .h3 { font-size: 20px; font-weight:700; } .main_top > .tit { display: block; font-size: 27px; font-weight: 600; letter-spacing: -1.5px; text-align: center; text-overflow: ellipsis; white-space: normal; text-align:left; line-height:1.3; } .main_top .sub_tit {padding:15px 0 15px; text-align:left; font-size:17px;} .main_top .w_news { display: block; margin-top:10px; } .main_top .w_news .thumb { width: 100%; padding-bottom: 67.165%; } .main_top .w_news .news_data { width: 100%; margin-top: 10px; } .main_top .w_news .news_data .tit { display: block; font-size: 23px; font-weight: 700; line-height: 33px; -webkit-line-clamp: 2; } .main_top .w_news .news_data .s_tit { display: none; } .main_top .w_news .news_data .desc { display: none; } .main_top .w_news .news_data .add { margin-top: 10px; } .main_top .w_news .news_data .add li a {font-size:17px; font-weight:500;} .main_top_sogbo { padding-bottom: 0; } .main_top_sogbo .tit { font-size: 24px; font-weight:700; text-align:left; margin-bottom:5px;} .main_top_sogbo .tit .badge { width: 40px; height: 22px; line-height: 22px; font-size: 13px; margin-top: 10px; } .main_atc_01 { padding-top: 0; margin-top:15px; } .main_atc_01 .nty_1 { flex-direction: column; } .main_atc_01 .nty_1 li { width: 100%; padding: 15px 0; } .main_atc_01 .nty_1 li + li { border-top: 1px solid #ddd; } .main_atc_01 .nty_1 li a { flex-direction: unset;align-items: center; } .main_atc_01 .nty_1 li .t_area { width: 52%; flex-direction: column; flex-grow: 1; } .main_atc_01 .nty_1 li .t_area .badge { margin:0 0 5px 0;} .main_atc_01 .nty_1 li .t_area .tit { margin-top: 5px; margin-top: 0; font-size: 19px; line-height: 28px; flex-grow: 1; } .main_atc_01 .nty_1 li .thumb { width:120px; height: 80px; padding-bottom: unset; margin-left: 10px; } .main_atc_02 { display: block; margin-top: 0; padding-top: 0; } .main_atc_02 .nty_2 { width: 100%; padding-right: 0; } .main_atc_02 .nty_2 li { padding: 15px 0; border-bottom: 1px solid #ddd; } .main_atc_02 .nty_2 li + li { margin-top: 0; } .main_atc_02 .nty_2 li .t_area {width: 52%; flex-direction: column; flex-grow: 1; } .main_atc_02 .nty_2 li .t_area .badge { margin:0; } .main_atc_02 .nty_2 li .t_area .tit { margin-top: 5px; font-size: 19px; line-height: 28px; } .main_atc_02 .nty_2 li .thumb { width:120px; height: 80px; padding-bottom: unset; margin-left: 10px; } .main_atc_02 .nty_3 { width: 100%; padding-left: 0; border-left: 0; } .main_atc_02 .nty_3 ul:nth-child(1) li { height:58px; border-bottom: 1px solid #ddd; margin-top: 0; } .main_atc_02 .nty_3 ul:nth-child(1) li + li { margin-top: 0; } .main_atc_02 .nty_3 ul:nth-child(1) li .tit { font-size: 19px; line-height: 58px; height: 58px; } .main_atc_02 .nty_3 ul:nth-child(2) li .tit { font-size: 19px; line-height: 28px; } .main_global .h_area { flex-direction: column; } .main_global .h_area .tab_area { margin-top: 10px; } .main_global .h_area .tab_area button { width: 33.33333%; height: 44px; line-height: 44px; font-size: 16px; border: 1px solid #ddd; } .main_global .h_area .tab_area button + button { margin-left: 0; border-left:0 ; } .main_global .h_area .tab_area button:before { vertical-align: text-bottom; } .main_global .tab_lst { margin-top: 0; } .main_global .tab_lst .tab_box ul li { border: 0; padding:5px 0;} .main_global .tab_lst .tab_box ul li .thumb { width: 80px; height: 80px; padding-bottom: unset; margin-left: 20px; } .main_global .tab_lst .tab_box ul li .t_area { width: 70%; flex-grow: 1; } .main_global .tab_lst .tab_box ul li .t_area .tit { font-size:19px; line-height:28px; } .main_global .tab_lst .tab_box .btn_more { font-size: 16px; } .main_global .tab_lst .tab_box .btn_more i { display: none; } .main_global_2 ul { border-bottom: 1px solid #ddd; } .main_global_2 ul li { border-top: 1px solid #ddd; } .main_global_2 ul li a .t_area .ctg { font-size: 15px; font-weight:500;} .main_global_2 ul li a .t_area .tit { font-size:19px; line-height:25px; } .main_global_2 ul li .t_area .tit {font-size:19px;} .main_global_2 ul li .t_area .ctg {font-size:16px; font-weight:500;} .main_focuslab .news .tit { font-size:19px; line-height:25px; -webkit-line-clamp: 2; } .main_a_ele .tooltip { display: none; } .main_a_ele .ly_tooltip { display: none; } .main_a_ele ul li + li { margin-top: 20px; } .main_a_ele ul li .t_area { width: 56.716%; flex-grow: 1; } .main_a_ele ul li .t_area .tit { font-size: 19px; line-height: 28px; } .main_a_ele ul li .thumb { width: 125px; height: 80px; margin-left: 20px; padding-bottom: unset; } .main_expand .tooltip { display: none; } .main_expand .ly_tooltip { display: none; } .main_expand ul li + li { margin-top: 20px; } .main_expand ul li .t_area { width: 56.716%; flex-grow: 1; } .main_expand ul li .t_area .tit { font-size: 19px; line-height: 28px; } .main_expand ul li .thumb { width: 125px; height: 80px; margin-left: 20px; padding-bottom: unset; } .main_pick .tooltip { display: none; } .main_pick .ly_tooltip { display: none; } .main_pick ul li { width: calc(50% - 10px); } .main_pick ul li:nth-child(odd) { padding-right: 10px; } .main_pick ul li:nth-child(even) { padding-left: 10px; } .main_pick ul li .tit { font-size: 19px; line-height: 25px; margin-top: 10px; } .art_ad_banner { display: none; } .main_insight ul { display: block; } .main_insight ul li:nth-child(n+3) { margin-top: 25px; } .main_insight ul li + li { margin-top: 25px; } .main_insight ul li .thumb { width: 75px; height:75px; } .main_insight ul li .t_area { padding: 0 0 0 14px; } .main_insight ul li .t_area .name { font-size: 16px; text-overflow: ellipsis; overflow: hidden; } .main_insight ul li .t_area .tit { font-size: 19px; line-height: 28px; } .main_ajutv h3 a em { width: 55px; height: 20px; background: url(../img/logo/logo_abc.png) no-repeat; background-size: 100% auto; } .main_shorts h3 a em { width: 126px; height: 20px; background: url(../img/logo/logo_abc_shorts.png) no-repeat; background-size: 100% auto; } .main_ajutv .h3 a em { width: 55px; height: 20px; background: url(../img/logo/logo_abc.png) no-repeat; background-size: 100% auto; } .main_shorts .h3 a em { width: 126px; height: 20px; background: url(../img/logo/logo_abc_shorts.png) no-repeat; background-size: 100% auto; } .main_shorts .shorts_lst { width: 100%; overflow-x: scroll; } .main_shorts .shorts_lst ul { width: 620px; } .main_shorts .shorts_lst li { width: 140px; } .main_shorts .shorts_lst .thumb { width: 100%; padding-bottom: 178.58%; } .main_digitallab .digitallab_swiper li .tit { font-size:19px; line-height:28px; } .main_invite ul { flex-direction: column; } .main_invite ul li { width: 100%; } .main_invite ul li + li { margin-top: 20px; } .main_invite ul li .t_area .tit { font-size:19px; line-height:28px; } .main_invite ul li .t_area .name { font-size:15px; } .main_realtime { margin-top: 45px; } .main_realtime .h_area .tooltip { display: none; } .main_realtime .h_area .ly_tooltip { display: none; } .main_realtime .update_area .current { font-size:14px; } .main_realtime ul li .tit { -webkit-line-clamp: 1; font-size:19px; margin-top:10px; } .main_realtime ul li .time { width:65px; height:25px; font-size:13px; line-height:23px; font-weight:400; letter-spacing:0; } .main_trend .tooltip { display: none; } .main_trend .ly_tooltip { display: none; } .main_trend ol li .t_area { flex-grow: 1; } .main_trend ol li .t_area .tit_wrap { align-items: center; } .main_trend ol li .t_area .tit_wrap .num { font-size:25px; width:30px; } .main_trend ol li .t_area .tit_wrap .tit { font-size:18px; line-height:28px; } .main_trend ol li .thumb { width: 95px; height: 60px; padding-bottom: unset; margin-left: 20px; } .main_invite ul li .t_area { flex-grow: 1; } .main_invite ul li .thumb { width: 125px; height: 80px; padding-bottom: unset; margin-left: 20px; } .accordion-slider { display: none; } .main_photo { margin-left: -20px; width: calc(100% + 40px); box-sizing: border-box; padding:30px 20px 50px; } .m_photo_swiper { display: block; margin-top: 15px; } .m_photo_swiper .thumb { padding-bottom:65.999999%; } .m_photo_swiper .tit { font-size: 19px; color: #fff; -webkit-line-clamp: 1; margin-top: 15px; } .main_category { flex-direction: column; } .main_category .ctg_news { width: 100%; border-bottom: 1px solid #ddd; } .main_category .ctg_news + .ctg_news { margin-top: 50px; } .main_category .ctg_news:nth-child(n+5) { margin-top: 50px; } .main_category .ctg_news h3 { font-size:20px; } .main_category .ctg_news .h3 { font-size:20px; } .main_category .ctg_news ul li .tit { font-size:19px; } .main_category .ctg_news ul li .tit em { -webkit-line-clamp: 1; line-height: 22px; min-height: 22px; } .main_category .ctg_news ul li:nth-child(1) { margin-bottom: 20px; } .main_category .ctg_news ul li:nth-child(1) a { display: flex; justify-content: space-between; } .main_category .ctg_news ul li:nth-child(1) .thumb { width: 150px; height: 95px; padding-bottom: unset; margin-right: 10px; } .main_category .ctg_news ul li:nth-child(1) .tit { width: 55%; flex-grow: 1; display: flex; align-items: center; line-height:28px; } .main_category .ctg_news ul li:nth-child(1) .tit em { -webkit-line-clamp: 2; line-height:28px; min-height:unset; font-size:19px; } .dasuk_koiners { flex-direction: column; } .dasuk { width: 100%; flex-direction: column; } .dasuk .h_area { width: 100%; } .dasuk .h_area h4 { display: none; } .dasuk .h_area .h4 { display: none; } .dasuk .h_area span { display: none; } .dasuk .h_area .btn_area { display: none; } .dasuk .m_tit { display: block; font-size: 20px; font-weight:700; } .dasuk .m_tit i { display: inline-block; width: 9px; height: 18px; margin-left: 7px; vertical-align: middle; overflow: hidden; text-indent: -99999px; background: url(../img/ico_btn_more.png) no-repeat; background-size: 100% auto; } .dasuk .video_box { width: 100%; margin-top: 10px; padding-bottom: 66%; } .dasuk .btn_area_m { display: flex; flex-direction: row; justify-content: space-between; margin-top: 15px; } .dasuk .btn_area_m a { display: block; height: 45px; line-height: 45px; width: 48%; max-width: none; font-size: 17px; border-radius: 23px; color: #fff; text-align: center; background-color: #001913; box-sizing: border-box; } .dasuk .btn_area_m a + a { color: #333; background-color: #fff; border:1px solid #c9c9c9; } .koiners { width: 100%; flex-direction: column; margin-top: 50px; } .koiners .h_area { display: flex; width: 100%; } .koiners .h_area h4 { display: none; } .koiners .h_area .h4 { display: none; } .koiners .h_area .btn_more { display: none; } .koiners .h_area .upbit { display: none; } .koiners .h_area .m_tit { display: block; font-size: 20px; } .koiners .h_area .m_tit i { display: inline-block; width: 9px; height: 18px; margin-left: 7px; vertical-align: middle; overflow: hidden; text-indent: -99999px; background: url(../img/ico_btn_more.png) no-repeat; background-size: 100% auto; } .koiners .price_lst { width: 100%; margin-top: 10px; } .koiners .koiners_swiper li > div { box-sizing: border-box; border:1px solid #dfdfdf; padding: 15px 0 20px; } .koiners .koiners_swiper li > div { flex-direction: column; width: 100%; } .koiners .koiners_swiper li .name { flex-direction: column; width: 100%; } .koiners .koiners_swiper li .name i { margin-right: 0; } .koiners .koiners_swiper li .name strong { font-size: 18px; margin-top: 10px; text-align: center; } .koiners .koiners_swiper li .name strong em { font-size: 12px; } .koiners .koiners_swiper li .num { width: 100%; text-align: center; margin-top: 15px; } .koiners .koiners_swiper li .num strong { font-size: 18px; } .koiners .koiners_swiper li .num span { font-size: 15px; } .newspaper_bn { width: 100%; margin-top: 50px; display: none; } .newspaper_bn .img { display: none; } .newspaper_bn .img_m { display: block; } .family_news { flex-direction: column; padding-top: 0; border-top: 0; } .family_news > div { width: 100%; } .family_news .economidaily { margin-top: 50px; } .family_news .ajupress { margin-top: 50px; } .family_news ul li { border-bottom: 1px solid #ddd; padding:20px 0; } .family_news ul li + li { margin-top: 0; } .family_news ul li:nth-child(1) { padding-top: 0; } .family_news ul li:nth-child(3) { display: none; } .family_news ul li .t_area .tit { font-size:19px; line-height:28px; } .family_news > div .h_area .btn_more { text-decoration:underline; } .board_w { border-top: 0; padding-top: 0; flex-direction: column; } .board_w .notice { width: 100%; flex-direction: column; } .board_w .notice h4 { width: 100%; font-weight: 700; font-size:25px; } .board_w .notice .h4 { width: 100%; font-weight: 700; font-size:25px; } .board_w .notice ul { width: 100%; border-top: 1px solid #ddd; } .board_w .notice ul li a { font-size:17px; } .board_w .event { width: 100%; flex-direction: column; margin-top: 50px; } .board_w .event h4 { width: 100%; font-weight: 700; font-size:25px; } .board_w .event .h4 { width: 100%; font-weight: 700; font-size:25px; } .board_w .event ul { width: 100%; border-top: 1px solid #ddd; } .board_w .event ul li a { font-size:17px; } .board_w .paper { width: 100%; margin-top: 50px; } .global_parther { display: none; } .nav_all_bottm { margin-top: 50px; border-top: 4px double #ddd; padding-top: 35px; } .nav_all_bottm .nav_01,.nav_all_bottm .nav_02,.nav_all_bottm .nav_03 { display: none; } .nav_all_bottm .nav_01_m { display: block; width: 100%; } .nav_all_bottm .nav_01_m ul { display: flex; flex-direction: column; flex-wrap: wrap; height: 300px; } .nav_all_bottm .nav_01_m ul li {} .nav_all_bottm .nav_01_m ul li a { display: block; font-size: 20px; font-weight: 500; line-height: 50px; } .btn_top { right: 20px; width: 50px; height: 50px; } .ai_wrap { right: 80px; width: 50px; height: 50px; background-size: 100% auto; } #footer { box-sizing: border-box; padding: 20px 20px 30px; background-color: #f2f3f5; } .f_menu { border: 0; } .f_menu .lst { display: none; } .f_menu .lst_m { display: flex; width: 100%; flex-direction: row; } .f_menu .lst_m li { position: relative; } .f_menu .lst_m li a { display: block; width: 100%; height: 20px; line-height: 20px; font-size: 14px; padding: 0 15px; box-sizing: border-box; } .f_menu .lst_m li:first-child a { padding-left: 0; } .f_menu .lst_m li a::before { content: ''; position: absolute; left: 0; top: 4px; display: block; width: 1px; height: 12px; background-color: #aaa; } .f_menu .lst_m li:first-child a::before { display: none; } .address_w { padding-bottom: 0; } .address_w .f_logo { display: none; } .address_w .address ul li { color: #666; } .address_w .address ul li::after { background-color: #dfdfdf; } .address_w .address .info { color: #666; line-height: 23px; margin-top: 10px; } .address_w .address .copyright { color: #333; } .atc_ad_main { display: none; } .atc_ad_main_m { display: block; width: 100%; margin-top: 30px; border-top:4px double #dfdfdf; padding-top:30px; } .atc_ad_main_m img { display: block; width: 100%; } .atc_ad_main_2 { display: none; } .icon_new {position:relative; padding-left:3px; top: -7px; } .icon_new img {vertical-align:middle;} .layer_nav_all .nav_02 ul li a .icon_new {top:-10px;} .main_ajutv { margin-top: 50px; } .main_expand { margin-top: 50px; } .secw .col_02 { margin-top: 50px; } .main_global { margin-top: 50px; } } @media screen and (max-width: 768px) { .main_digitallab { padding: 40px 4.8% 40px 3.4%; } .main_digitallab .h3_area h3 { font-size: 20px; } .main_digitallab .h3_area .h3 { font-size: 20px; } } @media screen and (max-width: 620px) { .main_digitallab { flex-direction: column; padding: 20px 4.8% 20px 3.4%; } .main_digitallab .h3_area { width: 100%; } .main_digitallab .h3_area .stit { display: none; } .main_digitallab .h3_area .btn_more { display: none; } .main_digitallab .digitallab_swiper { width: 100%; margin-top: 15px; } } @media screen and (max-width: 540px) { .main_digitallab { background-image: none; border-radius: 0; background: rgb(80,125,160); background: linear-gradient(130deg, rgba(80,125,160,1) 0%, rgba(37,58,75,1) 100%); margin-left: -20px; width: calc(100% + 40px); padding: 30px 20px 30px 20px; } .serial_news ul li { width: auto!important; } .serial_news ul li .txt_area .ctg::before { margin-right: 20px; } .serial_news ul li + li { margin-left: 20px!important; } } .header_v2 { position: relative; border-bottom: 1px solid #ccc; background-color: #fff; z-index: 91; } .header_v2 > .inner { position: relative; display: block; min-height: 120px; display: flex; justify-content: center; align-items: center; /*padding: 25px 0 15px;*/ } .header_v2 .inner_hd_nav { border-top: 1px solid #eee; height: 58px; } .header_v2 .logo a { display: block; height: 100%; } .header_v2 .logo a img { height: 100%; } .header_v2 .logo_m { display: none; } .header_v2 .nav_area { display: flex; width: 100%; margin-top: 14px; } .header_v2 .nav_area .nav_w { order:1; display: flex; height: 32px; margin: 0 0 0 60px; width: 87%; } .header_v2 .nav_area .nav_w ul { height: 100%; display: flex; flex-wrap: wrap; } .header_v2 .nav_area .nav_w ul li a { font-size: 17px; line-height: 32px; font-weight:600; letter-spacing:0; } .header_v2 .nav_area .nav_w .nav_01 { width: 100%; justify-content: space-between; overflow: visible; } .header_v2 .nav_area .nav_w .nav_01 ul { width: 100%; display: flex;} .header_v2 .nav_area .nav_w .nav_01 ul li { width: 6%; text-align: center; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(10) { width: 10%; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(11) { width: 10%; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(12) { width: 11.5%; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(13) { width: 10.5%; } .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab { margin-left: 4%;} .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab::before { content: ''; float: left; width: 1px; height: 15px; background-color: #dfdfdf; margin: 9px 0px 0 -23%; } .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab a { color: #6717cd; } .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab a i { position: absolute; left: 65px; top: -14px; display: block; width: 31px; z-index:99; height: 18px; background: url(https://image.ajunews.com/images/site/news/kr/focuslab/img/new_icon.gif) no-repeat; } .header_v2 .nav_area .nav_w .nav_01 ul li.deepinsight a { color: #794b81; } .header_v2 .nav_area .nav_w .nav_01 ul li.digitallab a { color: #34bba3; } .header_v2 .nav_area .nav_w .nav_02 { width: 360px; margin-left: 30px; } .header_v2 .nav_area .nav_w .nav_02::before { content: ''; display: inline-block; width: 1px; height: 15px; background-color: #dfdfdf; margin: 9px 30px 0 0; } .header_v2 .nav_area .nav_w .nav_02 li + li { margin-left: 36px; } .header_v2 .nav_area .nav_w .nav_02 li.focuslab a { position: relative; color: #6717cd; } .header_v2 .nav_area .nav_w .nav_02 li.focuslab a i { position: absolute; left: 65px; top: -14px; display: block; width: 31px; z-index:99; height: 18px; background: url(https://image.ajunews.com/images/site/news/kr/focuslab/img/new_icon.gif) no-repeat; } .header_v2 .nav_area .nav_w .nav_02 li.deepinsight a { color: #794b81; } .header_v2 .nav_area .nav_w .nav_02 li.digitallab a { color: #34bba3; } .header_v2 .nav_area .btn_menu_all { order:0; width: 32px; height: 32px; background: url(../img/btn_menuall.png) left center/20px 19px no-repeat; } .header_v2 .nav_area .btn_search { order:2; width: 32px; height: 32px; background: url(../img/btn_search.png) right center/20px 20px no-repeat; margin-left: auto; } .header_v2 .nav_area .btn_menu_all.on { background: url(../img/btn_close.png) center center no-repeat; background-size: 50% auto; } .header_v2 .nav_area .btn_search.on { background: url(../img/btn_close.png) center center no-repeat; background-size: 50% auto; } .header_v2 .family_site { position: absolute; left: 0; top: 20px; display:flex; justify-content: flex-end; } .header_v2 .family_site li { position: relative; } .header_v2 .family_site li::before { content: ''; display: inline-block; width: 1px; height: 11px; background-color: #dfdfdf; margin-right: 7px; } .header_v2 .family_site li:first-child::before { display: none; } .header_v2 .family_site li + li { margin-left: 7px; } .header_v2 .family_site li a { color: #888; font-size: 13px; } .header_v2 .login_area { position: absolute; right: 0; top: 20px; font-size: 13px; } .header_v2 .login_area .date { letter-spacing: -0.1px; } .header_v2 .login_area .date::before { content: ''; display: inline-block; width: 1px; height: 11px; background-color: #dfdfdf; margin: 0 10px 0; } .header_v2 .layer_nav_all { top: 178px; } .header_v2 .layer_search { top: 178px; } .header_v2 .layer_nav_all .inner { box-sizing: border-box; padding: 0 20px; } .header_v2 .inner_hd_nav .logo { display: none; } .header_v2.fixed { position: fixed; left: 0; top: 0; width: 100%; background: #fff; z-index: 99; border-bottom: 1px solid #eee; } .header_v2.fixed > .inner { display: none; } .header_v2.fixed .inner_hd_nav { border-top: 0; } .header_v2.fixed .inner_hd_nav .inner { height: 100%; } .header_v2.fixed .inner_hd_nav .logo { display: flex; order:0; width: 105px; height: 23px; align-self: center; } .header_v2.fixed .inner_hd_nav .logo a { display: block; width: 100%; height: 100%; background: url(../img/logo/logo.png) no-repeat; background-size: 100% auto; } .header_v2.fixed .nav_area { width: calc(100% - 105px); } .header_v2.fixed .nav_area .nav_w { width: calc(100% - 64px); box-sizing: border-box; padding: 0 40px 0 40px; margin:0; } .header_v2.fixed .nav_area .btn_menu_all { order: 2; margin-left: auto; } .header_v2.fixed .nav_area .btn_search { order: 3; margin-left: auto; } .header_v2.fixed .layer_nav_all { top: 58px; } .header_v2.fixed .layer_search { top: 58px; } @media screen and (max-width: 1220px) { .header_v2 > .inner { box-sizing: border-box; } .header_v2 .nav_area .nav_w { margin-left: 15px; width: 92%; } .header_v2 .nav_area .nav_w .nav_01 { width: 90%; } .header_v2 .nav_area .nav_w .nav_02 { display: none; } .header_v2 .nav_area .nav_w ul li a { font-size: 16px; } .header_v2 .nav_area .nav_w .nav_01 { width: 100%; } .header_v2 .nav_area .nav_w .nav_01 ul li { width: 5.5%; } .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab { margin-left: 1%; } .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab::before { margin-left: -4%; } .header_v2 .family_site { left: 40px; } .header_v2 .login_area { right: 40px; } .header_v2 .inner_hd_nav { box-sizing: border-box; padding: 0 40px; } .header_v2.fixed .inner_hd_nav .inner { box-sizing: border-box; /*padding: 0 40px;*/ } .header_v2.fixed .nav_area .nav_w { padding: 0 20px; } } @media screen and (max-width: 1200px) { .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(11) { width: 11%; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(12) { width: 13.4%; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(13) { width: 12%; } } @media screen and (max-width: 1100px) { .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(11) { width: 12%; } .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(12) { width: 14%; } .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(13) { width: 13%; } .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(11) a, .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(12) a, .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(13) a { letter-spacing: -0.5px; } } @media screen and (max-width: 1000px) { .header_v2 > .inner { padding: 0; } .header_v2 .nav_area .nav_w { margin-left: 10px; } .header_v2 .nav_area .nav_w .nav_01 ul li { width: 5.4%; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(4) { width: 7%; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(10) { width: 12%; } .header_v2.fixed .nav_area .nav_w .nav_01 ul li.focuslab { margin-left: 0; } .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(11) { width: 11%; } .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(12) { width: 14%; } .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(13) { width: 12%; } .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(11) a, .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(12) a, .header_v2.fixed .nav_area .nav_w .nav_01 ul li:nth-child(13) a { font-size: 15px; letter-spacing: -1px; } } @media screen and (max-width: 899px) { .header_v2 > .inner { min-height: 70px; } .header_v2 .inner_hd_nav { height: auto; padding: 0 20px; } .header_v2 .inner_hd_nav .inner { max-width: none; margin:0; display: block; } .header_v2 .logo { display: none; height: 70px; } .header_v2 .logo_m { display: block; } .header_v2 .logo_m img { height: 100%; } .header_v2 .family_site { display: none; } .header_v2 .login_area { display: none; } .header_v2 .nav_area { width: auto; padding: 0; margin:0; } .header_v2 .nav_area .btn_menu_all { position: absolute; left: 20px; top: 20px; } .header_v2 .nav_area .btn_search { position: absolute; right: 20px; top: 20px; } .header_v2 .nav_area .nav_w { width: 100%; margin: 0; height: 100%; } .header_v2 .nav_area .nav_w ul { width: auto; flex-wrap: nowrap; } .header_v2 .nav_area .nav_w ul li a { line-height: 48px; } .header_v2 .nav_area .nav_w .nav_01 { overflow: hidden; } .header_v2 .nav_area .nav_w .nav_01 { width: auto; } .header_v2 .nav_area .nav_w .nav_01 ul li { width: auto; margin-right: 25px; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(4) { width: auto; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(10) { width: auto; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(11) { width: auto; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(12) { width: auto; } .header_v2 .nav_area .nav_w .nav_01 ul li:nth-child(13) { width: auto; } .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab { margin-left: 1%; } .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab::before { margin: 15px 0 0 -21%; } .header_v2 .nav_area .nav_w .nav_01 ul li.focuslab a i { left: 60px; top: 0; } .header_v2 .layer_nav_all { top: 70px; border-top: 1px solid #ccc; } .header_v2 .layer_search { top: 70px; border-top: 1px solid #ccc; } .header_v2 .layer_search .inner { box-sizing: border-box; } .header_v2::before {display:none; } .header_v2 .nav_area .nav_w::before {content: ''; position: absolute; right:0px; box-shadow: -20px 0px 20px 20px #ffffff; top: 100px; transform: translateY(-50%); height: 13px; width: 0; z-index: 9;} .header_v2.fixed .inner_hd_nav .inner { height: 48px; padding: 0; display: flex; align-self: center; justify-content: space-between; } .header_v2.fixed .nav_area { width: auto; padding: 0; align-self: center; } .header_v2.fixed .nav_area .nav_w { display: none; } .header_v2.fixed .nav_area .btn_menu_all { position: relative; left: unset; top: unset; order: 3; background-position: center; margin-left: 10px; } .header_v2.fixed .nav_area .btn_search { position: relative; left: unset; top: unset; right: unset; order: 2; background-position: center; } .header_v2.fixed .layer_nav_all { top: 48px; } .header_v2.fixed .layer_search { top: 48px; } }