.view_hd { width:100%; padding:70px 0 0; } .view_hd .inner { display: block; width: 1100px; border-bottom:1px solid #878787; padding-bottom:12px; } .view_hd h1 { font-size:44px; font-weight:700; line-height:1.3em; } .view_hd .hd_area { display: flex; justify-content: space-between; margin-top:40px; } .view_hd .hd_area .byline { font-size: 14px; } .view_hd .hd_area .byline .name { float: left; font-size: 14px; } .view_hd .hd_area .byline span { float: left; font-size: 14px; } .view_hd .hd_area .byline span::before { content: ""; float: left; width: 1px; height: 11px; background-color: #ccc; margin:2px 10px 0; } .view_hd .hd_area .share_option { display:flex; align-items: flex-end; } .view_hd .hd_area .share_option li { position: relative; width: 34px; height: 34px; align-items: flex-end; } .view_hd .hd_area .share_option li button { width: 100%; height: 100%; } .view_hd .hd_area .share_option li.share > button { background: url(../img/ico_share.png) center/17px no-repeat; } .view_hd .hd_area .share_option li.print > button { background: url(../img/ico_print.png) center/20px no-repeat; } .view_hd .hd_area .share_option li.font_size > button { background: url(../img/ico_fontsize.png) center/20px no-repeat; } .view_hd .hd_area .share_option li .pop_lay { display: none; position: absolute; right: 0px; top: 36px; box-sizing: border-box; padding: 19px 19px 28px; background-color: #fff; border:1px solid #eee; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.05); z-index: 1; } .view_hd .hd_area .share_option li .pop_lay .h_tit { display: block; font-size: 17px; } .view_hd .hd_area .share_option li .pop_lay ul { display: flex; margin-top: 15px; } .view_hd .hd_area .share_option li .pop_lay ul li + li { margin-left: 10px; } .view_hd .hd_area .share_option li .pop_lay ul li { width: 50px; height: 50px; } .view_hd .hd_area .share_option li .pop_lay ul li button { width: 100%; height: 100%; } .view_hd .hd_area .share_option li .btn_close { position: absolute; right: 12px; top: 12px; width: 25px; height: 25px; background: url(../img/btn_close_date.png) center center no-repeat; } .view_hd .hd_area .share_option li.share .pop_lay { right: -68px; } .view_hd .hd_area .share_option li.share .pop_lay .sns_list li.kakao button { background: url(../img/ico_sns_kakao.png) no-repeat; } .view_hd .hd_area .share_option li.share .pop_lay .sns_list li.band button { background: url(../img/ico_sns_band.png) no-repeat; } .view_hd .hd_area .share_option li.share .pop_lay .sns_list li.twitter button { background: url(../img/ico_sns_twitter.png) no-repeat; } .view_hd .hd_area .share_option li.share .pop_lay .sns_list li.weibo button { background: url(../img/ico_sns_weibo.png) no-repeat; } .view_hd .hd_area .share_option li.share .pop_lay .sns_list li.url button { background: url(../img/ico_sns_url.png) no-repeat; } .view_hd .hd_area .share_option li.share .pop_lay { display: none; } .view_hd .hd_area .share_option li.font_size .pop_lay { right: 0; } .view_hd .hd_area .share_option li.font_size .pop_lay ul li { box-sizing: border-box; border:1px solid #dfdfdf; border-radius: 50%; } .view_hd .hd_area .share_option li.font_size .pop_lay ul li:nth-child(1) button { background: url(../img/ico_font_size_1.png) center center no-repeat; } .view_hd .hd_area .share_option li.font_size .pop_lay ul li:nth-child(2) button { background: url(../img/ico_font_size_2.png) center center no-repeat; } .view_hd .hd_area .share_option li.font_size .pop_lay ul li:nth-child(3) button { background: url(../img/ico_font_size_3.png) center center no-repeat; } .view_hd .hd_area .share_option li.font_size .pop_lay ul li:nth-child(4) button { background: url(../img/ico_font_size_4.png) center center no-repeat; } .view_hd .hd_area .share_option li.active .pop_lay { display: block; } .view_con .inner { width: 1100px; } .view_con .sub_title{position: relative; display: block; margin-bottom: 5rem; padding-left: 1.8rem; word-break: keep-all;} .view_con .sub_title:before{position: absolute; left: 0; top: 0; display: block; clear: both; content: ""; width: 3px; height: 100%; background: #000;} .view_con .sub_title li{display: block; margin-bottom: 1rem;font-size: 2rem; font-weight: 700; letter-spacing: -0.6px;} .view_con .sub_title li:last-child{margin-bottom: 0;} .view_con .sub_title li h2{ font-weight: 600; display: block; line-height: 26px; } .view_con article { font-size: 19px; line-height: 30px; font-weight: 500; border-bottom: 4px double #ccc; padding-bottom: 70px; } .view_con .view_article { width: 740px; padding-top: 40px; } .view_con aside { width: 300px; } .view_article .imgBox { display:flex; width:100%; margin: 30px 0;} .view_article .imgBox.ib_center { justify-content:center; } .view_article .imgBox.ib_left { justify-content:flex-start; width: auto; margin-right: 25px !important; margin-top: 0;} .view_article .imgBox.ib_right { justify-content:flex-end; width: auto; margin-left: 25px !important; margin-top: 0;} .view_article .imgBox .p_caption { display:block; text-align:left; font-size:14px; color:#666; letter-spacing:-0.5px; text-align:left; word-break:keep-all; line-height:21px; font-style:normal; margin-top:10px; } .view_article .imgBox .photo_img { position:relative; } .view_article .imgBox .photo_img .expansion_btn { position:absolute; right:1rem; top:1rem; width:38px; height:38px; background:url(../img/icon_expansion.png) no-repeat; background-size:38px; z-index:9; cursor:pointer; } .article_con .sub_title_heading{display: block; margin-bottom: 1.5rem; margin-top: 1.5rem; padding: 2rem 0; border-top: 3px solid #111; border-bottom: 1px solid #111; box-sizing: border-box; font-weight: bold;} .article_wrap .article_con .sub_title_heading strong{display: inline-block; font-size: 1.8rem; font-weight: 700;} .bigimg_popup { display:none; position:fixed; top:0; left:0; width:100%; height:100%; overflow:auto; white-space:nowrap; font-size:0; line-height:0; text-align:center; background:rgba(0,0,0,0.8); z-index:999999999999; box-sizing:border-box; } .bigimg_popup:before { content:''; display:inline-block; height:100%; vertical-align:middle; } .bigimg_popup .lay_big_img { position:relative; display:inline-block; max-width:1000px; width:auto; background:#fff; box-sizing:border-box; vertical-align:middle; white-space:normal; line-height:1; text-align:left; z-index:10; -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); transition:transform .6s; } .bigimg_popup .lay_big_img img { width:100%; height:auto; } .bigimg_popup .btn_bigimg_close { position:fixed; top:50px; right:40px; width:50px; height:50px; background:url(../img/btn_close_img.png) 50% 50% no-repeat; } .photo_view_slide {position: relative; overflow: hidden; display: block; width: 100%; padding-bottom: 7rem; margin-bottom: 8rem; border-bottom: 3px double #000;} .photo_view_slide .expansion_btn{position: absolute;right: 2rem;top: 2rem;width: 5rem;height: 5rem;background: url(../img/icon_expansion.png) no-repeat; background-size: auto;background-size: auto;background-size: 5rem;z-index: 9;cursor: pointer;} .photo_view_slide .slider_for{position: relative; background: #eee;position: relative;margin-bottom: 2rem;height: 45rem;} .photo_view_slide .slider_for .slider_img{display: block;width: 100%;height: 100%;text-align: center;} .photo_view_slide .slider_for .slider_img img{height: 100%;} .photo_view_slide .slider_for .slide_arrow{position: absolute;top: 50%;width: 7.5rem;height: 7.5rem;background-size: 3rem;transform: translateY(-50%);z-index: 9;cursor: pointer;box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 5%);font-size: 0;opacity: 0;transition: .3s;} .photo_view_slide .slider_for .slide_arrow.slide_prev{left: 2rem;background: #fff url(https://image.ajunews.com/images/site/news/kr/img/photo/photo_main_banner_prev.png) 50% 50% no-repeat;} .photo_view_slide .slider_for .slide_arrow.slide_next{right: 2rem;background: #fff url(https://image.ajunews.com/images/site/news/kr/img/photo/photo_main_banner_next.png) 50% 50% no-repeat;} .photo_view_slide .slider_for:hover .slide_arrow{opacity: 1;} .photo_view_slide .slider_for .slide_paging{position: absolute;right: 1rem;bottom: 1rem;padding: 0.7rem 1.5rem;font-size: 1.5rem;color: #828282;background: #0a1118;box-sizing: border-box;box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 5%);} .photo_view_slide .slider_for .slide_paging strong {color: #fff;} .photo_view_slide .slider_for .slide_paging span {color: #828282;} .photo_view_slide .slider_nav{display: block; width: 100%; position: relative; padding: 0 3rem; height: 8.5rem; box-sizing: border-box; background: #000;} .photo_view_slide .slider_nav:after{content:""; display:block; clear:both; visibility:hidden; width:0; height:0; font-size:0;} .photo_view_slide .slider_nav .slider_img{position: relative; float: left; width: 20%; height: 100%; overflow: hidden; background: #000;} .photo_view_slide .slider_nav .slider_img img{position: absolute; left: 50%; top: 0; width: 100%; transform: translate(-50%, 0);} .photo_view_slide .slider_nav .slider_img.on:after{position: absolute; left: 0; top: 0; display: block; clear: both; content: ""; width: 100%; height: 100%; border: 6px solid rgba(255,255,255,0.8); box-sizing: border-box;} .photo_view_slide .slider_nav .slide_arrow{position: absolute; top: 0; width: 3rem; height: 100%; background-size: 1rem; z-index: 10; cursor: pointer; font-size: 0;} .photo_view_slide .slider_nav .slide_arrow.slide_prev{left: 0; background: #0a1118 url(https://image.ajunews.com/images/site/news/kr/img/photo/pictorial_prev.png) 50% 50% no-repeat;} .photo_view_slide .slider_nav .slide_arrow.slide_next{right: 0; background: #0a1118 url(https://image.ajunews.com/images/site/news/kr/img/photo/pictorial_next.png) 50% 50% no-repeat;} .view_banner {margin-top:30px;} .view_banner img {width:740px !important; height:80px !important;} .layer_wrap {display: none;position: fixed;top: 0;left: 0;padding: 30px 0;width: 100%;height: 100%;overflow: auto;white-space: nowrap;font-size: 0;line-height: 0;text-align: center;z-index: 999999999999;box-sizing: border-box;} .layer_wrap{display: none; position: fixed; top: 0; left: 0; padding: 30px 0; width: 100%; height: 100%; overflow: auto; white-space: nowrap; font-size: 0; line-height: 0; text-align: center; z-index: 999999999999; box-sizing: border-box;} .layer_wrap:before{content: '';display: inline-block;height: 100%;vertical-align: middle;} .layer_wrap .layer_dialog{position: relative; display: inline-block; vertical-align: middle; white-space: normal; line-height: 1; text-align: left; -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s,-webkit-transform .3s; z-index: 10; box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.2);} .layer_dialog_close{position: absolute;top: 0;right: 0;width: 5rem;height: 5rem; background: url(../img/view/icon_share_close.png) 50% 50% no-repeat; background-size: auto;} .layer_wrap_background_close{position: absolute; z-index: 0; top: 0; left: 0; width: 100%; height: 100%;} .layer_dialog{width: 35rem; box-sizing: border-box; border: 1px solid #e0e0e0; border-top: 3px solid #000; border-radius: 5px; background: #fff; box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.2);} .layer_wrap.is_show{display: block; opacity:1;} .layer_wrap.is_show .layer_dialog{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)} .layer_wrap.is_hide{opacity:0;} .layer_head{padding: 2.5rem 0 1.8rem 3rem;} .layer_head strong{display: block; font-size: 1.7rem; line-height: 1.8rem; font-weight: 700; letter-spacing: -1.275px;} .alert_pop .layer_dialog{border: none; border-top: 3px solid #000; border-radius: 0 0 4px 4px;} .alert_pop .layer_content{padding: 2.5rem 3rem 4rem;} .alert_pop .alert_tit{display: block; height: 40px; font-size: 18px; font-weight: 700; letter-spacing: -1px; border-bottom: 1px solid #ccc; text-align: center;} .alert_pop .alert_txt{display: block; margin-bottom: 2.5rem; font-size: 1.8rem; line-height: 3rem;} .alert_pop .radio_list{display: block; margin-top: 30px;} .alert_pop .radio_list li{display: block; height: 20px; margin-bottom: 15px;} .alert_pop .radio_list li .form_radio label{padding-left: 30px; font-size: 16px; letter-spacing: -1px; line-height: 20px;} .alert_pop .radio_list li .form_radio label:before{width: 20px; height: 20px; border: 1px solid #b7b7b7;} .alert_pop .radio_list li .form_radio label:after{left: 5px; width: 10px; height: 10px; background: #fff;} .alert_pop .radio_list li .form_radio input:checked + label:before{background: #fff; border-color:#333;} .alert_pop .radio_list li .form_radio input:checked + label:after{background: #333;} .alert_pop .alert_textarea{position: relative; display: block; margin-top: 20px; margin-bottom: 20px; width: 100%; height: 130px;} .alert_pop .alert_textarea textarea{display: block; padding: 15px 10px; width: 100%; height: 100%; border: 1px solid #dfdfdf; outline: none; resize: none; border-radius: 4px; box-sizing: border-box; font-size: 14px; letter-spacing: -1.6px; color:#999; line-height: 21px;} .alert_pop .alert_textarea .count{position: absolute; right: 10px; bottom: 10px; font-size: 13px; color:#999; font-weight: 400;} .alert_pop .alert_textarea .count em{color:#333;} .alert_pop .alert_btn_wrap{display: flex; margin-left: -1rem; justify-content: center;} .alert_pop .alert_btn_wrap li{float: left; padding-left: 1rem; width: 50%; height: 4rem; box-sizing: border-box;} .alert_pop .alert_btn_wrap li .alert_btn{display: block; width: 100%; height: 100%; border: 1px solid #aaa; box-sizing: border-box; text-decoration: none;} .alert_pop .alert_btn_wrap li .alert_btn span{display: block; font-size: 1.5rem; font-weight: 500; text-align: center; line-height: 3.8rem;} .alert_pop .alert_btn_wrap li .alert_btn.fill span{color:#fff;} .alert_pop .alert_btn_wrap li .alert_btn.fill{background: #20d0cc; border: 1px solid #20d0cc;} .alert_pop .alert_btn_wrap li .alert_btn.fill.gray{background: #333; border: 1px solid #333;} .view_con .related_news { margin-top: 40px; } .view_con .related_news strong { display: block; font-size: 18px; font-weight:600; } .view_con .related_news li { width: 100%; overflow: hidden; } .view_con .related_news li a { display: block; font-size: 18px; font-weight: 500; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-left: 16px; background: url(../img/ico_related.png) 0 11px no-repeat; } .view_con .keyword_tag { margin-top: 40px; } .view_con .keyword_tag ul { display: flex; flex-wrap: wrap; } .view_con .keyword_tag ul li { height: 32px; box-sizing: border-box; border:1px solid #dfdfdf; border-radius: 16px; margin-bottom: 10px; margin-left: 5px; } .view_con .keyword_tag ul li a { font-size: 15px; line-height: 30px; padding: 0 14px; box-sizing: border-box; display: block; width: 100%; height: 100%; } .view_con .news_like_bad { display: flex; justify-content: center; margin-top: 40px; } .view_con .news_like_bad button { display: flex; width: 118px; height: 48px; line-height: 49px; box-sizing: border-box; border:1px solid #dfdfdf; border-radius: 8px; align-items: center; justify-content: center; } .view_con .news_like_bad button + button { margin-left: 10px; } .view_con .news_like_bad button i { width: 30px; height: 30px; font-size: 15px; overflow: hidden; text-indent: -9999px; } .view_con .news_like_bad button:nth-child(1) i { background: url(../img/ico_like.png) no-repeat; margin-right: 10px; background-size:100% auto; } .view_con .news_like_bad button:nth-child(2) i { background: url(../img/ico_bad.png) no-repeat; margin-right: 10px; background-size:100% auto; } .view_con .news_like_bad button:active { border-color: #aaa; } .view_con .byline { display: flex; background-color: #f6f6f6; margin-top: 40px; box-sizing: border-box; padding: 30px; } .view_con .byline .photo { width: 120px; height: 120px; flex-shrink: 0; } .view_con .byline .info { margin-left: 18px; width: 530px; } .view_con .byline .info .editor { display: flex; } .view_con .byline .info .editor .name { font-size: 18px; font-weight:500; } .view_con .byline .info .editor .email { position: relative; font-size: 16px; } .view_con .byline .info .editor .email:hover { color: #111; } .view_con .byline .info .editor .email::before { content: ""; clear: both; float: left; width: 1px; height: 11px; background-color: #ccc; margin:9px 10px 0; } .view_con .byline .info .related { margin-top: 14px; } .view_con .byline .info .related li { width: 100%; overflow: hidden; height: 30px; line-height: 30px; } .view_con .byline .info .related li a { display: block; font-size: 16px; font-weight: 500; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-left: 16px; background: url(../img/ico_related.png) 0 11px no-repeat; } .view_con .byline .info .btn_more { display: block; width: 130px; height: 38px; line-height: 38px; text-align: center; font-size: 14px; box-sizing: border-box; border:1px solid #dfdfdf; background-color: #fff; border-radius: 19px; margin-top: 12px; } .view_con .copy { display: block; font-size: 16px; font-weight: 400; margin-top: 28px; } .view_bottom_cont .comment_wrap { margin-top: 50px; } .comment_wrap .total_number { font-size: 18px; } .comment_wrap .total_number em { margin-left: 5px; font-weight:600; } .comment_wrap .comment_form_box { box-sizing: border-box; border:3px solid #eee; padding:25px 17px 12px; min-height: 200px; margin-top: 12px; } .comment_wrap .comment_form_box .user_name { display: flex; font-size:15px; line-height:25px; margin-bottom: 10px; } .comment_wrap .comment_form_box .user_name i { width:25px; height:25px; background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_aju.png); background-color: #20d0cc; background-size: 25px; border-radius: 50%; overflow:hidden; text-indent: -9999px; margin-right:5px; } .comment_wrap .comment_form_box .user_name i.naver { background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_naver.png); background-color: #06be34; } .comment_wrap .comment_form_box .user_name i.kakao { background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_kakao.png); background-color: #fee500; } .comment_wrap .comment_form_box .user_name i.google { background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_google.png); background-color: #fff; } .comment_wrap .comment_form_box .user_name i.facebook { background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_facebook.png); background-color: #1877f2; } .comment_wrap .comment_form_box .cf_textarea textarea { width: 100%; height: 80px; font-family:'Pretendard','맑은고딕',Arial,Helvetica,sans-serif; font-size: 15px; color: #999; border:0 none; resize:none; outline: none; } .comment_wrap .comment_form_box .cf_btn_area { display: flex; justify-content: space-between; width: 100%; height: 35px; border-top: 1px solid #eee; padding-top: 10px; margin-top: 10px; } .comment_wrap .comment_form_box .cf_btn_area .count { height: 35px; line-height: 35px; font-size: 13px; color: #999; } .comment_wrap .comment_form_box .cf_btn_area .count em { color: #111;} .comment_wrap .comment_form_box .cf_btn_area .write_btn { width: 90px; height: 35px; font-size: 15px; color: #fff; background-color: #20d0cc; } .comment_wrap .comment_list li { position: relative; border-bottom: 1px solid #eee; padding: 30px 0 15px; } .comment_wrap .comment_list li .user_info { display:flex; } .comment_wrap .comment_list li .user_info .user_name { display: flex; font-size:15px; line-height:25px; } .comment_wrap .comment_list li .user_info .user_name i { width:25px; height:25px; background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_aju.png); background-color: #20d0cc; background-size: 25px; border-radius: 50%; overflow:hidden; text-indent: -9999px; margin-right:5px; } .comment_wrap .comment_list li .user_info .user_name i.naver { background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_naver.png); background-color: #06be34; } .comment_wrap .comment_list li .user_info .user_name i.kakao { background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_kakao.png); background-color: #fee500; } .comment_wrap .comment_list li .user_info .user_name i.google { background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_google.png); background-color: #fff; } .comment_wrap .comment_list li .user_info .user_name i.facebook { background-image: url(https://image.ajunews.com/images/site/news/kr/img/view/comment_facebook.png); background-color: #1877f2; } .comment_wrap .comment_list li .user_info .date { line-height:25px; margin-left:20px; } .comment_wrap .comment_list li .user_info .date:before { content:""; float: left; width:1px; height:15px; background-color:#ddd; margin-right:20px; margin-top:5px; } .comment_wrap .comment_list li .user_info .btn_delete { margin-left: auto; width:19px; height:19px; box-sizing: border-box; border: 1px solid #f2f2f2; overflow:hidden; text-indent:-9999px; background: url(../img/btn_close_comment.png) 3px 3px no-repeat; position: absolute; right: 0px; top: 32px; } .comment_wrap .comment_list li .comment_txt { font-size:15px; line-height:25px; margin-top:14px; } .comment_wrap .comment_list li .like_bad { display:flex; justify-content: flex-end; margin-top:10px; } .comment_wrap .comment_list li .like_bad button + button { margin-left: 10px; } .comment_wrap .comment_list li .like_bad button { line-height:20px; font-size:13px; } .comment_wrap .comment_list li .like_bad button i { float: left; width:20px; height:20px; overflow:hidden; text-indent:-9999px; } .comment_wrap .comment_list li .like_bad button:nth-child(1) i { background: url(../img/ico_like.png) no-repeat; background-size:100% auto; margin-right: 10px; } .comment_wrap .comment_list li .like_bad button:nth-child(2) i { background: url(../img/ico_bad.png) no-repeat; background-size:100% auto; margin-right: 10px; } .comment_wrap .btn_more_comment { width:100%; height:54px; line-height:54px; font-size:15px; font-weight:400; } .comment_wrap .btn_more_comment button { width:100%; line-height:54px; } .comment_wrap .btn_more_comment button i { display: inline-block; width:11px; height:11px; background: url(../img/btn_more_comment.png) no-repeat; margin-left: 5px; } .recommend_news { margin-top:50px; } .recommend_news h4 { font-size:19px; } .recommend_news .h4 { font-size:19px; } .recommend_news ul { margin-top:14px; display:flex; flex-wrap: wrap; justify-content: space-between; } .recommend_news li { width:220px; margin-bottom:26px; } .recommend_news li .thumb { width:220px; height:145px; } .recommend_news li .tit { font-size:16px; line-height:21px; margin-top:8px; } .realtime_news { position: relative; margin-top: 80px; } .realtime_news .h_area { display: flex; } .realtime_news .h_area h3 { float: left; } .realtime_news .h_area .h3 { float: left; } .realtime_news .h_area .tooltip { position: relative; right: auto; top: auto; float: left; margin-left: 4px; } .realtime_news .h_area .ly_tooltip { width: 200px; height: auto; left: 85px; } .realtime_news .update_area { position: absolute; right: 0; top: 0; } .realtime_news .update_area .current { font-size: 12px; color: #888; } .realtime_news .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; } .realtime_news .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; } .realtime_news ul { margin:15px 0 0 5px; box-sizing: border-box; padding: 15px 0 20px; border-left:4px double #ddd; } .realtime_news ul li { position: relative; padding-left: 15px; } .realtime_news ul li::before { content: ''; display: block; width: 14px; height: 14px; margin-right: 5px; position: absolute; left: -9px; top: 4px; background: url(../img/ico_realtime_14.png) no-repeat; background-size: 100% auto; } .realtime_news ul li + li { margin-top: 15px; } .realtime_news 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; } .realtime_news ul li .tit { font-size: 16px; line-height: 22px; font-weight: 500; margin-top: 5px; } .expand_news { position: relative; margin-top: 80px; } .expand_news ul { margin-top: 15px; } .expand_news ul li + li { margin-top: 15px; } .expand_news ul li a { display: flex; justify-content: space-between; } .expand_news ul li .t_area { width: calc(100% - 115px); align-content: center; } .expand_news ul li .t_area .tit { font-size: 16px; line-height: 22px; } .expand_news ul li .thumb { width: 100px; height: 65px; border-radius: 5px; } .global_news { margin-top: 80px; } .global_news .h_area { display: flex; justify-content: space-between; } .global_news .h_area .tab_area { display: flex; } .global_news .h_area .tab_area button { height: 22px; line-height: 22px; font-size: 15px; color: #999; font-weight: 500; } .global_news .h_area .tab_area button + button { margin-left: 6px; } .global_news .h_area .tab_area button.on { color: #111; } .global_news .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%; } .global_news .h_area .tab_area button:nth-child(1):before { background: url(../img/ico_global_cn.png) no-repeat; background-size: 100% auto; } .global_news .h_area .tab_area button:nth-child(2):before { background: url(../img/ico_global_jp.png) no-repeat; background-size: 100% auto; } .global_news .h_area .tab_area button:nth-child(3):before { background: url(../img/ico_global_vn.png) no-repeat; background-size: 100% auto; } .global_news .tab_lst { margin-top: 8px; } .global_news .tab_lst .tab_box { display: none; } .global_news .tab_lst .tab_box.on { display: block; } .global_news .tab_lst .tab_box ul li { border-top: 1px solid #eee; padding: 15px 0; } .global_news .tab_lst .tab_box ul li a { display: flex; justify-content: space-between; } .global_news .tab_lst .tab_box ul li .t_area { width: calc(100% - 78px); align-content: center; } .global_news .tab_lst .tab_box ul li .t_area .tit { font-size: 16px; line-height: 25px; letter-spacing: -0.8px; } .global_news .tab_lst .tab_box ul li .thumb { width: 60px; height: 60px; border-radius: 5px; } .global_news .tab_lst .tab_box .btn_more { width: 100%; height: 44px; line-height: 42px; font-size: 15px; font-weight: 500; text-align: center; box-sizing: border-box; border: 1px solid #dfdfdf; border-radius: 5px; position: relative; } .global_news .tab_lst .tab_box .btn_more a { display: block; width: 100%; height: 100%; } .global_news .tab_lst .tab_box .btn_more a:hover{ color: #111; } .global_news .tab_lst .tab_box .btn_more span { color: #ee1c25; font-weight:600; } .global_news .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; } .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: 300px; width: 120px; height: 600px; } .atc_ad_wing .wing_right { position: absolute; right: -140px; top: 300px; width: 120px; height: 600px; } .atc_ad_wing.wing2 .wing_left { top: 194px; } .atc_ad_wing.wing2 .wing_right { top: 194px; } .atc_ad_view_hd { position: relative; width: 100%; text-align: center; margin: 0px 0 50px; } .atc_ad_view_bottom { position: relative; width: 100%; text-align: center; } .atc_ad_view_bottom.mtop { margin-top: 50px; } .atc_ad_view_bottom.mbottom { margin-bottom: 50px; } .atc_ad_view_bottom.bn_flex { display: flex; justify-content: space-between; } .atc_ad_view_bottom .bn_left, .atc_ad_view_bottom .bn_right { width: 50%; } .atc_ad_view_bottom .bn_left img, .atc_ad_view_bottom .bn_right img { width: 100%; } .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 center 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) no-repeat; } .ai_wrap ul li.en a { background:url(../img/ico_ai_en.png) no-repeat; } .ai_wrap ul li.jp a { background:url(../img/ico_ai_jp.png) no-repeat; } .ai_wrap ul li.vn a { background:url(../img/ico_ai_vn.png) no-repeat; } .ai_wrap:hover { width:240px; background:url(../img/bg_translation_2.png) center center 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; }