/* 공통 ================================== */ .gu_kv .kv_img_area{background: url("../../img/media/kv_media.jpg") no-repeat center/cover;} .gu_sub_wrapper .gu_sub_contents .contents_inner{padding-top:0;} .gu_sub_wrapper .gu_sub_contents .contents_inner .contents_title{margin: 0; padding: 146px 72px 0;} .img_box{padding-top:60px;} .section:last-child{padding-bottom:100px;} /* news ================================== */ #NEWS_LIST .ellipsis_line {-webkit-line-clamp: 3;max-height:90px;} #NEWS_LIST .img_area {position:relative; border: 1px solid #e5e5e5; } #NEWS_LIST .img_area .thumb {position:absolute;width:100%; height:100%;background-repeat:no-repeat; background-position:center center; background-size:cover;top:0;left:0;} #NEWS_LIST .text_area .date {font-size:16px; color:#999; } /* news_main */ #NEWS_LIST .news_main {position:relative;} #NEWS_LIST .news_main .text_area .main_title {margin:40px 0 20px; font-size:24px; line-height:40px} #NEWS_LIST .news_main a:hover .text_area .main_title span {border-bottom:1px solid #222} #NEWS_LIST .news_main .text_area .main_text {font-size:18px; line-height:30px; margin-bottom:30px; color:#555;} /* news_list */ #NEWS_LIST .news_list {margin-top:60px; padding:60px 0;border-top:1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;} #NEWS_LIST .news_list ul {font-size:0;} #NEWS_LIST .news_list ul li {margin-bottom:40px;} #NEWS_LIST .news_list ul li:last-child {margin-bottom:0;} #NEWS_LIST .news_list ul li>a{font-size: 0;position: relative;display: block} #NEWS_LIST .news_list ul li a > div {display:inline-block; vertical-align:top;} #NEWS_LIST .news_list .text_area {padding-left:35px; width:calc(100% - 470px);-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #NEWS_LIST .news_list .text_area .box_title {margin:0 0 16px; font-size:20px; line-height:34px;} #NEWS_LIST .news_list a:hover .text_area .box_title span {border-bottom:1px solid #222} #NEWS_LIST .news_list .text_area .text {margin:0 0 25px; font-size:16px; line-height:30px; color:#555;} #NEWS_LIST .news_list .text_area .date {font-size:16px; line-height:24px;} /* news-view ================================== */ #NEWS_DETAIL{position:relative; word-break:keep-all;max-width:960px;margin: 0 auto;} #NEWS_DETAIL .detail_top {border-bottom:1px solid #e5e5e5;padding-bottom:60px;} #NEWS_DETAIL .detail_top .title {padding-bottom:30px; font-size:32px; line-height:46px;} #NEWS_DETAIL .detail_top .short_content {padding-bottom:30px;font-size:18px; line-height:26px;color:#555;font-weight:500;} #NEWS_DETAIL .detail_top .date {color:#222; display:inline-block; vertical-align:bottom; font-size:16px; line-height:30px;} #NEWS_DETAIL .detail_top .new {color:#e35b0a;vertical-align:bottom; margin-left:15px;display: none} #NEWS_DETAIL .detail_middle {padding:60px 0 110px;} #NEWS_DETAIL .detail_middle .text {font-size:16px; line-height:30px; color:#555;} #NEWS_DETAIL .detail_middle .text > div{text-align:center;} #NEWS_DETAIL .detail_middle .text > div.img_top{margin-bottom:60px;} #NEWS_DETAIL .detail_middle .text > div.img_bottom{margin-top:60px;} #NEWS_DETAIL .detail_middle .text > div img {max-width:100%;} #NEWS_DETAIL .detail_middle .text p{font-size:16px; line-height:30px;} #NEWS_DETAIL .detail_middle .text .box_copy{background-color:#F5F5F5; padding:30px 25px; font-size:16px; margin: 0 auto;min-width: 100%; width: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #NEWS_DETAIL .detail_middle .text .title{font-size: 20px; padding-bottom: 30px; font-family: "Plain",sans-serif; font-weight: 700;} #NEWS_DETAIL .detail_middle .text .text_con{font-size:18px;} #NEWS_DETAIL .detail_bottom {font-size:16px; color:#222; line-height:30px;} #NEWS_DETAIL .detail_bottom .detail_btn_area {border-top:1px solid #444; border-bottom:1px solid #444;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div {color:#222;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div.no_data {padding:25px 38px;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div:first-child {border-bottom:1px solid #e1e1e1;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div a {display:inline-block; padding:25px 38px; width:100%; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div img {vertical-align:middle; width:16px; height:16px; padding-right:38px;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div span {vertical-align:middle;max-width:calc(100% - 54px); display:inline-block; vertical-align:middle;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div.no_data span {color:#999;} #NEWS_DETAIL .detail_bottom .btn_area {text-align:right; margin-top:40px;} #news_video_2118{width:960px; height:480px;} #NEWS_DETAIL .detail_middle .text.2118 p{line-height:15px;} #NEWS_DETAIL .detail_bottom .btn_area a {font-size: 16px;padding: 0 30px; transition: all 0.3s;min-width: 75px;height: 56px; border-color: #b2b2b2;} #NEWS_DETAIL .detail_bottom .btn_area span {top:31%} .section:last-child{padding-bottom:160px;} #NEWS_DETAIL .gu_detail_file{padding: 25px 40px;} #NEWS_DETAIL .gu_detail_file .gu_btn_down{padding: 16px 0px;} #NEWS_DETAIL .gu_detail_file .gu_btn_down:hover {color: #e35b0a; background:none;} #NEWS_DETAIL .gu_detail_file .gu_btn_down:hover span:before{background-image: url(../../img/common/ico_download_color.png);} /* stories ================================== */ #STORIES_LIST{margin-top: -60px;} #STORIES_LIST ul li {border-bottom:1px solid #e5e5e5; padding-bottom:60px;} #STORIES_LIST ul li:last-child {border-bottom:0;} #STORIES_LIST .text_area .box_title {font-size:24px; line-height:40px; margin-top:30px;} #STORIES_LIST .text_area .text {font-size:16px; line-height:30px;margin:15px 0 25px;} #STORIES_LIST .bottom .date {float:left;} #STORIES_LIST .bottom .btn_area {float:right;} #STORIES_LIST .text_area .more_btn{display:none;} /* ================================== Laptop css ================================== */ @media all and (max-width: 1280px) { .gu_sub_wrapper .gu_sub_contents .contents_inner{max-width:inherit;} .gu_sub_wrapper .gu_sub_contents .contents_inner .contents_title{padding:120px 0 0} #NEWS_DETAIL .detail_middle .text > div img{width:100%;} .section:last-child {padding:0 36px 100px 36px;} } /* ================================== Tablet css ================================== */ @media all and (max-width: 1080px) { #news_list ul br{display:block;} #NEWS_DETAIL br{display:block;} .gu_sub_wrapper .gu_sub_contents .contents_inner .contents_title{padding:70px 50px 0;} #SEARCH_BOX .fclear .sort_area{margin-bottom:0;} #SEARCH_BOX .sort_area .sort_name a{font-size:16px; padding: 6px 25px 14px 0;} #SEARCH_BOX .sort_area .sort_name:before{bottom:16px;} #SEARCH_BOX .sort_area .inputbox .inputbox_inner{width:165px; height:44px;} #SEARCH_BOX .sort_area .inputbox .inputbox_inner input{font-size:14px;} #SEARCH_BOX .sort_area .inputbox a.btn_search{width:44px; height:44px; margin-left:0;} #SEARCH_BOX .sort_area .inputbox a.btn_search img{width:18px; height:18px; padding:14px;} #NEWS_LIST .img_area>img{width: 100%} #NEWS_LIST .news_list ul li a > div.img_area{width: 45%} #NEWS_LIST .news_list .text_area{width: 55%;padding-left: 16px} #NEWS_LIST .text_area .date{font-size:14px; line-height:24px;} #NEWS_LIST .news_main .text_area .main_title{font-size:20px; line-height:30px; margin-top:25px;} #NEWS_LIST .news_main .text_area .main_text{font-size:16px; line-height:24px;} #NEWS_LIST .news_list .text_area .box_title{font-size:18px; line-height:24px; margin: 0 0 18px;} #NEWS_LIST .news_list .text_area .text{font-size:14px; line-height:24px;margin: 0 0 20px;} #NEWS_LIST .news_list{margin-top:60px; padding:60px 0;} #NEWS_LIST .news_list .text_area .date{font-size:13px; line-height:24px;} #NEWS_LIST .gu_paging{margin-top:35px;} #STORIES_LIST .text_area .box_title{font-size:20px;} #STORIES_LIST .text_area .text{font-size:13px; line-height:24px; margin-top: 18px;} #STORIES_LIST .bottom .date,#STORIES_LIST .btn_area .btn_more{font-size: 13px;} #STORIES_LIST .btn_area .btn_more div{width:10px; height:10px; margin-left:12px;} #STORIES_LIST .btn_area .btn_more div span:first-child{top:5px;} #STORIES_LIST .btn_area .btn_more div span:last-child{left:5px;} #STORIES_LIST ul li{padding-bottom:45px;} #NEWS_DETAIL .detail_top .title{padding-bottom:30px;font-size:24px; line-height:32px;} #NEWS_DETAIL .detail_top .short_content{line-height:24px; font-size:16px;} #NEWS_DETAIL .detail_top .date,#NEWS_DETAIL .detail_top .new{font-size:14px; line-height:24px;} #NEWS_DETAIL .detail_middle{padding:60px 0 110px;} #NEWS_DETAIL .detail_middle img{width:100%;} #NEWS_DETAIL .detail_middle .text > div.img_top{margin-bottom:40px;} #NEWS_DETAIL .detail_middle .text > div.img_bottom{margin-top:40px;} #NEWS_DETAIL .detail_middle .text .box_copy{padding:25px 20px; font-size:13px; } #NEWS_DETAIL .detail_middle .text .title{font-size:16px; padding-bottom:20px;} #NEWS_DETAIL .detail_middle .text .text_con, #NEWS_DETAIL .detail_middle .text p{font-size:14px; line-height:23px;padding-bottom:0;} #NEWS_DETAIL .detail_bottom{font-size:14px;line-height:24px;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div.no_data,#NEWS_DETAIL .detail_bottom .detail_btn_area>div a{padding:20px 12px;} #NEWS_DETAIL .detail_bottom .btn_area{margin-top:30px;} #NEWS_DETAIL .detail_bottom .btn_area a {font-size: 12px;padding: 0 14px;height: 42px;} #NEWS_DETAIL .detail_middle .text br {display:block;} #news_video_2118{width:760px; height:380px; display:block; text-align:center;} .section:last-child {padding:0 50px 100px 50px;} } /* ================================== Mobile css ================================== */ @media all and (max-width: 766px) { .no-mobile .gu_tab_depth3 ul li a:before{height:3px;} .section:last-child {padding:0 20px 100px 20px;} /* news ================================== */ .gu_sub_wrapper .gu_sub_contents .contents_inner .contents_title { padding : 60px 20px 0;} #NEWS_LIST .news_main .text_area .main_title {font-size: 20px; line-height:30px; margin: 40px 0 25px;} #NEWS_LIST .news_main .text_area .main_text {font-size:13px; line-height:24px; margin-bottom:25px; } #NEWS_LIST .news_list {margin-top: 60px; padding: 60px 0;} #NEWS_LIST .news_list ul li a > div {display:block; width: 100%; } #NEWS_LIST .news_list .text_area {padding-left: 0; margin-top:15px;} #NEWS_LIST .news_list ul li a > div.img_area{width: 100%} #NEWS_LIST .news_list .text_area{width: 100%;} #NEWS_LIST .news_list .text_area .box_title {font-size:18px;line-height:26px; margin: 0 0 18px;} #NEWS_LIST .news_list .text_area .text{font-size:14px; line-height:24px; margin : 0 0 20px;} /* news-view ================================== */ #NEWS_DETAIL .detail_top .title { font-size: 24px; line-height:36px;} #NEWS_DETAIL .detail_top .short_content{font-size:16px; line-height:24px;} #NEWS_DETAIL .detail_top {padding-bottom: 60px;} #NEWS_DETAIL .detail_middle {padding: 40px 0 60px;} #NEWS_DETAIL .detail_middle .text .box_copy {padding: 23px 17px; font-size: 14px; line-height:24px;} #NEWS_DETAIL .detail_middle .text .title {font-size: 14px; padding-bottom:17px;} #NEWS_DETAIL .detail_middle .text .text_con, #NEWS_DETAIL .detail_middle .text p {font-size: 14px; line-height:20px; padding-bottom:15px;} #NEWS_DETAIL .gu_detail_file{padding:25px 0;} /* stories ================================== */ #STORIES_LIST{margin-top: -50px;} #STORIES_LIST .text_area .box_title {font-size:18px; line-height:26px; margin-top:24px;} #STORIES_LIST .text_area .text {font-size: 12px; line-height: 18px; margin: 15px 0 0;} #STORIES_LIST .text_area .text p{overflow: hidden;} #STORIES_LIST .text_area .more_btn{display:block; margin:21px 0 0; } #STORIES_LIST .text_area .more_btn a{font-size:14px; line-height:24px; color:#999} #STORIES_LIST .text_area .bottom{margin-top:20px;} #STORIES_LIST .bottom .date, #STORIES_LIST .btn_area .btn_more {font-size: 14px; line-height:24px;} #NEWS_DETAIL .detail_bottom .detail_btn_area>div.no_data,#NEWS_DETAIL .detail_bottom .detail_btn_area>div a{padding:20px 0;} #news_video_2118{width:560px; height:240px; text-align:center;} #STORIES_LIST .gu_paging{margin-top:0;} } @media all and (max-width: 560px){ #news_video_2118{width:400px; height:200px; text-align:center;} }