@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo&display=swap');
/* common */
body {
overflow-x: hidden;
word-break: keep-all;
}
.blind {
overflow: hidden;
position: absolute;
width: 1px;
height: 1px;
border: 0;
clip: rect(1px, 1px, 1px, 1px);
z-index: -1;
}
.ellipsis {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap
}
.ellipsis2, .ellipsis3, .ellipsis4, .ellipsis5, .ellipsis6, .ellipsis7, .ellipsis8, .ellipsis9, .ellipsis10 {
display: -webkit-box;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
word-wrap: break-word
}
.ellipsis2 {
-webkit-line-clamp: 2
}
.ellipsis3 {
-webkit-line-clamp: 3
}
.ellipsis4 {
-webkit-line-clamp: 4
}
.ellipsis5 {
-webkit-line-clamp: 5
}
.ellipsis6 {
-webkit-line-clamp: 6
}
.ellipsis7 {
-webkit-line-clamp: 7
}
.ellipsis8 {
-webkit-line-clamp: 8
}
.ellipsis9 {
-webkit-line-clamp: 9
}
.ellipsis10 {
-webkit-line-clamp: 10
}
/* icon */
i.ico_red {
display: inline-block;
padding: 0 6px;
color: #F4361E;
text-align: center;
font-size: 11px;
font-weight: 700;
border-radius: 13px;
border: 1px solid rgba(244, 54, 30, 0.50);
vertical-align: middle;
background: rgba(244, 54, 30, 0.08);
backdrop-filter: blur(50px);
}
i.ico_blue {
display: inline-block;
padding: 0 6px;
color: #1D9BF0;
text-align: center;
font-size: 11px;
font-weight: 700;
border-radius: 13px;
border: 1px solid rgba(51, 184, 255, 0.70);
vertical-align: middle;
background: rgba(51, 184, 255, 0.08);
backdrop-filter: blur(50px);
}
/* header */
header {
position: relative;
font-size: 0;
border-bottom: 2px solid #171717;
}
header .header_area {
position: relative;
max-width: 1130px;
margin: 0 auto;
}
header .logo {
display: inline-block;
font-size: 0;
margin: 0;
padding: 30px 0;
}
header .logo a {
display: inline-block;
}
header .logo svg {
display: inline-block;
width: 200px;
vertical-align: middle;
transition: .1s;
}
header .logo em {
display: inline-block;
position: relative;
color: rgba(23, 23, 23, 0.60);
padding-left: 20px;
font-size: 13px;
font-weight: 500;
vertical-align: middle;
}
header .logo em::before {
position: absolute;
top: 50%;
left: 10px;
width: 1px;
height: 10px;
margin-top: -5px;
background: #e8e8e8;
content: '';
}
header .logo em.ico_premium {
box-sizing: border-box;
display: inline-block;
margin-left: 30px;
padding: 4px 10px 2px;
border-radius: 30px;
vertical-align: middle;
background: #1D9BF0;
}
header .logo em.ico_premium span {
color: #FFF;
text-align: center;
font-family: "Abhaya Libre";
font-size: 18px;
font-style: normal;
font-weight: 800;
line-height: 100%;
letter-spacing: -0.72px;
}
header .logo em.ico_premium::before {
display: none;
content: '';
}
header .date {
position: absolute;
top: 50%;
left: 0;
margin-top: -7px;
color: rgba(23, 23, 23, .5);
font-size: 13px;
}
header .btn_member {
position: absolute;
top: 50%;
right: 0;
margin-top: -6px;
font-size: 0;
}
header .btn_member .btn_list li {
display: inline-block;
vertical-align: middle;
}
header .btn_member .btn_list li + li {
position: relative;
margin-left: 21px;
}
header .btn_member .btn_list li + li::before {
display: block;
position: absolute;
top: 1px;
left: -11px;
width: 1px;
height: 10px;
background: #e8e8e8;
content: '';
}
header .btn_member .btn_list li a {
display: block;
color: #171717;
font-size: 13px;
font-weight: 500;
}
header .btn_member .btn_ico {
display: none;
}
header.change .logo {
padding: 22px 0;
}
header.change .btn_member {
right: 72px;
margin-top: -14px;
}
header.change .btn_member .btn_list {
display: none;
}
header.change .btn_member .btn_ico {
display: block;
}
header .btn_member .btn_ico svg {
width: 26px;
height: 26px;
fill: #171717;
transition: .1s;
}
header .btn_member:hover .btn_ico svg {
fill: #1d9bf0;
}
header.change .logo svg {
width: 160px;
}
header .issuebanner {
position: absolute;
top: 50%;
left: 50%;
width: 400px;
height: 50px;
margin: -25px 0 0 -150px;
}
header .issuebanner img {
display: block;
width: 400px;
height: 50px;
object-fit: cover;
object-position: top;
}
header.change .issuebanner {
display: none;
}
/* nav */
header nav {
position: relative;
padding: 6px 0;
font-size: 0;
border: 1px solid #e8e8e8;
border-width: 1px 0;
}
nav .nav_area {
max-width: 1130px;
margin: 0 auto;
}
nav .btn_all_menu {
display: inline-block;
width: 26px;
height: 26px;
vertical-align: middle;
background: transparent;
}
nav .btn_all_menu .bar_wrap {
display: inline-block;
}
nav .btn_all_menu span {
display: block;
width: 20px;
height: 2px;
margin: 4px 0;
background: #171717;
-webkit-transition: all 200ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
transition: all 200ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
-webkit-transform: translate3d(0, 0, 0);
-transform: translate3d(0, 0, 0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: .1s;
}
nav .btn_all_menu:hover span {
background: #1d9bf0;
}
nav .btn_all_menu.menu_active span {
margin: 4px 0;
background: #171717;
}
nav .btn_all_menu.menu_active:hover span {
background: #1d9bf0;
}
nav .btn_all_menu.menu_active .all_menu_bar1 {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
nav .btn_all_menu.menu_active .all_menu_bar2 {
opacity: 0;
}
nav .btn_all_menu.menu_active .all_menu_bar3 {
margin-top: -12px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
nav .all_menu_area {
z-index: 2;
display: none;
position: absolute;
top: 39px;
left: 0;
right: 0;
background: #fff;
box-shadow: 0px 22px 25px 0px rgba(0, 0, 0, .06);
}
nav .all_menu_area .all_menu_wrap {
box-sizing: border-box;
display: table;
position: relative;
width: 100%;
max-width: 1130px;
table-layout: fixed;
margin: 0 auto;
padding: 30px 0 20px;
font-size: 0;
}
nav .all_menu_wrap .all_menu_item {
box-sizing: border-box;
display: table-cell;
width: 25%;
padding: 0 40px;
vertical-align: top;
border-right: 1px solid rgba(23, 23, 23, 0.06);
}
nav .all_menu_item dt {
color: #171717;
font-size: 15px;
font-weight: 600;
}
nav .all_menu_item dd {
margin-top: 15px;
}
nav .all_menu_item dd + dt {
margin-top: 30px;
}
nav .all_menu_item .all_menu_list li:first-child {
margin-top: 0;
}
nav .all_menu_item .all_menu_list li a {
color: rgba(23, 23, 23, 0.70);
font-size: 15px;
font-weight: 400;
line-height: 2.3;
}
nav .all_menu_wrap .all_menu_item.first_item {
width: 35%;
padding-right: 0;
}
nav .all_menu_wrap .all_menu_item.first_item .all_menu_list li {
display: inline-block;
width: 50%;
}
nav .all_menu_wrap .all_menu_item.last_item {
width: 40%;
border-right: 0;
}
nav .all_menu_wrap .all_menu_item.last_item dd + dt {
margin-top: 30px;
}
nav .all_menu_item.last_item li {
display: inline-block;
margin: 0 18px 0 0;
vertical-align: top;
}
nav .all_menu_item.last_item li:first-child {
margin-left: 0;
}
nav .all_menu_area .all_menu_bottom {
box-sizing: border-box;
position: relative;
width: 100%;
max-width: 1130px;
margin: 0 auto;
padding: 0 30px;
}
nav .all_menu_area .all_menu_bottom dl {
box-sizing: border-box;
font-size: 0;
padding: 25px 0;
border-top: 1px solid rgba(23, 23, 23, 0.06);
}
nav .all_menu_area .all_menu_bottom dt {
display: inline-block;
vertical-align: top;
}
nav .all_menu_area .all_menu_bottom dd {
box-sizing: border-box;
display: inline-block;
margin-top: 0;
padding-left: 25px;
vertical-align: top;
}
nav .all_menu_area .all_menu_bottom dd .all_menu_list {
font-size: 0;
}
nav .all_menu_area .all_menu_bottom dd .all_menu_list li {
display: inline-block;
margin-right: 20px;
vertical-align: top;
}
nav .all_menu_area .all_menu_bottom dd .all_menu_list li a {
line-height: 1;
}
nav .all_menu_area .sns_list {
position: absolute;
bottom: 18px;
right: 30px;
font-size: 0;
}
nav .all_menu_area .sns_list li {
display: inline-block;
margin-left: 20px;
}
nav .all_menu_area .sns_list li:first-child {
margin-left: 0;
}
nav .all_menu_area .sns_list li a {
display: block;
width: 24px;
height: 24px;
text-align: center;
}
nav .all_menu_area .sns_list li svg {
fill: #171717;
transition: .1s;
}
nav .all_menu_area .sns_list li a:hover svg {
fill: #1d9bf0;
}
nav .all_menu_area .sns_list li.ico svg {
display: inline-block;
width: 22px;
height: 24px;
}
nav .all_menu_area .sns_list li.ico a svg::before {
display: inline-block;
height: 100%;
vertical-align: middle;
content: '';
}
nav .all_menu_area .sns_list li + li.ico a {
width: 26px;
}
nav .all_menu_area .sns_list li + li.ico svg {
width: 25px;
}
nav .gnb {
display: inline-block;
font-size: 0;
vertical-align: middle;
}
nav .gnb li {
display: inline-block;
margin-left: 20px;
}
nav .view_gnb .gnb li {
margin-left: 15px;
}
nav .gnb li a {
display: block;
color: #171717;
font-size: 14px;
font-weight: 600;
}
nav .gnb li a.for_member {
position: relative;
padding-right: 20px;
font-weight: 800;
}
nav .view_gnb .gnb li a.for_member {
padding-right: 15px;
}
nav .gnb li a.for_member::before {
position: absolute;
top: 50%;
right: 0;
width: 1px;
height: 12px;
margin-top: -6px;
background: #e8e8e8;
content: '';
}
nav .gnb li a.btn_hic {
box-sizing: border-box;
padding: 0 10px;
color: #FFF;
font-size: 13px;
font-weight: 700;
line-height: 1.5;
border-radius: 22px;
background: #1D9BF0;
}
header.change nav .gnb li {
margin-left: 15px;
}
header.change nav .gnb li a.for_member {
padding-right: 15px;
}
nav .gnb li a .military {
color: #8C9320;
}
header .btn_search_bar {
position: absolute;
bottom: -33px;
right: 0;
z-index: 3;
width: 26px;
vertical-align: middle;
}
header .btn_search_bar button {
display: block;
width: 26px;
height: 26px;
background: transparent;
}
header .btn_search_bar svg {
transition: .1s;
fill: #171717;
}
header .btn_search_bar:hover svg {
fill: #1d9bf0;
}
header .btn_search_bar.search_active svg {
display: none;
}
header .btn_search_bar.search_active button {
position: relative;
}
header .btn_search_bar.search_active button::before, header .btn_search_bar.search_active button::after {
position: absolute;
top: 12px;
left: 4px;
width: 20px;
height: 2px;
background: #171717;
transition: .1s;
}
header .btn_search_bar.search_active button::before {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
content: '';
}
header .btn_search_bar.search_active button::after {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
content: '';
}
header .btn_search_bar.search_active button:hover::before, header .btn_search_bar.search_active button:hover::after {
background: #1d9bf0;
}
header.change .btn_search_bar {
top: 20px;
bottom: auto;
}
header .search_area {
z-index: 2;
display: none;
position: absolute;
top: 130px;
left: 0;
right: 0;
background: rgba(255, 255, 255, 0.96);
box-shadow: 0px 22px 25px 0px rgba(0, 0, 0, .06);
backdrop-filter: blur(200px);
}
header.change .search_area {
top: 70px;
}
header .search_area .search_wrap {
padding: 55px 0 80px;
}
header .search_area .search_bar {
position: relative;
max-width: 645px;
margin: 0 auto;
}
header .search_area .search_bar .search_inp {
box-sizing: border-box;
display: block;
width: 100%;
height: 60px;
padding: 0 70px 0 20px;
color: #171717;
font-size: 22px;
font-weight: 700;
vertical-align: middle;
border-bottom: 2px solid #171717;
transition: .1s;
background: transparent;
}
header .search_area .search_bar .search_inp::-webkit-input-placeholder {
color:rgba(23, 23, 23, 0.40);
font-weight: 300;
}
header .search_area .search_bar .search_inp:-ms-input-placeholder {
color:rgba(23, 23, 23, 0.40);
}
header .search_area .search_bar .search_inp:focus {
border-color: #1d9bf0
}
header .search_area .search_bar .search_inp:focus + .btn_search svg {
fill: #1d9bf0
}
header .search_area .search_bar .btn_search {
display: block;
position: absolute;
top: 0;
right: 0;
width: 56px;
height: 60px;
text-align: center;
cursor: pointer;
background: transparent;
}
header .search_area .search_bar .btn_search svg {
display: inline-block;
width: 36px;
fill: #171717;
transition: .1s;
}
header .header_news_swiper {
overflow: hidden;
position: relative;
max-width: 1130px;
margin: 0 auto;
}
.header_news_swiper .swiper-button-next, .header_news_swiper .swiper-button-prev {
box-sizing: border-box;
top: 45px !important;
z-index: 1;
width: 30px;
height: 30px;
border: 1px solid rgba(255, 255, 255, 0.40);
border-radius: 20px;
border: 1px solid #DADCDF;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
}
.header_news_swiper .swiper-button-next {
right: var(--swiper-navigation-sides-offset,0px);
}
.header_news_swiper .swiper-button-prev {
left: var(--swiper-navigation-sides-offset,0px);
}
.header_news_swiper .swiper-button-next:after, .header_news_swiper .swiper-button-prev:after {
color: #171717;
font-size: 10px;
}
.header_news_swiper .swiper-button-next:after {
padding-left: 2px;
}
.header_news_swiper .swiper-button-prev:after {
padding-right: 2px;
}
header .header_news_list li {
box-sizing: border-box;
position: relative;
padding: 16px 0 16px 20px;
text-align: center;
}
header .header_news_list li a {
position: relative;
display: block;
text-align: center;
}
header .header_news_list li a::before {
display: block;
position: absolute;
top: 50%;
left: -21px;
width: 1px;
height: 40px;
margin-top: -20px;
background: #e8e8e8;
content: '';
}
header .header_news_list li:first-child a:before {
display: none;
}
header .header_news_list .header_news_item {
box-sizing: border-box;
overflow: hidden;
display: inline-block;
position: relative;
max-width: 270px;
min-height: 44px;
padding-left: 64px;
}
header .header_news_list .header_news_item .news_img {
position: absolute;
top: 0;
left: 0;
}
header .header_news_list .news_img_wrap .news_img {
overflow: hidden;
width: 44px;
height: 44px;
border-radius: 50%;
}
header .header_news_list .news_img_wrap .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0,0,0,0.05);
border-radius: 50%;
content: '';
}
header .header_news_list .header_news_item .news_img img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
header .header_news_list .header_news_item .news_txt {
text-align: left;
}
header .header_news_list .header_news_item .news_txt em {
display: block;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
header .header_news_list .header_news_item .news_txt p {
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
header .gauge_bar {
position: absolute;
bottom: -2px;
height: 2px;
background: #33B8FF;
z-index: 10;
}
header.change {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 5;
border-bottom: 2px solid #171717;
background: #FFF;
box-shadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.10);
}
header.change nav {
padding: 0;
border: 0;
}
header.change nav .nav_area {
position: relative;
}
header.change nav .btn_all_menu {
position: absolute;
top: -48px;
right: 36px;
}
header.change nav .all_menu_area {
position: fixed;
top: 70px;
}
header.change nav .gnb {
position: absolute;
top: -41px;
left: 206px;
}
header.change + .site_main {
margin-top: 72px;
}
/* series header */
header.series {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 5;
border-bottom: 0;
background: rgba(23, 23, 23, 0.90);
backdrop-filter: blur(100px);
}
header.series .header_area {
height: 70px;
}
header.series .logo {
padding: 23px 0;
}
header.series .logo a {
display: inline-block;
vertical-align: middle;
}
header.series .logo svg {
width: 160px;
}
header.series .logo .serise_link em {
display: block;
position: relative;
padding-left: 20px;
color: rgba(255, 255, 255, 1);
font-size: 13px;
font-weight: 500;
}
header.series .logo .serise_link em::before {
position: absolute;
top: 50%;
left: 10px;
width: 1px;
height: 10px;
margin-top: -5px;
background: rgba(255, 255, 255, 0.20);
content: '';
}
header.series .logo .serise_link em span {
display: inline-block;
margin-left: 6px;
color: #FDFBAA;
font-weight: 500;
}
header.series nav {
padding: 0;
border: 0;
}
header.series nav .nav_area {
position: relative;
}
header.series nav .btn_all_menu {
position: absolute;
top: -49px;
right: 36px;
}
header.series nav .all_menu_area {
position: fixed;
top: 70px;
}
header.series nav .gnb {
position: absolute;
top: -42px;
left: 310px;
}
header.series nav .btn_all_menu span {
background: #fff;
}
header.series nav .btn_all_menu:hover span {
background: #1d9bf0;
}
header.series .btn_member {
right: 72px;
margin-top: -14px;
}
header.series .btn_member .btn_ico {
display: block;
}
header.series .btn_member .btn_ico svg {
fill: #fff;
}
header.series .btn_member:hover .btn_ico svg {
fill: #1d9bf0;
}
header.series .btn_search_bar {
top: 22px;
bottom: auto;
}
header.series .search_area {
top: 70px;
}
header.series .btn_search_bar svg {
fill: #fff;
}
header.series .btn_search_bar:hover svg {
fill: #1d9bf0;
}
header.series .btn_search_bar.search_active button::before, header.series .btn_search_bar.search_active button::after {
background: #fff;
}
/* view header */
header.view {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 5;
border-bottom: 2px solid #171717;
background: #FFF;
box-shadow: 0px -1px 1px 0px rgba(0, 0, 0, 0.10);
}
header.view .header_area {
height: 68px;
}
header.view .logo {
padding: 23px 0;
}
header.view .logo svg {
width: 160px;
}
header.view nav {
padding: 0;
border: 0;
}
header.view nav .nav_area {
position: relative;
}
header.view nav .btn_all_menu {
position: absolute;
top: -48px;
right: 36px;
}
header.view nav .all_menu_area {
position: fixed;
top: 70px;
}
header.view nav .view_gnb .gnb {
position: absolute;
top: -41px;
left: 205px;
}
header.view nav .view_gnb .news_title {
display: none;
position: absolute;
top: -46px;
left: 225px;
right: 15%;
}
header.view nav .view_gnb .news_title em {
display: block;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
}
header.view .btn_member {
right: 72px;
margin-top: -14px;
}
header.view .btn_member .btn_ico {
display: block;
}
header.view .btn_search_bar {
top: 20px;
bottom: auto;
}
header.view .search_area {
top: 70px;
}
header.view .btn_search_bar:hover svg {
fill: #1d9bf0;
}
/* special content */
.special_content {
background:#171717;
}
.special_content .special_container {
position: relative;
max-width: 1170px;
margin: 0 auto;
}
.special_content .breaking_news {
box-sizing: border-box;
position: relative;
padding: 0 400px 0 90px;
}
.special_content .breaking_news em.title {
position: absolute;
top: 50%;
left: 20px;
margin-top: -12px;
color: #ff6261;
font-size: 13px;
font-weight: 800;
line-height: 24px;
}
.special_content .breaking_news i span {
color: #ff6261;
font-size: 12px;
font-weight: 800;
line-height: 20px;
}
.special_content .breaking_news .breaking_news_list {
overflow: hidden;
height: 40px;
}
.special_content .breaking_news .breaking_news_list li {
position: relative;
}
.special_content .breaking_news .breaking_news_list li i {
box-sizing: border-box;
display: inline-block;
min-width: 40px;
margin-right: 10px;
padding: 0 5px;
text-align: center;
line-height: .8;
border: 1px solid #ff6261;
border-radius: 30px;
}
.special_content .breaking_news .breaking_news_list li a {
display: block;
color: #fff;
font-size: 13px;
font-weight: 500;
line-height: 40px;
transition: .1s;
}
.special_content .breaking_news .breaking_news_list li a:hover {
color: #999;
}
.special_content .btn_special_content {
position: absolute;
top: 8px;
right: 20px;
}
.special_content .btn_special_content button {
display: block;
position: relative;
font-size: 0;
background: rgba(51, 184, 255, 0.90);
border: 1px solid #33B8FF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
backdrop-filter: blur(50px);
border-radius: 20px;
padding: 0 27px 0 16px;
}
.special_content .btn_special_content button em {
display: block;
color: #fff;
font-size: 13px;
line-height: 22px;
vertical-align: middle;
}
.special_content .btn_special_content button em strong{
font-weight: 400;
line-height: 22px;
display: inline-block;
vertical-align: top;
}
.special_content .btn_special_content em span {
display: inline-block;
font-weight: 700;
color: #fff;
margin-left: 4px;
font-size: 14px;
line-height: 22px;
vertical-align: top;
}
.special_content .btn_special_content i {
box-sizing: border-box;
position: absolute;
top: 50%;
right: 2px;
width: 18px;
height: 18px;
margin-top: -9px;
border: 1px solid rgba(255, 255, 255, 0.90);
border-radius: 20px;
background: rgba(255, 255, 255, 0.90);
box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.05);
backdrop-filter: blur(50px);
}
.btn_special_content i::before, .btn_special_content i::after {
display: block;
position: absolute;
top: 8px;
width: 5px;
height: 1px;
border-radius: 30px;
background: #33B8FF;
transition: .1s ease-in-out;
content:'';
}
.btn_special_content i::before {
left: 4px;
transform: rotate(45deg);
}
.btn_special_content i::after {
left: 7px;
transform: rotate(-45deg);
}
.btn_special_content.btn_active i {
animation: bounce paused;
animation-iteration-count:0;
}
.btn_special_content.btn_active i::before {
transform: rotate(-45deg)
}
.btn_special_content.btn_active i::after {
transform: rotate(45deg)
}
.special_content .special_content_area {
display: none;
padding: 20px 0;
}
.special_content .special_content_area .special_swiper {
overflow: hidden;
width: 100%;
height: 100%;
}
.special_content .special_content_list {
width: 100%;
font-size: 0;
}
.special_content .special_content_list li {
box-sizing: border-box;
position: relative;
padding: 0 20px;
}
.special_content .special_content_list li a {
display: block;
width: 100%;
height: 100%;
}
.special_content .special_content_list li a .special_img {
position: relative;
width: 100%;
height: 154px;
}
.special_content .special_content_list li a .special_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
.special_content .special_content_list li a .special_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.special_content .special_content_list li a .special_txt {
margin-top: 10px;
color: #fff;
font-size: 16px;
font-weight: 500;
line-height: 24px;
}
article.hbanner {
margin-top: 30px;
}
article.hbanner .hbanner_title {
padding-bottom: 10px;
font-size: 14px;
}
main.hbanner_section {
padding-bottom: 20px;
}
main.hbanner_section article.hbanner {
margin-top: 0;
}
article.hbanner .hbanner_div_layout {
margin-left: -40px;
font-size: 0;
}
article.hbanner .hbanner_div_item {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding-left: 40px;
vertical-align: top;
}
article.hbanner .hbanner_div_layout2 {
margin-left: -40px;
font-size: 0;
}
article.hbanner .hbanner_div_layout2 .hbanner_div_item + .hbanner_div_item {
box-sizing: border-box;
display: inline-block;
width: 66.66666%;
margin-top: -10px;
padding-left: 40px;
vertical-align: top;
}
article.hbanner .hbanner_div_item .hbanner_list_type3 {
padding-left: 30px;
}
article.hbanner .section_title i {
box-sizing: border-box;
display: inline-block;
margin: -1px 0 0 2px;
padding: 3px 8px;
color: #FFF;
text-align: center;
font-size: 11px;
font-weight: 500;
line-height: normal;
border-radius: 13px;
vertical-align: middle;
background: rgba(201, 201, 201, 0.50);
backdrop-filter: blur(50px);
}
article.hbanner .img_hbanner {
display: block;
padding: 10px 0;
text-align: center;
background: rgba(220, 220, 220, 0.50);
}
article.hbanner .img_hbanner.img_hbanner3 {
margin-bottom: 40px;
padding: 0;
background: none;
}
article.hbanner .img_hbanner img {
display: inline-block;
width: 100%;
max-width: 300px;
height: 150px;
object-fit: cover;
object-position: top;
}
article.hbanner .img_hbanner.img_hbanner2 img {
height: 250px;
}
article.hbanner .img_hbanner.img_hbanner3 img {
max-width: 100%;
height: 100%;
object-fit: contain;
}
article.hbanner .img_hbanner + .img_hbanner {
margin-top: 15px;
}
article.hbanner .hbanner_list_type1 li + li {
margin-top: 8px;
}
article.hbanner .hbanner_list_type1 li a {
display: block;
position: relative;
padding-left: 15px;
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
article.hbanner .hbanner_list_type1 li a i {
display: inline-block;
position: absolute;
top: 1px;
left: -5px;
}
article.hbanner .hbanner_list_type1 li a i svg {
display: block;
width: 18px;
height: 18px;
fill: none;
}
article.hbanner .hbanner_list_type1 li a i svg path {
stroke: #171717;
stroke-opacity: .7;
}
article.hbanner .hbanner_list_type2 li + li {
position: relative;
padding-top: 16px;
}
article.hbanner .hbanner_list_type2 li + li::before {
position: absolute;
top: 8px;
left: 0;
right: 0;
height: 1px;
background: #e8e8e8;
content: '';
}
article.hbanner .hbanner_list_type2 a {
display: table;
width: 100%;
table-layout: fixed;
}
article.hbanner .hbanner_list_type2 a .hbanner_txt {
box-sizing: border-box;
display: table-cell;
width: 74%;
padding-right: 10px;
vertical-align: top;
}
article.hbanner .hbanner_list_type2 a.no_img .hbanner_txt {
width: 100%;
padding-right: 0;
}
article.hbanner .hbanner_list_type2 a .hbanner_txt .hbanner_title {
margin-top: 0;
color: rgba(23, 23, 23, 0.70);
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
article.hbanner .hbanner_list_type2 a .hbanner_img {
display: table-cell;
position: relative;
width: 26%;
height: 48px;
}
article.hbanner .hbanner_list_type2 a .hbanner_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.hbanner .hbanner_list_type2 a .hbanner_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.hbanner .hbanner_list_type3 li {
box-sizing: border-box;
display: inline-block;
width: 50%;
padding: 0 10px 0 0;
vertical-align: top;
}
article.hbanner .hbanner_list_type3 li:nth-child(n+3) {
padding-top: 20px;
}
article.hbanner .hbanner_list_type3 li:nth-child(even) {
padding-left: 10px;
padding-right: 0;
}
article.hbanner .hbanner_list_type3 a {
display: block;
}
article.hbanner .hbanner_list_type3 .hbanner_img {
position: relative;
height: 94px;
}
article.hbanner .hbanner_list_type3 .hbanner_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.hbanner .hbanner_list_type3 .hbanner_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.hbanner .hbanner_list_type3 .hbanner_title {
margin-top: 4px;
color: rgba(23, 23, 23, 0.70);
font-size: 14px;
font-weight: 500;
line-height: 1.4;
}
article.hbanner .hbanner_list_type4 li + li {
margin-top: 15px;
}
article.hbanner .hbanner_list_type4.other_type li + li {
margin-top: 8px;
}
article.hbanner .hbanner_list_type4 li a {
display: block;
position: relative;
color: rgba(23, 23, 23, 0.70);
font-size: 15px;
font-weight: 500;
line-height: 1.5;
}
article.hbanner .hbanner_list_type5 li + li {
position: relative;
padding-top: 50px;
}
article.hbanner .hbanner_list_type5 li + li::before {
position: absolute;
top: 25px;
left: 0;
right: 0;
height: 1px;
background: #e8e8e8;
content: '';
}
article.hbanner .hbanner_list_type5 a {
display: table;
width: 100%;
table-layout: fixed;
}
article.hbanner .hbanner_list_type5 a .hbanner_txt {
box-sizing: border-box;
display: table-cell;
width: 68%;
padding-right: 10px;
vertical-align: top;
}
article.hbanner .hbanner_list_type5 a.no_img .hbanner_txt {
width: 100%;
padding-right: 0;
}
article.hbanner .hbanner_list_type5 a .hbanner_txt .hbanner_title {
margin-top: 0;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.hbanner .hbanner_list_type5 a .hbanner_img {
display: table-cell;
position: relative;
width: 32%;
height: 64px;
}
article.hbanner .hbanner_list_type5 a .hbanner_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.hbanner .hbanner_list_type5 a .hbanner_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.hbanner .hbanner_list_type6 {
margin-left: -30px;
padding: 20px 0 30px;
font-size: 0;
}
article.hbanner .hbanner_list_type6 li {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding-left: 30px;
vertical-align: top;
}
article.hbanner .hbanner_list_type6 a {
display: block;
}
article.hbanner .hbanner_list_type6 .hbanner_img {
position: relative;
height: 94px;
}
article.hbanner .hbanner_list_type6 .hbanner_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.hbanner .hbanner_list_type6 .hbanner_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.hbanner .hbanner_list_type6 .hbanner_title {
margin-top: 4px;
color: rgba(23, 23, 23, 0.70);
font-size: 14px;
font-weight: 500;
line-height: 1.4;
}
article.hbanner a.hbanner_news_type {
display: block;
}
article.hbanner a.hbanner_news_type .hbanner_img {
position: relative;
height: 196px;
}
article.hbanner a.hbanner_news_type .hbanner_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.hbanner a.hbanner_news_type .hbanner_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.hbanner a.hbanner_news_type .hbanner_title {
margin-top: 10px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.hbanner a.hbanner_news_type .hbanner_txt {
margin-top: 5px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
aside article.hbanner_right_wing {
position: absolute;
top: 0;
right: -200px;
width: 160px;
height: 600px;
}
aside article.hbanner_right_wing a {
display: block;
width: 160px;
height: 600px;
}
aside article.hbanner_right_wing a img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.mypage_content_area .mypage_content .list_type2 .content_item {
width: 33.33333%;
}
article.mypage_content_area .mypage_content .list_type2 .content_item + .content_item {
padding: 0;
}
.special_content .swiper-button-next,
.special_content .swiper-button-prev {
top: 50% !important;
width: 30px;
height: 30px;
border: 1px solid rgba(255, 255, 255, 0.40);
border-radius: 20px;
z-index: 1;
background: rgba(23, 23, 23, 0.50);
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
backdrop-filter: blur(50px);
}
.special_content .swiper-button-next {
right: var(--swiper-navigation-sides-offset,3px);
left: auto;
}
.special_content .swiper-button-prev {
left: var(--swiper-navigation-sides-offset,3px);
right: auto;
}
.special_content .swiper-button-next:after, .special_content .swiper-button-prev:after {
color: #fff;
font-size: 10px;
}
.special_content .swiper-button-next:after {
padding-left: 2px;
}
.special_content .swiper-button-prev:after {
padding-right: 2px;
}
/* main */
main {
box-sizing: border-box;
max-width: 1130px;
margin: 0 auto;
padding-top: 30px;
font-size: 0;
}
main.connect_layout section {
box-sizing: border-box;
display: table;
width: 100%;
table-layout: fixed;
}
.connect_layout article.headline {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 70%;
padding: 0 20px 30px 0;
}
.connect_layout article.headline::before {
position: absolute;
bottom: 0;
left: 0;
right: 20px;
height: 1px;
background: #e8e8e8;
content: '';
}
.connect_layout article.headline .headline_item {
padding-bottom: 0;
}
.connect_layout article.top_news {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 30%;
padding-left: 20px;
vertical-align: top;
border-top: 0;
}
.connect_layout article.top_news::before {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 1px;
background: #e8e8e8;
content: '';
}
main.div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
main.div_layout section {
box-sizing: border-box;
display: table-cell;
width: 70%;
padding-right: 20px;
font-size: 13px;
vertical-align: top;
}
main aside article + article {
border-top: 0;
}
main.div_layout aside {
box-sizing: border-box;
position: relative;
display: table-cell;
width: 30%;
padding-left: 20px;
vertical-align: top;
}
main aside::before {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 1px;
background: #e8e8e8;
content: '';
}
main.div_layout aside.series .follow_area {
position: absolute;
top: 0;
left: 20px;
right: 0;
}
main section section.half_layout {
display: table;
width: 100%;
margin-top: 30px;
padding-right: 0;
border-top: 1px solid #171717;
table-layout: fixed;
}
main section section.half_layout article {
display: table-cell;
position: relative;
width: 50%;
padding: 0 20px 0 0;
}
main section section.half_layout article .section_title {
border-top: 0;
}
main section section.half_layout article + article {
padding: 0 0 0 20px;
}
main section section.half_layout article + article::before {
position: absolute;
top: 65px;
bottom: 0;
left: 0;
width: 1px;
background: #e8e8e8;
content: '';
}
main.connect_layout + main.div_layout {
padding-top: 0;
}
main section.section_list + aside::before {
top: 20px;
}
main strong.section_title {
display: block;
position: relative;
padding: 20px 0;
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
border-top: 1px solid #171717;
}
main strong.section_title.no_line {
border-top: 0;
}
main strong.section_title.no_txt {
min-height: 24px;
}
main strong.section_title.no_top {
padding-top: 0;
}
main strong.section_title img {
display: inline-block;
vertical-align: middle;
}
main strong.section_title .btn_more {
box-sizing: border-box;
position: absolute;
right: 0;
font-size: 0;
line-height: 22px;
}
main strong.section_title .btn_more span {
display: inline-block;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 400;
vertical-align: middle;
}
main strong.section_title .btn_more i {
display: inline-block;
width: 6px;
height: 10px;
margin-left: 4px;
line-height: 0;
vertical-align: middle;
}
main strong.section_title .btn_more i svg {
fill: #171717;
fill-opacity: 0.4;
}
main strong.section_title.category {
display: table;
width: 100%;
padding: 14px 0;
table-layout: fixed;
}
main strong.section_title.category span.title {
display: table-cell;
width: 30%;
}
main strong.section_title.category .category_list {
display: table-cell;
width: 70%;
text-align: right;
}
main strong.section_title.category .category_list li {
display: inline-block;
}
main strong.section_title.category .category_list li + li {
margin-left: 6px;
}
main strong.section_title.category .category_list li button {
display: block;
padding: 7px 20px 6px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: #FFF;
transition: .1s;
}
main strong.section_title.category .category_list li.current button,
main strong.section_title.category .category_list li button:hover {
color: #fff;
border-color: #171717;
background: #171717;
}
div.category_content,
div.category_content2,
div.category_content3 {
display: none;
}
div.category_content.current,
div.category_content2.current,
div.category_content3.current {
display: block;
}
main strong.section_title span.count {
display: inline-block;
position: absolute;
right: 0;
color: rgba(23, 23, 23, 0.60);
font-family: Pretendard;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 21px */
}
main strong.section_title span.count em {
display: inline-block;
margin-right: 5px;
}
main strong.section_title span {
display: inline-block;
vertical-align: middle;
}
main strong.section_title em.sub_title {
display: inline-block;
position: relative;
padding-left: 15px;
font-size: 14px;
font-weight: 500;
}
main strong.section_title em.sub_title::before {
position: absolute;
top: 50%;
left: 6px;
width: 1px;
height: 10px;
margin-top: -5px;
background: #171717;
content: '';
}
article.headline .headline_item {
width: 100%;
padding-bottom: 30px;
font-size: 0;
}
article.headline .headline_item + .headline_item {
border-top: 1px solid #e8e8e8;
}
article.headline .headline_item .news_txt {
box-sizing: border-box;
display: inline-block;
width: 40%;
padding-right: 20px;
}
article.headline .headline_item .txt_area {
display: block;
padding-bottom: 20px;
}
article.headline .headline_item .category {
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.headline .headline_item .news_title {
margin-top: 4px;
color: #171717;
font-size: 24px;
font-weight: 500;
line-height: 1.4;
}
article.headline .headline_item .news_title i {
margin: -3px 8px 0 0;
padding: 2px 7px;
font-size: 14px;
}
article.headline .headline_item .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.headline .headline_item .related_list {
padding-top: 20px;
border-top: 1px solid #e8e8e8;
}
article.headline .headline_item .related_list li {
position: relative;
padding-left: 15px;
}
article.headline .headline_item .related_list li + li {
margin-top: 10px;
}
article.headline .headline_item .related_list li::before {
position: absolute;
top: 50%;
left: 6px;
width: 2px;
height: 2px;
margin-top: -2px;
border-radius: 50%;
background: #171717;
content: '';
}
article.headline .headline_item .news_txt .related_list li a {
display: block;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
}
article.headline .headline_item .news_img {
display: inline-block;
position: relative;
width: 60%;
min-height: 346px;
vertical-align: top;
}
article.headline .headline_item .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.headline .headline_item .news_img img {
display: inline-block;
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.headline .headline_item .headline_list {
display: table;
margin-left: -40px;
padding-top: 20px;
}
article.headline .headline_item .headline_list li {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 33.33333%;
padding-left: 40px;
}
article.headline .headline_item .headline_list li::before {
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 1px;
background: #e8e8e8;
content: '';
}
article.headline .headline_item .headline_list li:first-child {
border-left: 0;
}
article.headline .headline_item .headline_list li:first-child:before {
display: none;
}
article.headline .headline_item .headline_list .txt_area {
padding-bottom: 0;
}
article.headline .headline_item .headline_list .news_title {
font-size: 16px;
line-height: 1.4;
}
article.headline_type2 {
box-sizing: border-box;
padding: 0 20px 30px 0;
font-size: 0;
}
article.headline_type2 .news_list {
box-sizing: border-box;
display: inline-block;
width: 48%;
padding-right: 20px;
vertical-align: top;
}
article.headline_type2 .news_list li {
box-sizing: border-box;
display: block;
padding-bottom: 20px;
}
article.headline_type2 .news_list li + li {
padding-top: 20px;
border-top: 1px solid #e8e8e8;
}
article.headline_type2 .news_list li:last-child {
padding-bottom: 0;
}
article.headline_type2 .news_list li a {
display: block;
font-size: 0;
}
article.headline_type2 .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 71px;
vertical-align: top;
}
article.headline_type2 .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.headline_type2 .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.headline_type2 .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
width: 70%;
padding-right: 20px;
vertical-align: top;
}
article.headline_type2 .news_list .news_txt .category {
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.headline_type2 .news_list .news_txt .news_title {
margin-top: 5px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.headline_type2 .news_list .news_txt .news_title i {
margin: -1px 8px 0 0;
}
article.headline_type2 .alone_news {
display: inline-block;
width: 52%;
}
article.headline_type2 .alone_news a {
display: block;
}
article.headline_type2 .alone_news .news_img {
position: relative;
height: 218px;
}
article.headline_type2 .alone_news .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.headline_type2 .alone_news .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.headline_type2 .alone_news .category {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.headline_type2 .alone_news .news_title {
margin-top: 5px;
color: #171717;
font-size: 22px;
font-weight: 500;
line-height: 1.4;
}
article.headline_type2 .alone_news .news_title i {
margin: -3px 8px 0 0;
padding: 2px 7px;
font-size: 14px;
}
article.headline_type2 .alone_news .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.today_news .top_area {
padding-bottom: 30px;
}
article.today_news .top_area .news_list {
display: table;
margin-left: -40px;
}
article.today_news .top_area .news_list li {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 33.33333%;
padding-left: 40px;
vertical-align: top;
}
article.today_news .top_area .news_list li::before {
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 1px;
background: #e8e8e8;
content: '';
}
article.today_news .top_area .news_list li:first-child::before {
display: none;
}
article.today_news .top_area .news_list a {
display: block;
}
article.today_news .top_area .news_list .news_img {
position: relative;
height: 139px;
}
article.today_news .top_area .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.today_news .top_area .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.today_news .top_area .news_list .category {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.today_news .top_area .news_list .news_title {
margin-top: 4px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.today_news .top_area .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.today_news .bottom_area {
padding: 30px 0;
border-top: 1px solid #e8e8e8;
}
article.today_news .bottom_area .div_layout {
display: table;
table-layout: fixed;
width: 100%;
}
article.today_news .bottom_area .div_layout .div_item {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 35.01945525292%;
padding-left: 40px;
vertical-align: top;
}
article.today_news .bottom_area .div_layout .div_item::before {
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 1px;
background: #e8e8e8;
content: '';
}
article.today_news .bottom_area .div_layout .div_item:first-child {
width: 64.98054474708%;
padding-left: 0;
border-left: 0;
}
article.today_news .bottom_area .div_layout .div_item:first-child::before {
display: none;
}
article.today_news .bottom_area .news_list li {
box-sizing: border-box;
display: block;
padding-bottom: 20px;
}
article.today_news .bottom_area .news_list li + li {
padding-top: 20px;
border-top: 1px solid #e8e8e8;
}
article.today_news .bottom_area .news_list li a {
display: block;
font-size: 0;
}
article.today_news .bottom_area .news_list .news_img {
display: inline-block;
position: relative;
width: 33.33333%;
height: 104px;
vertical-align: top;
}
article.today_news .bottom_area .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.today_news .bottom_area .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.today_news .bottom_area .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
width: 66.66666%;
padding-left: 20px;
vertical-align: top;
}
article.today_news .bottom_area .news_list .news_txt .category {
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.today_news .bottom_area .news_list .news_txt .news_title {
margin-top: 5px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.today_news .bottom_area .news_list .news_txt .news_title i {
margin: -1px 8px 0 0;
}
article.today_news .bottom_area .news_list .news_txt .news_text {
margin-top: 5px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.today_news .bottom_area .div_item + .div_item .news_list li {
box-sizing: border-box;
padding: 10px 0;
}
article.today_news .bottom_area .div_item + .div_item .news_list li:first-child {
padding-top: 0;
}
article.today_news .bottom_area .div_item + .div_item .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.today_news .bottom_area .div_item + .div_item .news_list li .category {
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.today_news .bottom_area .div_item + .div_item .news_list li a {
display: block;
margin-top: 4px;
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.4;
}
article.today_news .bottom_area .div_item + .div_item .news_list li a i {
margin: -1px 8px 0 0;
}
article.today_news_type2 .top_area {
padding-bottom: 20px;
font-size: 0;
}
article.today_news_type2 .top_area .news_list {
display: inline-block;
width: 50%;
margin-left: 0;
vertical-align: top;
}
article.today_news_type2 .top_area .news_list li {
display: inline-block;
width: 50%;
padding-left: 20px;
}
article.today_news_type2 .top_area .news_list li::before {
display: none;
}
article.today_news_type2 .top_area .news_list li .news_title {
margin-top: 15px;
}
article.today_news_type2 .news_list .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.today_news_type2 .alone_news {
display: inline-block;
width: calc(50% - 10px);
}
article.today_news_type2 .alone_news a {
display: block;
}
article.today_news_type2 .alone_news .news_img {
position: relative;
height: 200px;
}
article.today_news_type2 .alone_news .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.today_news_type2 .alone_news .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.today_news_type2 .alone_news .category {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.today_news_type2 .alone_news .news_title {
margin-top: 5px;
color: #171717;
font-size: 22px;
font-weight: 500;
line-height: 1.4;
}
article.today_news_type2 .alone_news .news_title i {
margin: -3px 8px 0 0;
padding: 2px 7px;
font-size: 14px;
}
article.today_news_type2 .alone_news .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.today_news_type2 .bottom_area {
padding: 0;
border: 0;
}
article.today_news_type2 .bottom_area .news_list {
margin-left: -20px;
font-size: 0;
}
article.today_news_type2 .bottom_area .news_list li {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 25%;
padding-left: 20px;
vertical-align: top;
}
article.today_news_type2 .bottom_area .news_list li + li {
padding-top: 0;
border: 0;
}
article.today_news_type2 .bottom_area .news_list a {
display: block;
}
article.today_news_type2 .bottom_area .news_list .news_img {
position: relative;
width: 100%;
height: 139px;
}
article.today_news_type2 .bottom_area .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.today_news_type2 .bottom_area .news_list .category {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.today_news_type2 .bottom_area .news_list .news_title {
margin-top: 4px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.today_news_type2 .bottom_area .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.issue .div_layout {
display: table;
width: 100%;
padding-bottom: 30px;
table-layout: fixed;
}
article.issue .div_layout:last-child {
padding-bottom: 0;
}
article.issue .div_layout + .section_title {
border-top: 1px solid #e8e8e8;
}
article.issue .div_layout .div_item {
box-sizing: border-box;
display: table-cell;
width: 50%;
padding: 0 20px 10px 0;
vertical-align: top;
}
article.issue .div_layout .div_item + .div_item {
padding: 0 0 10px 20px;
border-left: 1px solid #e8e8e8;
}
article.issue .div_item a {
display: block;
}
article.issue .news_img {
position: relative;
height: 221px;
}
article.issue .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.issue .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.issue .news_title {
margin-top: 10px;
color: #171717;
font-size: 22px;
font-weight: 500;
line-height: 1.4;
}
article.issue .news_title i {
margin: -4px 8px 0 0;
}
article.issue .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.issue .news_list li {
padding: 20px 0;
}
article.issue .news_list li:first-child {
padding-top: 0;
}
article.issue .news_list li:last-child {
padding-bottom: 0;
}
article.issue .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.issue .news_list a {
font-size: 0;
}
article.issue .news_list a .news_txt {
box-sizing: border-box;
display: inline-block;
width: 68%;
padding-right: 10px;
vertical-align: top;
}
article.issue .news_list a .news_txt .category {
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.issue .news_list a .news_txt .news_title {
margin-top: 0;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.issue .news_list a .news_img {
display: inline-block;
width: 32%;
height: 64px;
vertical-align: top;
}
article.top_news {
padding-bottom: 30px;
}
article.top_news a {
display: block;
}
article.top_news .news_img {
position: relative;
height: 200px;
}
article.headline_type2 + article.top_news .news_img {
height: 218px;
}
article.top_news .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.top_news .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.top_news .category {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.top_news .news_title {
margin-top: 5px;
color: #171717;
font-size: 22px;
font-weight: 500;
line-height: 1.4;
}
article.top_news .news_title i {
margin: -2px 6px 0 0;
}
article.top_news .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.premium_content .btn_premium {
display: block;
position: relative;
}
article.premium_content .btn_premium .news_img {
position: relative;
height: 166px;
}
article.premium_content .btn_premium .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(255, 255, 255, 0.10);
content: '';
}
article.premium_content .btn_premium .news_img::after {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(180deg, rgba(23, 23, 23, 0.10) 0%, rgba(23, 23, 23, 0.30) 50%, rgba(23, 23, 23, 0.70) 70%, rgba(23, 23, 23, 0.90) 100%);
content: '';
}
article.premium_content .btn_premium .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.premium_content .btn_premium .news_text {
position: absolute;
bottom: 16px;
padding: 0 20px;
z-index: 1;
}
article.premium_content .btn_premium .news_title {
margin-top: 2px;
color: #fff;
font-size: 16px;
font-weight: 600;
line-height: 1.40;
}
article.premium_content .btn_premium .category {
color: rgba(255, 255, 255, 0.80);
font-size: 12px;
font-weight: 300;
line-height: 1.5;
}
article.premium_content .btn_premium .category .date {
position: relative;
padding-left: 12px;
}
article.premium_content .btn_premium .category .date::before {
position: absolute;
top: 50%;
left: 5px;
width: 1px;
height: 8px;
margin-top: -4px;
background: rgba(255, 255, 255, 0.60);
content: '';
}
article.premium_content .news_list {
position: relative;
margin-top: 20px;
}
article.premium_content .news_list li {
box-sizing: border-box;
padding: 20px 0;
}
article.premium_content .news_list li:first-child {
padding-top: 0;
}
article.premium_content .news_list li:last-child {
padding-bottom: 0;
}
article.premium_content .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.premium_content .news_list a {
display: block;
}
article.premium_content .news_list .news_wrap {
display: table;
width: 100%;
table-layout: fixed;
}
article.premium_content .news_list a .news_text {
box-sizing: border-box;
display: table-cell;
width: 86%;
padding-right: 16px;
vertical-align: middle;
}
article.premium_content .news_list a .news_text.no_img {
width: 100%;
padding-right: 0;
}
article.premium_content .news_list .news_text .news_title {
margin-top: 0;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.premium_content .news_list a .news_img {
display: table-cell;
width: 44px;
height: 44px;
vertical-align: middle;
}
article.premium_content .news_list a .news_img img {
display: block;
width: 100%;
height: 100%;
border-radius: 30px;
object-fit: cover;
object-position: top;
}
article.premium_content .news_list .category {
margin-top: 4px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.premium_content .news_list .category .date {
position: relative;
padding-left: 12px;
}
article.premium_content .news_list .category .date::before {
position: absolute;
top: 50%;
left: 5px;
width: 1px;
height: 8px;
margin-top: -4px;
background: rgba(23, 23, 23, 0.20);
content: '';
}
article.opinion {
border-top: 1px solid #e8e8e8;
}
article.opinion .news_list li {
box-sizing: border-box;
padding: 16px 0;
}
article.opinion .news_list li:first-child {
padding-top: 0;
}
article.opinion .news_list li:last-child {
padding-bottom: 0;
}
article.opinion .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.opinion .news_list li a {
display: block;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.opinion .news_list li a i {
margin: -2px 4px 0 0;
}
article.hic {
margin-top: 30px;
}
article.hic .news_list li {
padding: 25px 0;
}
article.hic .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.hic .news_list li:last-child {
padding-bottom: 0;
}
article.hic .news_list a {
display: block;
}
article.hic .news_list .category {
display: block;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.hic .news_list .news_title {
box-sizing: border-box;
display: table-cell;
width: 86%;
padding-right: 20px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.hic .news_list .news_title.no_img {
width: 100%;
padding-right: 0;
}
article.hic .news_list .news_img {
display: table-cell;
position: relative;
}
article.hic .news_list .news_img .img_wrap {
display: inline-block;
position: relative;
width: 44px;
height: 44px;
border-radius: 50%;
}
article.hic .news_list .img_wrap::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
border-radius: 50%;
content: '';
}
article.hic .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
object-position: top;
}
article.vote {
box-sizing: border-box;
position: relative;
margin: 30px 0 0;
padding: 20px 20px 0;
border: 1px solid #e8e8e8;
}
.section_list + aside .article.vote {
margin: 30px 0 50px;
}
article.vote .vote_title {
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.vote .vote_subject {
margin-top: 10px;
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
word-break: break-all;
}
article.vote .vote_area {
padding: 20px 0 12px;
}
article.vote .vote_area .vote_item + .vote_item {
margin-top: 10px;
}
article.vote .vote_area .btn_vote_select {
box-sizing: border-box;
position: relative;
display: block;
padding: 12px 50px 14px 20px;
border: 1px solid #e8e8e8;
cursor: pointer;
transition: .1s;
}
article.vote .vote_area .btn_vote_select em {
box-sizing: border-box;
display: block;
color: rgba(23, 23, 23, 0.80);
font-size: 14px;
font-weight: 700;
line-height: 1.5;
word-break: break-all;
}
article.vote .vote_area .btn_vote_select em.vote_count {
margin-top: 5px;
padding: 0;
}
article.vote .vote_area .btn_vote_select:hover, article.vote .vote_area .btn_vote_select.checked {
border: 1px solid #171717;
}
article.vote .vote_area .btn_vote_select:hover em, article.vote .vote_area .btn_vote_select.checked em {
color: #171717;
}
article.vote .vote_area input[type="radio"] {
position: absolute;
top: 50%;
right: 20px;
margin-top: -7px;
transition: .1s;
}
article.vote .vote_area .btn_vote_select:hover input[type="radio"], article.vote .vote_area .btn_vote_select.checked input[type="radio"] {
border: 5px solid #171717;
}
article.vote .vote_area input[type="radio"] {
width: 14px;
height: 14px;
border: 5px solid rgba(23, 23, 23, 0.30);
border-radius: 50px;
appearance: none;
}
article.vote .vote_area input[type="radio"]:checked {
border: 5px solid #171717;
}
article.vote .btn_area {
margin-top: 20px;
text-align: center;
}
article.vote .btn_area .btn_vote {
box-sizing: border-box;
display: block;
width: 100%;
padding: 9px 10px 8px;
color: #FFF;
text-align: center;
font-size: 14px;
font-weight: 700;
line-height: 1.5;
background: #171717;
}
article.vote .btn_area .btn_related {
display: block;
margin-top: 12px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 400;
line-height: 1.0;
}
article.vote .btn_area .btn_related i {
display: inline-block;
width: 6px;
height: 10px;
margin-left: 4px;
vertical-align: middle;
}
article.vote .btn_area .btn_related i svg {
fill: #171717;
fill-opacity: .4;
}
article.vote .vote_area.result {
padding: 20px 0 18px;
}
article.vote .vote_area.result .vote_item + .vote_item {
margin-top: 0;
}
article.vote .vote_area.result .btn_vote_select {
padding: 9px 0 8px;
border: 0;
cursor: auto;
}
article.vote .vote_area.result .btn_vote_select em {
padding-bottom: 20px;
color: #171717;
}
article.vote .vote_area.result .btn_vote_select em.vote_count {
top: auto;
bottom: 20px;
margin: 0;
padding: 0;
}
article.vote .vote_area.result input[type="radio"], article.vote .vote_area.result .btn_vote {
display: none;
}
article.vote .vote_area .vote_count {
display: none;
}
article.vote .vote_area.result .vote_count {
display: block;
position: absolute;
top: 11px;
right: 0;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 500;
line-height: 1.5;
letter-spacing: -0.24px;
}
article.vote .vote_area.result .vote_graph {
display: none;
position: relative;
height: 5px;
margin-top: 6px;
background: #eaeaea;
}
article.vote .vote_area.result .vote_graph {
display: block;
}
article.vote .vote_area.result .vote_graph span {
position: absolute;
top: 0;
left: 0;
bottom: 0;
background: rgba(23, 23, 23, 0.30);
}
article.vote .vote_area.result .btn_vote_select.checked .vote_graph span {
background: #171717;
}
article.serial_news {
position: relative;
margin-top: 30px;
}
article.serial_news .series_swiper {
overflow: hidden;
max-height: 514px;
}
article.serial_news .btn_swiper {
position: absolute;
top: 39px;
right: 0;
}
article.serial_news .swiper-button-next4, article.serial_news .swiper-button-prev4 {
width: 30px;
height: 30px;
border-radius: 20px;
border: 1px solid #DADCDF;
z-index: 2;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
}
article.serial_news .swiper-button-next4 {
right: 0;
left: -32px !important;
}
article.serial_news .swiper-button-prev4 {
right: 0;
left: -68px !important;
}
article.serial_news .swiper-button-next4:after, article.serial_news .swiper-button-prev4:after {
color: #171717;
font-size: 10px;
}
article.serial_news .swiper-button-next4:after {
padding-left: 2px;
}
article.serial_news .swiper-button-prev4:after {
padding-right: 2px;
}
article.serial_news .news_list li {
padding: 20px 0;
}
article.serial_news .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.serial_news .news_list li:first-child {
padding-top: 0;
}
article.serial_news .news_list li:last-child {
padding-bottom: 0;
}
article.serial_news .news_list a {
display: block;
}
article.serial_news .news_list .category {
display: block;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.serial_news .news_list .div_layout {
display: table;
width: 100%;
position: relative;
margin-top: 4px;
table-layout: fixed;
}
article.serial_news .news_list .div_layout .news_title {
box-sizing: border-box;
display: table-cell;
width: 86%;
padding-right: 20px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.serial_news .news_list .div_layout .news_title.no_img {
width: 100%;
padding-right: 0;
}
article.serial_news .news_list .div_layout .news_img {
display: table-cell;
position: relative;
}
article.serial_news .news_list .div_layout .news_img .img_wrap {
display: inline-block;
position: relative;
width: 44px;
height: 44px;
border-radius: 50%;
}
article.serial_news .news_list .div_layout .img_wrap::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
border-radius: 50%;
content: '';
}
article.serial_news .news_list .div_layout .news_img img {
display: block;
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
object-position: top;
}
article.serial_news .news_list2 .div_layout .news_title {
width: 72%;
}
article.serial_news .news_list2 .div_layout .news_img {
width: 28%;
}
article.serial_news .news_list2 .div_layout .news_img .img_wrap {
width: 100%;
height: 48px;
}
article.serial_news .news_list2 .div_layout .news_img::before {
border-radius: 0;
}
article.serial_news .news_list2 .div_layout .news_img img {
border-radius: 0;
}
article.issue_pick {
position: relative;
margin-top: 30px;
}
article.issue_pick .issue_pick_swiper {
overflow: hidden;
}
article.issue_pick .btn_swiper {
position: absolute;
top: 39px;
right: 0;
}
article.issue_pick .swiper-button-next5, article.issue_pick .swiper-button-prev5 {
width: 30px;
height: 30px;
border-radius: 20px;
border: 1px solid #DADCDF;
z-index: 2;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
}
article.issue_pick .swiper-button-next5 {
right: 0;
left: -32px !important;
}
article.issue_pick .swiper-button-prev5 {
right: 0;
left: -68px !important;
}
article.issue_pick .swiper-button-next5:after, article.issue_pick .swiper-button-prev5:after {
color: #171717;
font-size: 10px;
}
article.issue_pick .swiper-button-next5:after {
padding-left: 2px;
}
article.issue_pick .swiper-button-prev5:after {
padding-right: 2px;
}
article.issue_pick .issue_wrap {
box-sizing: border-box;
padding: 20px;
border: 1px solid #e8e8e8;
}
article.issue_pick .issue_wrap .issue_title {
color: #1D9BF0;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.issue_pick .news_list li {
padding: 20px 0;
}
article.issue_pick .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.issue_pick .news_list li:last-child {
padding-bottom: 0;
}
article.issue_pick .news_list a {
display: block;
}
article.issue_pick .news_list .div_layout {
display: block;
}
article.issue_pick .news_list .div_layout .news_text {
box-sizing: border-box;
display: inline-block;
width: 70%;
padding-right: 10px;
}
article.issue_pick .news_list .div_layout .news_title {
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
article.issue_pick .news_list .div_layout .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 48px;
}
article.issue_pick .news_list .div_layout .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.issue_pick .news_list .div_layout .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.category_main {
padding-bottom: 30px;
}
article.category_main .div_fixed {
margin-left: -40px;
}
article.category_main .div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
article.category_main .div_layout .div_item {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 33.33333%;
vertical-align: top;
padding-left: 40px;
}
article.category_main .div_layout .div_item::before {
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 1px;
background: #e8e8e8;
content: '';
}
article.category_main .div_layout .div_item:first-child:before {
display: none;
}
article.category_main .div_layout .div_item:first-child {
border-left: 0;
}
article.category_main .div_layout .div_item:last-child {
padding-right: 0;
}
article.category_main .div_layout .div_item .news_list li {
padding: 20px 0;
border-top: 1px solid #e8e8e8;
}
article.category_main .div_layout .div_item .news_list li:first-child {
padding-top: 0;
border-top: 0;
}
article.category_main .div_layout .div_item a {
display: block;
}
article.category_main .div_layout .div_item .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.category_main .div_layout .div_item .news_title i {
margin: -2px 8px 0 0;
}
article.category_main .div_layout .div_item .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.category_main .div_layout .div_item .news_img {
position: relative;
height: 213px;
}
article.category_main .div_layout .div_item .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.category_main .div_layout .div_item .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.category_main .div_layout .div_item .news_img + .news_title {
margin-top: 10px;
font-size: 22px;
line-height: 1.4;
}
article.category_main_type2 {
}
article.category_main_type2 .news_list {
box-sizing: border-box;
vertical-align: top;
}
article.category_main_type2 .news_list li {
box-sizing: border-box;
display: block;
padding-bottom: 20px;
}
article.category_main_type2 .news_list li + li {
padding-top: 20px;
border-top: 1px solid #e8e8e8;
}
article.category_main_type2 .news_list li:last-child {
padding-bottom: 0;
}
article.category_main_type2 .news_list li a {
display: block;
font-size: 0;
}
article.category_main_type2 .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 71px !important;
vertical-align: top;
}
article.category_main_type2 .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.category_main_type2 .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
width: 70%;
padding-right: 20px;
vertical-align: top;
}
article.category_main_type2 .news_list .news_img + .news_txt {
padding: 0 0 0 20px;
}
article.category_main_type2 .news_list .news_txt .category {
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.category_main_type2 .news_list .news_txt .news_title {
margin-top: 5px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.category_main_type2 .news_list .news_txt .news_title i {
margin: -1px 8px 0 0;
}
article.category_main.category_main_type2 .div_layout .div_item .news_img {
height: 192px;
}
article.category_detail {
width: 1234px;
margin-left: -52px;
}
article.category_detail .category_detail_wrap {
position: relative;
width: 1130px;
margin: 0 auto;
border-top: 1px solid #171717;
}
article.category_detail .div_fixed {
overflow: hidden;
}
article.category_detail .div_layout {
width: 1170px;
}
article.category_detail .swiper-button-next6,
article.category_detail .swiper-button-prev6 {
top: 55% !important;
width: 30px;
height: 30px;
border-radius: 20px;
border: 1px solid #DADCDF;
z-index: 2;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
opacity: 30%;
transition: .3s;
}
article.category_detail:hover .swiper-button-next6,
article.category_detail:hover .swiper-button-prev6 {
opacity: 100%;
}
article.category_detail .swiper-button-next6 {
right: var(--swiper-navigation-sides-offset,-52px);
left: auto;
}
article.category_detail .swiper-button-prev6 {
left: var(--swiper-navigation-sides-offset,-52px);
right: auto;
}
article.category_detail .swiper-button-next6:after,
article.category_detail .swiper-button-prev6:after {
color: #171717;
font-size: 10px;
}
article.category_detail .swiper-button-next6:after {
padding-left: 2px;
}
article.category_detail .swiper-button-prev6:after {
padding-right: 2px;
}
article.category_detail .div_layout .div_item {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 33.33333%;
}
article.category_detail .div_layout .div_item::before {
position: absolute;
top: 64px;
bottom: 0;
left: -20px;
width: 1px;
background: #e8e8e8;
content: '';
}
article.category_detail .div_layout .div_item:first-child:before {
display: none;
}
article.category_detail .div_layout .div_item:last-child {
padding-right: 0;
}
article.category_detail .news_list li {
padding: 20px 0;
}
article.category_detail .news_list li:first-child {
padding-top: 0;
}
article.category_detail .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.category_detail .news_list a {
display: block;
}
article.category_detail .news_list .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.category_detail .news_list li:first-child .news_title {
margin-top: 10px;
}
article.category_detail .news_list .news_title i {
margin: -1px 6px 0 0;
}
article.category_detail .news_list .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.category_detail .news_list .news_img {
position: relative;
height: 213px;
}
article.category_detail .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.category_detail .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.herald_story {
display: table;
width: 100%;
table-layout: fixed;
padding-bottom: 30px;
border-top: 1px solid #CC0000;
}
article.herald_story + .herald_story {
padding-bottom: 0;
}
article.herald_story strong.section_title {
color: #CC0000;
border-top: 0;
}
article.herald_story section strong.section_title::before {
display: none;
}
article.herald_story ul.div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
article.herald_story li.div_item {
display: table-cell;
padding-left: 30px;
vertical-align: top;
}
article.herald_story li.div_item a {
display: block;
}
article.herald_story .div_item:first-child {
width: 52%;
padding-left: 0;
}
article.herald_story .news_img {
position: relative;
height: 228px;
}
article.herald_story .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
article.herald_story li.div_item .channel_info {
box-sizing: border-box;
position: relative;
display: table;
width: 100%;
table-layout: fixed;
padding-right: 70px;
}
article.herald_story li.div_item .channel_info .channel_thumb {
display: table-cell;
width: 34px;
vertical-align: middle;
}
article.herald_story li.div_item .channel_info .channel_thumb img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
border-radius: 50%;
}
article.herald_story li.div_item .channel_info .channel_name {
box-sizing: border-box;
padding-left: 10px;
}
article.herald_story li.div_item .channel_info .channel_name em {
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
article.herald_story li.div_item .channel_info .channel_name span {
display: block;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 400;
line-height: 1.5;
}
article.herald_story li.div_item .channel_info .btn_subscription {
box-sizing: border-box;
position: absolute;
top: 50%;
right: 0;
margin-top: -17px;
padding: 7px 18px 6px;
color: #FFF;
text-align: center;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border: 1px solid #CC0000;
border-radius: 30px;
background: #CC0000;
}
article.herald_story li.div_item .news_list li {
padding: 15px 0;
}
article.herald_story li.div_item .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.herald_story li.div_item .news_list li a {
display: table;
}
article.herald_story li.div_item .news_list li .news_title {
display: table-cell;
width: 70%;
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
vertical-align: top;
}
article.herald_story li.div_item .news_list li .news_img {
box-sizing: border-box;
display: table-cell;
width: 30%;
height: 48px;
padding-left: 10px;
}
article.herald_story li.div_item .news_list li .news_img img {
height: 48px;
object-fit: cover;
}
article.herald_story aside.shorts {
padding: 0;
}
article.herald_story aside.shorts::before {
top: 64px;
}
article.herald_story aside.shorts .section_title {
padding: 20px
}
article.herald_story .swiper_wrap {
position: relative;
}
article.herald_story .shorts_swiper {
box-sizing: border-box;
overflow: hidden;
padding-left: 19.5px;
}
article.herald_story .shorts_list {
width: 100%;
font-size: 0;
}
article.herald_story .shorts_list li {
position: relative;
}
article.herald_story .shorts_list li a {
display: block;
width: 100%;
height: 290px;
}
article.herald_story .shorts_list li a .special_img {
position: relative;
width: 100%;
height: 290px;
}
article.herald_story .shorts_list a .special_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
article.herald_story .swiper-button-next2,
article.herald_story .swiper-button-prev2 {
width: 30px;
height: 30px;
top: 50% !important;
border-radius: 20px;
border: 1px solid #DADCDF;
z-index: 1;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
}
article.herald_story .swiper-button-next2 {
right: var(--swiper-navigation-sides-offset,-16px) !important;
left: auto !important;
}
article.herald_story .swiper-button-prev2 {
left: var(--swiper-navigation-sides-offset,4px);
right: auto;
}
article.herald_story .swiper-button-next2:after, article.herald_story .swiper-button-prev2:after {
color: #171717;
font-size: 10px;
}
article.herald_story .swiper-button-next2:after {
padding-left: 2px;
}
article.herald_story .swiper-button-prev2:after {
padding-right: 2px;
}
article.herald_story + article.herald_story {
border-top: 0;
}
article.herald_story .herald_military .section_title {
color: #8C9320;
border-top: 1px solid #8C9320;
}
article.herald_story .herald_military li.div_item .channel_info .btn_subscription {
border-color: #8C9320;
background: #8C9320;
}
article.herald_story aside.leader::before {
top: 64px;
}
article.herald_story aside.leader strong.section_title {
color: #171717;
border-top: 1px solid #171717;
}
article.herald_story aside.leader .leader_list {
font: 0;
}
article.herald_story aside.leader .leader_list li {
box-sizing: border-box;
display: inline-block;
width: 50%;
margin-bottom: -1px;
vertical-align: middle;
text-align: center;
}
article.herald_story aside.leader .leader_list li a {
display: block;
position: relative;
height: 70px;
}
article.herald_story aside.leader .leader_list li a:hover img {
transform: translate(-50%,-50%) scale(1.1)
}
article.herald_story aside.leader .leader_list li a::after {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
border: 1px solid #e8e8e8;
content: '';
}
article.herald_story aside.leader .leader_list li:nth-child(even) a::after {
left: -1px;
}
article.herald_story aside.leader .leader_list li a img {
max-width: 70%;
max-height: 60%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: .1s;
}
article.other_service {
border-top: 1px solid #171717;
}
article.other_service strong.section_title {
border-top: 0;
}
article.other_service .div_fixed {
margin-left: -40px;
}
article.other_service .div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
article.other_service .div_item {
display: table-cell;
position: relative;
width: 33.33333%;
padding-left: 40px;
}
article.other_service .div_item::before {
position: absolute;
top: 64px;
left: 20px;
bottom: 0;
width: 1px;
background: #e8e8e8;
content: '';
}
article.other_service .div_item:first-child::before {
display: none;
}
article.other_service .news_list li {
padding: 20px 0;
}
article.other_service .news_list li:first-child {
padding-top: 0;
}
article.other_service .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.other_service .news_list a {
display: block;
}
article.other_service .news_list .news_title {
margin-top: 10px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.other_service .news_list .news_title i {
margin: -2px 6px 0 0;
}
article.other_service .news_list .category {
display: block;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.other_service .news_list .category + .news_title {
margin-top: 4px;
}
article.other_service .news_list .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.other_service .news_list .news_img {
position: relative;
height: 196px;
}
article.other_service .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.other_service .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.other_service .news_list .news_img + .category {
margin-top: 10px;
}
article.other_service .pop_list li {
padding: 19px 0;
}
article.other_service .pop_list a {
display: block;
font-size: 0;
}
article.other_service .pop_list a .news_txt {
box-sizing: border-box;
display: inline-block;
width: 68%;
padding-right: 10px;
vertical-align: top;
}
article.other_service .pop_list a .news_img {
display: inline-block;
width: 32%;
height: 64px;
vertical-align: top;
}
article.other_service .pop_list a .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.notice .notice_list {
display: table;
width: 100%;
margin-left: -40px;
table-layout: fixed;
}
article.notice .notice_list li {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 25%;
padding: 0 0 10px 40px;
}
article.notice .notice_list li + li::before {
position: absolute;
left: 20px;
top: 0;
bottom: 0;
width: 1px;
background: #e8e8e8;
content: '';
}
article.notice .notice_list li a {
display: block;
}
article.notice .notice_list .date {
display: block;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.notice .notice_list .notice_title {
margin-top: 4px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
word-break: break-all;
}
/* section main */
main.section_main {
position: relative;
max-width: 100%;
margin-top: 0;
padding: 50px 0;
text-align: center;
background-size: cover;
}
main.section_main::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(23, 23, 23, 0.60);
-webkit-backdrop-filter: blur(400px);
backdrop-filter: blur(400px);
content: '';
}
main.section_main + main {
padding-top: 0;
}
main.section_main + main strong.section_title {
padding: 25px 0;
}
main.section_main .section_top {
display: inline-block;
max-width: 1130px;
font-size: 0;
word-break: break-all;
}
main.section_main .section_top a {
display: block;
position: relative;
z-index: 1;
font-size: 0;
text-align: left;
}
main.section_main .section_top .news_txt {
box-sizing: border-box;
display: inline-block;
width: 52%;
padding-right: 40px;
text-align: left;
}
main.section_main .section_top a.no_img {
padding: 20px 0;
}
main.section_main .section_top a.no_img .news_txt {
width: 100%;
padding-right: 0;
}
main.section_main .section_top .news_txt .category {
color: rgba(255, 255, 255, 0.50);
font-family: Pretendard;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
main.section_main .section_top .news_txt .news_title {
color: #FFF;
font-size: 28px;
font-weight: 500;
line-height: 1.4;
}
main.section_main .section_top .news_txt .news_text {
margin-top: 10px;
color: rgba(255, 255, 255, 0.50);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
main.section_main .section_top .news_img {
overflow: hidden;
display: inline-block;
position: relative;
width: 48%;
height: 330px;
vertical-align: top;
}
main.section_main .section_top .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
main.section_main .section_top .news_img img {
display: inline-block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
main.section_main .section_top .div_fixed {
margin-left: -40px;
}
main.section_main .section_top .div_layout {
display: table;
width: 100%;
table-layout: fixed;
font-size: 0;
}
main.section_main .section_top .div_layout .news_img {
max-height: 290px;
}
main.section_main .section_top .div_layout .div_item {
display: table-cell;
width: 70%;
padding-left: 40px;
vertical-align: top;
}
main.section_main .section_top .div_layout .div_item + .div_item {
display: table-cell;
position: relative;
width: 30%;
}
main.section_main .section_top .div_layout .div_item + .div_item::before {
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 1px;
background: rgba(232, 232, 232, 0.20);
content: '';
}
main.section_main .section_top .div_layout.type2 .div_item {
width: 33.33333%;
padding-left: 40px;
}
main.section_main .section_top .div_layout.type2 .div_item + .div_item {
width: 33.33333%;
}
main.section_main .section_top .div_layout.type2 .link_type2 .news_img {
height: 220px;
}
main.section_main .section_top .link_type2 .news_img {
overflow: hidden;
display: inline-block;
position: relative;
width: 100%;
height: 200px;
vertical-align: top;
}
main.section_main .section_top .link_type2 .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
main.section_main .section_top .link_type2 .news_img img {
display: inline-block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
main.section_main .section_top .link_type2 .news_title {
margin-top: 10px;
color: #FFF;
font-size: 22px;
font-weight: 500;
line-height: 1.4;
}
main.section_main .section_top .news_list {
position: relative;
margin-top: 20px;
padding-top: 20px;
}
main.section_main .section_top .news_list::before {
position: absolute;
top: 0;
left: 40px;
right: 0;
height: 1px;
background: rgba(232, 232, 232, 0.20);
content: '';
}
main.section_main .section_top .div_item .news_list::before {
display: none;
}
main.section_main .section_top .news_list li {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 33.33333%;
padding-left: 40px;
}
main.section_main .section_top .news_list li::before {
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 1px;
background: rgba(232, 232, 232, 0.20);
content: '';
}
main.section_main .section_top .div_item .news_list li::before {
display: none;
}
main.section_main .section_top .news_list li:first-child:before {
display: none;
}
main.section_main .section_top .news_list a {
display: table;
width: 100%;
table-layout: fixed;
}
main.section_main .section_top .news_list a .news_txt {
box-sizing: border-box;
display: table-cell;
width: 68%;
padding: 5px 10px 5px 0;
vertical-align: top;
}
main.section_main .section_top .news_list a .news_txt .category {
color: rgba(255, 255, 255, 0.50);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
main.section_main .section_top .news_list a .news_txt .news_title {
margin-top: 0;
color: #fff;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
main.section_main .section_top .news_list a .news_img {
display: table-cell;
width: 32%;
height: 64px;
vertical-align: top;
}
main.section_main .section_top .div_layout .news_list {
margin-top: 0;
padding-top: 0;
border-top: 0;
}
main.section_main .section_top .div_layout .news_list li {
width: 100%;
padding: 20px 0;
}
main.section_main .section_top .div_layout .news_list li:first-child {
padding-top: 0;
}
main.section_main .section_top .div_layout .news_list li:last-child {
padding-bottom: 0;
}
main.section_main .section_top .div_layout .news_list li + li {
border-top: 1px solid rgba(232, 232, 232, 0.20);
border-left: 0;
}
/* sub_main */
main.sub_main {
max-width: 100%;
margin-top: 0;
padding: 40px 0;
text-align: center;
background: #F0F0F0;
}
main.sub_main .keyword {
margin-top: 30px;
}
main.sub_main .keyword .keyword_title {
display: inline-block;
color: #171717;
font-size: 17px;
font-weight: 500;
line-height: 1.6;
vertical-align: middle;
}
main.sub_main .keyword .keyword_list {
display: inline-block;
padding-left: 20px;
}
main.sub_main .keyword .keyword_list li {
box-sizing: border-box;
display: inline-block;
border: 1px solid #DADCDF;
border-radius: 25px;
vertical-align: middle;
background: #FFF;
}
main.sub_main .keyword li + li {
margin-left: 6px;
}
main.sub_main .keyword .keyword_list li a {
display: block;
padding: 6px 20px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
}
main.sub_main .issue_pick {
display: inline-block;
text-align: center;
}
main.sub_main .issue_pick .ico {
display: inline-block;
padding: 0 20px;
color: #FFF;
font-size: 30px;
font-weight: 700;
line-height: 1.4;
border-radius: 25px;
background: #171717;
}
main.sub_main .issue_pick .issue_name {
display: block;
margin-top: 15px;
color: #045A95;
font-size: 32px;
font-weight: 800;
line-height: 1.4;
}
main.sub_main .issue_pick .issue_text {
color: #171717;
font-size: 18px;
font-weight: 500;
line-height: 1.6;
}
main.sub_main .search .search_info {
color: #171717;
font-size: 32px;
font-weight: 800;
line-height: 1.4;
}
main.sub_main .search .search_section {
padding: 25px 0 15px;
}
main.sub_main .search .search_bar {
position: relative;
max-width: 645px;
margin: 0 auto;
}
main.sub_main .search .search_bar .search_inp {
box-sizing: border-box;
display: block;
width: 100%;
height: 60px;
padding: 0 70px 0 20px;
color: #171717;
font-size: 22px;
font-weight: 700;
border-bottom: 2px solid #171717;
vertical-align: middle;
transition: .1s;
background: transparent;
}
main.sub_main .search .search_bar .search_inp::-webkit-input-placeholder {
color:rgba(23, 23, 23, 0.40);
font-weight: 300;
}
main.sub_main .search .search_bar .search_inp:-ms-input-placeholder {
color:rgba(23, 23, 23, 0.40);
}
main.sub_main .search .search_bar .search_inp:focus {
border-color: #1d9bf0
}
main.sub_main .search .search_bar .search_inp:focus + .btn_search svg {
fill: #1d9bf0
}
main.sub_main .search .search_bar .btn_search {
display: block;
position: absolute;
top: 0;
right: 0;
width: 56px;
height: 60px;
text-align: center;
cursor: pointer;
background: transparent;
}
main.sub_main .search .search_bar .btn_search svg {
display: inline-block;
width: 36px;
fill: #171717;
transition: .1s;
}
/* view */
main.view {
position: relative;
max-width: 100%;
margin-top: 70px;
padding: 40px 0;
text-align: center;
background-size: cover;
}
main.view::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(23, 23, 23, 0.60);
-webkit-backdrop-filter: blur(400px);
backdrop-filter: blur(400px);
content: '';
}
main.view .view_top {
display: inline-block;
position: relative;
width: 100%;
max-width: 1130px;
font-size: 0;
text-align: left;
word-break: break-all;
}
main.view .view_top .news_title {
box-sizing: border-box;
width: 70%;
padding: 0 20px 0 20%;
}
main.view .view_top .category {
color: rgba(255, 255, 255, 0.60);
font-size: 14px;
font-weight: 600;
line-height: 1.4;
}
main.view .view_top .category a {
position: relative;
}
main.view .view_top .category a + a {
padding-left: 16px;
font-weight: 400;
}
main.view .view_top .category a + a::before {
position: absolute;
top: 50%;
left: 7px;
width: 1px;
height: 10px;
margin-top: -5px;
background: rgba(255, 255, 255, 0.60);
content: '';
}
main.view .view_top h1 {
margin: 10px 0 0;
padding: 0;
color: #fff;
font-size: 34px;
font-weight: 600;
line-height: 1.4;
word-break: keep-all;
}
main.view .view_top .date {
margin-top: 30px;
color: rgba(255, 255, 255, 0.60);
font-size: 13px;
font-weight: 400;
line-height: 1.5;
}
main.view .view_top .date .modify {
display: inline-block;
margin-left: 16px;
}
main.view .view_top .btn_area {
position: relative;
margin-top: 20px;
padding-top: 20px;
border-top: 1px solid rgba(255, 255, 255, 0.20);
text-align: right;
}
main.view .view_top .btn_area .sympathy_list {
position: absolute;
top: 20px;
left: 0;
font-size: 0;
}
main.view .view_top .btn_area .sympathy_list li {
display: inline-block;
}
main.view .view_top .btn_area .sympathy_list li + li {
margin-left: 20px;
}
main.view .view_top .btn_area .sympathy_list li em.ico_sympathy {
display: inline-block;
vertical-align: middle;
}
main.view .view_top .btn_area .sympathy_list li em.ico_sympathy svg {
display: block;
width: 20px;
height: 20px;
fill: #fff;
}
main.view .view_top .btn_area .sympathy_list li span.count {
display: inline-block;
padding-left: 8px;
color: #FFF;
font-size: 13px;
font-weight: 400;
line-height: 1.2;
letter-spacing: -0.26px;
vertical-align: middle;
}
main.view .view_top .btn_area .btn_list li {
position: relative;
display: inline-block;
}
main.view .view_top .btn_area .btn_list li + li {
margin-left: 15px;
}
.btn_list li .pop_share_wrap {
box-sizing: border-box;
display: none;
position: absolute;
top: 40px;
right: -37px;
width: 224px;
padding: 30px 20px;
z-index: 1;
border: 1px solid #ccc;
background: rgba(255,255,255,.9);
backdrop-filter: blur(7px);
}
.btn_list li .pop_share_wrap .pop_share .btn_del {
position: absolute;
top: 10px;
right: 10px;
width: 15px;
height: 15px;
}
.btn_list li .pop_share_wrap .pop_share .btn_del i {
display: block;
width: 16px;
height: 16px;
}
.btn_list li .pop_share_wrap .pop_share .btn_del i::before, .btn_list li .pop_share_wrap .pop_share .btn_del i::after {
position: absolute;
left: 8px;
width: 1px;
height: 16px;
background: #111;
content: '';
}
.btn_list li .pop_share_wrap .pop_share .btn_del i:before {
transform: rotate(45deg);
}
.btn_list li .pop_share_wrap .pop_share .btn_del i:after {
transform: rotate(-45deg);
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list {
font-size: 0;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list + .pop_share_list {
margin-top: 16px;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li {
display: inline-block;
position: relative;
width: 33.33333%;
text-align: center;
vertical-align: top;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li + li {
margin-left: 0;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item {
position: relative;
display: inline-block;
width: 40px;
height: 40px;
border-radius: 30px;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item svg {
display: inline-block;
width: 30px;
height: 30px;
transition: .2s;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item {
background: #666;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li:first-child .btn_share_item.btn_clip svg {
width: 28px;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_reddit {
background: #ff4500
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_twitter {
background: #171717;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_facebook {
background: #0866ff;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_kakao {
background: #fae102;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_kakao svg {
margin-left: 1px;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_linked {
background: #0073b1;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item:hover svg {
transform: scale(1.2);
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .toast_pop {
display: none;
position: absolute;
top: 0px;
left: 50%;
width: 40px;
height: 40px;
margin-left: -20px;
border-radius: 40px;
background: #666;
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .toast_pop .toast_text {
box-sizing: border-box;
position: absolute;
top: 44px;
left: 50%;
width: 80px;
margin-left: -40px;
padding: 5px;
color: #fff;
font-size: 12px;
background: rgba(0,0,0,0.5);
}
.btn_list li .pop_share_wrap .pop_share .pop_share_list li .toast_pop .link_copied {
animation: 0.34s cubic-bezier(0.65, 0, 1, 1) 0.1s forwards copied;
stroke-dasharray: 0, 75px;
stroke-linecap: round;
stroke-linejoin: round;
}
main.view .view_top .btn_area .btn_list li button.btn_bookmark svg {
width: 18px;
height: 18px;
fill: transparent;
}
main.view .view_top .btn_area .btn_list li .btn_bookmark:hover svg,
main.view .view_top .btn_area .btn_list li .btn_bookmark.bookmark_on svg {
fill: #fff;
}
.btn_list li .btn_bookmark + .toast_pop_bookmark {
display: none;
position: absolute;
top: 28px;
left: 50%;
margin-left: -75px;
}
.btn_list li .btn_bookmark + .toast_pop_bookmark .toast_bookmark_text {
box-sizing: border-box;
width: 150px;
padding: 5px;
color: #fff;
font-size: 12px;
line-height: 1.2;
text-align: center;
background: rgba(0,0,0,0.5);
}
@keyframes copied {
from {
stroke-dasharray: 0, 75px;
}
to {
stroke-dasharray: 75px, 75px;
}
}
.btn_list li .pop_share_wrap.pop_font {
right: -111px;
width: 224px;
}
.btn_list li .pop_font .pop_share .btn_del2 {
position: absolute;
top: 10px;
right: 10px;
width: 15px;
height: 15px;
}
.btn_list li .pop_font .pop_share .btn_del2 i {
display: block;
width: 16px;
height: 16px;
}
.btn_list li .pop_font .pop_share .btn_del2 i::before, .btn_list li .pop_font .pop_share .btn_del2 i::after {
position: absolute;
left: 8px;
width: 1px;
height: 16px;
background: #111;
content: '';
}
.btn_list li .pop_font .pop_share .btn_del2 i:before {
transform: rotate(45deg);
}
.btn_list li .pop_font .pop_share .btn_del2 i:after {
transform: rotate(-45deg);
}
.btn_list li .pop_share_wrap .pop_share .pop_font_list li {
display: inline-block;
position: relative;
width: 25%;
text-align: center;
vertical-align: top;
}
.btn_list li .pop_share_wrap .pop_share .pop_font_list li + li {
margin-left: 0;
}
.btn_list li .pop_share_wrap .pop_share .pop_font_list li .btn_share_item {
position: relative;
display: inline-block;
width: 40px;
height: 40px;
border-radius: 30px;
border: 1px solid rgba(0, 0, 0, 0.1);
transition: .2s;
}
.btn_list li .pop_share_wrap .pop_share .pop_font_list li .btn_share_item svg {
display: inline-block;
width: 30px;
height: 30px;
fill: #171717;
vertical-align: middle;
transition: .2s;
}
.btn_list li .pop_share_wrap .pop_share .pop_font_list li .btn_share_item:hover {
background: rgba(0, 0, 0, 0.8);
}
.btn_list li .pop_share_wrap .pop_share .pop_font_list li .btn_share_item:hover svg {
fill: #fff;
}
main.view .view_top .btn_area .btn_list li button {
display: block;
width: 22px;
height: 22px;
background: transparent;
}
main.view .view_top .btn_area .btn_list li button svg {
display: inline-block;
width: 22px;
height: 22px;
fill: #fff;
vertical-align: middle;
transition: .1s;
}
main.view .view_top .btn_area .btn_list li button.on svg {
fill: #1d9bf0;
}
main.view .view_top .btn_area .btn_list li button.small_font svg {
width: 18px;
height: 18px;
}
main section.section_view {
position: relative;
width: 50%;
}
main section.section_view + aside.view_aside::before {
display: none;
}
main section.section_view + aside.view_aside article.premium_content strong.section_title {
padding-top: 0;
}
main section.section_editor {
position: relative;
width: 20%;
}
main section.section_editor .editor {
position: absolute;
top: 0;
}
main section.section_editor .editor .editor_info {
box-sizing: border-box;
width: 180px;
padding: 20px 10px;
border: 1px solid #e8e8e8;
text-align: center;
background: #fff;
}
main section.section_editor .editor .editor_img {
display: inline-block;
position: relative;
width: 60px;
height: 60px;
vertical-align: top;
}
main section.section_editor .editor .editor_img img {
width: 100%;
max-height: 60px;
border-radius: 50px;
object-fit: contain;
}
main section.section_editor .editor .editor_img::before {
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
width: 60px;
height: 60px;
border-radius: 50px;
border: 1px solid rgba(0, 0, 0, 0.1);
content: '';
}
main section.section_editor .editor .editor_name {
display: block;
margin-top: 10px;
color: #171717;
text-align: center;
font-size: 14px;
font-weight: 600;
line-height: 1.2;
word-break: break-all;
}
main section.section_editor .editor .editor_word {
margin-top: 6px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 500;
line-height: 1.2;
word-break: break-all;
}
main section.section_editor .editor .editor_subscribe {
margin-top: 12px;
}
main section.section_editor .editor .editor_subscribe button {
box-sizing: border-box;
display: inline-block;
padding: 6px 14px 5px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
main section.section_editor .editor .editor_subscribe button:hover,
main section.section_editor .editor .editor_subscribe button.subscribe {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
main section.section_editor .editor .editor_info_list .editor_info {
padding: 15px;
}
main section.section_editor .editor .editor_info_list .editor_info + .editor_info {
margin-top: 10px;
}
main section.section_editor .editor .editor_info_list .editor_info .info_wrap {
display: table;
width: 100%;
table-layout: fixed;
}
main section.section_editor .editor .editor_info_list .editor_info .editor_img {
display: table-cell;
width: 60px;
height: 60px;
}
main section.section_editor .editor .editor_info_list .editor_info .editor_img::before {
width: 60px;
height: 60px;
}
main section.section_editor .editor .editor_info_list .editor_info .editor_img img {
max-height: 60px;
}
main section.section_editor .editor .editor_info_list .editor_info .editor_name {
box-sizing: border-box;
display: table-cell;
padding-left: 10px;
text-align: left;
vertical-align: middle;
}
main section.section_editor .editor .editor_info_list .editor_info .editor_name a {
display: block;
text-align: left;
word-break: break-all;
}
main section.section_editor .editor .editor_info_list .editor_info .editor_word {
margin-top: 10px;
text-align: left;
}
main section.section_editor .editor .editor_info_list .editor_info .editor_subscribe {
margin-top: 5px;
}
main section.section_editor .editor .editor_info_list .editor_info .editor_subscribe button {
padding: 6px 12px;
font-size: 12px;
}
article.news_content {
width: 100%;
max-width: 600px;
margin: 0 auto;
}
article.news_content .summary_area {
box-sizing: border-box;
padding-left: 18px;
border-left: 4px solid #171717;
}
article.news_content .summary_area .news_summary {
color: #171717;
font-size: 18px;
font-weight: 500;
line-height: 1.7;
letter-spacing: -0.38px;
}
article.news_content .news_img {
box-sizing: border-box;
padding: 40px 0;
object-fit: cover;
object-position: top;
}
article.news_content .news_img img {
display: block;
width: 100%;
}
article.news_content .news_img .img_caption {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.news_content .news_txt {
color: #171717;
font-size: 18px;
font-weight: 400;
line-height: 1.7;
word-break: break-all;
}
article.news_content .news_txt + .news_txt {
margin-top: 40px;
}
article.news_content .by_line {
padding-top: 40px;
}
article.news_content .by_line .editor_info {
color: #171717;
font-size: 18px;
font-weight: 400;
line-height: 1.7;
}
article.news_content .by_line .editor_info em {
font-weight: 700;
}
article.news_content .by_line .editor_info + .editor_info {
margin-top: 5px;
}
article.news_content .pop_join {
box-sizing: border-box;
position: relative;
background: #333;
border-radius: 15px;
text-align: center;
padding: 30px 50px;
word-break: keep-all;
margin-top: -60px;
}
article.news_content .pop_join::before {
content: "";
position: absolute;
top: -80px;
left: 0;
width: 100%;
height: 80px;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, rgba(255, 255, 255, .9) 50%, rgba(255, 255, 255, 1) 100%);
}
article.news_content .pop_join .pop_join_title {
color: #fff;
text-align: center;
font-size: 28px;
font-weight: 400;
line-height: 1.3;
letter-spacing: 0.75px;
}
article.news_content .pop_join .pop_join_title + .pop_join_title {
color: #1D9BF0;
font-weight: 600;
}
article.news_content .pop_join .pop_join_btn {
width: 150px;
margin-top: 20px;
color: var(--Color, #FFF);
text-align: center;
font-family: Pretendard;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 24px */
padding: 10px 0;
border-radius: 22px;
border: 1px solid #1D9BF0;
background: rgba(29, 155, 240, .9);
backdrop-filter: blur(150px);
-webkit-backdrop-filter: blur(150px);
display: inline-block;
vertical-align: top;
margin-top: 20px;
}
article.news_content .pop_join .pop_join_sub {
margin-top: 20px;
color: rgba(255, 255, 255, .6);
font-size: 16px;
font-weight: 200;
line-height: 1.5;
letter-spacing: -0.16px;
}
article.news_content .pop_join .pop_join_btn_2 {
box-sizing: border-box;
display: inline-block;
margin-top: 12px;
padding: 5px 5px 5px 15px;
border: 1px solid #fff;
border-radius: 25px;
font-size: 0;
vertical-align: middle;
}
article.news_content .pop_join .pop_join_btn_2 span {
display: inline-block;
color: #FFF;
font-size: 13px;
font-weight: 400;
line-height: 1;
vertical-align: middle;
}
article.news_content .pop_join .pop_join_btn_2 i {
display: inline-block;
vertical-align: middle;
}
article.news_content .pop_join .pop_join_btn_2 i svg {
width: 15px;
height: 15px;
}
article.news_content .pop_join .language{position:absolute; bottom: 33px; right: 34px;}
article.news_content .pop_join .language_earth{width:16px; height:16px; fill:#fff; display:inline-block; vertical-align:middle; margin-top:1px}
article.news_content .pop_join .language_select{position:relative; width:auto; height:20px; display:inline-block; vertical-align:middle;}
article.news_content .pop_join .language_select select{width:100%; height:100%; padding:0 10px 0 5px; font-size:12px; font-weight:300; color:#fff; line-height:20px; letter-spacing:-0.5px; background: transparent}
article.news_content .pop_join .language_select select option {color:#171717}
article.news_content .pop_join .language_select svg{position:absolute; top:7px; right:0; width:7px; height:7px; fill:#fff}
article.news_content .tag_list {
padding: 40px 0;
font-size: 0;
}
article.news_content .tag_list li {
display: inline-block;
margin: 0 6px 10px 0;
}
article.news_content .tag_list li a {
display: block;
padding: 0 14px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 32px;
border: 1px solid #e8e8e8;
border-radius: 25px;
}
article.by_line {
border: 1px solid #171717;
border-width: 1px 0;
padding: 25px 0;
}
article.by_line .by_line_warp {
box-sizing: border-box;
display: table;
width: 100%;
padding-bottom: 20px;
table-layout: fixed;
}
article.by_line .by_line_warp + .by_line_warp {
padding-top: 20px;
border-top: 1px solid #e8e8e8;
}
article.by_line .by_line_warp:last-child {
padding-bottom: 0;
}
article.by_line .profile {
box-sizing: border-box;
display: table-cell;
width: 32%;
padding: 0 20px;
}
article.by_line .profile a {
display: table;
width: 100%;
table-layout: fixed;
}
article.by_line .profile .editor_img {
display: table-cell;
position: relative;
width: 40px;
height: 40px;
vertical-align: middle;
}
article.by_line .profile .editor_img img {
width: 100%;
max-height: 40px;
border-radius: 40px;
object-fit: contain;
}
article.by_line .profile .editor_img::before {
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
border-radius: 50px;
border: 1px solid rgba(0, 0, 0, 0.1);
content: '';
}
article.by_line .profile .editor_name {
box-sizing: border-box;
display: table-cell;
padding-left: 10px;
color: #171717;
font-size: 15px;
font-weight: 600;
line-height: 1.2;
vertical-align: middle;
word-break: break-all;
}
article.by_line .profile .editor_contact {
margin-top: 20px;
font-size: 0;
text-align: center;
}
article.by_line .profile .editor_contact li {
display: inline-block;
vertical-align: middle;
}
article.by_line .profile .editor_contact li + li {
margin-left: 6px;
}
article.by_line .profile .editor_contact li a {
box-sizing: border-box;
display: block;
position: relative;
width: 44px;
height: 32px;
border-radius: 22px;
border: 1px solid #DADCDF;
background: rgba(217, 217, 217, 0.08);
}
article.by_line .profile .editor_contact li a svg {
display: inline-block;
position: absolute;
top: 50%;
left: 50%;
width: 16px;
height: 13px;
margin: -7px 0 0 -8px;
fill: #171717;
}
article.by_line .profile .editor_contact li a:hover {
border-color: #1D9BF0;
background: #1D9BF0;
}
article.by_line .profile .editor_contact li a:hover svg {
fill: #fff;
}
article.by_line .profile .editor_contact li button {
box-sizing: border-box;
display: block;
min-width: 60px;
padding: 6px 12px;
color: #171717;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.by_line .profile .editor_contact li button:hover,
article.by_line .profile .editor_contact li button.subscribe {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
article.by_line .editor_news {
box-sizing: border-box;
display: table-cell;
width: 68%;
padding-right: 20px;
vertical-align: top;
}
article.by_line .editor_news .news_list li {
box-sizing: border-box;
padding: 10px 0;
}
article.by_line .editor_news .news_list li:first-child {
padding-top: 0;
}
article.by_line .editor_news .news_list li:last-child {
padding-bottom: 0;
}
article.by_line .editor_news .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.by_line .editor_news .news_list li a {
display: block;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
}
article.series_navigation {
margin-bottom: 30px;
border: 1px solid #171717;
}
article.series_navigation .series_info {
box-sizing: border-box;
display: table;
width: 100%;
padding: 20px;
table-layout: fixed;
background: rgba(248, 248, 248, 0.80);
}
article.series_navigation .series_info a {
display: inline-block;
}
article.series_navigation .series_img {
display: table-cell;
width: 60px;
}
article.series_navigation .series_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.series_navigation .series_txt {
box-sizing: border-box;
display: table-cell;
padding-left: 20px;
vertical-align: middle;
}
article.series_navigation .series_txt .series_title {
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.series_navigation .series_txt .series_text {
box-sizing: border-box;
margin-top: 2px;
padding-right: 20px;
color: rgba(23, 23, 23, 0.80);
font-size: 13px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.26px;
}
article.series_navigation .series_btn {
display: table-cell;
position: relative;
width: 80px;
vertical-align: middle;
}
article.series_navigation .series_btn button {
box-sizing: border-box;
display: inline-block;
position: absolute;
top: 16px;
padding: 6px 14px 5px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.series_navigation .series_btn button:hover, article.series_navigation .series_btn button.subscribe {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
article.series_navigation .btn_series {
box-sizing: border-box;
padding: 20px;
}
article.series_navigation .btn_series li {
padding: 0 0 20px 0;
}
article.series_navigation .btn_series li + li {
padding: 20px 0 0 0;
border-top: 1px solid #e8e8e8;
}
article.series_navigation .btn_series li a {
display: block;
}
article.series_navigation .btn_series li a em {
display: table-cell;
width: 12%;
text-align: center;
vertical-align: middle;
}
article.series_navigation .btn_series li a span {
display: inline-block;
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.4;
vertical-align: middle;
}
article.series_navigation .btn_series li a em svg {
display: inline-block;
width: 24px;
height: 24px;
vertical-align: middle;
fill: #171717;
}
article.series_navigation .btn_series li a .news_title {
box-sizing: border-box;
padding: 0 20px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
vertical-align: middle;
}
article.sympathy {
padding-bottom: 25px;
border: 1px solid #e8e8e8;
border-width: 1px 0 0;
}
article.sympathy .sympathy_tltle {
display: block;
padding: 40px 0;
color: #171717;
font-size: 15px;
font-weight: 600;
text-align: center;
}
article.sympathy .sympathy_list {
box-sizing: border-box;
display: table;
width: 100%;
padding: 0 40px;
table-layout: fixed;
}
article.sympathy .sympathy_list li {
display: table-cell;
position: relative;
width: 25%;
}
article.sympathy .sympathy_list li:last-child::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 1px;
background: #e8e8e8;
content: '';
}
article.sympathy .btn_sympathy {
display: block;
width: 100%;
background: transparent;
}
article.sympathy .ico_sympathy {
display: inline-block;
width: 100%;
max-width: 34px;
}
article.sympathy .ico_sympathy svg {
display: block;
width: 34px;
height: 34px;
fill: #171717;
fill-opacity: .4;
}
article.sympathy .sympathy_list li span {
display: block;
color: rgba(23, 23, 23, 0.80);
font-size: 14px;
line-height: 1.4;
word-break: break-all;
}
article.sympathy span.txt {
margin-top: 8px;
font-weight: 400;
}
article.sympathy span.count {
margin-top: 2px;
font-weight: 600;
}
article.sympathy .btn_sympathy:hover .ico_sympathy svg .ico_black,
article.sympathy li.on .btn_sympathy .ico_sympathy svg .ico_black {
fill-opacity: 1;
}
article.sympathy .btn_sympathy .ico_sympathy svg .ico_yellow {
fill: transparent;
}
article.sympathy .btn_sympathy:hover .ico_sympathy svg .ico_yellow,
article.sympathy li.on .btn_sympathy .ico_sympathy svg .ico_yellow {
fill: #FBD771;
fill-opacity: 1;
}
article.sympathy .btn_sympathy .ico_sympathy svg .ico_red {
fill: transparent;
}
article.sympathy .btn_sympathy:hover .ico_sympathy svg .ico_red,
article.sympathy li.on .btn_sympathy .ico_sympathy svg .ico_red {
fill: #EE6173;
fill-opacity: 1;
}
article.sympathy .btn_sympathy:hover .ico_sympathy svg .ico_blue,
article.sympathy li.on .btn_sympathy .ico_sympathy svg .ico_blue {
fill: #1BA2DA;
fill-opacity: 1;
}
article.sympathy .btn_sympathy:hover span.txt,
article.sympathy li.on .btn_sympathy span.txt {
font-weight: 800;
}
main section.section_view .related_news {
padding: 30px 0;
}
main section.section_view .related_news strong {
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
main section.section_view .related_news .news_list {
padding-top: 20px;
}
main section.section_view .related_news .news_list li {
position: relative;
padding-left: 15px;
}
main section.section_view .related_news .news_list li + li {
margin-top: 10px;
}
main section.section_view .related_news .news_list li::before {
position: absolute;
top: 50%;
left: 6px;
width: 2px;
height: 2px;
margin-top: -2px;
border-radius: 50%;
background: #171717;
content: '';
}
main section.section_view .related_news .news_list li a {
display: block;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
}
main section.section_view .thistime_news .div_layout {
box-sizing: border-box;
padding: 20px;
font-size: 0;
background: #F1F1F1;
}
main section.section_view .thistime_news .div_item {
box-sizing: border-box;
display: inline-block;
width: 50%;
padding-right: 20px;
vertical-align: top;
}
main section.section_view .thistime_news .div_item + .div_item {
padding: 0 0 0 20px;
border-left: 1px solid #e8e8e8;
}
main section.section_view .thistime_news .div_item a {
display: block;
word-break: break-all;
}
main section.section_view .thistime_news .news_img {
position: relative;
height: 169px;
}
main section.section_view .thistime_news .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
main section.section_view .thistime_news .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
main section.section_view .thistime_news .category {
display: block;
margin-top: 12px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
main section.section_view .thistime_news .news_title {
margin-top: 6px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
main section.section_view .thistime_news .news_title i {
font-size: 12px;
margin: -2px 6px 0 0;
}
main section.section_view .thistime_news .news_text {
margin-top: 8px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
main section.section_view .thistime_news .news_list li {
padding: 15px 0;
}
main section.section_view .thistime_news .news_list li:first-child {
padding-top: 0;
}
main section.section_view .thistime_news .news_list li:last-child {
padding-bottom: 0;
}
main section.section_view .thistime_news .news_list li + li {
border-top: 1px solid #e8e8e8;
}
main section.section_view .thistime_news .news_list a {
display: table;
width: 100%;
table-layout: fixed;
}
main section.section_view .thistime_news .news_list a .news_txt {
box-sizing: border-box;
display: inline-block;
width: 68%;
padding-right: 10px;
vertical-align: top;
}
main section.section_view .thistime_news .news_list a.no_img .news_txt {
width: 100%;
padding-right: 0;
}
main section.section_view .thistime_news .news_list a .news_txt .category {
margin-top: 0;
}
main section.section_view .thistime_news .news_list a .news_txt .news_title {
margin-top: 3px;
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
main section.section_view .thistime_news .news_list a .news_img {
display: inline-block;
width: 32%;
height: 56px;
}
article.popular_news {
padding-bottom: 20px;
}
article.popular_news .news_list li {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding-right: 20px;
}
article.popular_news .news_list li:nth-child(4n) {
padding-left: 0;
}
article.popular_news .news_list li:nth-child(3n) {
padding-right: 0;
}
article.popular_news .news_list li:nth-child(n+4):nth-child(-n+6) {
padding-top: 30px;
}
article.popular_news .news_list li:nth-child(n+4):nth-child(-n+6) a::before {
position: absolute;
top: -15px;
left: 0;
right: 0;
height: 1px;
background: #e8e8e8;
content: '';
}
article.popular_news .news_list a {
display: table;
position: relative;
width: 100%;
min-height: 64px;
table-layout: fixed;
}
article.popular_news .news_list a .news_txt {
box-sizing: border-box;
display: inline-block;
width: 68%;
padding-right: 10px;
vertical-align: top;
}
article.popular_news .news_list a.no_img .news_txt {
width: 100%;
padding-right: 0;
}
article.popular_news .news_list a .news_txt .number {
position: absolute;
top: 0;
left: 0;
color: #171717;
font-size: 22px;
font-weight: 600;
line-height: 1.2;
}
article.popular_news .news_list a .news_txt .category {
display: block;
padding-left: 30px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.popular_news .news_list a .news_txt .news_title {
padding-left: 30px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.popular_news .news_list a .news_img {
position: relative;
display: inline-block;
width: 32%;
height: 64px;
}
article.popular_news .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.popular_news .news_list .news_img img {
display: inline-block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.popular_news .div_fixed {
margin-left: -40px;
}
article.popular_news .div_layout {
font-size: 0;
}
article.popular_news .div_item {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding-left: 40px;
vertical-align: top;
}
article.popular_news .div_item:first-child a {
display: block;
}
article.popular_news .div_item:first-child .news_img {
position: relative;
height: 214px;
}
article.popular_news .div_item:first-child .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.popular_news .div_item:first-child .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.popular_news .div_item:first-child .category {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.popular_news .div_item:first-child .news_title {
margin-top: 10px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.popular_news .div_item:first-child .news_title i {
font-size: 12px;
margin: -2px 6px 0 0;
}
article.popular_news .div_item:first-child .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.popular_news .div_item .news_list li {
width: 100%;
padding: 18px 0;
border-top: 1px solid #e8e8e8;
}
article.popular_news .div_item .news_list li:first-child {
padding-top: 0;
border-top: 0;
}
article.popular_news .div_item .news_list li:nth-child(n+4) {
padding-top: 18px;
padding-bottom: 0;
}
article.popular_news .div_item .news_list li:nth-child(n+4) a::before {
display: none;
}
article.recent_news .news_list {
font-size: 0;
}
article.recent_news .news_list li {
box-sizing: border-box;
padding: 20px 0;
vertical-align: top;
border-bottom: 1px solid #e8e8e8;
}
article.recent_news .news_list li:first-child {
padding-top: 0;
}
article.recent_news .news_list a {
display: block;
font-size: 0;
}
article.recent_news .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 140px;
}
article.recent_news .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.recent_news .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.recent_news .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 100%;
vertical-align: top;
}
article.recent_news .news_list .news_img + .news_txt {
width: 70%;
padding-left: 20px;
}
article.recent_news .news_list .date {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.recent_news .news_list .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.recent_news .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.recent_news .news_list .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
/* pagenation */
main .pagenation {
width: 100%;
margin-top: 30px;
font-size: 0;
text-align: center
}
main .pagenation .btn_prev, main .pagenation .btn_next {
display: inline-block;
width: 30px;
height: 30px;
border: 1px solid #e8e8e8;
border-radius: 20px;
vertical-align: top;
border-radius: 20px;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
transition: .2s;
}
main .pagenation .btn_prev svg, main .pagenation .btn_next svg {
width: 8px;
height: 12px;
fill: #171717;
}
main .pagenation .btn_prev svg {
margin-left: -1px;
}
main .pagenation .btn_next svg {
margin-right: -3px;
}
main .pagenation .btn_prev:hover, main .pagenation .btn_next:hover {
border-color: #DADCDF;
background: #f1f1f1;
}
main .pagenation ul {
display: inline-block;
margin: 0 15px;
font-size: 0;
vertical-align: top
}
main .pagenation ul li {
display: inline-block
}
main .pagenation ul li + li {
margin-left: 5px
}
main .pagenation ul a {
box-sizing: border-box;
display: block;
min-width: 30px;
min-height: 30px;
padding: 0 5px;
color: #171717;
font-size: 14px;
border-radius: 30px;
line-height: 30px;
transition: .3s
}
main .pagenation ul a:hover {
color: #fff;
background: #171717;
}
main .pagenation ul .on a {
color: #fff;
background: #171717;
}
main .category_series_count {
display: table;
width: 100%;
margin-top: 20px;
table-layout: fixed;
}
main .category_series_count span.count {
display: table-cell;
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
vertical-align: middle;
}
main .category_series_count .category_array {
display: table-cell;
position: relative;
text-align: right;
vertical-align: middle;
}
main .category_series_count .btn_array {
display: inline-block;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 400;
line-height: normal;
background: transparent;
}
main .category_series_count .btn_array.on::before {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
content: ''
}
main .category_series_count .btn_array .ico_arrow {
display: inline-block;
margin-left: 8px;
vertical-align: middle;
animation: bounce paused;
animation-iteration-count: 0;
}
main .category_series_count .btn_array .ico_arrow::before, main .category_series_count .btn_array .ico_arrow::after {
display: block;
position: relative;
left: -3px;
width: 5px;
height: 1px;
background: rgba(23, 23, 23, 0.50);
opacity: .4;
transition: .1s ease-in-out;
content: '';
}
main .category_series_count .btn_array .ico_arrow::before {
top: -1px;
transform: rotate(45deg)
}
main .category_series_count .btn_array .ico_arrow::after {
top: -2px;
left: 0px;
transform: rotate(-45deg)
}
main .category_series_count .btn_array.on .ico_arrow::before {
transform: rotate(-45deg)
}
main .category_series_count .btn_array.on .ico_arrow::after {
transform: rotate(45deg)
}
main .category_series_count .array_list {
display: none;
box-shadow: 0 3px 10px rgba(0,0,0,0.15);
box-sizing: border-box;
overflow-y: auto;
position: absolute;
top: 30px;
right: 0;
z-index: 1;
padding: 5px 0;
border: 1px solid #e5e5e5;
background: #fff;
font-size: 14px;
text-align: left;
}
main .category_series_count .array_list li button {
display: block;
padding: 9px 20px;
font-size: 14px;
color: #666;
background: transparent;
}
main .category_series_count .array_list li button:hover {
color: #333;
font-weight: 500;
text-decoration: underline
}
article.thistime_main {
margin-top: 40px;
padding-bottom: 50px;
}
article.thistime_main .div_fixed {
margin-left: -40px;
}
article.thistime_main .news_list {
display: table;
width: 100%;
table-layout: fixed;
}
article.thistime_main .news_list li {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 20%;
padding-left: 40px;
vertical-align: top;
}
article.thistime_main .news_list li::before {
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 1px;
background: #e8e8e8;
content: '';
}
article.thistime_main .news_list li:first-child:before {
display: none;
}
article.thistime_main .news_list a {
display: block;
}
article.thistime_main .news_list .news_img {
position: relative;
height: 116px;
}
article.thistime_main .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.thistime_main .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.thistime_main .news_list .category {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.thistime_main .news_list .news_title {
margin-top: 4px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.50;
}
article.thistime_main .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.special {
padding: 40px 0 70px;
}
article.special .div_layout {
width: 100%;
}
article.special .div_item {
overflow: hidden;
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
height: 100%;
max-height: 400px;
vertical-align: top;
}
article.special .div_item a {
overflow: hidden;
display: block;
width: 100%;
height: 100%;
max-height: 200px;
}
article.special .div_item:first-child a {
max-height: 400px;
}
article.special .div_item a img {
display: block;
width: 100.5%;
object-fit: cover;
object-position: top;
transition: .4s;
}
article.special .div_item a:hover img {
transform: scale(1.1);
}
article.issue_content {
padding: 20px 0 50px;
}
article.issue_content .top_news_list {
display: table;
width: 100%;
table-layout: fixed;
}
article.issue_content .div_fixed {
margin-left: -20px;
}
article.issue_content .top_news_list li {
box-sizing: border-box;
display: table-cell;
width: 25%;
padding-left: 20px;
vertical-align: top;
}
article.issue_content .top_news_list a {
box-sizing: border-box;
display: block;
height: 254px;
padding: 20px;
border: 1px solid #e8e8e8;
}
article.issue_content .top_news_list .news_img {
position: relative;
height: 115px;
}
article.issue_content .top_news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.issue_content .top_news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.issue_content .top_news_list .news_title {
margin-top: 10px;
min-height: 48px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.50;
}
article.issue_content .top_news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.issue_content .top_news_list .date {
margin-top: 20px;
color: rgba(23, 23, 23, 0.70);
font-size: 12px;
font-weight: 400;
line-height: 1.5;
}
article.issue_content .top_news_list a.no_img .news_title {
margin-top: 0;
}
article.issue_content .top_news_list a.no_img .news_text {
margin-top: 8px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
article.issue_content .top_news_list a.no_img .date {
margin-top: 10px;
}
article.issue_content .issue_history {
margin-top: 40px;
}
article.issue_content .issue_history .history_list {
border: 1px solid #e8e8e8;
border-width: 1px 0;
}
article.issue_content .history_list li {
display: table;
width: 100%;
table-layout: fixed;
}
article.issue_content .history_list li .date {
box-sizing: border-box;
display: table-cell;
width: 23.77256637168%;
padding: 20px 30px 20px 20px;
color: #171717;
text-align: right;
font-size: 22px;
font-weight: 800;
line-height: 1.5;
}
article.issue_content .history_list li .news_list {
box-sizing: border-box;
display: table-cell;
width: 76.22743362832%;
padding: 20px 0 0 30px;
border-left: 1px solid #e8e8e8;
vertical-align: top;
}
article.issue_content .history_list li + li .news_list {
padding-top: 0;
}
article.issue_content .history_list li + li .news_list li:first-child {
padding-top: 20px;
}
article.issue_content .history_list li .news_list li {
padding-bottom: 20px;
border-top: 1px solid #e8e8e8;
}
article.issue_content .history_list li:first-child .news_list li:first-child {
border-top: 0;
}
article.issue_content .history_list li .news_list li + li {
padding-top: 20px;
}
article.issue_content .history_list li .news_list a {
display: table;
width: 100%;
table-layout: fixed;
}
article.issue_content .history_list li .news_list .news_txt {
box-sizing: border-box;
display: table-cell;
width: 72%;
padding-right: 20px;
vertical-align: top;
}
article.issue_content .history_list li .news_list a.no_img .news_txt {
width: 100%;
padding-right: 0;
}
article.issue_content .history_list li .news_list .news_img {
display: table-cell;
position: relative;
width: 28%;
height: 158px;
vertical-align: top;
}
article.issue_content .history_list li .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.issue_content .history_list li .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.issue_content .history_list li .news_list .news_title {
color: #171717;
font-size: 18px;
font-weight: 500;
line-height: 1.5;
}
article.issue_content .history_list li .news_list .news_text {
margin-top: 8px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.issue_content .history_list li .news_list .detail_date {
margin-top: 10px;
color: rgba(23, 23, 23, 0.70);
font-size: 12px;
font-weight: 400;
line-height: 1.5;
}
article.search_content {
padding: 20px 0 0;
}
article.search_content .count_list {
font-size: 0;
}
article.search_content .count_list li {
display: inline-block;
margin-right: 25px;
}
article.search_content .count_list .count_item {
display: table;
}
article.search_content .count_list .count_item em {
display: table-cell;
padding: 4px 12px;
color: #171717;
font-size: 14px;
font-weight: 700;
line-height: 1.5;
border: 1px solid #e8e8e8;
border-right: 0;
vertical-align: middle;
}
article.search_content .count_list .count_item span {
display: table-cell;
position: relative;
padding: 4px 12px;
color: #171717;
font-size: 12px;
font-weight: 400;
line-height: 1.5;
border: 1px solid #e8e8e8;
border-left: 0;
vertical-align: middle;
}
article.search_content .count_list .count_item span::before {
position: absolute;
top: 50%;
left: 0;
width: 1px;
height: 12px;
margin-top: -6px;
background: #e8e8e8;
content: '';
}
article.search_content .count_list .count_item.current em {
color: #fff;
border-color: #171717;
background: #171717;
}
article.search_content .count_list .count_item.current span::before {
display: none;
}
article.search_content .count_area {
position: relative;
}
article.search_content .count_area .category_wrap {
position: absolute;
top: 50%;
right: 0;
margin-top: -8px;
}
article.search_content .count_area .category_array {
position: relative;
text-align: right;
vertical-align: middle;
}
article.search_content .count_area .btn_array {
display: inline-block;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 600;
line-height: normal;
background: transparent;
}
article.search_content .count_area .btn_array.on::before {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
content: ''
}
article.search_content .count_area .btn_array .ico_arrow {
display: inline-block;
margin-left: 10px;
vertical-align: middle;
animation: bounce paused;
animation-iteration-count: 0;
}
article.search_content .count_area .btn_array .ico_arrow::before,
article.search_content .count_area .btn_array .ico_arrow::after {
display: block;
position: relative;
left: -4px;
width: 7px;
height: 1px;
background: rgba(23, 23, 23, 0.50);
opacity: .4;
transition: .1s ease-in-out;
content: '';
}
article.search_content .count_area .btn_array .ico_arrow::before {
top: -1px;
transform: rotate(45deg)
}
article.search_content .count_area .btn_array .ico_arrow::after {
top: -2px;
left: 0px;
transform: rotate(-45deg)
}
article.search_content .count_area .btn_array.on .ico_arrow::before {
transform: rotate(-45deg)
}
article.search_content .count_area .btn_array.on .ico_arrow::after {
transform: rotate(45deg)
}
article.search_content .count_area .array_list {
display: none;
box-shadow: 0 3px 10px rgba(0,0,0,0.15);
box-sizing: border-box;
overflow-y: auto;
position: absolute;
top: 30px;
right: 0;
z-index: 1;
padding: 5px 0;
border: 1px solid #e5e5e5;
background: #fff;
font-size: 14px;
text-align: left;
}
article.search_content .count_area .array_list li button {
display: block;
padding: 9px 20px;
font-size: 14px;
color: #666;
background: transparent;
}
article.search_content .count_area .array_list li button:hover {
color: #333;
font-weight: 500;
text-decoration: underline
}
article.search_content .count_area .btn_list {
position: absolute;
top: 5px;
right: 0;
}
article.search_content .count_area .btn_list li {
display: inline-block;
}
article.search_content .count_area .btn_list li + li {
position: relative;
padding-left: 20px;
}
article.search_content .count_area .btn_list li + li:before {
position: absolute;
top: 50%;
left: 10px;
width: 1px;
height: 12px;
margin-top: -6px;
background: #D9D9D9;
content: '';
}
article.search_content .count_area .btn_list li button {
color: rgba(0, 0, 0, 0.50);
font-size: 14px;
font-weight: 600;
line-height: 1.5;
background: transparent;
transition: .1s;
}
article.search_content .count_area .btn_list li button:hover {
color: #171717;
}
article.search_content .count_area .btn_list li button.on {
color: #171717;
}
article.search_content .search_result {
box-sizing: border-box;
margin-top: 20px;
padding: 30px 50px;
border-top: 1px solid #e8e8e8;
}
article.search_content .search_result .nodata {
padding: 80px 100px 0;
text-align: center;
}
article.search_content .search_result .nodata i {
display: inline-block;
width: 110px;
height: 110px;
}
article.search_content .search_result .nodata i svg {
display: block;
width: 110px;
height: 110px;
}
article.search_content .search_result .nodata strong {
display: block;
margin-top: 40px;
color: #171717;
font-size: 26px;
font-weight: 800;
line-height: 1.4;
text-align: center;
}
article.search_content .search_result .nodata strong span {
color: #1D9BF0;
}
article.search_content .search_result .nodata ul {
margin-top: 80px;
padding: 30px 50px;
}
article.search_content .search_result .nodata ul li {
color: rgba(23, 23, 23, 0.80);
font-size: 15px;
font-weight: 400;
line-height: 1.5;
}
article.search_content .search_result .nodata ul li + li {
margin-top: 5px;
}
article.search_content .search_result .search_content {
display: none;
}
article.search_content .search_result .search_content.current,
article.search_content .search_result .search_content.all_current {
display: block;
}
article.search_content .search_result .search_content.all_current .btn_result_more,
article.search_content .search_result .search_content.current .pagenation,
article.search_content .search_result .search_content.result_photo.current .btn_result_more {
display: block;
}
article.search_content .search_result .search_content.current .pagenation {
margin-top: 50px;
padding-bottom: 40px;
}
article.search_content .search_result .search_content.current .btn_result_more,
article.search_content .search_result .search_content.all_current .pagenation,
article.search_content .search_result .search_content.result_photo.current .btn_result_more {
display: none;
}
article.search_content .search_result .result_title {
color: #171717;
font-size: 20px;
font-weight: 700;
line-height: 1.5;
}
article.search_content .search_result .result_title span {
display: inline-block;
margin-left: 15px;
color: rgba(23, 23, 23, 0.70);
font-size: 12px;
font-weight: 400;
line-height: 1.5;
vertical-align: middle;
}
article.search_content .search_result .result_news .news_list {
margin-top: 30px;
font-size: 0;
}
article.search_content .search_result .result_news .news_list li {
box-sizing: border-box;
padding: 20px 0;
vertical-align: top;
border-bottom: 1px solid #e8e8e8;
}
article.search_content .search_result .result_news .news_list li:first-child {
padding-top: 0;
}
article.search_content .search_result .result_news.all_current .news_list li:nth-child(n+6) {
display: none;
}
article.search_content .search_result .result_news.all_current .news_list li:nth-child(5n) {
border-bottom: 0;
}
article.search_content .search_result .result_news .news_list a {
display: block;
font-size: 0;
}
article.search_content .search_result .result_news .news_list .news_img {
display: inline-block;
position: relative;
width: 25%;
height: 140px;
}
article.search_content .search_result .result_news .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.search_content .search_result .result_news .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.search_content .search_result .result_news .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 75%;
padding-left: 20px;
vertical-align: top;
}
article.search_content .search_result .result_news .news_list a.no_img .news_txt {
width: 100%;
padding: 0;
}
article.search_content .search_result .result_news .news_list .category {
font-size: 0;
}
article.search_content .search_result .result_news .news_list .category em {
display: inline-block;
margin: 10px 10px 0 0;
color: rgba(23, 23, 23, 0.70);
font-size: 13px;
font-weight: 800;
line-height: 1.5;
vertical-align: middle;
}
article.search_content .search_result .result_news .news_list .date {
display: inline-block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.search_content .search_result .result_news .news_list .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.search_content .search_result .result_news .news_list .news_title em {
font-weight: 600;
background: rgba(29,155,240,.4);
}
article.search_content .search_result .result_news .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.search_content .search_result .result_news .news_list .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.search_content .search_result .result_news .news_list .news_title em,
article.search_content .search_result .result_photo .news_list .news_title em,
article.search_content .search_result .result_news .news_list .news_text em {
font-weight: 600;
background: rgba(29,155,240,.4);
}
article.search_content .search_result .result_news .news_list.series_list .news_txt {
padding: 0 20px 0 0;
}
article.search_content .search_result .btn_result_more {
position: relative;
padding: 20px 0 50px;
text-align: center;
}
article.search_content .search_result .btn_result_more:before {
position: absolute;
top: 39px;
left: 0;
right: 0;
height: 1px;
background: #e8e8e8;
z-index: -1;
content: '';
}
article.search_content .search_result .btn_result_more button {
display: inline-block;
min-width: 150px;
padding: 0 40px;
color: #171717;
font-size: 15px;
font-weight: 500;
line-height: 36px;
border: 1px solid #e8e8e8;
border-radius: 25px;
background: #fff;
transition: .2s;
}
article.search_content .search_result .btn_result_more button svg {
display: inline-block;
width: 10px;
height: 10px;
margin-left: 10px;
line-height: 36px;
fill: #171717;
}
article.search_content .search_result .btn_result_more button:hover {
background: #e8e8e8;
}
article.search_content .search_result .result_photo .div_fixed {
margin-left: -20px;
}
article.search_content .search_result .result_photo .news_list {
display: table;
width: 100%;
table-layout: fixed;
margin-top: 30px;
}
article.search_content .search_result .result_photo .news_list li {
box-sizing: border-box;
display: table-cell;
width: 25%;
padding-left: 20px;
vertical-align: top;
}
article.search_content .search_result .result_photo .news_list a {
box-sizing: border-box;
display: block;
}
article.search_content .search_result .result_photo .news_list .news_img {
position: relative;
height: 140px;
}
article.search_content .search_result .result_photo .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.search_content .search_result .result_photo .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.search_content .search_result .result_photo .news_list .news_title {
margin-top: 10px;
min-height: 48px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.50;
}
article.search_content .search_result .result_photo .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.search_content .search_result .result_photo .news_list .date {
margin-top: 20px;
color: rgba(23, 23, 23, 0.70);
font-size: 12px;
font-weight: 400;
line-height: 1.5;
}
article.search_content .search_result .result_photo .btn_result_more {
padding-top: 50px;
}
article.search_content .search_result .result_photo .btn_result_more:before {
position: absolute;
top: 69px;
left: 0;
right: 0;
height: 1px;
background: #e8e8e8;
z-index: -1;
content: '';
}
article.graphic_news .graphic_swiper_wrap {
position: relative;
}
article.graphic_news .graphic_swiper {
overflow: hidden;
position: relative;
}
article.graphic_news .graphic_swiper .swiper-slide {
overflow: hidden;
width: 45% !important;
}
article.graphic_news .graphic_swiper .graphic_news_link {
overflow: hidden;
display: block;
position: relative;
padding-bottom: 177.8%;
}
article.graphic_news .graphic_swiper .graphic_news_link::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.graphic_news .graphic_swiper .graphic_news_link img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
article.graphic_news .btn_graphic_next,
article.graphic_news .btn_graphic_prev {
top: 50% !important;
width: 30px;
height: 30px;
border-radius: 20px;
border: 1px solid #DADCDF;
z-index: 2;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
}
article.graphic_news .btn_graphic_next {
right: -15px;
}
article.graphic_news .btn_graphic_prev {
left: -15px;
}
article.graphic_news .btn_graphic_next:after,
article.graphic_news .btn_graphic_prev:after {
color: #171717;
font-size: 10px;
}
article.graphic_news .btn_graphic_next:after {
padding-left: 2px;
}
article.graphic_news .btn_graphic_prev:after {
padding-right: 2px;
}
/* series */
main.series_main {
position: relative;
max-width: 100%;
margin-top: 70px;
padding: 0 0 45px;
background-size: cover;
}
main.series_main::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(23, 23, 23, 0.60);
backdrop-filter: blur(30px);
content: '';
}
main.series_main .series_top {
position: relative;
width: 100%;
max-width: 1130px;
margin: 0 auto;
}
main.series_sub {
position: relative;
max-width: 100%;
margin-top: 70px;
padding-top: 0;
background-size: cover;
}
main.series_sub::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, .03);
content: '';
}
main.series_sub + main {
position: relative;
}
main.series_sub .series_top {
position: relative;
}
main.series_sub .series_view {
position: relative;
width: 100%;
max-width: 600px;
margin: 0 auto;
}
main.series_main .today_content .title {
padding: 20px 0;
color: #FFF;
font-size: 20px;
font-weight: 700;
line-height: 1.5;
}
main.series_main .today_content .title span {
display: inline-block;
position: relative;
padding-right: 21px;
font-weight: 300;
}
main.series_main .today_content .title span::before {
position: absolute;
top: 50%;
right: 10px;
width: 1px;
height: 10px;
margin-top: -5px;
background: rgba(255, 255, 255, 0.20);
content: '';
}
main.series_main .today_content .content_area {
display: table;
width: 100%;
table-layout: fixed;
}
main.series_main .today_content .content_area .main_content {
display: table-cell;
width: 70%;
vertical-align: top;
}
main.series_main .today_content .content_area .timeline {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 30%;
padding-left: 51px;
vertical-align: middle;
}
main.series_main .today_content .content_area .timeline::before {
position: absolute;
top: 0;
left: 30px;
bottom: 0;
width: 1px;
background: rgba(255, 255, 255, 0.10);
content: '';
}
main.series_main .today_content .content_area .main_content a {
display: block;
position: relative;
}
main.series_main .today_content .content_area .main_content .news_img {
position: relative;
height: 403px;
}
main.series_main .today_content .content_area .main_content .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
background: linear-gradient(180deg, rgba(23, 23, 23, 0.10) 0%, rgba(23, 23, 23, 0.10) 50%, rgba(23, 23, 23, 0.50) 70%, rgba(23, 23, 23, 0.80) 100%);
content: '';
}
main.series_main .today_content .content_area .main_content .news_img::after {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(255, 255, 255, 0.10);
content: '';
}
main.series_main .today_content .content_area .main_content .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
main.series_main .today_content .content_area .main_content .news_txt {
box-sizing: border-box;
position: absolute;
bottom: 0;
width: 100%;
padding: 0 37.5% 30px 30px;
z-index: 1;
}
main.series_main .today_content .content_area .main_content .category {
color: #FFF;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
main.series_main .today_content .content_area .main_content .category .lock {
display: inline-block;
vertical-align: middle;
}
main.series_main .today_content .content_area .main_content .category .lock svg {
display: block;
width: 18px;
height: 18px;
margin-top: -2px;
fill: #fff;
fill-opacity: .8;
}
main.series_main .today_content .content_area .main_content .news_title {
margin-top: 4px;
color: #FFF;
font-size: 28px;
font-weight: 700;
line-height: 1.3;
letter-spacing: -0.56px;
}
main.series_main .today_content .content_area .main_content .news_text {
margin-top: 6px;
color: rgba(255, 255, 255, 0.60);
font-size: 14px;
font-weight: 500;
line-height: 1.4;
}
main.series_main .today_content .content_area .main_content .date {
margin-top: 6px;
color: #FFF;
font-size: 15px;
font-weight: 700;
line-height: 1.5;
}
main.series_main .today_content .content_area .timeline ul {
display: inline-block;
position: relative;
}
main.series_main .today_content .content_area .timeline ul li {
position: relative;
padding: 14px 18px;
}
main.series_main .today_content .content_area .timeline ul li::before {
position: absolute;
top: 38px;
left: -26px;
width: 9px;
height: 9px;
border: 1px solid #fff;
border-radius: 50px;
backdrop-filter: blur(100px);
content: '';
}
main.series_main .today_content .content_area .timeline ul li.current::after,
main.series_main .today_content .content_area .timeline ul li::after {
display: none;
position: absolute;
top: 38px;
left: -26px;
width: 11px;
height: 11px;
border-radius: 100px;
background: #fff;
content: '';
}
main.series_main .today_content .content_area .timeline ul li.current::after,
main.series_main .today_content .content_area .timeline ul li:hover::after {
display: block;
}
main.series_main .today_content .content_area .timeline ul li + li {
border-top: 1px solid rgba(255, 255, 255, 0.10);
}
main.series_main .today_content .content_area .timeline ul li.tab_link.current,
main.series_main .today_content .content_area .timeline ul li:hover {
background: rgba(255, 255, 255, .03);
}
main.series_main .today_content .content_area .timeline .time {
color: #FFF;
font-size: 15px;
font-weight: 700;
line-height: 1.5;
}
main.series_main .today_content .content_area .timeline a {
display: block;
}
main.series_main .today_content .content_area .timeline .news_wrap {
display: table;
width: 100%;
table-layout: fixed;
}
main.series_main .today_content .content_area .timeline .news_text {
box-sizing: border-box;
display: table-cell;
width: 86%;
padding-right: 8px;
vertical-align: middle;
}
main.series_main .today_content .content_area .timeline .news_title {
color: rgba(255, 255, 255, 0.50);
font-size: 14px;
font-weight: 500;
line-height: 1.4;
}
main.series_main .today_content .content_area .timeline .news_img {
display: table-cell;
width: 44px;
height: 44px;
vertical-align: middle;
}
main.series_main .today_content .content_area .timeline .news_img img {
display: block;
width: 100%;
height: 100%;
border-radius: 30px;
object-fit: cover;
object-position: top;
}
main.series_main .today_content .content_area .timeline .category {
margin-top: 4px;
color: #FFF;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
main.series_main .today_content .content_area .timeline .category .lock {
display: inline-block;
vertical-align: middle;
}
main.series_main .today_content .content_area .timeline .category .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #fff;
fill-opacity: .5;
}
main.series_main .today_content .content_area .timeline .category .date {
position: relative;
padding-left: 12px;
}
main.series_main .today_content .content_area .timeline .category .date::before {
position: absolute;
top: 50%;
left: 5px;
width: 1px;
height: 8px;
margin-top: -4px;
background: rgba(23, 23, 23, 0.20);
content: '';
}
main.series_main .today_content .content_area .timeline_content {
display: none;
}
main.series_main .today_content .content_area .timeline_content.current {
display: block;
transition: .2s;
}
main.series_schedule {
padding-top: 0;
}
article.weekly_schedule strong.title {
display: block;
padding: 20px 0;
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.weekly_schedule .schedule_list {
display: table;
width: 100%;
table-layout: fixed;
}
article.weekly_schedule .schedule_list .tab_link {
display: table-cell;
position: relative;
width: 16.66666666666667%;
text-align: center;
}
article.weekly_schedule .schedule_list .tab_link a {
display: block;
position: relative;
padding: 13px 5px;
color: #FFF;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
background: #171717;
transition: .1s;
}
article.weekly_schedule .schedule_list .tab_link a::before {
position: absolute;
top: 50%;
left: 0;
width: 1px;
height: 20px;
margin-top: -10px;
background: rgba( 255, 255, 255, 0.1);
content: '';
}
article.weekly_schedule .schedule_list .tab_link a:hover,
article.weekly_schedule .schedule_list .tab_link.current a {
background: #666;
}
article.weekly_schedule .schedule_list .tab_link.current a::before,
article.weekly_schedule .schedule_list .tab_link.current + .tab_link a::before,
article.weekly_schedule .schedule_list .tab_link:hover a::before,
article.weekly_schedule .schedule_list .tab_link:hover + .tab_link a::before {
display: none;
}
article.weekly_schedule .schedule_list .tab_link i {
display: none;
position: absolute;
bottom: -24px;
left: 50%;
z-index: 1;
margin-left: -13px;
}
article.weekly_schedule .schedule_list .tab_link i svg {
display: block;
width: 26px;
height: 13px;
fill: #fff;
}
article.weekly_schedule .schedule_list .tab_link.current i {
display: block;
}
article.weekly_schedule .schedule_content {
display: none;
padding-top: 30px;
}
article.weekly_schedule .schedule_content.current {
display: block;
}
article.weekly_schedule .schedule_content .tab_info_text {
display: inline-block;
padding-bottom: 25px;
}
article.weekly_schedule .schedule_content .info_area {
padding-bottom: 20px;
}
article.weekly_schedule .schedule_content .info_area strong {
padding: 12px 0;
color: #171717;
font-size: 18px;
font-weight: 500;
line-height: 1.5;
}
article.weekly_schedule .schedule_content .info_area strong em {
color: #1ba2da;
}
article.weekly_schedule .schedule_content .info_area p {
color: rgba(23, 23, 23, 0.60);
font-size: 15px;
font-weight: 500;
line-height: 1.5;
}
article.weekly_schedule .schedule_content .div_fixed {
margin-left: -30px;
}
article.weekly_schedule .schedule_content .schedule_content_list {
font-size: 0;
}
article.weekly_schedule .schedule_content .schedule_content_list li {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding: 0 0 30px 30px;
vertical-align: top;
}
article.weekly_schedule .schedule_content .schedule_content_list a {
box-sizing: border-box;
display: block;
position: relative;
padding: 35px 30px 30px;
border: 1px solid #e8e8e8;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_program_end {
position: absolute;
top: 0;
left: 0;
font-size: 14px;
font-weight: 400;
line-height: 18px;
color: #fff;
width: 26px;
padding: 11px 16px;
background: #6c6c6c;
word-break: break-all;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_img {
display: block;
width: 140px;
margin: 0 auto;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_img img {
display: inline-block;
width: 140px;
height: 140px;
object-fit: cover;
object-position: top;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_title {
margin-top: 20px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_title em {
vertical-align: middle;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_title .lock {
display: inline-block;
vertical-align: middle;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_title .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_text {
margin-top: 5px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_tag {
margin-top: 5px;
}
article.weekly_schedule .schedule_content .schedule_content_list a .series_tag span {
display: inline-block;
margin: 5px 4px 0 0;
padding: 4px 6px 3px;
color: #1D9BF0;
text-align: center;
font-size: 11px;
font-weight: 700;
line-height: normal;
border-radius: 13px;
border: 1px solid rgba(51, 184, 255, 0.70);
background: rgba(51, 184, 255, 0.08);
backdrop-filter: blur(50px);
}
article.series_popular {
display: table;
width: 100%;
table-layout: fixed;
}
article.series_popular .news_list {
font-size: 0;
}
article.series_popular .news_list li {
box-sizing: border-box;
display: inline-block;
width: 50%;
height: 102px;
padding: 0 20px 0 0;
}
article.series_popular .news_list li:nth-child(2n) {
padding: 0 0 0 20px;
border-left: 1px solid #e8e8e8;
}
article.series_popular .news_list li a {
box-sizing: border-box;
display: table;
width: 100%;
height: 102px;
table-layout: fixed;
}
article.series_popular .news_list li:nth-child(n+3) a {
border-top: 1px solid #e8e8e8;
}
article.series_popular .news_list li a .number {
display: table-cell;
width: 10%;
color: #1D9BF0;
text-align: center;
font-size: 18px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.series_popular .news_list li:nth-child(n+4) a .number {
color: #171717;
}
article.series_popular .news_list li a .news_txt {
box-sizing: border-box;
display: table-cell;
padding-left: 2%;
vertical-align: middle;
}
article.series_popular .news_list li a .news_txt .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.series_popular .news_list li a .news_txt .category {
margin-top: 4px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.series_popular .news_list li a .news_txt .category em {
vertical-align: middle;
}
article.series_popular .news_list li a .news_txt .category .lock {
display: inline-block;
vertical-align: middle;
}
article.series_popular .news_list li a .news_txt .category .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
aside.series::before {
top: 64px;
}
article.premium_content + article.series_swiper_area {
margin-top: 40px;
}
article.series_swiper_area .swiper_wrap {
box-sizing: border-box;
position: relative;
padding: 35px 50px;
}
article.series_swiper_area .series_popular_swiper {
overflow: hidden;
}
article.series_swiper_area .swiper-button-next7, article.series_swiper_area .swiper-button-prev7 {
width: 30px;
height: 30px;
border-radius: 20px;
border: 1px solid #DADCDF;
z-index: 2;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
}
article.series_swiper_area .swiper-button-next7 {
right: var(--swiper-navigation-sides-offset,0);
left: auto;
}
article.series_swiper_area .swiper-button-prev7 {
left: var(--swiper-navigation-sides-offset,0);
right: auto;
}
article.series_swiper_area .swiper-button-next7:after, article.series_swiper_area .swiper-button-prev7:after {
color: #171717;
font-size: 10px;
}
article.series_swiper_area .swiper-button-next7:after {
padding-left: 2px;
}
article.series_swiper_area .swiper-button-prev7:after {
padding-right: 2px;
}
article.series_swiper_area .series_popular_swiper a {
display: block;
text-align: center;
}
article.series_swiper_area .series_popular_swiper a .series_img {
display: block;
width: 100%;
max-width: 150px;
margin: 0 auto;
}
article.series_swiper_area .series_popular_swiper a .series_img img {
display: inline-block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.series_swiper_area .series_popular_swiper a .series_title {
margin-top: 14px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.series_swiper_area .series_popular_swiper a .series_title em {
vertical-align: middle;
}
article.series_swiper_area .series_popular_swiper a .series_title .lock {
display: inline-block;
vertical-align: middle;
}
article.series_swiper_area .series_popular_swiper a .series_title .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
article.series_swiper_area .series_popular_swiper a .series_text {
margin-top: 4px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.4;
}
article.category_series .news_list {
padding: 20px 0 10px;
font-size: 0;
}
article.category_series .news_list li {
box-sizing: border-box;
display: inline-block;
width: 50%;
padding: 0 10px 30px 0;
}
article.category_series .news_list li:nth-child(2n) {
padding: 0 0 30px 10px;
}
article.category_series .news_list a {
box-sizing: border-box;
display: block;
font-size: 0;
padding: 30px 50px;
border: 1px solid #e8e8e8;
}
article.category_series .news_list .series_img {
display: inline-block;
position: relative;
width: 30%;
max-width: 100px;
}
article.category_series .news_list .series_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.category_series .news_list .series_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 70%;
padding-left: 20px;
vertical-align: top;
}
article.category_series .news_list .series_title {
font-size: 0;
}
article.category_series .news_list .series_title em {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.category_series .news_list .series_title .lock {
display: inline-block;
margin-left: 4px;
vertical-align: middle;
}
article.category_series .news_list .series_title .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
article.category_series .news_list .series_title .series_category {
display: inline-block;
margin-left: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.category_series .news_list .series_title .series_category .fin {
display: inline-block;
position: relative;
padding-left: 10px;
}
article.category_series .news_list .series_title .series_category .fin::before {
position: absolute;
top: 50%;
left: 4px;
width: 2px;
height: 2px;
margin-top: -1px;
border-radius: 5px;
background: rgba(23, 23, 23, 0.20);
content: '';
}
article.category_series .news_list .series_text {
margin-top: 4px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.category_series .news_list .series_tag {
margin-top: 10px;
}
article.category_series .news_list .series_tag span {
display: inline-block;
margin: 5px 4px 0 0;
padding: 4px 6px 3px;
color: #1D9BF0;
text-align: center;
font-size: 11px;
font-weight: 700;
line-height: normal;
border-radius: 13px;
border: 1px solid rgba(51, 184, 255, 0.70);
background: rgba(51, 184, 255, 0.08);
backdrop-filter: blur(50px);
}
article.all_series .category_series_count {
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.all_series .news_list {
padding: 20px 0 10px;
font-size: 0;
}
article.all_series .news_list li {
box-sizing: border-box;
display: inline-block;
width: 50%;
padding: 0 20px 0 0;
vertical-align: top;
}
article.all_series .news_list li:nth-child(2n) {
padding: 0 0 0 20px;
border-left: 1px solid #e8e8e8;
}
article.all_series .news_list a {
box-sizing: border-box;
display: block;
height: 100%;
max-height: 125px;
font-size: 0;
padding-bottom: 17px;
}
article.all_series .news_list li:nth-child(n+3) a {
padding-top: 17px;
border-top: 1px solid #e8e8e8;
}
article.all_series .news_list .series_img {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 30%;
height: 90px;
padding-left: 16px;
}
article.all_series .news_list .series_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.all_series .news_list .series_txt {
display: inline-block;
position: relative;
width: 70%;
vertical-align: top;
}
article.all_series .news_list a.no_img .series_txt {
width: 100%;
}
article.all_series .news_list .series_category {
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.all_series .news_list .series_title {
margin-top: 4px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.all_series .news_list .series_txt .date {
display: inline-block;
margin-top: 4px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
main article.all_series .pagenation {
padding-bottom: 60px;
}
article.series_info {
display: table;
width: 100%;
max-width: 1130px;
table-layout: fixed;
margin: 0 auto;
padding: 60px 0;
}
article.series_info .info_txt {
box-sizing: border-box;
display: table-cell;
position: relative;
padding-right: 50px;
}
article.series_info .info_txt .info_txt_wrap {
max-width: 450px;
}
article.series_info .info_img {
display: table-cell;
width: 200px;
vertical-align: top;
}
article.series_info .info_img img {
display: block;
width: 100%;
object-fit: cover;
object-position: top;
}
article.series_info .series_category {
color: #FFF;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.series_info .series_title {
margin-top: 4px;
font-size: 0;
}
article.series_info .series_title em {
color: #FFF;
font-size: 44px;
font-weight: 700;
line-height: 1.3;
letter-spacing: -0.88px;
vertical-align: middle;
}
article.series_info .series_title .lock {
display: inline-block;
margin-left: 16px;
vertical-align: middle;
}
article.series_info .series_title .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #fff;
}
article.series_info .series_title .series_fin {
display: inline-block;
margin-left: 10px;
color: rgba(255, 255, 255, 0.70);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
letter-spacing: -0.48px;
vertical-align: middle;
}
article.series_info .series_title .series_fin .cycle {
display: inline-block;
position: relative;
padding-left: 11px;
}
article.series_info .series_title .series_fin .cycle::before {
position: absolute;
top: 50%;
left: 5px;
width: 2px;
height: 2px;
margin-top: -1px;
border-radius: 5px;
background: rgba(255, 255, 255, 0.70);
content: '';
}
article.series_info .series_text {
margin-top: 10px;
color: rgba(255, 255, 255, 0.60);
font-size: 16px;
font-weight: 500;
line-height: 1.4;
}
article.series_info .series_tag {
margin-top: 30px;
}
article.series_info .series_tag span {
display: inline-block;
margin-right: 6px;
padding: 6px 14px 5px;
color: #FFF;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid rgba(255, 255, 255, 0.30);
background: rgba(23, 23, 23, 0.20);
backdrop-filter: blur(150px);
}
article.series_info .info_txt .btn_info {
position: absolute;
top: 50%;
right: 50px;
margin-top: -17px;
}
article.series_info .info_txt .btn_info li {
display: inline-block;
position: relative;
vertical-align: middle;
}
article.series_info .info_txt .btn_info li + li {
margin-left: 6px;
}
article.series_info .info_txt .btn_info li button {
box-sizing: border-box;
display: block;
height: 34px;
padding: 6px 18px 6px;
border-radius: 22px;
border: 1px solid rgba(255, 255, 255, 0.30);
background: rgba(23, 23, 23, 0.20);
backdrop-filter: blur(150px);
transition: .2s;
}
article.series_info .info_txt .btn_info li button span {
display: inline-block;
color: #FFF;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.series_info .info_txt .btn_info li button svg {
display: inline-block;
width: 16px;
vertical-align: middle;
fill: #fff;
}
article.series_info .info_txt .btn_info li button.on_subscribe,
article.series_info .info_txt .btn_info li button.on_alarm,
article.series_info .info_txt .btn_info li button:hover {
color: #171717;
background: #fff;
}
article.series_info .info_txt .btn_info li button.on_subscribe span,
article.series_info .info_txt .btn_info li button.on_alarm span,
article.series_info .info_txt .btn_info li button:hover span {
color: #171717;
}
article.series_info .info_txt .btn_info li button:hover svg {
fill: #171717;
}
article.series_info .info_txt .btn_info li button i.check {
display: inline-block;
width: 15px;
height: 16px;
margin: -3px 0 0 6px;
vertical-align: middle;
}
article.series_info .info_txt .btn_info li button i.check svg {
display: inline-block;
width: 15px;
height: 16px;
fill: #fff;
}
article.series_info .info_txt .btn_info li button:hover i.check svg,
article.series_info .info_txt .btn_info li button.on_alarm i.check svg {
fill: #171717;
}
article.series_info .info_txt .btn_info li .pop_share_wrap {
box-sizing: border-box;
display: none;
position: absolute;
top: 45px;
right: 0;
width: 224px;
padding: 30px 20px;
z-index: 1;
border: 1px solid #ccc;
background: rgba(255,255,255,.9);
backdrop-filter: blur(7px);
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .btn_del {
position: absolute;
top: 10px;
right: 10px;
width: 15px;
height: 15px;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .btn_del i {
display: block;
width: 16px;
height: 16px;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .btn_del i::before,
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .btn_del i::after {
position: absolute;
left: 8px;
width: 1px;
height: 16px;
background: #111;
content: '';
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .btn_del i:before {
transform: rotate(45deg);
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .btn_del i:after {
transform: rotate(-45deg);
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list {
font-size: 0;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list + .pop_share_list {
margin-top: 16px;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li {
display: inline-block;
position: relative;
width: 33.33333%;
text-align: center;
vertical-align: top;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li + li {
margin-left: 0;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item {
position: relative;
display: inline-block;
width: 40px;
height: 40px;
padding: 0;
border-radius: 30px;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item svg {
display: inline-block;
width: 30px;
height: 30px;
transition: .2s;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item {
background: #666;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li:first-child .btn_share_item.btn_clip svg {
width: 28px;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_reddit {
background: #ff4500
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_twitter {
background: #171717;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_facebook {
background: #0866ff;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_kakao {
background: #fae102;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_kakao svg {
margin-left: 1px;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item.btn_linked {
background: #0073b1;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item:hover svg {
transform: scale(1.2);
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .toast_pop {
display: none;
position: absolute;
top: 0px;
left: 50%;
width: 40px;
height: 40px;
margin-left: -20px;
border-radius: 40px;
background: #666;
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .toast_pop .toast_text {
box-sizing: border-box;
position: absolute;
top: 44px;
left: 50%;
width: 80px;
margin-left: -40px;
padding: 5px;
color: #fff;
font-size: 12px;
background: rgba(0,0,0,0.5);
}
article.series_info .info_txt .btn_info li .pop_share_wrap .pop_share .pop_share_list li .toast_pop .link_copied {
animation: 0.34s cubic-bezier(0.65, 0, 1, 1) 0.1s forwards copied;
stroke-dasharray: 0, 75px;
stroke-linecap: round;
stroke-linejoin: round;
}
@keyframes copied {
from {
stroke-dasharray: 0, 75px;
}
to {
stroke-dasharray: 75px, 75px;
}
}
article.series_info.newsletter_view {
padding: 30px 0;
}
article.series_info.newsletter_view .series_title em {
font-size: 32px;
}
article.newsletter_view_area {
}
article.newsletter_view_area .tbl_wrap {
max-width: 700px;
margin: 0 auto;
}
article.newsletter_view_area .tbl_wrap table th,
article.newsletter_view_area .tbl_wrap table td {
vertical-align: top;
}
article.newsletter_view_area .btn_area {
padding: 40px 0 0;
text-align: center;
}
article.newsletter_view_area .btn_area .btn_prev {
box-sizing: border-box;
display: inline-block;
position: relative;
z-index: 1;
margin: 0 auto;
padding: 7px 120px 6px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.newsletter_view_area .btn_area .btn_prev:hover {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
article.series_popular2 {
padding: 0 0 10px;
}
article.series_popular2 strong.section_title.category {
padding: 10px 0 20px;
}
main.view_area + main article.series_popular2 strong.section_title.category {
padding: 20px 0;
}
article.series_popular2 .div_fixed {
margin-left: -40px;
}
article.series_popular2 .div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
article.series_popular2 .div_item {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 33.33333%;
padding-left: 40px;
}
article.series_popular2 .div_item::before {
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 1px;
background: #e8e8e8;
content: '';
}
article.series_popular2 .div_item:first-child:before {
display: none;
}
article.series_popular2 .news_list li + li {
position: relative;
margin-top: 33px;
}
article.series_popular2 .news_list li + li::before {
position: absolute;
top: -17px;
left: 0;
right: 0;
height: 1px;
background: #e8e8e8;
content: '';
}
article.series_popular2 .news_list a {
display: table;
position: relative;
width: 100%;
min-height: 75px;
table-layout: fixed;
}
article.series_popular2 .news_list a .news_txt {
box-sizing: border-box;
display: inline-block;
width: 66%;
padding: 5px 10px 5px 0;
vertical-align: top;
}
article.series_popular2 .news_list a.no_img .news_txt {
width: 100%;
padding-right: 0;
}
article.series_popular2 .news_list a .news_txt .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.series_popular2 .news_list a .news_txt .category {
display: block;
margin-top: 4px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.series_popular2 .news_list a .news_img {
position: relative;
display: inline-block;
width: 34%;
height: 75px;
vertical-align: top;
}
article.series_popular2 .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.series_popular2 .news_list .news_img img {
display: inline-block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.series_detail_list .category_series_count {
margin-top: 0;
padding: 20px 0;
border-top: 1px solid #171717;
}
article.series_detail_list .nodata {
margin-bottom: 60px;
padding: 200px 0;
text-align: center;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
}
article.series_detail_list .news_list {
font-size: 0;
}
article.series_detail_list .news_list li {
box-sizing: border-box;
padding: 20px 0;
vertical-align: top;
}
article.series_detail_list .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.series_detail_list .news_list li:first-child {
padding-top: 0;
}
article.series_detail_list .news_list a {
display: block;
font-size: 0;
}
article.series_detail_list .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 140px;
}
article.series_detail_list .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.series_detail_list .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.series_detail_list .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 70%;
padding-right: 20px;
vertical-align: top;
}
article.series_detail_list .news_list a.no_img .news_txt {
width: 100%;
padding-right: 0;
}
article.series_detail_list .news_list .date {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.series_detail_list .news_list .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.series_detail_list .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.series_detail_list .news_list .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.series_detail_list + .pagenation {
padding-bottom: 30px;
}
article.series_view {
padding: 150px 0 50px;
}
article.series_view .category {
color: #1D9BF0;
font-size: 14px;
font-weight: 600;
line-height: 1.4;
}
article.series_view h1 {
display: block;
margin-top: 10px;
color: #FFF;
font-size: 34px;
font-weight: 600;
line-height: 1.4;
letter-spacing: 1.02px;
word-break: keep-all;
}
article.series_view .news_info {
display: table;
width: 100%;
margin-top: 30px;
table-layout: fixed;
color: #FFF;
font-size: 13px;
font-weight: 400;
line-height: 1.5;
}
article.series_view .news_info .date {
display: table-cell;
width: 70%;
}
article.series_view .news_info .date .modify {
display: inline-block;
margin-left: 16px;
}
article.series_view .news_info .editor_name {
display: table-cell;
width: 30%;
text-align: right;
font-weight: 600;
}
main.series_popular {
max-width: 100%;
margin-top: 40px;
padding-top: 0;
background: #171717;
}
article.series_popular_bottom {
max-width: 1160px;
padding: 40px 0;
margin: 0 auto;
}
article.series_popular_bottom .section_title {
padding: 0 15px;
color: #fff;
}
article.series_popular_bottom .series_list {
display: table;
width: 100%;
margin-top: 20px;
table-layout: fixed;
}
article.series_popular_bottom .series_list li {
display: table-cell;
width: 25%;
padding: 0 15px;
}
article.series_popular_bottom .series_list li a {
box-sizing: border-box;
display: block;
min-height: 300px;
padding: 30px 20px;
text-align: center;
background: #fff;
}
article.series_popular_bottom .series_list li a .series_img {
display: inline-block;
width: 100%;
max-width: 150px;
margin: 0 auto;
}
article.series_popular_bottom .series_list li a .series_img img {
display: inline-block;
width: 100%;
object-fit: cover;
object-position: top;
}
article.series_popular_bottom .series_list li a .series_title {
margin-top: 20px;
}
article.series_popular_bottom .series_list li a .series_title em {
vertical-align: middle;
color: #171717;
text-align: center;
font-size: 16px;
font-weight: 600;
line-height: 1.5;
}
article.series_popular_bottom .series_list li a .series_title .lock {
display: inline-block;
vertical-align: middle;
}
article.series_popular_bottom .series_list li a .series_title .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
article.series_popular_bottom .series_list li a .series_text {
margin-top: 6px;
color: rgba(23, 23, 23, 0.60);
font-size: 13px;
font-weight: 400;
line-height: 1.5;
}
article.view_utility {
position: absolute;
}
article.view_utility .btn_list {
box-sizing: border-box;
width: 80px;
border: 1px solid rgba(23, 23, 23, 0.14);
}
article.view_utility .btn_list li {
position: relative;
text-align: center;
}
article.view_utility .btn_list li + li {
box-sizing: border-box;
border-top: 1px solid rgba(23, 23, 23, 0.14);
}
article.view_utility .btn_list li button {
display: inline-block;
width: 100%;
padding: 16px 0;
background: transparent;
}
article.view_utility .btn_list li button svg {
display: inline-block;
width: 28px;
height: 28px;
fill: #171717;
vertical-align: middle;
transition: .1s;
}
article.view_utility .btn_list li button.on svg {
fill: #1d9bf0;
}
article.view_utility .btn_list li button svg + p {
margin-top: 4px;
color: rgba(23, 23, 23, 0.60);
text-align: center;
font-size: 13px;
font-weight: 400;
line-height: 1.5;
letter-spacing: -0.26px;
transition: .2s;
}
article.view_utility .btn_list li button:hover svg + p,
article.view_utility .btn_list li button.on svg + p {
color: #171717;
}
article.view_utility .btn_list li button.small_font svg {
width: 22px;
height: 22px;
}
article.view_utility .btn_list li button.btn_bookmark svg {
width: 18px;
height: 18px;
fill: transparent;
}
article.view_utility .btn_list li button.btn_bookmark:hover svg,
article.view_utility .btn_list li button.btn_bookmark.bookmark_on svg {
fill: #171717;
}
article.view_utility .btn_list li .btn_bookmark + .toast_pop_bookmark {
display: none;
position: absolute;
top: 60px;
left: 50%;
margin-left: -75px;
}
article.view_utility .btn_list li .btn_bookmark + .toast_pop_bookmark .toast_bookmark_text {
box-sizing: border-box;
width: 150px;
padding: 5px;
color: #fff;
font-size: 12px;
line-height: 1.2;
text-align: center;
background: rgba(0,0,0,0.5);
}
article.view_utility .btn_list .pop_share_wrap li + li {
border-top: 0;
}
article.view_utility .btn_list li .pop_share_wrap {
top: -1px;
left: 90px;
border-color: rgba(23, 23, 23, 0.14);
}
article.view_utility .btn_list li .pop_share_wrap.pop_font {
top: -1px;
}
article.view_utility .btn_list li .pop_share_wrap .pop_share .pop_share_list li .btn_share_item,
article.view_utility .btn_list li .pop_share_wrap .pop_share .pop_font_list li .btn_share_item {
padding: 0;
}
main.serial_sub {
max-width: 100%;
padding-top: 0;
background: #F0F0F0;
}
main.serial_sub .serial_top {
position: relative;
}
article.recent_serial_news {
padding: 30px 0;
}
article.recent_serial_news .section_title {
max-width: 1130px;
margin: 0 auto;
padding: 0;
font-size: 18px;
border-top: 0;
}
article.recent_serial_news .news_list {
display: table;
width: 100%;
max-width: 1150px;
table-layout: fixed;
margin: 20px auto 0;
}
article.recent_serial_news .news_list li {
box-sizing: border-box;
display: table-cell;
width: 25%;
padding: 0 10px;
vertical-align: top;
}
article.recent_serial_news .news_list a {
box-sizing: border-box;
display: block;
height: 255px;
padding: 30px;
background: #fff;
}
article.recent_serial_news .news_list .news_img {
position: relative;
height: 115px;
}
article.recent_serial_news .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.recent_serial_news .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.recent_serial_news .news_list .category {
display: block;
margin-top: 12px;
color: #0088CB;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.recent_serial_news .news_list .news_title {
margin-top: 6px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.recent_serial_news .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.recent_serial_news .news_list a.no_img .category {
display: block;
margin-top: 4px;
color: #0088CB;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.recent_serial_news .news_list a.no_img .news_title {
margin-top: 10px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.recent_serial_news .news_list a.no_img .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.recent_serial_news .news_list a.no_img .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
main.serial_content {
padding: 0;
}
main.serial_content .series_popular2 {
padding: 0;
}
main.serial_content strong.section_title {
border-top: 0;
padding: 25px 0;
}
main.serial_content strong.section_title.category {
padding: 25px 0;
}
article.serial_list {
margin-top: 30px;
padding-bottom: 25px;
border-top: 1px solid #171717;
}
article.serial_list .serial_item_list {
font-size: 0;
}
article.serial_list .serial_item_list li {
box-sizing: border-box;
display: inline-block;
padding: 0 6px 15px 0;
}
article.serial_list .serial_item_list li a {
box-sizing: border-box;
display: block;
padding: 6px 18px;
border: 1px solid #e8e8e8;
transition: .1s;
}
article.serial_list .serial_item_list li a:hover {
border-color: #171717;
}
article.serial_list .serial_item_list li a i {
display: inline-block;
width: 25px;
vertical-align: middle;
}
article.serial_list .serial_item_list li a i img {
display: inline-block;
width: 100%;
}
article.serial_list .serial_item_list li a em {
display: inline-block;
margin-left: 12px;
color: #666;
font-size: 15px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
main.serial_content2 {
max-width: 1150px;
padding: 0;
}
article.serial_news_list {
position: relative;
}
article.serial_news_list::before {
position: absolute;
top: 0;
left: 50%;
width: 1130px;
height: 1px;
margin-left: -565px;
background: #171717;
content: '';
}
article.serial_news_list .div_layout {
position: relative;
display: table;
width: 100%;
table-layout: fixed;
padding: 30px 0;
}
article.serial_news_list .div_layout + .div_layout::before {
position: absolute;
top: 0;
left: 50%;
width: 1130px;
height: 1px;
margin-left: -565px;
background: #e8e8e8;
content: '';
}
article.serial_news_list .div_layout:last-child {
padding-bottom: 60px;
}
article.serial_news_list .div_item {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding: 0 10px;
vertical-align: top;
}
article.serial_news_list .div_item .div_item_wrap {
box-sizing: border-box;
padding: 15px;
border: 1px solid #e8e8e8;
vertical-align: top;
}
article.serial_news_list .div_item .serial_info {
box-sizing: border-box;
display: table;
width: 100%;
table-layout: fixed;
}
article.serial_news_list .serial_info .serial_img {
display: table-cell;
width: 50px;
vertical-align: middle;
}
article.serial_news_list .serial_info .serial_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.serial_news_list .serial_info .serial_txt {
box-sizing: border-box;
position: relative;
display: table-cell;
padding-left: 15px;
vertical-align: middle;
}
article.serial_news_list .serial_info .serial_txt .series_title {
display: table-cell;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.serial_news_list .serial_info .serial_txt .count {
box-sizing: border-box;
position: absolute;
top: 50%;
right: 0;
margin-top: -11px;
padding: 4px 10px 3px;
color: #1D9BF0;
font-size: 0;
border-radius: 13px;
border: 1px solid rgba(51, 184, 255, 0.70);
background: rgba(51, 184, 255, 0.08);
backdrop-filter: blur(50px);
z-index: 1;
cursor: default;
}
article.serial_news_list .serial_info .serial_txt .count em {
display: inline-block;
font-size: 11px;
font-weight: 700;
line-height: normal;
vertical-align: middle;
}
article.serial_news_list .serial_info .serial_txt .count span {
display: inline-block;
margin-left: 6px;
font-size: 11px;
font-weight: 500;
line-height: normal;
vertical-align: middle;
}
article.serial_news_list .div_item .news_list {
margin-top: 15px;
border-top: 1px solid #e8e8e8;
}
article.serial_news_list .div_item .news_list li {
box-sizing: border-box;
padding-top: 15px;
vertical-align: top;
}
article.serial_news_list .div_item .news_list a {
display: block;
min-height: 64px;
font-size: 0;
}
article.serial_news_list .div_item .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 100%;
padding: 5px 0;
vertical-align: top;
}
article.serial_news_list .div_item .news_list .news_img + .news_txt {
width: 70%;
padding: 5px 0 5px 15px;
}
article.serial_news_list .div_item .news_list .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.serial_news_list .div_item .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 64px;
vertical-align: middle;
}
article.serial_news_list .div_item .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.serial_news_list .div_item .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
main.serial_sub article.series_info .series_category,
main.serial_sub article.series_info .series_title em,
main.serial_sub article.series_info .series_title .series_fin {
color: #171717;
}
main.serial_sub article.series_info .series_title .lock svg {
fill: #171717;
}
main.serial_sub article.series_info .series_text {
color: rgba(23, 23, 23, 0.60);
}
main.serial_sub article.series_info .series_nbanner {
margin-top: 20px;
}
main.serial_sub article.series_info .series_nbanner img {
display: block;
width: 100%;
object-fit: cover;
object-position: top;
}
main.serial_sub article.series_info .series_tag span,
main.serial_sub article.series_info .info_txt .btn_info li button {
border-radius: 22px;
border: 1px solid rgba(255, 255, 255, 0.30);
background: rgba(23, 23, 23, 0.50);
backdrop-filter: blur(150px);
transition: .2s;
}
main.serial_sub article.series_info .info_txt .btn_info li button.on_subscribe,
main.serial_sub article.series_info .info_txt .btn_info li button:hover {
color: #171717;
border-color: rgba(0, 0, 0, 0.30);
background: #fff;
}
/* editor */
main.editor {
display: table;
position: relative;
width: 100%;
min-height: 500px;
table-layout: fixed;
}
header.change + main.editor {
padding-top: 70px;
}
main.editor aside {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 20%;
vertical-align: top;
}
main.editor aside::before {
display: none;
}
main.editor section {
box-sizing: border-box;
display: table-cell;
width: 80%;
padding-left: 20px;
vertical-align: top;
}
main.editor article.editor_profile {
position: absolute;
left: 0;
right: 0;
}
main.editor article.editor_profile .editor_info {
box-sizing: border-box;
width: 100%;
padding: 20px;
border: 1px solid #e8e8e8;
text-align: center;
}
main.editor article.editor_profile .editor_img {
display: inline-block;
position: relative;
width: 70px;
vertical-align: top;
}
main.editor article.editor_profile .editor_img img {
width: 100%;
max-height: 70px;
border-radius: 50px;
object-fit: contain;
}
main.editor article.editor_profile .editor_img::before {
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
width: 70px;
height: 70px;
border-radius: 50px;
border: 1px solid rgba(0, 0, 0, 0.1);
content: '';
}
main.editor article.editor_profile .editor_name {
margin-top: 14px;
color: #171717;
font-size: 13px;
font-weight: 500;
line-height: 1.5;
}
main.editor article.editor_profile .editor_name em {
color: #171717;
text-align: center;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
main.editor article.editor_profile .editor_word {
margin-top: 6px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 500;
line-height: 1.2;
}
main.editor article.editor_profile .editor_contact {
margin-top: 12px;
font-size: 0;
}
main.editor article.editor_profile .editor_contact li {
display: inline-block;
vertical-align: middle;
}
main.editor article.editor_profile .editor_contact li + li {
margin-left: 6px;
}
main.editor article.editor_profile .editor_contact li a {
box-sizing: border-box;
display: block;
position: relative;
width: 46px;
height: 34px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
main.editor article.editor_profile .editor_contact li a svg {
display: inline-block;
position: absolute;
top: 50%;
left: 50%;
width: 16px;
height: 13px;
margin: -7px 0 0 -8px;
fill: #171717;
}
main.editor article.editor_profile .editor_contact li a:hover {
border-color: #1D9BF0;
background: #1D9BF0;
}
main.editor article.editor_profile .editor_contact li a:hover svg {
fill: #fff;
}
main.editor article.editor_profile .editor_contact li button {
box-sizing: border-box;
display: block;
padding: 6px 14px 5px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
main.editor article.editor_profile .editor_contact li button:hover,
main.editor article.editor_profile .editor_contact li button.subcribe {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
main.editor article.editor_profile .subscribe_count {
margin-top: 12px;
}
main.editor article.editor_profile .subscribe_count em {
display: inline-block;
color: #171717;
font-size: 12px;
font-weight: 500;
line-height: 1.2;
vertical-align: middle;
}
main.editor article.editor_profile .subscribe_count span {
display: inline-block;
position: relative;
margin-left: 5px;
color: #1D9BF0;
font-size: 13px;
font-weight: 700;
line-height: 1.2;
vertical-align: middle;
}
main.editor section article {
box-sizing: border-box;
padding: 20px;
border: 1px solid #e8e8e8;
}
main.editor section article + article {
margin-top: 20px;
}
main.editor section em.editor_title {
display: block;
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
main.editor section em.editor_title .count {
display: inline-block;
margin-left: 5px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
}
main.editor section em.editor_title i {
box-sizing: border-box;
display: inline-block;
padding: 2px 16px;
color: #0088CB;
text-align: center;
font-size: 13px;
font-weight: 700;
line-height: 1.5;
border-radius: 13px;
border: 1px solid #0088CB;
background: #FFF;
}
article.editor_pick .news_list {
margin-top: 15px;
}
article.editor_pick .news_list li {
box-sizing: border-box;
display: block;
padding-bottom: 20px;
}
article.editor_pick .news_list li + li {
padding-top: 20px;
border-top: 1px solid #e8e8e8;
}
article.editor_pick .news_list li:last-child {
padding-bottom: 0;
}
article.editor_pick .news_list li a {
display: table;
width: 100%;
table-layout: fixed;
}
article.editor_pick .news_list .news_img {
display: table-cell;
position: relative;
width: 25%;
height: 115px;
vertical-align: middle;
}
article.editor_pick .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.editor_pick .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.editor_pick .news_list .news_txt {
box-sizing: border-box;
display: table-cell;
width: 75%;
padding-left: 20px;
vertical-align: middle;
}
article.editor_pick .news_list .news_txt .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.editor_pick .news_list .news_txt .news_title i {
margin: -2px 6px 0 0;
font-size: 12px;
}
article.editor_pick .news_list .news_txt .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.editor_news .div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
article.editor_news .div_item {
display: table-cell;
width: 50%;
padding-right: 10px;
vertical-align: top;
}
article.editor_news div.div_item + .div_item {
padding: 0 0 0 10px;
}
article.editor_news .news_list {
margin-top: 15px;
}
article.editor_news div.div_item .news_list li {
box-sizing: border-box;
padding: 12px 0;
}
article.editor_news div.div_item .news_list li:first-child {
padding-top: 0;
}
article.editor_news div.div_item .news_list li:last-child {
padding-bottom: 0;
}
article.editor_news div.div_item .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.editor_news div.div_item .news_list li a {
display: block;
}
article.editor_news div.div_item .news_list li a .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.editor_news div.div_item .news_list li a i {
margin: -2px 6px 0 0;
font-size: 12px;
}
article.editor_news div.div_item + .div_item .news_list {
display: table;
width: 100%;
table-layout: fixed;
}
article.editor_news div.div_item + .div_item .news_list li {
box-sizing: border-box;
display: table-cell;
width: 50%;
padding: 0 8px;
}
article.editor_news div.div_item + .div_item .news_list li + li {
border-top: 0;
}
article.editor_news div.div_item + .div_item .news_list li:first-child {
padding-left: 0;
}
article.editor_news div.div_item + .div_item .news_list li:last-child {
padding-right: 0;
}
article.editor_news div.div_item + .div_item .news_list a {
display: block;
}
article.editor_news div.div_item + .div_item .news_list .news_img {
position: relative;
height: 116px;
}
article.editor_news div.div_item + .div_item .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.editor_news div.div_item + .div_item .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.editor_news div.div_item + .div_item .news_list .news_title {
margin-top: 6px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.50;
}
article.editor_news div.div_item + .div_item .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.editor_news.type2 .news_list {
display: table;
width: 100%;
table-layout: fixed;
}
article.editor_news.type2 .news_list li {
box-sizing: border-box;
display: table-cell;
width: 25%;
padding: 0 8px;
}
article.editor_news.type2 .news_list li + li {
border-top: 0;
}
article.editor_news.type2 .news_list li:first-child {
padding-left: 0;
}
article.editor_news.type2 .news_list li:last-child {
padding-right: 0;
}
article.editor_news.type2 .news_list a {
display: block;
}
article.editor_news.type2 .news_list .news_img {
position: relative;
height: 116px;
}
article.editor_news.type2 .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.editor_news.type2 .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.editor_news.type2 .news_list .news_title {
margin-top: 10px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.50;
}
article.editor_news.type2 .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.editor_news.type3 .div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
article.editor_news.type3 .div_item {
display: table-cell;
width: 50%;
padding-right: 10px;
}
article.editor_news.type3 .div_item + .div_item {
padding: 0 0 0 10px;
}
article.editor_news.type3 .news_list {
margin-top: 0;
}
article.editor_news.type3 .news_list li {
box-sizing: border-box;
display: inline-block;
width: 50%;
padding-top: 15px;
vertical-align: top;
}
article.editor_news.type3 .news_list a {
display: block;
font-size: 0;
}
article.editor_news.type3 .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 70%;
padding: 5px 0 5px 15px;
vertical-align: top;
}
article.editor_news.type3 .news_list .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.editor_news.type3 .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 64px;
vertical-align: top;
}
article.editor_news.type3 .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.editor_news.type3 .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.editor_popular .news_list {
margin-top: 15px;
font-size: 0;
}
article.editor_popular .news_list li {
box-sizing: border-box;
display: inline-block;
width: 50%;
padding: 0 10px 0 0;
}
article.editor_popular .news_list li:nth-child(2n) {
padding: 0 0 0 10px;
}
article.editor_popular .news_list li:nth-child(n+3) a {
padding-top: 15px;
}
article.editor_popular .news_list li a {
box-sizing: border-box;
display: block;
font-size: 0;
}
article.editor_popular .news_list li a .number {
display: inline-block;
width: 8%;
color: #1D9BF0;
text-align: center;
font-size: 18px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.editor_popular .news_list li:nth-child(n+4) a .number {
color: #171717;
}
article.editor_popular .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
width: 62%;
padding: 0 2%;
vertical-align: middle;
}
article.editor_popular .news_list .news_txt .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.editor_popular .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 64px;
vertical-align: middle;
}
article.editor_popular .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.editor_popular .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.editor_all_news .news_list {
margin-top: 15px;
font-size: 0;
}
article.editor_all_news .news_list li {
box-sizing: border-box;
padding: 20px 0;
vertical-align: top;
}
article.editor_all_news .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.editor_all_news .news_list li:first-child {
padding-top: 0;
}
article.editor_all_news .news_list a {
display: block;
font-size: 0;
}
article.editor_all_news .news_list .news_img {
display: inline-block;
position: relative;
width: 20%;
height: 104px;
vertical-align: middle;
}
article.editor_all_news .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.editor_all_news .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.editor_all_news .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 100%;
vertical-align: top;
}
article.editor_all_news .news_list .news_img + .news_txt {
width: 80%;
padding-left: 20px;
}
article.editor_all_news .news_list .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.editor_all_news .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
font-size: 12px;
}
article.editor_all_news .news_list .news_text {
margin-top: 6px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.editor_all_news .news_list .date {
display: block;
margin-top: 6px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.editor_all_news .pagenation {
padding-bottom: 20px;
}
main.stoty_sub {
position: relative;
max-width: 100%;
padding-top: 0;
background-size: cover;
}
main.stoty_sub::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(23, 23, 23, 0.60);
-webkit-backdrop-filter: blur(400px);
backdrop-filter: blur(400px);
content: '';
}
main.stoty_sub + main.div_layout {
padding-top: 0;
}
main.stoty_sub .stoty_top {
position: relative;
}
article.story_top_news {
width: 100%;
max-width: 1130px;
margin: 0 auto;
padding: 60px 0;
}
article.story_top_news .div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
article.story_top_news .div_item {
box-sizing: border-box;
display: table-cell;
width: 65%;
padding-right: 20px;
vertical-align: top;
}
article.story_top_news .div_item + .div_item {
display: table-cell;
width: 35%;
padding: 0 0 0 20px;
border-left: 1px solid rgba(255, 255, 255, 0.2);
}
article.story_top_news .div_item a {
display: block;
font-size: 0;
}
article.story_top_news .news_img {
display: inline-block;
position: relative;
width: 40%;
height: 186px;
vertical-align: middle;
}
article.story_top_news .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(255, 255, 255, 0.09);
content: '';
}
article.story_top_news .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.story_top_news .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 60%;
padding-left: 20px;
vertical-align: middle;
}
article.story_top_news .news_txt .category {
color: rgba(255, 255, 255, 0.50);
font-family: Pretendard;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.story_top_news .news_title {
margin-top: 4px;
color: #fff;
font-size: 25px;
font-weight: 500;
line-height: 1.5;
letter-spacing: -0.75px;
}
article.story_top_news .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.story_top_news .news_text {
margin-top: 5px;
color: rgba(255, 255, 255, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.story_top_news .news_list {
font-size: 0;
}
article.story_top_news .news_list li {
box-sizing: border-box;
padding: 0 0 20px 0;
}
article.story_top_news .news_list li + li {
padding: 20px 0 0 0;
border-top: 1px solid rgba(255, 255, 255, 0.2)
}
article.story_top_news .news_list li:first-child {
padding-top: 0;
}
article.story_top_news .news_list a {
display: block;
font-size: 0;
}
article.story_top_news .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 70px;
}
article.story_top_news .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(255, 255, 255, 0.09);
content: '';
}
article.story_top_news .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.story_top_news .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 70%;
padding: 0 20px 0 0;
vertical-align: top;
}
article.story_top_news .news_list .news_title {
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.story_top_news .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.story_top_news .news_list .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.stoty_interactive {
padding-bottom: 20px;
}
article.stoty_interactive .news_list {
font-size: 0;
margin-left: -2%;
}
article.stoty_interactive .news_list li {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding-left: 2%;
text-align: center;
vertical-align: top;
}
article.stoty_interactive .news_list li a {
overflow: hidden;
display: block;
}
article.stoty_interactive .news_list li a img {
display: block;
width: 100%;
object-fit: cover;
object-position: top;
transition: .4s;
}
article.stoty_interactive .news_list li a:hover img {
transform: scale(1.1);
}
article.stoty_interactive .news_list li em {
display: block;
padding: 15px 0 20px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.story_news {
padding-bottom: 40px;
}
article.story_news:last-child {
padding-bottom: 80px;
}
article.story_news .div_layout {
display: table;
width: 100%;
table-layout: fixed;
}
article.story_news .div_item {
box-sizing: border-box;
display: table-cell;
width: 50%;
padding: 0 20px 0 0;
vertical-align: top;
}
article.story_news .div_item + .div_item {
padding: 0 0 0 20px;
border-left: 1px solid #e8e8e8;
}
article.story_news .div_item a {
display: block;
font-size: 0;
}
article.story_news .div_item .link_img {
display: block;
position: relative;
height: 186px;
}
article.story_news .div_item .link_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.story_news .div_item .link_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
article.story_news .div_item .link_img + em {
display: block;
margin-top: 20px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
text-align: center;
}
article.story_news .news_list li {
box-sizing: border-box;
padding: 12px 0;
vertical-align: top;
}
article.story_news .news_list li:first-child {
padding-top: 0;
}
article.story_news .news_list li:last-child {
padding-bottom: 0;
}
article.story_news .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.story_news .news_list .news_img {
display: inline-block;
position: relative;
width: 30%;
height: 64px;
vertical-align: top;
}
article.story_news .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.story_news .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.story_news .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 70%;
padding: 5px 15px 5px 0;
vertical-align: top;
}
article.story_news .news_list a.no_img .news_txt {
width: 100%;
padding: 0;
}
article.story_news .news_list .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.mypage_top {
position: relative;
}
article.mypage_top .tab_list {
font-size: 0;
}
article.mypage_top .tab_list li {
display: inline-block;
}
article.mypage_top .tab_list li + li {
margin-left: 16px;
}
article.mypage_top .tab_list li button {
box-sizing: border-box;
display: block;
min-width: 150px;
padding: 4px 20px;
color: #171717;
font-size: 20px;
font-weight: 500;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #e8e8e8;
background: #fff;
transition: .2s;
}
article.mypage_top .my_info {
position: absolute;
top: 0;
right: 0;
}
article.mypage_top .my_info .info_img {
display: inline-block;
width: 40px;
vertical-align: middle;
}
article.mypage_top .my_info .info_img .profile_img {
display: inline-block;
position: relative;
width: 40px;
vertical-align: top;
}
article.mypage_top .my_info .info_img .profile_img::before {
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
border-radius: 50px;
border: 1px solid rgba(0, 0, 0, 0.1);
content: '';
}
article.mypage_top .my_info .info_img img {
width: 40px;
max-height: 40px;
border-radius: 50px;
object-fit: contain;
}
article.mypage_top .my_info .info_img .no_img {
width: 40px;
height: 40px;
text-align: center;
border-radius: 100%;
background: rgba(217, 217, 217, 0.80);
}
article.mypage_top .my_info .info_img .no_img::before {
display: inline-block;
vertical-align: middle;
height: 100%;
content: '';
}
article.mypage_top .my_info .info_img .no_img svg {
display: inline-block;
width: 24px;
fill: #171717;
vertical-align: middle;
}
article.mypage_top .tab_list li.current button,
article.mypage_top .tab_list li button:hover {
color: #fff;
border-color: #171717;
background: #171717;
}
article.mypage_top .my_info .info_txt {
box-sizing: border-box;
display: inline-block;
padding: 0 10px;
vertical-align: middle;
}
article.mypage_top .my_info .info_txt .nickname {
color: #171717;
font-size: 15px;
font-weight: 400;
line-height: 1.5;
}
article.mypage_top .my_info .info_txt .nickname em {
display: inline-block;
max-width: 150px;
line-height: 1.2;
vertical-align: middle;
}
article.mypage_top .my_info .info_btn {
display: inline-block;
}
article.mypage_top .my_info .info_btn a {
box-sizing: border-box;
display: block;
padding: 6px 15px;
border-radius: 22px;
border: 1px solid #1d9bf0;
background: #fff;
transition: .2s;
}
article.mypage_top .my_info .info_btn a em {
display: inline-block;
color: #1d9bf0;
font-size: 13px;
font-weight: 500;
line-height: 1;
vertical-align: middle;
}
article.mypage_top .my_info .info_btn a i {
display: inline-block;
margin-left: 3px;
vertical-align: middle;
}
article.mypage_top .my_info .info_btn a i svg {
display: inline-block;
width: 8px;
height: 12px;
stroke: #1d9bf0;
stroke-width: .5px;
vertical-align: top;
}
article.mypage_top .my_info .info_btn a:hover {
background: #1d9bf0;
}
article.mypage_top .my_info .info_btn a:hover em {
color: #fff;
}
article.mypage_top .my_info .info_btn a:hover i svg {
stroke: #fff;
}
article.mypage_top .language_wrap {
box-sizing: border-box;
display: inline-block;
margin-left: 10px;
vertical-align: middle;
}
article.mypage_top .language_setting {
position: relative;
padding: 3px 10px 4px;
border: 1px solid #171717;
border-radius: 15px;
}
article.mypage_top .btn_language {
display: inline-block;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: normal;
background: transparent;
}
article.mypage_top .btn_language.on::before {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
content: ''
}
article.mypage_top .btn_language svg {
display: inline-block;
width: 14px;
height: 14px;
vertical-align: middle;
fill: #171717;
}
article.mypage_top .btn_language svg + span {
display: inline-block;
margin-left: 4px;
font-size: 13px;
vertical-align: middle;
}
article.mypage_top .btn_language .ico_arrow {
display: inline-block;
margin-left: 7px;
vertical-align: middle;
animation: bounce paused;
animation-iteration-count: 0;
}
article.mypage_top .btn_language .ico_arrow::before,
article.mypage_top .btn_language .ico_arrow::after {
display: block;
position: relative;
left: -4px;
width: 5px;
height: 1px;
background: #171717;
transition: .1s ease-in-out;
content: '';
}
article.mypage_top .btn_language .ico_arrow::before {
top: 1px;
transform: rotate(45deg)
}
article.mypage_top .btn_language .ico_arrow::after {
top: 0;
left: -1px;
transform: rotate(-45deg)
}
article.mypage_top .btn_language.on .ico_arrow::before {
transform: rotate(-45deg)
}
article.mypage_top .btn_language.on .ico_arrow::after {
transform: rotate(45deg)
}
article.mypage_top .array_list {
display: none;
box-sizing: border-box;
position: absolute;
top: 30px;
right: 0;
z-index: 1;
width: 100%;
padding: 5px 0;
border: 1px solid #e5e5e5;
background: #fff;
font-size: 14px;
text-align: center;
}
article.mypage_top .array_list li {
box-sizing: border-box;
padding: 9px 10px;
}
article.mypage_top .array_list li button {
display: block;
width: 100%;
font-size: 14px;
color: #666;
background: transparent;
}
article.mypage_top .array_list li button:hover {
color: #333;
text-decoration: underline;
}
article.mypage_content_area {
padding-top: 30px;
}
article.mypage_content_area .mypage_content {
display: none;
}
article.mypage_content_area .mypage_content.current {
display: block;
}
article.mypage_content_area .mypage_content .chart_area {
padding-bottom: 30px;
}
article.mypage_content_area .mypage_content .chart_area .chart_tit {
position: relative;
padding: 20px 0;
border-top: 1px solid rgba(23, 23, 23, 0.10);
}
article.mypage_content_area .mypage_content .chart_area .chart_tit strong {
box-sizing: border-box;
display: block;
padding: 0 40px;
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.mypage_content_area .mypage_content .chart_area .chart_tit .btn_month_area {
position: absolute;
top: 22px;
right: 40px;
font-size: 0;
}
article.mypage_content_area .mypage_content .chart_area .chart_tit .btn_month,
article.mypage_content_area .mypage_content .chart_area .chart_tit .view_month {
display: inline-block;
vertical-align: middle;
}
article.mypage_content_area .mypage_content .chart_area .chart_tit .btn_month {
position:relative;
width: 20px;
height: 20px;
}
article.mypage_content_area .mypage_content .chart_area .chart_tit .btn_month svg {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
fill: rgba(23,23,23,.5);
}
article.mypage_content_area .mypage_content .chart_area .chart_tit .view_month {
font-size: 15px;
font-weight: 500;
margin: 0 3px;
}
article.mypage_content_area .mypage_content .chart_area .my_chart_wrap {
position: relative;
height: 400px;
}
article.mypage_content_area .mypage_content .chart_area .my_chart {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
article.mypage_content_area .mypage_content .content_list_wrap {
position: relative;
padding: 25px 0;
background: #F7F7F7;
}
article.mypage_content_area .mypage_content .content_list_wrap .record_area {
box-sizing: border-box;
display: table;
width: 100%;
padding: 0 50px;
table-layout: fixed;
}
article.mypage_content_area .mypage_content .content_list_wrap .record_txt {
display: table-cell;
width: 25%;
color: #171717;
text-align: center;
font-size: 25px;
font-weight: 400;
line-height: 1.5;
vertical-align: middle;
}
article.mypage_content_area .mypage_content .content_list_wrap .record_txt p {
font-size: 25px;
}
article.mypage_content_area .mypage_content .content_list_wrap .record_txt span {
display: block;
font-size: 20px;
}
article.mypage_content_area .mypage_content .content_list_wrap .record_list {
display: table-cell;
width: 65%;
}
article.mypage_content_area .mypage_content .content_list {
box-sizing: border-box;
display: table;
width: 100%;
padding: 0 20px;
table-layout: fixed;
}
article.mypage_content_area .mypage_content .content_list.list_type2 {
padding: 0;
}
article.mypage_content_area .mypage_content .content_list.list_type2 .content_item .content_name {
margin-top: 0;
}
article.mypage_content_area .mypage_content .content_list.list_type2 .content_item + .content_item::before {
height: 80px;
margin-top: -40px;
}
article.mypage_content_area .mypage_content .chart_area + .content_list_wrap {
background: none;
}
article.mypage_content_area .mypage_content .content_item {
box-sizing: border-box;
display: table-cell;
width: 25%;
position: relative;
text-align: center;
vertical-align: top;
}
article.mypage_content_area .mypage_content .content_item + .content_item {
width: 75%;
}
article.mypage_content_area .mypage_content .content_list.list_type2 .content_item + .content_item {
width: 33.33333%;
}
article.mypage_content_area .mypage_content .content_item .btn_array {
display: block;
margin: 0 auto;
background: transparent;
transition: .2s;
}
article.mypage_content_area .mypage_content .content_item + .content_item::before {
position: absolute;
top: 50%;
left: 0;
width: 1px;
height: 120px;
margin-top: -60px;
background: #E2E2E2;
content: '';
}
article.mypage_content_area .mypage_content .content_item .content_ico {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 60px;
height: 60px;
text-align: center;
border-radius: 60px;
border: 1px solid #fff;
background: #fff;
}
article.mypage_content_area .mypage_content .content_item .content_ico::before {
display: inline-block;
vertical-align: middle;
height: 100%;
content: '';
}
article.mypage_content_area .mypage_content .content_item .content_ico svg {
display: inline-block;
width: 32px;
height: 32px;
vertical-align: middle;
}
article.mypage_content_area .mypage_content .content_item .content_inner_item {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 240px;
vertical-align: top;
}
article.mypage_content_area .mypage_content .content_item .content_inner_item + .content_inner_item::before {
position: absolute;
top: 50%;
left: 0;
width: 1px;
height: 104px;
margin-top: -52px;
background: #E2E2E2;
content: '';
}
article.mypage_content_area .mypage_content .content_item .content_inner_item:last-child .content_ico svg {
width: 40px;
height: 40px;
}
article.mypage_content_area .mypage_content .scroll_kh + .content_list_wrap .content_item .content_inner_item:last-child .content_ico svg {
width: 32px;
height: 32px;
}
article.mypage_content_area .mypage_content .content_item .content_name {
margin-top: 10px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.mypage_content_area .mypage_content .content_item .content_count {
margin-top: 6px;
color: #171717;
font-size: 30px;
font-weight: 400;
line-height: 1.5;
}
article.mypage_content_area .mypage_content .content_item .btn_array:hover .content_ico {
border-color: rgba(0, 0, 0, 0.4);
}
article.mypage_content_area .mypage_content .content_item .btn_array:hover .content_name {
color: #1d9bf0;
}
article.mypage_content_area .mypage_content .content_item .btn_array:hover .content_count {
color: #1d9bf0;
}
article.mypage_content_area .mypage_content .content_item .btn_array:disabled .content_ico,
article.mypage_content_area .mypage_content .content_item .btn_array[disabled] .content_ico {
border: none;
}
article.mypage_content_area .mypage_content .content_item .btn_array:disabled .content_name,
article.mypage_content_area .mypage_content .content_item .btn_array[disabled] .content_name {
font-weight: 500;
}
article.mypage_content_area .mypage_content .content_item .btn_array:disabled .content_count,
article.mypage_content_area .mypage_content .content_item .btn_array[disabled] .content_count {
color: #666;
}
article.mypage_content_area .mypage_content .content_list_wrap .subscribe_setting {
position: absolute;
bottom: 18px;
right: 18px;
}
article.mypage_content_area .mypage_content .content_list_wrap .subscribe_setting .btn_subscribe_setting {
box-sizing: border-box;
display: block;
width: 35px;
height: 35px;
padding: 6px;
border: 1px solid #DCDCDC;
border-radius: 50px;
background: #fff;
transition: .1s;
}
article.mypage_content_area .mypage_content .content_list_wrap .subscribe_setting .btn_subscribe_setting:hover {
border-color: #999;
}
article.mypage_content_area .mypage_content .content_list_wrap .subscribe_setting .btn_subscribe_setting svg {
display: block;
fill: #999;
}
article.mypage_content_area .mypage_content .news_area {
position: relative;
padding: 40px 120px 0;
}
article.mypage_content_area .mypage_content .news_area + .news_area {
padding: 100px 40px 0;
}
article.mypage_content_area .mypage_content .tab_title_link {
padding: 20px 0;
border-top: 1px solid rgba(23, 23, 23, 0.10);
}
article.mypage_content_area .mypage_content .tab_title_link li {
box-sizing: border-box;
display: inline-block;
min-width: 150px;
padding: 0 20px;
}
article.mypage_content_area .mypage_content .tab_title_link li span {
box-sizing: border-box;
display: block;
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
text-align: center;
}
article.mypage_content_area .mypage_content .tab_title_link li a {
box-sizing: border-box;
display: block;
color: rgba(23, 23, 23, 0.50);
font-size: 16px;
font-weight: 700;
line-height: 1.5;
text-align: center;
}
article.mypage_content_area .mypage_content .tab_title_link li a:hover {
color: #666;
}
article.mypage_content_area .mypage_content .tab_title_link li a i {
display: inline-block;
margin-left: 12px;
vertical-align: middle;
}
article.mypage_content_area .mypage_content .tab_title_link li a i::before,
article.mypage_content_area .mypage_content .tab_title_link li a i::after {
display: block;
position: relative;
left: -4px;
width: 7px;
height: 1px;
background: #999;
content: '';
}
article.mypage_content_area .mypage_content .tab_title_link li a:hover i::before,
article.mypage_content_area .mypage_content .tab_title_link li a:hover i::after {
background: #666;
}
article.mypage_content_area .mypage_content .tab_title_link li a i::before {
top: -1px;
transform: rotate(45deg)
}
article.mypage_content_area .mypage_content .tab_title_link li a i::after {
top: -2px;
left: 1px;
transform: rotate(-45deg)
}
article.mypage_content_area .mypage_content .tab_title_link li a.scroll_top i::before {
top: 0;
transform: rotate(-45deg)
}
article.mypage_content_area .mypage_content .tab_title_link li a.scroll_top i::after {
top: -1px;
transform: rotate(45deg)
}
article.mypage_content_area .news_area .news_list {
margin-top: 35px;
font-size: 0;
}
article.mypage_content_area .news_area .news_list li {
box-sizing: border-box;
position: relative;
padding: 20px 0;
vertical-align: top;
}
article.mypage_content_area .news_area .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.mypage_content_area .news_area .news_list li:first-child {
padding-top: 0;
}
article.mypage_content_area .news_area .news_list a {
display: block;
font-size: 0;
}
article.mypage_content_area .news_area .news_list a.btn_add {
width: calc(100% - 36px);
}
article.mypage_content_area .news_area .news_list .news_img {
display: inline-block;
position: relative;
width: 25%;
height: 140px;
}
article.mypage_content_area .news_area .news_list .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.mypage_content_area .news_area .news_list .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.mypage_content_area .news_area .news_list .btn_check_list {
position: absolute;
top: 19px;
right: 0;
font-size: 0;
z-index: 1;
}
article.mypage_content_area .news_area .news_list li:first-child .btn_check_list {
top: -1px;
}
article.mypage_content_area .news_area .news_list .btn_check_list li {
margin-bottom: 6px;
padding: 0;
}
article.mypage_content_area .news_area .news_list .btn_check_list li + li {
border-top: 0;
}
article.mypage_content_area .news_area .news_list .btn_check_list li button {
width: 24px;
height: 24px;
background: transparent;
}
article.mypage_content_area .news_area .news_list .btn_check_list li button svg {
stroke-width: 2px;
}
article.mypage_content_area .news_area .news_list .btn_check_list li button.btn_bookmark svg {
width: 16px;
fill: #171717;
stroke: #171717;
}
article.mypage_content_area .news_area .news_list .btn_check_list li button.btn_recommend svg {
width: 18px;
height: 17px;
fill: #EE6173;
stroke: #EE6173;
}
article.mypage_content_area .news_area .news_list .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 75%;
padding-right: 20px;
vertical-align: top;
}
article.mypage_content_area .news_area .news_list a.no_img .news_txt {
width: 100%;
padding-right: 0;
}
article.mypage_content_area .news_area .news_list .category {
font-size: 13px;
font-style: normal;
font-weight: 600;
line-height: 150%;
}
article.mypage_content_area .news_area .news_list .category em {
display: inline-block;
color: #1d9bf0;
vertical-align: middle;
}
article.mypage_content_area .news_area .news_list .category span {
display: inline-block;
margin-left: 8px;
color: rgba(23, 23, 23, 0.60);
vertical-align: middle;
}
article.mypage_content_area .news_area .news_list .date {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.mypage_content_area .news_area .news_list .date .editor {
display: inline-block;
margin-left: 6px;
}
article.mypage_content_area .news_area .news_list .news_title {
margin-top: 6px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.mypage_content_area .news_area .news_list .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.mypage_content_area .news_area .news_list .news_text {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.mypage_content_area .news_area .nodata {
margin-top: 35px;
padding: 50px 0;
text-align: center;
}
article.mypage_content_area .news_area .nodata strong {
color: #171717;
font-size: 20px;
font-weight: 500;
line-height: 1.5;
}
article.mypage_content_area .news_area .nodata p {
margin-top: 10px;
color: rgba(23, 23, 23, 0.60);
font-size: 15px;
font-weight: 500;
line-height: 1.5;
}
article.mypage_content_area .hidden_wrap {
display: table;
width: 100%;
table-layout: fixed;
}
article.mypage_content_area .hidden_wrap .news_area {
display: table-cell;
width: calc(100% - 28px);
padding: 50px 80px 0 52px;
}
article.mypage_content_area .newspaper_info {
box-sizing: border-box;
padding: 30px;
background: #F7F7F7;
}
article.mypage_content_area .newspaper_info strong {
color: #171717;
font-size: 28px;
font-weight: 500;
line-height: 1.3;
letter-spacing: -0.56px;
}
article.mypage_content_area .newspaper_info p {
margin-top: 40px;
color: rgba(23, 23, 23, 0.70);
font-size: 15px;
font-weight: 400;
line-height: 1.5;
}
article.mypage_content_area .newspaper_subscribe {
display: table;
width: 100%;
padding-bottom: 60px;
table-layout: fixed;
}
article.mypage_content_area .newspaper_subscribe .newspaper_subscribe_item {
box-sizing: border-box;
display: table-cell;
width: 50%;
padding: 50px 15px 0 0;
}
article.mypage_content_area .newspaper_subscribe .newspaper_subscribe_item + .newspaper_subscribe_item {
padding: 50px 0 0 15px;
}
article.mypage_content_area .newspaper_subscribe .item_title {
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.mypage_content_area .newspaper_subscribe .item_box {
box-sizing: border-box;
height: 710px;
margin-top: 30px;
padding: 25px;
border: 1px solid #e8e8e8;
border-radius: 5px;
}
article.mypage_content_area .newspaper_subscribe .box_title {
padding: 0 20px;
color: #171717;
font-size: 18px;
font-weight: 600;
line-height: 1.5;
}
article.mypage_content_area .newspaper_subscribe .box_title span {
color: #1d9bf0;
}
article.mypage_content_area .newspaper_subscribe .submit_list {
padding-top: 20px;
}
article.mypage_content_area .newspaper_subscribe .submit_item {
box-sizing: border-box;
display: table;
width: 100%;
padding: 20px;
border-top: 1px solid #e8e8e8;
table-layout: fixed;
}
article.mypage_content_area .newspaper_subscribe .submit_item:first-child {
border-top: 0;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_tltle {
box-sizing: border-box;
display: table-cell;
width: 30%;
padding-right: 10px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_tltle i {
display: inline-block;
margin-left: 5px;
color: #FA0707;
font-size: 16px;
vertical-align: middle;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text {
display: table-cell;
width: 70%;
vertical-align: middle;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text span {
display: inline-block;
padding: 0 10px 0 0;
color: #171717;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
vertical-align: middle;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text input {
box-sizing: border-box;
display: inline-block;
width: 100%;
height: 35px;
padding: 5px 15px;
color: #171717;
font-size: 15px;
border: 1px solid #e8e8e8;
vertical-align: middle;
transition: .2s;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text input:focus {
outline: none;
border-color: rgba(0, 0, 0, 0.4);
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text input.inp_short {
max-width: 80px;
text-align: center;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text input + span {
padding: 0 0 0 10px;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .datepicker_wrap {
position: relative;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .datepicker_wrap i {
position: absolute;
top: 5px;
right: 10px;
width: 24px;
height: 24px;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .datepicker_wrap i svg {
display: inline-block;
width: 24px;
height: 24px;
fill: rgba(0, 0, 0, 0.2);
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .datepicker_wrap input:focus + i svg {
fill: rgba(0, 0, 0, 0.4);
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .phone_list {
font-size: 0;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .phone_list li {
box-sizing: border-box;
display: inline-block;
width: 30%;
position: relative;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .phone_list li + li {
width: 35%;
padding-left: 15px;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .phone_list li + li::before {
position: absolute;
top: 50%;
left: 5px;
width: 6px;
height: 1px;
background: #e8e8e8;
content: '';
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .address_list li + li {
margin-top: 6px;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .address_list li .post {
position: relative;
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .address_list li .post input {
width: calc(100% - 90px);
}
article.mypage_content_area .newspaper_subscribe .submit_item .submit_text .address_list li .post button {
position: absolute;
top: 0;
right: 0;
width: 80px;
height: 35px;
padding: 0 10px;
color: #fff;
font-size: 13px;
font-style: normal;
font-weight: 500;
line-height: 1.5;
background: #171717;
}
article.mypage_content_area .newspaper_subscribe .item_box .btn_area {
padding: 20px 0 20px;
text-align: center;
}
article.mypage_content_area .newspaper_subscribe .item_box .btn_area button {
display: inline-block;
width: 50%;
height: 35px;
padding: 0 10px;
color: #fff;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 1.5;
background: #171717;
}
article.mypage_content_area .tbl_newspaper {
position: relative;
margin-top: 40px;
border-bottom: 1px solid #e8e8e8;
}
article.mypage_content_area .tbl_newspaper table {
box-sizing: border-box;
width: 100%;
table-layout: fixed;
border-collapse: collapse;
}
article.mypage_content_area .tbl_newspaper table thead {
background: #F7F7F7;
}
article.mypage_content_area .tbl_newspaper th,
article.mypage_content_area .tbl_newspaper td {
box-sizing: border-box;
padding: 10px;
color: #171717;
font-size: 16px;
font-weight: 400;
text-align: center;
line-height: 1.5;
border-top: 1px solid #e8e8e8;
}
article.mypage_content_area .tbl_newspaper th + th,
article.mypage_content_area .tbl_newspaper td + td {
border-left: 1px solid #e8e8e8;
}
article.mypage_content_area .tbl_newspaper tr.fin td {
color: rgba(23, 23, 23, 0.60);
}
article.mypage_content_area .tbl_newspaper tr:hover {
position: relative;
cursor: pointer;
background: #F7F7F7;
transition: .2s;
}
article.mypage_content_area .tbl_newspaper tr:hover td {
color: #1d9bf0;
}
article.mypage_content_area .tbl_newspaper + .pagenation {
margin-top: 40px;
}
article.mypage_content_area .tbl_newspaper + .pagenation .btn_prev,
article.mypage_content_area .tbl_newspaper + .pagenation .btn_next {
width: 28px;
height: 28px;
}
article.mypage_content_area .tbl_newspaper + .pagenation .btn_prev svg,
article.mypage_content_area .tbl_newspaper + .pagenation .btn_next svg {
width: 6px;
height: 10px;
}
article.mypage_content_area .tbl_newspaper + .pagenation ul a {
width: 28px;
height: 28px;
min-width: 28px;
min-height: 28px;
font-size: 12px;
line-height: 28px;
}
article.mypage_content_area .pop_newspaper_info {
display: none;
box-sizing: border-box;
position: absolute;
top: -73px;
right: -10px;
width: 300px;
padding: 20px 30px;
border: 1px solid #e8e8e8;
border-radius: 5px;
background: #fff;
}
article.mypage_content_area .pop_newspaper_info.on {
display: block;
}
article.mypage_content_area .pop_newspaper_info strong.pop_title {
color: #171717;
font-size: 20px;
font-weight: 500;
line-height: 1.5;
}
article.mypage_content_area .pop_newspaper_info em.pop_title {
display: block;
margin-top: 8px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.mypage_content_area .pop_newspaper_info em.pop_title span {
color: #1d9bf0;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list {
margin-top: 10px;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li {
box-sizing: border-box;
display: table;
width: 100%;
padding: 10px 0;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
table-layout: fixed;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li + li {
border-top: 1px solid #e8e8e8;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li em {
display: table-cell;
width: 38%;
padding-right: 10px;
color: #171717;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li p {
display: table-cell;
width: 58%;
padding-right: 10px;
color: rgba(23, 23, 23, 0.60);
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li.address {
display: block;
width: 100%;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li.address em {
display: block;
width: 100%;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li.address p {
display: block;
width: 100%;
line-height: 1.6;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li.address p span {
display: inline-block;
margin-right: 5px;
}
article.mypage_content_area .pop_newspaper_info .newspaper_info_list li.address em + p {
margin-top: 5px;
}
article.mypage_content_area .pop_newspaper_info .btn_del {
position: absolute;
top: 10px;
right: 10px;
width: 15px;
height: 15px;
}
article.mypage_content_area .pop_newspaper_info .btn_del i {
display: block;
width: 16px;
height: 16px;
}
article.mypage_content_area .pop_newspaper_info .btn_del i::before,
article.mypage_content_area .pop_newspaper_info .btn_del i::after {
position: absolute;
left: 8px;
width: 1px;
height: 16px;
background: #111;
content: '';
}
article.mypage_content_area .pop_newspaper_info .btn_del i:before {
transform: rotate(45deg);
}
article.mypage_content_area .pop_newspaper_info .btn_del i:after {
transform: rotate(-45deg);
}
article.mypage_content_area .newspaper_contact {
box-sizing: border-box;
position: relative;
margin-bottom: 130px;
padding: 20px 30px;
font-size: 0;
background: #F7F7F7;
}
article.mypage_content_area .newspaper_contact .contact_item {
display: inline-block;
margin-right: 30px;
}
article.mypage_content_area .newspaper_contact .contact_item i {
display: inline-block;
width: 24px;
height: 24px;
margin-right: 10px;
vertical-align: middle;
}
article.mypage_content_area .newspaper_contact .contact_item i svg {
display: block;
width: 24px;
}
article.mypage_content_area .newspaper_contact .contact_item span {
color: #171717;
font-size: 16px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.mypage_content_area .newspaper_contact .btn_online {
position: absolute;
top: 50%;
right: 30px;
display: block;
margin-top: -16px;
padding: 4px 15px 5px;
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
border-radius: 3px;
border: 1px solid #171717;
background: #fff;
}
article.mypage_content_area .news_area .section_title {
padding: 0 0 20px;
border-bottom: 1px solid #171717;
}
.btn_hidden_area .btn_hidden {
display: block;
width: 28px;
height: 120px;
border: 1px solid rgba(23, 23, 23, 0.3);
border-radius: 0 10px 10px 0;
background: #fff;
transition: .2s;
}
.btn_hidden_area .btn_hidden i {
display: inline-block;
vertical-align: middle;
}
.btn_hidden_area .btn_hidden i svg {
display: inline-block;
width: 16px;
height: 16px;
fill: rgba(23, 23, 23, 0.3);
}
.btn_hidden_area .btn_hidden i.ico_open {
display: block;
}
.btn_hidden_area .btn_hidden i.ico_close {
display: none;
}
.btn_hidden_area .btn_hidden.on i.ico_open {
display: none;
}
.btn_hidden_area .btn_hidden.on i.ico_close {
display: block;
}
.btn_hidden:hover {
border-color: rgba(23, 23, 23, 0.8);
}
.btn_hidden_area .btn_hidden:hover i svg {
fill: #171717;
}
.pop_subscribe_setting {
box-sizing: border-box;
display: none;
position: absolute;
top: 45px;
right: -6px;
width: 320px;
padding: 18px 0 15px;
border: 1px solid rgba(23, 23, 23, 0.30);
z-index: 2;
background: #fff;
}
.pop_subscribe_setting strong {
display: block;
padding: 0 20px;
color: #171717;
font-size: 18px;
font-weight: 500;
line-height: 1.5;
}
.pop_subscribe_setting .pop_tab_list {
margin-top: 15px;
padding: 0 20px;
font-size: 0;
}
.pop_subscribe_setting .pop_tab_list li {
display: inline-block;
}
.pop_subscribe_setting .pop_tab_list li + li {
margin-left: 6px;
}
.pop_subscribe_setting .pop_tab_list li button {
padding: 4px 10px 5px;
color: #171717;
text-align: center;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
border-radius: 3px;
border: 1px solid #171717;
background: transparent;
transition: .2s;
}
.pop_subscribe_setting .pop_tab_list li.current button,
.pop_subscribe_setting .pop_tab_list li button:hover {
color: #fff;
background: #171717;
}
.pop_subscribe_setting .pop_tab_content {
display: none;
padding-top: 18px;
}
.pop_subscribe_setting .pop_tab_content.current {
display: block;
}
.pop_subscribe_setting .pop_tab_content .subscribe_count {
padding: 0 20px 6px;
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
.pop_subscribe_setting .pop_tab_content .subscribe_count em {
display: inline-block;
margin-left: 5px;
}
.pop_subscribe_setting .pop_tab_content .subscribe_list_wrap {
padding: 0 10px 0 20px;
}
.pop_subscribe_setting .pop_tab_content .subscribe_list_area {
position: relative;
overflow-y: auto;
min-height: 180px;
max-height: 180px;
padding-right: 15px;
scrollbar-width: thin;
scrollbar-color: #171717 #fff;
}
.pop_subscribe_setting .pop_tab_content .no_subscribe {
height: 180px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.4;
text-align: center;
}
.pop_subscribe_setting .pop_tab_content .no_subscribe::before {
display: inline-block;
height: 100%;
vertical-align: middle;
content: '';
}
.pop_subscribe_setting .pop_tab_content .subscribe_list {
margin-top: 0px;
}
.pop_subscribe_setting .pop_tab_content .subscribe_list li {
position: relative;
padding: 10px 0;
border-bottom: 1px solid #e8e8e8;
}
.pop_subscribe_setting .pop_tab_content .subscribe_list li em {
display: block;
width: calc(100% - 15px);
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
.pop_subscribe_setting .pop_tab_content .subscribe_list li .btn_del {
position: absolute;
top: 50%;
right: 0;
width: 10px;
height: 10px;
margin-top: -5px;
background: transparent;
}
.pop_subscribe_setting .pop_tab_content .subscribe_list li .btn_del i {
position: relative;
}
.pop_subscribe_setting .pop_tab_content .subscribe_list li .btn_del i::before,
.pop_subscribe_setting .pop_tab_content .subscribe_list li .btn_del i::after {
position: absolute;
top: -1px;
left: -6px;
width: 12px;
height: 1px;
background: #171717;
}
.pop_subscribe_setting .pop_tab_content .subscribe_list li .btn_del i::before {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
content: '';
}
.pop_subscribe_setting .pop_tab_content .subscribe_list li .btn_del i::after {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
content: '';
}
.pop_subscribe_setting .pop_tab_content .btn_area {
padding: 10px 0 8px;
text-align: center;
}
.pop_subscribe_setting .pop_tab_content .btn_direct {
display: inline-block;
padding: 4px 12px 4px;
border-radius: 22px;
border: 1px solid rgba(23, 23, 23, 0.50);
background: #fff;
transition: .2s;
}
.pop_subscribe_setting .pop_tab_content .btn_direct em {
display: inline-block;
color: #171717;
font-size: 12px;
font-weight: 600;
line-height: 1.4;
vertical-align: middle;
}
.pop_subscribe_setting .pop_tab_content .btn_direct i {
display: inline-block;
margin-left: 5px;
vertical-align: middle;
}
.pop_subscribe_setting .pop_tab_content .btn_direct i svg {
width: 5px;
height: 10px;
stroke: #171717;
}
.pop_subscribe_setting .pop_tab_content .btn_direct:hover {
background: #171717;
}
.pop_subscribe_setting .pop_tab_content .btn_direct:hover em {
color: #fff;
}
.pop_subscribe_setting .pop_tab_content .btn_direct:hover i svg {
stroke: #fff;
}
.pop_subscribe_setting .btn_close {
position: absolute;
top: 15px;
right: 15px;
width: 15px;
height: 15px;
}
.pop_subscribe_setting .btn_close i {
display: block;
width: 16px;
height: 16px;
}
.pop_subscribe_setting .btn_close i::before,
.pop_subscribe_setting .btn_close i::after {
position: absolute;
left: 8px;
width: 1px;
height: 16px;
background: #111;
content: '';
}
.pop_subscribe_setting .btn_close i:before {
transform: rotate(45deg);
}
.pop_subscribe_setting .btn_close i:after {
transform: rotate(-45deg);
}
section.mypage_bottom {
display: table;
position: relative;
width: 1180px;
margin-left: -25px;
padding: 90px 0 120px;
table-layout: fixed;
}
section.mypage_bottom::before {
position: absolute;
top: 90px;
left: 25px;
right: 25px;
height: 1px;
background: #171717;
content: '';
}
section.mypage_bottom article {
box-sizing: border-box;
display: table-cell;
position: relative;
width: 33.33333%;
padding: 20px 25px 0;
vertical-align: top;
}
section.mypage_bottom article.serial_news,
section.mypage_bottom article.premium_content + article.series_swiper_area {
margin-top: 0;
}
section.mypage_bottom article.shorts strong.section_title {
color: #171717;
}
section.mypage_bottom article.shorts .swiper_wrap {
margin-left: 0;
}
section.mypage_bottom article.shorts .recommend_swiper {
padding-left: 0;
}
section.mypage_bottom article.shorts .recommend_swiper .shorts_list li a .special_img {
height: 233px;
}
section.mypage_bottom article.shorts .recommend_swiper .shorts_list li a .special_txt {
margin-top: 10px;
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
section.mypage_bottom article.shorts .swiper-button-prev2,
section.mypage_bottom article.shorts .swiper-button-next2 {
margin-top: -40px;
}
section.mypage_bottom article.shorts .swiper-button-prev2 {
left: var(--swiper-navigation-sides-offset,-16px);
right: auto;
}
section.mypage_bottom article + article::before {
position: absolute;
top: 84px;
left: 0;
bottom: 0;
width: 1px;
background: #e8e8e8;
content: '';
}
section.mypage_bottom article.series_swiper_area .swiper_wrap {
min-height: 300px;
z-index: 0;
}
section.mypage_bottom article.serial_news .btn_swiper {
top: 59px;
right: 25px;
}
article.newsletter_swiper_area .swiper_wrap {
box-sizing: border-box;
position: relative;
padding: 10px;
}
article.newsletter_swiper_area .newsletter_swiper {
overflow: hidden;
}
article.newsletter_swiper_area .swiper-button-next9,
article.newsletter_swiper_area .swiper-button-prev9 {
top: 106px !important;
width: 30px;
height: 30px;
border-radius: 20px;
border: 1px solid #DADCDF;
z-index: 2;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
}
article.newsletter_swiper_area .swiper-button-next9 {
right: var(--swiper-navigation-sides-offset,-6px);
left: auto;
}
article.newsletter_swiper_area .swiper-button-prev9 {
left: var(--swiper-navigation-sides-offset,-6px);
right: auto;
}
article.newsletter_swiper_area .swiper-button-next9:after,
article.newsletter_swiper_area .swiper-button-prev9:after {
color: #171717;
font-size: 10px;
}
article.newsletter_swiper_area .swiper-button-next9:after {
padding-left: 2px;
}
article.newsletter_swiper_area .swiper-button-prev9:after {
padding-right: 2px;
}
article.newsletter_swiper_area .newsletter_swiper a {
display: block;
text-align: center;
}
article.newsletter_swiper_area .newsletter_swiper a .series_img {
display: block;
width: 100%;
margin: 0 auto;
}
article.newsletter_swiper_area .newsletter_swiper a .series_img img {
display: inline-block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.newsletter_swiper_area .newsletter_swiper a .series_title {
margin-top: 16px;
color: #171717;
font-size: 18px;
font-weight: 500;
line-height: 1.5;
text-align: left;
}
article.newsletter_swiper_area .newsletter_swiper a .series_title em {
vertical-align: middle;
}
article.newsletter_swiper_area .newsletter_swiper a .series_title .lock {
display: inline-block;
vertical-align: middle;
}
article.newsletter_swiper_area .newsletter_swiper a .series_title .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
article.newsletter_swiper_area .newsletter_swiper a .series_text {
margin-top: 6px;
color: rgba(23, 23, 23, 0.60);
font-size: 15px;
font-weight: 500;
line-height: 1.5;
text-align: left;
}
main.subscribe_main {
position: relative;
max-width: 100%;
padding-top: 70px;
background-size: cover;
}
main.subscribe_main::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(23, 23, 23, 0.60);
-webkit-backdrop-filter: blur(400px);
backdrop-filter: blur(400px);
content: '';
}
main.subscribe_main .subscribe_top {
position: relative;
max-width: 1130px;
margin: 0 auto;
padding: 50px 0 100px;
}
main.subscribe_main .subscribe_top p {
color: #fff;
font-size: 28px;
font-weight: 500;
line-height: 1.3;
text-align: center;
letter-spacing: -0.56px;
}
main.subscribe_main .subscribe_top p + p {
margin-top: 8px;
}
main.subscribe_main .subscribe_top .ico_arrow span {
box-sizing: border-box;
position: absolute;
bottom: 57px;
left: 50%;
width: 16px;
height: 16px;
margin-left: -12px;
border-left: 1px solid #fff;
border-bottom: 1px solid #fff;
transform: rotate(-45deg);
animation:arrow_motion 2s infinite;
opacity: 0;
}
main.subscribe_main .subscribe_top .ico_arrow span:first-child {
animation-delay: 0s;
}
main.subscribe_main .subscribe_top .ico_arrow span:last-child {
bottom: 47px;
animation-delay: .1s;
}
@keyframes arrow_motion {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
main.subscribe {
padding-top: 0;
}
main.subscribe_main .subscribe_top .btn_subscribe {
position: absolute;
bottom: 30px;
right: 0;
padding: 4px 20px 5px;
color: #171717;
text-align: center;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
border: 1px solid #171717;
background: #fff;
}
main.subscribe article.weekly_schedule .schedule_content .schedule_content_list li a {
height: 387px;
text-align: center;
}
main.subscribe article.weekly_schedule .schedule_content .schedule_content_list .btn_subscribe {
box-sizing: border-box;
display: block;
position: relative;
z-index: 1;
margin: 20px auto 0;
padding: 7px 14px 6px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
main.subscribe article.weekly_schedule .schedule_content .schedule_content_list .btn_subscribe:hover,
main.subscribe article.weekly_schedule .schedule_content .schedule_content_list .btn_subscribe.subscribe {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
article.subscribe_series .series_tab_list {
display: table;
width: 100%;
table-layout: fixed;
}
article.subscribe_series .series_tab_list .tab_link {
display: table-cell;
width: 20%;
text-align: center;
}
article.subscribe_series .series_tab_list .tab_link a {
display: block;
padding: 13px 5px;
color: #FFF;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
background: #171717;
transition: .1s;
}
article.subscribe_series .series_tab_list .tab_link a em {
box-sizing: border-box;
display: inline-block;
margin-right: 5px;
padding: 2px 6px;
color: #171717;
text-align: center;
font-size: 12px;
font-weight: 700;
line-height: normal;
vertical-align: middle;
border-radius: 13px;
border: 1px solid #171717;
background: #fff;
}
article.subscribe_series .series_tab_list .tab_link a:hover,
article.subscribe_series .series_tab_list .tab_link.current a {
background: #666;
}
article.subscribe_series .series_tab_content {
display: none;
padding-bottom: 60px;
}
article.subscribe_series .series_tab_content.current {
display: block;
}
article.subscribe_series .series_list {
margin-top: 60px;
font-size: 0;
text-align: center;
border-top: 1px solid #171717;
}
article.subscribe_series .series_list li {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
max-width: 370px;
padding: 0 20px;
vertical-align: top;
}
article.subscribe_series .series_list li .time {
position: relative;
padding-top: 20px;
}
article.subscribe_series .series_list li .time::before {
position: absolute;
top: -6px;
left: 50%;
width: 12px;
height: 12px;
margin-left: -8px;
border-radius: 15px;
background: #787878;
transition: .2s;
content: '';
}
article.subscribe_series .series_list li .time em {
position: relative;
display: block;
color: #787878;
text-align: center;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: normal;
transition: .2s;
}
article.subscribe_series .series_list li .time i {
display: inline-block;
width: 24px;
height: 24px;
}
article.subscribe_series .series_list li .time i svg {
display: block;
width: 24px;
height: 24px;
fill: #787878;
}
article.subscribe_series .series_list li.time_on .time::before,
article.subscribe_series .series_list li:hover .time::before {
background: #171717;
}
article.subscribe_series .series_list li.time_on .time em,
article.subscribe_series .series_list li:hover .time em {
color: #171717;
}
article.subscribe_series .series_list li.time_on .time i svg,
article.subscribe_series .series_list li:hover .time i svg {
fill: #171717;
}
article.subscribe_series .series_list li .time + a {
margin-top: 8px;
}
article.subscribe_series .series_list li .today_series_item {
box-sizing: border-box;
display: block;
padding: 15px;
border: 1px solid #E8E8E8;
border-radius: 5px;
background: #fff;
transition: .2s;
}
article.subscribe_series .series_list li .today_series_item:hover {
border-color: #171717;
}
article.subscribe_series .series_list li .today_series_item a {
display: block;
}
article.subscribe_series .series_list li .today_series_item .news_img {
overflow: hidden;
display: block;
position: relative;
height: 280px;
}
article.subscribe_series .series_list li .today_series_item .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
border-radius: 5px;
content: '';
}
article.subscribe_series .series_list li .today_series_item .news_img::after {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border-radius: 5px;
background: linear-gradient(180deg, rgba(23, 23, 23, 0.10) 0%, rgba(23, 23, 23, 0.30) 50%, rgba(23, 23, 23, 0.70) 70%, rgba(23, 23, 23, 0.90) 100%);
content: '';
}
article.subscribe_series .series_list li .today_series_item .news_img img {
display: block;
width: 100%;
height: 100%;
border-radius: 5px;
object-fit: cover;
object-position: top;
transition: .3s;
}
article.subscribe_series .series_list li .today_series_item:hover .news_img img {
transform: scale(1.1);
}
article.subscribe_series .series_list li .today_series_item .news_img .news_title {
position: absolute;
left: 20px;
right: 20px;
bottom: 25px;
color: #fff;
font-size: 16px;
font-weight: 500;
text-align: left;
line-height: 1.5;
z-index: 1;
}
article.subscribe_series .series_list li .today_series_item .news_info {
position: relative;
padding-top: 15px;
text-align: left;
}
article.subscribe_series .series_list li .today_series_item .news_info .news_category {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.subscribe_series .series_list li .today_series_item .news_info .news_category + .lock {
display: inline-block;
vertical-align: middle;
}
article.subscribe_series .series_list li .today_series_item .news_info .news_category + .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
article.subscribe_series .series_list li .today_series_item .news_info .btn_subscribe {
box-sizing: border-box;
position: absolute;
top: 12px;
right: 0;
min-width: 58px;
padding: 4px 0;
color: #fff;
text-align: center;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
border-radius: 2px;
border: 1px solid #171717;
background: #171717;
transition: .2s;
}
article.subscribe_series .series_list li .today_series_item .news_info .btn_subscribe:hover,
article.subscribe_series .series_list li .today_series_item .news_info .btn_subscribe.subscribe {
color: #171717;
background: #fff;
}
article.subscribe_series .series_list li .series_item {
box-sizing: border-box;
display: block;
padding: 30px 50px;
border: 1px solid #E8E8E8;
border-radius: 5px;
background: #fff;
transition: .2s;
}
article.subscribe_series .series_list li .series_item:hover {
border-color: #171717;
}
article.subscribe_series .series_list li .series_item .news_img {
display: block;
width: 150px;
margin: 0 auto;
}
article.subscribe_series .series_list li .series_item .news_img img {
display: inline-block;
width: 150px;
height: 150px;
object-fit: cover;
object-position: top;
}
article.subscribe_series .series_list li .series_item .news_title {
margin-top: 20px;
color: #171717;
font-size: 16px;
font-weight: 600;
line-height: 1.5;
}
article.subscribe_series .series_list li .series_item .news_title em {
vertical-align: middle;
}
article.subscribe_series .series_list li .series_item .news_title .lock {
display: inline-block;
vertical-align: middle;
}
article.subscribe_series .series_list li .series_item .news_title .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
article.subscribe_series .series_list li .series_item .news_text {
margin-top: 6px;
color: rgba(23, 23, 23, 0.60);
text-align: center;
font-size: 13px;
font-weight: 400;
line-height: 1.5;
}
article.subscribe_series .series_list li .series_item .btn_subscribe {
box-sizing: border-box;
min-width: 58px;
margin-top: 20px;
padding: 4px 0;
color: #fff;
text-align: center;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
border-radius: 2px;
border: 1px solid #171717;
background: #171717;
transition: .2s;
}
article.subscribe_series .series_list li .series_item .btn_subscribe:hover,
article.subscribe_series .series_list li .series_item .btn_subscribe.subscribe {
color: #171717;
background: #fff;
}
article.subscribe_serial .div_fixed {
margin-left: -30px;
}
article.subscribe_serial .serial_list {
padding-bottom: 60px;
font-size: 0;
text-align: left;
}
article.subscribe_serial .serial_list li {
box-sizing: border-box;
display: inline-block;
width: 25%;
padding: 0 0 30px 30px;
vertical-align: top;
}
article.subscribe_serial .serial_list li .serial_item {
box-sizing: border-box;
display: block;
padding: 30px 20px;
border: 1px solid #E8E8E8;
text-align: center;
background: #fff;
transition: .2s;
}
article.subscribe_serial .serial_list li .serial_item .news_img {
display: block;
width: 150px;
margin: 0 auto;
}
article.subscribe_serial .serial_list li .serial_item .news_img img {
display: inline-block;
width: 150px;
height: 150px;
object-fit: cover;
object-position: top;
}
article.subscribe_serial .serial_list li .serial_item .news_title {
margin-top: 20px;
color: #171717;
font-size: 16px;
font-weight: 600;
line-height: 1.5;
}
article.subscribe_serial .serial_list li .serial_item .news_title em {
vertical-align: middle;
}
article.subscribe_serial .serial_list li .serial_item .news_title .lock {
display: inline-block;
vertical-align: middle;
}
article.subscribe_serial .serial_list li .serial_item .news_title .lock svg {
display: block;
width: 16px;
height: 16px;
fill: #171717;
fill-opacity: .5;
}
article.subscribe_serial .serial_list li .serial_item .news_text {
margin-top: 6px;
color: rgba(23, 23, 23, 0.60);
text-align: center;
font-size: 13px;
font-weight: 400;
line-height: 1.5;
}
article.subscribe_serial .serial_list li .serial_item .btn_subscribe {
box-sizing: border-box;
display: block;
position: relative;
z-index: 1;
margin: 15px auto 0;
padding: 7px 14px 6px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.subscribe_serial .serial_list li .serial_item .btn_subscribe:hover,
article.subscribe_serial .serial_list li .serial_item .btn_subscribe.subscribe {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
article.subscribe_newsletter .div_fixed {
margin-left: -30px;
}
article.subscribe_newsletter .newsletter_list {
display: table;
width: 100%;
table-layout: fixed;
padding-bottom: 60px;
}
article.subscribe_newsletter .newsletter_list li {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding-left: 30px;
vertical-align: top;
z-index: 0;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item {
box-sizing: border-box;
display: block;
position: relative;
min-height: 372px;
padding: 20px;
text-align: center;
border: 1px solid #E8E8E8;
background: #fff;
transition: .2s;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .item_title {
display: block;
color: #222;
font-size: 18px;
font-weight: 500;
text-align: left;
line-height: 1.5;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .news_img {
display: block;
margin: 12px auto 0;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .news_img img {
display: inline-block;
width: 100%;
height: 150px;
object-fit: cover;
object-position: top;
border-radius: 5px;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .news_text {
color: rgba(23, 23, 23, 0.60);
text-align: center;
font-size: 14px;
font-weight: 400;
text-align: left;
line-height: 1.5;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .news_title + .news_text {
margin-top: 5px;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .title_date {
position: relative;
padding: 13px 0;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .title_date .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
text-align: left;
line-height: 1.7;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .title_date .date {
box-sizing: border-box;
display: inline-block;
padding: 4px 12px;
color: rgba(23, 23, 23, 0.60);
font-size: 12px;
font-weight: 600;
line-height: 1.4;
border-radius: 25px;
border: 1px solid #e8e8e8;
background: #fff;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .title_date .news_title + .date {
position: absolute;
top: 13px;
right: 0;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .btn_subscribe {
box-sizing: border-box;
display: inline-block;
z-index: 1;
margin-top: 10px;
padding: 7px 14px 6px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .btn_subscribe:hover,
article.subscribe_newsletter .newsletter_list li .newsletter_item .btn_subscribe.subscribe {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .subscribe_newsletter_swiper {
overflow: hidden;
position: relative;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .subscribe_newsletter_swiper .swiper-slide {
min-height: 290px;
padding: 0 0 46px 0;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .subscribe_newsletter_swiper .btn_subscribe {
position: absolute;
bottom: 0;
right: 0;
margin-top: 0;
z-index: 2;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .subscribe_newsletter_swiper .swiper-horizontal>.swiper-pagination-bullets,
article.subscribe_newsletter .newsletter_list li .newsletter_item .subscribe_newsletter_swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
bottom: var(--swiper-pagination-bottom,13px);
right: 0;
left: auto;
z-index: 1;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .subscribe_newsletter_swiper .swiper-horizontal>.swiper-pagination-bullets {
width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,10px));
height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,10px));
background: #e8e8e8;
}
article.subscribe_newsletter .newsletter_list li .newsletter_item .subscribe_newsletter_swiper .swiper-pagination-bullet-active {
background: #171717;
}
section.newsletter_top {
width: 100%;
max-width: 1130px;
margin: 0 auto;
}
article.newsletter_info {
box-sizing: border-box;
display: table;
width: 100%;
padding: 0 30px;
table-layout: fixed;
}
article.newsletter_info .newsletter_thumb {
display: table-cell;
width: 122px;
vertical-align: middle;
}
article.newsletter_info .newsletter_txt {
display: table-cell;
width: calc(100% - 122px);
padding-left: 25px;
text-align: left;
vertical-align: middle;
}
article.newsletter_info .newsletter_txt strong {
display: block;
color: #171717;
font-size: 32px;
font-weight: 700;
line-height: 1.3;
letter-spacing: -0.88px;
vertical-align: middle;
}
article.newsletter_info .newsletter_txt p {
margin-top: 10px;
color: #171717;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 1.4;
}
main.newsletter,
main.newsletter_main {
padding-top: 0;
}
main.newsletter_main section {
position: relative;
min-height: 320px;
}
main.newsletter_main section.section_today {
background:url('../image/bg_newsletter_today.jpg') no-repeat;
background-size: cover;
}
main.newsletter_main section::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba( 0, 0, 0, 0.7);
content: '';
}
article.newsletter_main_news {
box-sizing: border-box;
display: table;
position: relative;
width: 100%;
min-height: 320px;
padding: 50px;
table-layout: fixed;
}
article.newsletter_main_news .news_info {
box-sizing: border-box;
display: table-cell;
width: 32%;
padding-right: 40px;
vertical-align: top;
}
article.newsletter_main_news .news_info strong {
color: #fff;
font-size: 24px;
font-weight: 700;
line-height: 1.5;
}
article.newsletter_main_news .news_info .info_txt {
margin-top: 20px;
color: #fff;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
}
article.newsletter_main_news .news_info .info_date {
margin-top: 20px;
color: #fff;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
}
article.newsletter_main_news .news_info .btn_area {
margin-top: 30px;
}
article.newsletter_main_news .news_info .btn_area li {
display: inline-block;
}
article.newsletter_main_news .news_info .btn_area li + li {
margin-left: 10px;
}
article.newsletter_main_news .news_info .btn_area li button {
box-sizing: border-box;
display: block;
height: 34px;
padding: 6px 18px 6px;
border-radius: 22px;
border: 1px solid rgba(255, 255, 255, 0.30);
background: rgba(23, 23, 23, 0.20);
backdrop-filter: blur(150px);
transition: .2s;
}
article.newsletter_main_news .news_info .btn_area li button span {
display: inline-block;
color: #FFF;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.newsletter_main_news .news_info .btn_area li button.on_subscribe,
article.newsletter_main_news .news_info .btn_area li button:hover {
color: #171717;
background: #fff;
}
article.newsletter_main_news .news_info .btn_area li button.on_subscribe span,
article.newsletter_main_news .news_info .btn_area li button:hover span {
color: #171717;
}
article.newsletter_main_news .news_info .btn_area li a {
box-sizing: border-box;
display: block;
height: 34px;
padding: 6px 18px 6px;
border-radius: 22px;
border: 1px solid rgba(255, 255, 255, 0.30);
background: rgba(23, 23, 23, 0.20);
backdrop-filter: blur(150px);
transition: .2s;
}
article.newsletter_main_news .news_info .btn_area li a span {
display: inline-block;
color: #FFF;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.newsletter_main_news .news_info .btn_area li a:hover {
color: #171717;
background: #fff;
}
article.newsletter_main_news .news_info .btn_area li a:hover span {
color: #171717;
}
article.newsletter_main_news .news_list_area {
display: table-cell;
width: 68%;
padding-left: 30px;
vertical-align: top;
border-left: 1px solid rgba(255, 255, 255, 0.40);
}
article.newsletter_main_news .news_list_area .top_news {
display: block;
font-size: 0;
}
article.newsletter_main_news .news_list_area .top_news .news_img {
display: inline-block;
position: relative;
width: 22%;
height: 94px;
}
article.newsletter_main_news .news_list_area .top_news .news_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.newsletter_main_news .news_list_area .top_news .news_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.newsletter_main_news .news_list_area .top_news .news_txt {
box-sizing: border-box;
display: inline-block;
position: relative;
width: 78%;
padding-left: 20px;
vertical-align: top;
}
article.newsletter_main_news .news_list_area .top_news .date {
display: block;
margin-top: 10px;
color: #fff;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.newsletter_main_news .news_list_area .top_news .news_title {
color: #fff;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.newsletter_main_news .news_list_area .top_news .news_title i {
margin: -2px 8px 0 0;
line-height: 1.6;
}
article.newsletter_main_news .news_list_area .news_list {
margin-top: 20px;
padding-top: 20px;
border-top: 1px solid rgba(255, 255, 255, 0.40);
}
article.newsletter_main_news .news_list_area .news_list li {
position: relative;
padding-left: 11px;
}
article.newsletter_main_news .news_list_area .news_list li + li {
margin-top: 10px;
}
article.newsletter_main_news .news_list_area .news_list li::before {
position: absolute;
top: 50%;
left: 0;
width: 2px;
height: 2px;
margin-top: -2px;
border-radius: 50%;
background: #fff;
content: '';
}
article.newsletter_main_news .news_list_area .news_list li a {
display: block;
color: #fff;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
}
main.newsletter_section {
padding: 30px;
background: #F0F0F0;
}
article.category_newsletter .section_title {
padding: 0;
}
article.category_newsletter .category_list_wrap {
overflow: hidden;
margin-left: -30px;
padding-top: 20px;
}
article.category_newsletter .category_list {
display: table;
width: 100%;
table-layout: fixed;
}
article.category_newsletter .category_list .category_item {
box-sizing: border-box;
display: table-cell;
width: 33.33333%;
padding-left: 30px;
vertical-align: top;
}
article.category_newsletter .category_list .category_item .newsletter_img {
display: block;
position: relative;
}
article.category_newsletter .category_list .category_item .newsletter_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.category_newsletter .category_list .category_item .newsletter_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.category_newsletter .category_list .category_item .newsletter_txt {
box-sizing: border-box;
padding: 20px;
background: #fff;
}
article.category_newsletter .category_list .category_item .newsletter_tit {
position: relative;
}
article.category_newsletter .category_list .category_item .newsletter_tit em {
display: block;
width: calc(100% - 112px);
color: #171717;
font-size: 17px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.category_newsletter .category_list .category_item .newsletter_tit .newsletter_date {
position: absolute;
top: 50%;
right: 0;
box-sizing: border-box;
display: inline-block;
margin-top: -13px;
padding: 5px 10px;
color: #1d9bf0;
text-align: center;
font-size: 13px;
font-weight: 500;
border-radius: 25px;
border: 1px solid #1d9bf0;
}
article.category_newsletter .category_list .category_item .newsletter_comment {
margin-top: 20px;
padding-top: 20px;
color: #171717;
font-size: 15px;
font-weight: 400;
line-height: 1.5;
border-top: 1px solid #e8e8e8;
text-align: left;
word-break: break-all;
}
article.category_newsletter .category_list .category_item .btn_area {
margin-top: 20px;
text-align: center;
}
article.category_newsletter .category_list .category_item .btn_area li {
display: inline-block;
}
article.category_newsletter .category_list .category_item .btn_area li + li {
margin-left: 10px;
}
article.category_newsletter .category_list .category_item .btn_area li button {
box-sizing: border-box;
display: block;
position: relative;
z-index: 1;
margin: 20px auto 0;
padding: 7px 14px 6px;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.category_newsletter .category_list .category_item .btn_area li button span {
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.category_newsletter .category_list .category_item .btn_area li button.on_subscribe,
article.category_newsletter .category_list .category_item .btn_area li button:hover {
border-color: #1D9BF0;
background: #1D9BF0;
}
article.category_newsletter .category_list .category_item .btn_area li button.on_subscribe span,
article.category_newsletter .category_list .category_item .btn_area li button:hover span {
color: #fff;
}
article.category_newsletter .category_list .category_item .btn_area li a {
box-sizing: border-box;
display: block;
position: relative;
z-index: 1;
margin: 20px auto 0;
padding: 7px 14px 6px;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.category_newsletter .category_list .category_item .btn_area li a span {
display: inline-block;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.category_newsletter .category_list .category_item .btn_area li a:hover {
border-color: #1D9BF0;
background: #1D9BF0;
}
article.category_newsletter .category_list .category_item .btn_area li a:hover span {
color: #fff;
}
article.alarm_newsletter {
padding: 0 30px 50px;
}
article.alarm_newsletter .section_title {
padding: 0;
}
article.alarm_newsletter .alarm_list_wrap {
overflow: hidden;
margin-left: -30px;
padding-top: 20px;
}
article.alarm_newsletter .alarm_list {
font-size: 0;
}
article.alarm_newsletter .alarm_list + .alarm_list {
margin-top: 30px;
}
article.alarm_newsletter .alarm_list .alarm_item {
box-sizing: border-box;
display: inline-block;
width: 33.33333%;
padding-left: 30px;
vertical-align: top;
}
article.alarm_newsletter .alarm_list .alarm_item .newsletter_txt {
box-sizing: border-box;
padding: 20px;
border: 1px solid #e8e8e8;
}
article.alarm_newsletter .alarm_list .alarm_item .newsletter_tit {
position: relative;
}
article.alarm_newsletter .alarm_list .alarm_item .newsletter_tit em {
display: block;
width: calc(100% - 112px);
color: #171717;
font-size: 17px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.alarm_newsletter .alarm_list .alarm_item .newsletter_tit .newsletter_date {
position: absolute;
top: 50%;
right: 0;
box-sizing: border-box;
display: inline-block;
margin-top: -13px;
padding: 5px 10px;
color: #1d9bf0;
text-align: center;
font-size: 13px;
font-weight: 500;
border-radius: 25px;
border: 1px solid #1d9bf0;
}
article.alarm_newsletter .alarm_list .alarm_item .newsletter_comment {
margin-top: 20px;
padding-top: 20px;
color: #171717;
font-size: 15px;
font-weight: 400;
line-height: 1.5;
border-top: 1px solid #e8e8e8;
text-align: left;
word-break: break-all;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area {
margin-top: 20px;
text-align: center;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li {
display: inline-block;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li + li {
margin-left: 10px;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li button {
box-sizing: border-box;
display: block;
position: relative;
z-index: 1;
margin: 20px auto 0;
padding: 7px 14px 6px;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li button span {
display: inline-block;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li button.on_subscribe,
article.alarm_newsletter .alarm_list .alarm_item .btn_area li button:hover {
border-color: #1D9BF0;
background: #1D9BF0;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li button.on_subscribe span,
article.alarm_newsletter .alarm_list .alarm_item .btn_area li button:hover span {
color: #fff;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li a {
box-sizing: border-box;
display: block;
position: relative;
z-index: 1;
margin: 20px auto 0;
padding: 7px 14px 6px;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li a span {
display: inline-block;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li a:hover {
border-color: #1D9BF0;
background: #1D9BF0;
}
article.alarm_newsletter .alarm_list .alarm_item .btn_area li a:hover span {
color: #fff;
}
article.newsletter_detail_list .newsletter_list li {
padding: 25px 0;
border-bottom: 1px solid #e8e8e8;
}
article.newsletter_detail_list .newsletter_list li:first-child {
padding-top: 0;
}
article.newsletter_detail_list .newsletter_list li a {
display: table;
width: 100%;
table-layout: fixed;
vertical-align: middle;
}
article.newsletter_detail_list .newsletter_list li a .number {
display: table-cell;
width: 15%;
color: #1d9bf0;
font-size: 16px;
font-weight: 700;
line-height: 1.2;
text-align: center;
vertical-align: middle;
}
article.newsletter_detail_list .newsletter_list li a .news_info {
display: table-cell;
width: 85%;
}
article.newsletter_detail_list .newsletter_list li a .news_info .news_title {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.newsletter_detail_list .newsletter_list li a .news_info .date {
margin-top: 10px;
color: rgba(23, 23, 23, 0.70);
font-size: 13px;
font-weight: 400;
line-height: 1.5;
}
article.newsletter_subscribe .section_title {
padding-top: 0;
}
article.newsletter_subscribe .newsletter_item {
padding-bottom: 30px;
}
article.newsletter_subscribe .newsletter_item + .newsletter_item {
padding-top: 30px;
border-top: 1px solid #e8e8e8;
}
article.newsletter_subscribe .newsletter_item .newsletter_img {
position: relative;
height: 164px;
}
article.newsletter_subscribe .newsletter_item .newsletter_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
border: 1px solid rgba(0, 0, 0, 0.05);
content: '';
}
article.newsletter_subscribe .newsletter_item .newsletter_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
}
article.newsletter_subscribe .newsletter_item .newsletter_tit {
position: relative;
margin-top: 15px;
}
article.newsletter_subscribe .newsletter_item .newsletter_tit em {
display: block;
width: calc(100% - 112px);
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
vertical-align: middle;
}
article.newsletter_subscribe .newsletter_item .newsletter_tit .btn_subscribe {
position: absolute;
top: 50%;
right: 0;
box-sizing: border-box;
display: inline-block;
z-index: 1;
margin-top: -18px;
padding: 6px 14px 5px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: transparent;
transition: .1s;
}
article.newsletter_subscribe .newsletter_item .newsletter_tit .btn_subscribe.subscribe,
article.newsletter_subscribe .newsletter_item .newsletter_tit .btn_subscribe:hover {
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
article.newsletter_subscribe .newsletter_item .newsletter_comment {
margin-top: 16px;
color: rgba(23, 23, 23, 0.60);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
article.notice_section {
padding-bottom: 150px;
}
article.notice_section .notice_category {
font-size: 0;
}
article.notice_section .notice_category li {
display: inline-block;
}
article.notice_section .notice_category li + li {
margin-left: 10px;
}
article.notice_section .notice_category li .btn_category {
box-sizing: border-box;
display: block;
padding: 8px 40px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #171717;
background: #fff;
transition: .2s;
}
article.notice_section .notice_category li .btn_category:hover,
article.notice_section .notice_category li .btn_category.on {
color: #fff;
background: #171717;
}
article.notice_section .notice_list_area {
padding: 40px 0 0;
}
article.notice_section .notice_list_area .notice_list_top {
position: relative;
}
article.notice_section .notice_list_area .notice_list_top .count {
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.notice_section .notice_list_area .search_area {
position: absolute;
top: -10px;
right: 0;
}
article.notice_section .notice_list_area .search_area .search_bar {
position: relative;
max-width: 245px;
margin: 0 auto;
}
article.notice_section .notice_list_area .search_area .search_bar .search_inp {
box-sizing: border-box;
display: block;
width: 100%;
height: 34px;
padding: 5px 70px 5px 10px;
color: #171717;
font-size: 15px;
font-weight: 600;
vertical-align: middle;
border-bottom: 1px solid #D9D9D9;
transition: .1s;
background: transparent;
}
article.notice_section .notice_list_area .search_area .search_bar .search_inp::-webkit-input-placeholder {
color:rgba(23, 23, 23, 0.50);
font-weight: 500;
}
article.notice_section .notice_list_area .search_area .search_bar .search_inp:-ms-input-placeholder {
color:rgba(23, 23, 23, 0.50);
}
article.notice_section .notice_list_area .search_area .search_bar .search_inp:focus {
border-color: #1d9bf0
}
article.notice_section .notice_list_area .search_area .search_bar .search_inp:focus + .btn_search svg {
fill: #1d9bf0
}
article.notice_section .notice_list_area .search_area .search_bar .btn_search {
display: block;
position: absolute;
top: 0;
right: 0;
width: 26px;
height: 30px;
text-align: center;
cursor: pointer;
background: transparent;
}
article.notice_section .notice_list_area .search_area .search_bar .btn_search svg {
display: inline-block;
width: 26px;
fill: #171717;
fill-opacity: .7;
transition: .1s;
}
article.notice_section .notice_list_area .notice_list {
padding: 20px 0 0;
}
article.notice_section .notice_list_area .notice_list .notice_list_item,
article.notice_section .notice_list_area .notice_list .notice_list_item a {
display: table;
width: 100%;
table-layout: fixed;
}
article.notice_section .notice_list_area .notice_list .notice_list_item:first-child {
border-top: 1px solid #e8e8e8;
background: #F7F7F7;
}
article.notice_section .notice_list_area .notice_list .notice_list_item a:hover {
transition: .1s;
background: rgba(29, 155, 240, 0.08);
}
article.notice_section .notice_list_area .notice_list .notice_list_item span {
box-sizing: border-box;
display: table-cell;
padding: 12px 0;
color: #171717;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
text-align: center;
border: 1px solid #e8e8e8;
border-width: 0 0 1px 1px;
}
article.notice_section .notice_list_area .notice_list .notice_list_item .number {
width: 10%;
border-left: 0;
}
article.notice_section .notice_list_area .notice_list .notice_list_item .category {
width: 10%;
}
article.notice_section .notice_list_area .notice_list .notice_list_item .title {
width: 67%;
padding: 0 50px;
text-align: left;
}
article.notice_section .notice_list_area .notice_list .notice_list_item:first-child .title {
text-align: center;
}
article.notice_section .notice_list_area .notice_list .notice_list_item .date {
width: 13%;
}
article.notice_section .notice_title {
padding: 30px 50px;
background: #F7F7F7;
}
article.notice_section .notice_title .subject {
color: #171717;
font-size: 20px;
font-weight: 500;
line-height: 1.5;
}
article.notice_section .notice_title .info {
margin-top: 10px;
}
article.notice_section .notice_title .category {
display: inline-block;
padding: 3px 6px;
color: #1D9BF0;
text-align: center;
font-size: 11px;
font-weight: 700;
line-height: normal;
border-radius: 13px;
border: 1px solid rgba(51, 184, 255, 0.70);
background: rgba(51, 184, 255, 0.08);
backdrop-filter: blur(50px);
vertical-align: middle;
}
article.notice_section .notice_title .date {
display: inline-block;
position: relative;
padding-left: 20px;
color: #171717;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
vertical-align: middle;
}
article.notice_section .notice_title .date::before {
position: absolute;
top: 50%;
left: 10px;
width: 1px;
height: 10px;
margin-top: -5px;
background: rgba(23, 23, 23, 0.70);
content: '';
}
article.notice_section .notice_content {
padding: 50px 0;
text-align: center;
}
article.notice_section .notice_content .notice_content_area {
display: inline-block;
max-width: 830px;
padding-bottom: 50px;
text-align: center;
color: #171717 !important;
font-size: 17px !important;
font-weight: 400 !important;
line-height: 1.5 !important;
}
article.notice_section .notice_content .notice_content_area img,
article.notice_section .notice_content .notice_content_area p img {
display: block;
width: 100%;
}
article.notice_section .notice_content .notice_content_area p,
article.notice_section .notice_content p {
color: #171717 !important;
font-size: 17px !important;
font-weight: 400 !important;
line-height: 1.5 !important;
text-align: left;
}
article.notice_section .notice_content .notice_content_area p b,
article.notice_section .notice_content .notice_content_area b,
article.notice_section .notice_content p b {
font-size: 17px !important;
font-weight: 700 !important;
}
article.notice_section .notice_content .notice_content_area table {
display: inline-block;
}
article.notice_section .notice_content .btn_area {
position: relative;
padding: 50px 0 0;
font-size: 0;
border-top: 1px solid #e8e8e8;
}
article.notice_section .notice_content .btn_area button {
box-sizing: border-box;
display: inline-block;
min-width: 120px;
padding: 8px 30px;
border-radius: 3px;
border: 1px solid #171717;
background: #fff;
transition: .2s;
}
article.notice_section .notice_content .btn_area button + button {
margin-left: 20px;
}
article.notice_section .notice_content .btn_area button em {
display: inline-block;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
vertical-align: middle;
}
article.notice_section .notice_content .btn_area button svg {
display: inline-block;
width: 8px;
height: 12px;
margin-top: -1px;
vertical-align: middle;
fill: #171717;
}
article.notice_section .notice_content .btn_area button:hover {
background: #171717;
}
article.notice_section .notice_content .btn_area button:hover em {
color: #fff;
}
article.notice_section .notice_content .btn_area button:hover svg {
fill: #fff;
}
article.notice_section .notice_content .btn_area .btn_prev em {
padding-left: 6px;
}
article.notice_section .notice_content .btn_area .btn_next em {
padding-right: 6px;
}
article.notice_section .notice_content .btn_area .btn_list {
box-sizing: border-box;
display: inline-block;
min-width: 120px;
padding: 8px 40px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #171717;
background: #fff;
transition: .2s;
}
article.notice_section .notice_content .btn_area .btn_list:hover {
color: #fff;
background: #171717;
}
article.error {
padding: 50px 0;
text-align: center;
}
article.error i {
display: inline-block;
width: 110px;
height: 110px;
}
article.error i svg {
display: block;
width: 110px;
height: 110px;
}
article.error .error_title {
display: block;
margin-top: 40px;
color: #171717;
text-align: center;
font-size: 25px;
font-weight: 600;
line-height: 1.4;
letter-spacing: 0.75px;
}
article.error .error_text {
margin-top: 30px;
color: #171717;
text-align: center;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
}
article.error .error_text + .error_text {
margin-top: 8px;
}
article.error .error_text a {
color: #1D9BF0;
text-decoration: underline;
}
article.error .btn_area {
padding: 50px 0 0;
}
article.error .btn_area a {
display: inline-block;
min-width: 106px;
padding: 7px 14px 6px;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border-radius: 22px;
border: 1px solid #DADCDF;
background: var(--Color, #FFF);
}
article.error .btn_area a.btn_home {
margin-left: 10px;
color: #fff;
border-color: #1D9BF0;
background: #1D9BF0;
}
article.error + article.thistime_main {
padding-bottom: 40px;
}
/* herald military */
main.military_main.section_main::before {
background: rgba(23, 23, 23, 0.50);
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
main.military_main.section_main .section_top {
position: relative;
padding-top: 30px;
}
main.military_main.section_main .section_top .military_title {
position: absolute;
top: -25px;
left: 0;
color: #E9B951;
font-size: 22px;
font-style: normal;
font-weight: 700;
line-height: 1.5;
}
main.military_main.section_main .section_top .news_img {
width: 52%;
max-height: 274px;
}
main.military_main .section_top .news_txt {
width: 48%;
padding: 0 0 0 30px;
}
article.shorts strong.section_title {
color: #CC0000;
}
article.shorts .swiper_wrap {
position: relative;
margin-left: -20px;
}
article.shorts .shorts_swiper {
box-sizing: border-box;
overflow: hidden;
padding-left: 19.5px;
}
article.shorts .shorts_list {
width: 100%;
font-size: 0;
}
article.shorts .shorts_list li {
position: relative;
}
article.shorts .shorts_list li a {
display: block;
width: 100%;
height: 290px;
}
article.shorts .shorts_list li a .special_img {
position: relative;
width: 100%;
height: 290px;
}
article.shorts .shorts_list a .special_img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
article.shorts .swiper-button-next2,
article.shorts .swiper-button-prev2 {
width: 30px;
height: 30px;
top: 50% !important;
border-radius: 20px;
border: 1px solid #DADCDF;
background: #FFF;
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
}
article.shorts .swiper-button-next2 {
right: var(--swiper-navigation-sides-offset,-16px) !important;
left: auto !important;
}
article.shorts .swiper-button-prev2 {
left: var(--swiper-navigation-sides-offset,4px);
right: auto;
}
article.shorts .swiper-button-next2:after,
article.shorts .swiper-button-prev2:after {
color: #171717;
font-size: 10px;
}
article.shorts .swiper-button-next2:after {
padding-left: 2px;
}
article.shorts .swiper-button-prev2:after {
padding-right: 2px;
}
article.shorts + article.shorts {
border-top: 0;
}
article.premium_content.military {
padding-bottom: 20px;
}
article.premium_content.military .btn_premium .news_img {
height: 180px;
}
article.premium_content.military .btn_premium .news_img::before,
article.premium_content.military .btn_premium .news_img::after {
display: none;
}
article.premium_content.military .btn_subscription {
box-sizing: border-box;
position: absolute;
top: 50%;
right: 0;
margin-top: -17px;
padding: 5px 14px 4px;
color: #FFF;
text-align: center;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border: 1px solid #8C9320;
border-radius: 30px;
background: #8C9320;
}
article.premium_content.military .news_list {
margin-top: 10px;
}
article.premium_content.military .news_list li {
padding: 15px 0;
}
article.premium_content.military .news_list li + li {
border-top: 1px solid #e8e8e8;
}
article.premium_content.military .news_list li a {
display: table;
}
article.premium_content.military .news_list li .news_title {
display: table-cell;
width: 70%;
color: #171717;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
vertical-align: top;
}
article.premium_content.military .news_list li .news_img {
box-sizing: border-box;
display: table-cell;
width: 30%;
height: 48px;
padding-left: 10px;
}
article.premium_content.military .news_list li .news_img img {
height: 48px;
object-fit: cover;
object-position: top;
border-radius: 0;
}
article.topic {
margin-top: 30px;
box-sizing: border-box;
padding: 20px;
border: 1px solid #E8E8E8;
background: #fff;
}
article.topic .topic_tit {
color: #171717;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
article.topic .topic_link {
box-sizing: border-box;
display: block;
padding-top: 30px;
}
article.topic .topic_img {
width: 150px;
height: 150px;
margin: 0 auto;
}
article.topic .topic_img img {
display: block;
width: 150px;
height: 150px;
object-fit: cover;
object-position: top;
border-radius: 50%;
}
article.topic .topic_img.type_square img {
border-radius: 0;
}
article.topic .topic_txt {
margin-top: 20px;
}
article.topic .topic_txt span {
display: block;
color: rgba(23, 23, 23, 0.50);
text-align: center;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.topic .topic_txt em {
display: block;
margin-top: 4px;
color: #171717;
text-align: center;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.topic .topic_txt p {
margin-top: 10px;
color: rgba(23, 23, 23, 0.50);
font-size: 13px;
font-weight: 400;
line-height: 1.5;
}
article.topic.recommend_book .topic_img_bg {
position: relative;
width: 150px;
height: 150px;
margin: 0 auto;
}
article.topic.recommend_book .topic_img_bg::before {
position: absolute;
top: 0;
left: 0;
width: 150px;
height: 150px;
border-radius: 50%;
background: #FFCD61;
opacity: .8;
z-index: 0;
content: '';
}
article.topic.recommend_book .topic_img {
position: absolute;
overflow: hidden;
top: 50%;
left: 50%;
width: 64%;
height: 91%;
transform: translate(-50%, -50%);
box-shadow: 3px 6px 4px rgba(45, 44, 39, .26);
border-radius: 0 6px 6px 0;
}
article.topic.recommend_book .topic_img::before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border: 1px solid rgba(23, 23, 23, .1);
border-radius: 0 6px 6px 0;
content: '';
}
article.topic.recommend_book .topic_img::after {
position: absolute;
top: 0;
left: 0;
width: 5%;
bottom: 0;
background: rgba(23, 23, 23, .1);
content: '';
}
article.topic.recommend_book .topic_img img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
border-radius: 0;
}
article.topic.today_talk .topic_link {
padding-top: 0;
}
article.topic .today_talk_area {
box-sizing: border-box;
margin-top: 20px;
padding: 20px;
border: 1px solid rgba(29, 155, 240, 0.10);
background: rgba(29, 155, 240, 0.06);
}
article.topic .today_talk_area i svg {
display: block;
width: 22px;
height: 15px;
}
article.topic .today_talk_area .today_talk_txt {
padding-top: 8px;
color: #1D9BF0;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
}
article.topic .today_talk_area .today_talk_txt2 {
padding-top: 8px;
color: #1D9BF0;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
font-style: italic;
}
article.topic .today_talk_area .today_talk_txt3 {
padding-top: 8px;
font-family: "Nanum Myeongjo";
color: #1D9BF0;
font-size: 16px;
font-weight: 400;
line-height: 1.6;
}
article.topic .today_talk_area .today_talk_txt4 {
padding-top: 8px;
font-family: "Nanum Myeongjo";
color: #1D9BF0;
font-size: 16px;
font-weight: 400;
line-height: 1.5;
font-style: italic;
}
article.topic .today_talk_area .source {
margin-top: 16px;
padding-top: 18px;
color: rgba(23, 23, 23, 0.80);
font-size: 12px;
font-weight: 400;
line-height: 1.5;
border-top: 1px solid rgba(29, 155, 240, 0.16);
}
article.topic .today_talk_area .source em {
display: inline-block;
margin-right: 6px;
color: rgba(23, 23, 23, 0.80);
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 1.5;
}
article.america_election {
padding-top: 30px;
}
article.america_election .election_type1 {
height: 160px;
}
article.america_election .election_type1 .election_list {
position: relative;
font-size: 0;
}
article.america_election .election_type1 .election_list::before {
position: absolute;
top: 50%;
left: 50%;
margin: -39px 0 0 -32px;
color: #FFF;
text-align: center;
font-size: 60px;
font-style: normal;
font-weight: 100;
line-height: 1.3;
letter-spacing: -3.6px;
content: 'VS';
}
article.america_election .election_type1 .election_list li {
box-sizing: border-box;
display: inline-block;
width: 50%;
height: 160px;
padding: 38px 70px 38px 0;
}
article.america_election .election_type1 .election_list li + li {
padding: 38px 0 38px 70px;
}
article.america_election .election_type1 .election_list li em {
display: block;
color: rgba(255, 255, 255, 0.80);
text-align: right;
font-size: 12px;
font-weight: 600;
line-height: 1.5;
}
article.america_election .election_type1 .election_list li strong {
display: block;
margin-top: 4px;
color: #fff;
text-align: right;
font-size: 20px;
font-weight: 700;
line-height: 1.4;
}
article.america_election .election_type1 .election_list li a {
display: block;
margin-top: 20px;
color: rgba(255, 255, 255, 0.80);
text-align: right;
font-size: 12px;
font-weight: 400;
line-height: normal;
}
article.america_election .election_type1 .election_list li a span {
display: inline-block;
vertical-align: middle;
}
article.america_election .election_type1 .election_list li a i {
display: inline-block;
vertical-align: middle;
}
article.america_election .election_type1 .election_list li a i svg {
display: block;
width: 6px;
height: 10px;
}
article.america_election .election_type1 .election_list li + li em,
article.america_election .election_type1 .election_list li + li strong,
article.america_election .election_type1 .election_list li + li a {
text-align: left;
}
article.america_election .election_type2 .election_list {
position: relative;
font-size: 0;
}
article.america_election .election_type2 .election_list::before {
position: absolute;
bottom: 0;
left: 50%;
margin-left: -18.5px;
color: #171717;
text-align: center;
font-size: 30px;
font-style: normal;
font-weight: 700;
line-height: 1.3;
letter-spacing: -1.8px;
content: 'VS';
}
article.america_election .election_type2 .election_list::after {
position: absolute;
top: 0;
left: 50%;
width: 1px;
height: 220px;
background: #E8E8E8;
content: '';
}
article.america_election .election_type2 .election_list li {
box-sizing: border-box;
display: inline-block;
width: 50%;
padding-right: 20px;
}
article.america_election .election_type2 .election_list li + li {
padding: 0 0 0 20px;
}
article.america_election .election_type2 .election_list li .election_link {
display: block;
}
article.america_election .election_type2 .election_list li .election_link .img img {
display: block;
width: 100%;
height: 220px;
object-fit: cover;
object-position: top;
}
article.america_election .election_type2 .election_list li .election_link em {
display: block;
margin-top: 10px;
color: rgba(23, 23, 23, 0.50);
text-align: center;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 1.5;
}
article.america_election .election_type2 .election_list li .election_link strong {
display: block;
color: #171717;
text-align: center;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 1.4;
}
article.climate {
margin-top: 30px;
}
/* layer popup */
.pop_dimmed {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 10;
}
.pop_wrap {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 300px;
background-color: #fff;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
z-index: 11;
}
.pop_content {
box-sizing: border-box;
position: relative;
padding: 50px 30px;
}
.pop_wrap .btn_close {
position: absolute;
top: 15px;
right: 15px;
width: 16px;
height: 16px;
background: transparent;
}
.pop_wrap .btn_close i {
display: block;
width: 16px;
height: 16px;
}
.pop_wrap .btn_close i::before,
.pop_wrap .btn_close i::after {
position: absolute;
left: 8px;
width: 1px;
height: 16px;
background: #111;
content: '';
}
.pop_wrap .btn_close i:before {
transform: rotate(45deg);
}
.pop_wrap .btn_close i:after {
transform: rotate(-45deg);
}
.pop_wrap .pop_message {
color: #171717;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
text-align: center;
}
.pop_wrap .pop_btn_list {
margin-top: 20px;
font-size: 0;
text-align: center;
}
.pop_wrap .pop_btn_list li {
display: inline-block;
}
.pop_wrap .pop_btn_list li + li {
margin-left: 10px;
}
.pop_wrap .pop_btn_list li .btn_pop {
box-sizing: border-box;
width: 80px;
padding: 6px 0;
color: #fff;
text-align: center;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border: 1px solid #171717;
border-radius: 22px;
background: #171717;
transition: .1s;
}
.pop_wrap .pop_btn_list li + li .btn_pop {
color: #171717;
border: 1px solid #171717;
background: #fff;
}
.pop_wrap .btn_complete {
box-sizing: border-box;
display: block;
width: 100px;
margin: 20px auto 0;
padding: 6px 0;
color: #fff;
text-align: center;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
border: 1px solid #171717;
background: #171717;
transition: .1s;
}
main.military,
main.dcon,
main.insight {
max-width: 100%; padding-top:0;
}
main.military + footer,
main.dcon + footer {
margin-top: 0;
}
/* footer */
footer {
box-sizing: border-box;
position: relative;
margin-top: 30px;
padding-bottom: 50px;
border-top: 1px solid #e8e8e8;
}
main.series_popular + footer {
margin-top: 0;
}
footer .footer_container {
position: relative;
width: 100%;
max-width: 1130px;
margin: 0 auto;
}
footer .sns_list {
position: absolute;
bottom: 20px;
right: -1px;
font-size: 0;
}
footer .sns_list li {
display: inline-block;
margin-left: 20px;
}
footer .sns_list li:first-child {
margin-left: 0;
}
footer .sns_list li a {
display: block;
width: 24px;
height: 24px;
text-align: center;
}
footer .sns_list li svg {
fill: #171717;
transition: .1s;
}
footer .sns_list li a:hover svg {
fill: #1d9bf0;
}
footer .sns_list li.ico svg {
display: inline-block;
width: 22px;
height: 24px;
}
footer .sns_list li.ico a svg::before {
display: inline-block;
height: 100%;
vertical-align: middle;
content: '';
}
footer .sns_list li + li.ico a {
width: 26px;
}
footer .sns_list li + li.ico svg {
width: 25px;
}
footer .family_site {
display: inline-block;
position: absolute;
top: 30px;
right: 0;
width: 200px;
text-align: right;
}
footer .family_site .family_container {
position: relative;
font-size: 0;
}
footer .family_site .btn_family {
display: inline-block;
color: #171717;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
background: transparent;
}
footer .btn_family.on::before {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
content: ''
}
footer .btn_family .ico_arrow {
display: inline-block;
margin-left: 23px;
vertical-align: middle;
animation: bounce paused;
animation-iteration-count: 0;
}
footer .btn_family .ico_arrow::before,
footer .btn_family .ico_arrow::after {
display: block;
position: relative;
left: -3px;
width: 5px;
height: 1px;
background: #171717;
opacity: .4;
transition: .1s ease-in-out;
content: '';
}
footer .btn_family .ico_arrow::before {
top: -1px;
transform: rotate(45deg)
}
footer .btn_family .ico_arrow::after {
top: -2px;
left: 0px;
transform: rotate(-45deg)
}
footer .btn_family.on .ico_arrow::before {
transform: rotate(-45deg)
}
footer .btn_family.on .ico_arrow::after {
transform: rotate(45deg)
}
footer .family_list {
box-sizing: border-box;
overflow-y: auto;
position: absolute;
top: -274px;
width: 100%;
padding: 9px 0;
border: 1px solid #e8e8e8;
background: #fff;
font-size: 14px;
text-align: left;
z-index: 1;
}
footer .family_list.on {
display: block;
}
footer .family_list li a {
display: block;
padding: 9px 20px;
font-size: 14px;
color: #666
}
footer .family_list li a:hover {
color: #333;
font-weight: 500;
text-decoration: underline
}
footer nav {
padding: 15px 0 16px;
}
footer nav .gnb li {
margin: 0 20px 0 0;
padding: 16px 0 0;
}
footer nav .gnb li:first-child {
margin-left: 0;
}
footer nav .gnb li a {
color: rgba(23, 23, 23, 0.80);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
footer nav .gnb li a em {
font-weight: 600;
}
footer address p {
font-size: 0;
}
footer address p + p {
margin-top: 2px;
}
footer address span {
display: inline-block;
position: relative;
padding-right: 16px;
color: rgba(23, 23, 23, 0.60);
font-size: 13px;
font-weight: 400;
line-height: 1.5;
}
footer address span::before {
position: absolute;
top: 50%;
right: 8px;
width: 1px;
height: 12px;
margin-top: -6px;
background: rgba(23, 23, 23, 0.10);
content: '';
}
footer address span:last-child {
padding-right: 0;
}
footer address span:last-child:before {
display: none;
}
@media all and (max-width: 1180px) {
nav .search_area .search_wrap {
padding: 55px 150px;
}
main section.connect_layout {
max-height: 100%;
}
.connect_layout article.top_news::before {
bottom: -1000px;
}
}
/* datepicker */
.ui-widget-header { border: 0px solid #dddddd; background: #fff; }
.ui-datepicker-calendar>thead>tr>th { font-size: 14px !important; }
.ui-datepicker .ui-datepicker-header { position: relative; padding: 10px 0 20px; }
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active { border: 0px solid #c5c5c5; background-color: transparent; font-weight: normal; color: #454545; text-align: center; }
.ui-datepicker .ui-datepicker-title { margin: 0 0em; line-height: 16px; text-align: center; font-size: 14px; padding: 0px; font-weight: bold; }
.ui-datepicker { display: none; background-color: #fff; border-radius: 4px; margin-top: 10px; margin-left: 0px; margin-right: 0px; padding: 20px; padding-bottom: 10px; width: 280px; box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.1); }
.ui-widget.ui-widget-content { border: 1px solid #eee; }
#datepicker:focus>.ui-datepicker { display: block; }
.ui-datepicker-prev,
.ui-datepicker-next { display: block; position: absolute; top: 10px; width: 18px; height: 18px; cursor: pointer; }
.ui-datepicker-next { right: 0; }
.ui-state-disabled { cursor: auto; color: hsla(0, 0%, 80%, 1); }
.ui-datepicker-title { text-align: center; padding: 10px; font-weight: 100; font-size: 20px; }
.ui-datepicker-calendar { width: 100%; }
.ui-datepicker-calendar>thead>tr>th { padding: 5px; font-size: 20px; font-weight: 400; }
.ui-datepicker-calendar>tbody>tr>td>a { color: #000; font-size: 12px !important; font-weight: bold !important; text-decoration: none;}
.ui-datepicker-calendar>tbody>tr>.ui-state-disabled:hover { cursor: auto; background-color: #fff; }
.ui-datepicker-calendar>tbody>tr>td { border-radius: 100%; width: 44px; height: 30px; cursor: pointer; padding: 5px; font-weight: 100; text-align: center; font-size: 12px; vertical-align: middle;}
.ui-datepicker-calendar>tbody>tr>td:hover { background-color: transparent; opacity: 0.6; }
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus { border: 0px solid #cccccc; background-color: transparent; font-weight: normal; color: #2b2b2b; }
.ui-widget-header .ui-icon { display: inline-block; position: absolute; width: 18px; height: 18px; text-indent: -9999px; background-size: 36px; background-image: url('../image/ico_datepicker.png'); }
.ui-icon-circle-triangle-e { background-position: -20px 0px; background-size: 36px; }
.ui-icon-circle-triangle-w { background-position: -0px -0px; background-size: 36px; }
.ui-datepicker-calendar>tbody>tr>td:first-child a { color: red !important; }
.ui-datepicker-calendar>tbody>tr>td:last-child a { color: #0099ff !important; }
.ui-datepicker-calendar>thead>tr>th:first-child { color: red !important; }
.ui-datepicker-calendar>thead>tr>th:last-child { color: #0099ff !important; }
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight { display: block; border: 0px; background: #f1f1f1; border-radius: 50%; padding-top: 10px; padding-bottom: 10px; }
/* ====== dcon ======================================================================================================= */
.dcon_bg {
background: #F3F3F3;
width: 100%;
overflow: hidden
}
.dcon_top {
width: 100%;
height: 607px;
position: relative;
display: block;
}
.dcon_link {
font-size: 15px;
color: #606060;
font-weight: 200;
width: 1100px;
margin: 0 auto;
line-height: 45px
}
.dcon_link li {
float: left;
margin-right: 15px;
}
.dcon_top_tit {
width: 1100px;
margin: 0 auto;
text-align: left;
position: relative;
top: 200px;
left: -175px
}
.dcon_top_txt {
font-size: 22px;
font-weight: 200;
color: #fff;
line-height: 24px;
width: 470px;
height: 72px;
text-align: left;
position: relative;
top: 15px;
left: 176px
}
.dcon_down_btn {
text-align: right;
position: relative;
top: 25px;
right: -175px;
}
.dcon_menu {
color: #fff;
font-size: 20px;
width: 1100px;
margin: 0 auto;
height: 67px;
line-height: 67px;
border-top: 1px solid rgba(255, 255, 255, 0.6 );
position: relative;
bottom: -399px;
text-align: center;
letter-spacing: 2px;
font-weight: 700
}
.dcon_menu li {
width: 33.333%;
float: left;
height: 67px;
display: block
}
.dcon_menu li:hover {
background-color: rgba(51, 183, 255, 0.7 );
cursor: pointer;
}
.dcon_tit {
text-align: center;
margin: 80px 0 40px 0
}
.dcon_tit h1 {
font-size: 30px;
font-weight: 700;
color: #262D3D
}
/*video*/
.dcon_video {
margin: 0 auto;
width: 1100px;
position: relative;
display: block;
overflow: hidden;
}
.dcon_video li {
float: left;
margin-right: 25px;
margin-bottom: 40px;
}
.dcon_video li.mr0 {
margin-right: 0;
}
.dcon_video_box {
position: relative;
display: block;
overflow: hidden;
width: 350px;
height: 294px
}
.ico_movie {
position: absolute;
left: 0;
bottom: 83px;
z-index: 5;
background-color: transparent;
}
.dcon_video_img {
position: relative;
width: 350px;
height: 197px
}
.dcon_video_img img {
width: 100%;
height: 100%
}
.dcon_txt_bg {
box-sizing: border-box;
min-height: 104px;
background: #fff;
text-align: left;
padding: 15px 15px 20px 15px;
}
.dcon_txt_bg.type2 {
min-height: 0;
}
.dcon_video_cate {
font-size: 14px;
color: #666;
font-weight: 400;
letter-spacing: 1px;
margin-bottom: 10px;
}
.dcon_video_tit {
font-size: 19px;
line-height: 22px;
max-height: 44px;
color: #111;
font-weight: 600;
}
.dcon_more_btn {
margin: 0 auto;
width: 170px;
text-align: center;
border-radius: 24px;
border: 2px solid black;
background-color: white;
padding: 14px 28px;
font-size: 16px;
cursor: pointer;
border-color: #33b8ff;
color: #33b8ff;
transition: all 0.4s
}
.dcon_more_btn:hover {
background: #33b8ff;
color: white;
}
/*special*/
.dcon_speaial {
width: 100%
}
.dcon_speaial .container {
position: relative;
}
.dcon_speaial .mySlides {
display: none;
}
.sp_img {
height: 520px;
}
.sp_img img {
width: 100%;
height: 520px;
}
.dcon_speaial .cursor {
position: relative;
cursor: pointer;
}
.dcon_speaial .row {
position: absolute;
overflow: hidden;
bottom: 30px;
left: 0;
right: 0;
text-align: center;
z-index: 5;
font-size: 0
}
.dcon_speaial .row:after {
z-index: 999;
background-color: rgba(127, 193, 234, 0.6 );
}
.dcon_speaial .column {
position: relative;
display: inline-block;
vertical-align: middle;
margin: 0 5px;
width: 180px;
}
.dcon_speaial .column img {
z-index: 0
}
.num01 {
color: #fff;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 99;
background-color: rgba(0,0,0,.7 );
font-size: 11px;
display: table;
transition: .2s;
cursor: pointer;
}
.num01:hover {
background-color: rgba(127, 193, 234, 0.6 )
}
.column .active {
background-color: rgba(127, 193, 234, 0.6 )
}
.num01_t {
display: table-cell;
vertical-align: middle;
font-size: 16px;
line-height: 20px;
padding: 0 10px;
letter-spacing: 1px;
font-weight: 300
}
/* ====== insight24 ======================================================================================================= */
.insight24_site_width{position:relative; max-width:1100px; margin:0 auto}
.insight24_pc{}
.insight24_m{display:none !important}
@media screen and (max-width:1100px) {
.insight24_pc{display:none !important}
.insight24_m{display:block !important}
}
/* ====== insight24_header ======================================================================================================= */
.insight24_header{position:absolute; top:0; left:0; width:100%; height:60px; border-bottom:1px solid rgba(255,255,255,.1); font-size:0; z-index:10}
.insight24_logo{display:block; margin:18px 0 0; opacity:.6;}
.insight24_logo_pc{width:155px; height:24px; background:url(https://static.heraldcorp.com/wbazic/biz/www/image/insight/insight24_logo_pc.png) center no-repeat; background-size:cover}
.insight24_logo_m{width:25px; height:24px; background:url(https://static.heraldcorp.com/wbazic/biz/www/image/insight/insight24_logo_m.png) center no-repeat; background-size:cover}
.insight24_header_language{position:absolute; top:3px; right:0}
.insight24_header_language li{display:inline-block; line-height:20px}
.insight24_header_language li a{display:inline-block; font-size:12px; color:rgba(255, 255, 255, .5); font-weight:200; vertical-align:middle}
.insight24_header_language li.on a{color:#fff}
.insight24_header_language li + li{margin-left:7px}
.insight24_header_language li + li:before{display:inline-block; content:"|"; font-size:10px; color:rgba(255, 255, 255, .3); vertical-align:middle; margin-right:7px; font-weight:100}
@media screen and (max-width:1100px) {
.insight24_header{height:50px}
.insight24_logo{margin:13px 0 0 15px}
.insight24_header_language{right:20px}
}
/* 모바일버전 */
.insight24_main .insight24_header_language{top:50px; z-index:1;}
/* ====== insight24_main ======================================================================================================= */
.insight24_main{position:relative; background:url(https://static.heraldcorp.com/wbazic/biz/www/image/insight/insight24_main.jpg) center no-repeat; background-size:cover; padding-top:226px;;}
.insight24_main_titleimg{display:block; margin:0 auto 30px; width:609px}
.insight24_main_star{position:absolute; top:0;left:0; width:100%; height:100%; background:url(https://static.heraldcorp.com/wbazic/biz/www/image/insight/insight24_main_star.gif) center no-repeat; background-size:cover}
.insight24_main_t{position:relative; font:400 17px/37px 'Nanum Myeongjo'; text-align:center; color:rgba(255,255,255,.7); margin-bottom:104px;}
.insight24_main_scroll{position:relative; width:42px; margin:0 auto 142px}
.insight24_main_scroll_mouse{width:100%; fill:#fff}
.insight24_main_scroll_mouse_arrow{position:absolute; top:40px; left:50%; width:36px ;margin-left:-18px; fill:#fff; animation: insight24mainscrollbounce 2s infinite}
@keyframes insight24mainscrollbounce {
0%, 20%, 50%, 80%, 100% {transform:translateY(0)}
40% {transform:translateY(-12px)}
60% {transform:translateY(-7px)}
}
.insight24_main_tab{position:relative; font-size:0; background:rgba(17,21,34,.8); border-top:1px solid rgba(17,21,34,1);}
.insight24_main_tab_li li{position:relative; display:inline-block; vertical-align:middle; width:50%;}
.insight24_main_tab_li li + li:before{position:absolute; content:""; width:1px; height:26px; background:rgba(255,255,255,.5); top:50%; margin-top:-13px; left:0}
.insight24_main_tab_li li a{display:block; padding:30px 0; color:rgba(255,255,255,.4); text-transform:uppercase; letter-spacing:0.9px; text-align:center;}
.insight24_main_tab_li li a, .insight24_main_tab_li li a span{font:400 26px/29px 'Roboto';}
.insight24_main_tab_li li.on a, .insight24_main_tab_li li:hover a{font-weight:500; color:#fff}
.insight24_main_tab_li li.on a span, .insight24_main_tab_li li:hover a span{font:500 26px/29px 'Roboto';}
@media screen and (max-width:1100px) {
.insight24_main{padding-top:200px;}
.insight24_main_titleimg{margin:0 auto 20px; max-width:609px; width:86%}
.insight24_main_t{font:400 14px/24px 'Nanum Myeongjo'; margin-bottom:60px;}
.insight24_main_scroll{width:34px; margin:0 auto 80px}
.insight24_main_scroll_mouse_arrow{top:38px; width:28px ; margin-left:-14px}
.insight24_main_tab_li li + li:before{height:20px; margin-top:-10px}
.insight24_main_tab_li li a, .insight24_main_tab_li li a span{font:400 22px/24px 'Roboto';}
.insight24_main_tab_li li a{padding:15px 0; letter-spacing:0.9px}
.insight24_main_tab_li li a span{display:none;}
}
/* ====== insight_swiper_bg ======================================================================================================= */
.insight_swiper_bg{position:relative; overflow:hidden; padding:30px 0; font-size:0; }
.insight23_swiper_bg{background:#8665c8;}
.insight24_swiper_bg{background:#508ee3;}
.insight24_swiper{overflow:hidden; padding:50px 0;}
.insight24_swiper .swiper-slide{/*display:flex; justify-content:center; align-items:center; */width:20%; text-align:center; transition:.1s;}
/*
.insight_swiper_bg.insight23_swiper_bg .insight24_swiper .swiper-slide{width:25%;}
*/
.insight24_swiper_img{position:relative; overflow:hidden; margin:0 auto; border-radius:8px; width:88%; padding-bottom:88%}
.insight24_swiper_img img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.insight24_swiper_img:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border-radius:8px; border:1px solid rgba(0,0,0,.08);}
.insight24_swiper_t1{font:400 14px/20px 'Roboto'; margin:22px 0 7px; color:#fff; letter-spacing:0.6px;}
.insight24_swiper_t2{font:400 12px 'SCoreDream'; color:rgba(255,255,255,.6)}
.insight24_swiper .swiper-slide:hover{transform:scale(1.1)}
.insight24_swiper .swiper-slide:before{position:absolute; content:""; width:70%; padding-bottom:50%; background:rgba(0,0,0,.01); left:50%; margin-left:-35%; filter:blur(18px); top:30%; transition:.1s;}
.insight24_swiper .swiper-slide:hover:before{background:rgba(0,0,0,.5); }
.insight_swiper_bg .swiper-button-next:after, .insight_swiper_bg .swiper-button-prev:after{display:none;}
.insight_swiper_bg .swiper-button-next, .insight_swiper_bg .swiper-button-prev{width:38px; height:38px; border:1px solid rgba(255,255,255,.5); border-radius:50%; transition:.1s;}
.insight_swiper_bg .swiper-button-prev{left:0; margin-left:-50px;}
.insight_swiper_bg .swiper-button-next{right:0; margin-right:-50px;}
.insight_swiper_bg .swiper-button-next svg, .insight_swiper_bg .swiper-button-prev svg{width:15px; height:15px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); fill:rgba(255,255,255,.5); transition:.1s;}
.insight_swiper_bg .swiper-button-next:hover, .insight_swiper_bg .swiper-button-prev:hover{border-color:#fff;}
.insight_swiper_bg .swiper-button-next:hover svg, .insight_swiper_bg .swiper-button-prev:hover svg{fill:#fff}
@media screen and (max-width:1100px) {
.insight_swiper_bg{padding:10px 0 0}
.insight24_swiper{padding:40px 0; margin:0 -25%}
.insight24_swiper .swiper-slide{width:33.33%}
/*
.insight_swiper_bg.insight23_swiper_bg .insight24_swiper .swiper-slide{width:33.33%;}
*/
.insight24_swiper .swiper-slide:before{width:60%; margin-left:-30%; top:26%;}
.insight24_swiper_t2{line-height:1.3;}
}
/* ====== insight24_person ======================================================================================================= */
.insight24_person{position:relative; overflow:hidden; padding:100px 0 0; font-size:0;}
.insight24_person:before{position:absolute; content:""; top:0; left:50%; width:1px; height:100%; background:#a7c6f2}
.insight24_person.insight23_person:before{background:#c2b2e3}
.insight24_person_li{position:relative;}
.insight24_person_li > li{position:relative; margin-bottom:126px;}
.insight24_person_li > li:before{position:absolute; content:""; top:5px; width:11px; height:11px; border-radius:50%; background:#4e8fe1; left:50%; margin-left:-5px; box-shadow:0 0 0 5px rgba(79,142,227, .4)}
.insight24_person.insight23_person .insight24_person_li > li:before{background:#8665c8; box-shadow:0 0 0 5px rgba(134,101,200, .4)}
.insight24_person_li > li:after{content:""; display:table; table-layout:fixed; clear:both}
.insight24_person_li li:nth-child(2n) > div{float:right; text-align:right;}
.insight24_person_li_img{display:inline-block; vertical-align:top; width:47%; padding-bottom:28.27%; position:relative; overflow:hidden; border-radius:8px; box-shadow:0 10px 13px rgba(0,0,0,.1);}
.insight24_person_li_img img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.insight24_person_li_img:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border-radius:8px; border:1px solid rgba(0,0,0,.08);}
.insight24_person_li_t_bg{display:inline-block; vertical-align:top; width:calc(53% - 70px); word-break:keep-all; margin-left:70px;}
.insight24_person_li li:nth-child(2n) .insight24_person_li_t_bg{margin-left:0; margin-right:70px;}
.insight24_person_li_t1{font:600 26px/1.5 'Roboto'; text-transform:uppercase; margin-top:-9px; letter-spacing:0.3px;}
.insight24_person_li_t2{font:400 14px/20px 'SCoreDream'; margin-bottom:11px;}
.insight24_person_li_t3{font:600 15px/24px 'SCoreDream'; color:#4f8ee3; margin-bottom:19px;}
.insight24_person.insight23_person .insight24_person_li_t3{color:#8665c8}
.insight24_person_li_t4{font:400 14px/24px 'SCoreDream'; color:#777; margin-bottom:24px; letter-spacing:-0.3px;}
.insight24_person_li_column{background:#4f8ee3; font:400 14px/21px 'Roboto'; color:#fff; display:inline-block; text-transform:uppercase; padding:1px 14px 0; border-radius:5px; border:1px solid #4886d9; margin-bottom:15px;}
.insight24_person.insight23_person .insight24_person_li_column{background:#8665c8; border-color:#7255ad}
.insight24_person_li_column_li li{margin-bottom:4px; }
.insight24_person_li_column_li li:last-child{margin-bottom:0}
.insight24_person_li_column_li li a:before{content:"●"; font-size:6px; display:inline-block; vertical-align:middle; margin:-2px 7px 0 0 ; font-family:'SCoreDream'}
.insight24_person_li_column_li li a{display:block; font:500 15px/1.5 'SCoreDream'; color:#333; letter-spacing:-0.1px;}
@media screen and (max-width:1100px) {
.insight24_person{padding:0}
.insight24_person::before{display:none;}
.insight24_person_li > li{margin-bottom:50px; padding-top:14%;}
.insight24_person_li > li:before{display:none;}
.insight24_person_li li:nth-child(2n) > div{float:none; text-align:left}
.insight24_person_li_bg{position:absolute; top:0; left:0; width:100%; padding-bottom:40%; background:#ededed;}
.insight24_person_li_img{display:block; width:47%; padding-bottom:47%; margin:0 auto 25px}
.insight24_person_li_t_bg{display:block; width:calc(100% - 40px); margin:0 20px;}
.insight24_person_li li:nth-child(2n) .insight24_person_li_t_bg{margin:0 20px;}
.insight24_person_li_t1{font:600 24px/1.5 'Roboto'; margin-top:0}
.insight24_person_li_t2{font-size:13px; margin-bottom:8px}
.insight24_person_li_t3{font-size:14px; line-height:22px; margin-bottom:10px;}
.insight24_person_li_t4{margin-bottom:20px}
.insight24_person_li_column{font:400 13px/20px 'Roboto'; padding:1px 10px 0; margin-bottom:10px;}
.insight24_person_li_column_li li a:before{font-size:5px; margin:-2px 5px 0 0}
.insight24_person_li_column_li li a{font-size:14px}
}
/* ====== readers ======================================================================================================= */
/* readers */
.readers_bnn {
background: url(https://static.heraldcorp.com/wbazic/biz/www/image/readers_bnn.jpg) center no-repeat;
background-size: cover;
text-align: center;
color: #fff;
font-size: 15px;
line-height: 22px;
font-weight: 200;
padding: 75px 51px 78px;
letter-spacing: -0.5px;
word-break: keep-all;
}
.readers_bnn b {
display: block;
font-size: 28px;
font-weight: 500;
line-height: 40px;
margin-bottom: 13px;
letter-spacing: -1px
}
.readers_tab {
font-size: 0;
margin-bottom: 35px
}
.readers_tab li {
width: 50%;
display: inline-block;
vertical-align: middle;
position: relative;
}
.readers_tab li a {
display: block;
line-height: 76px;
font-size: 18px;
text-align: center;
border-bottom: 1px solid #dbdbdb;
color: #999;
font-weight: 300
}
.readers_tab li.on a:after {
position: absolute;
content: "";
left: 0;
right: 0;
bottom: 0;
height: 3px;
background: #33b8ff
}
.readers_tab li.on a {
color: #000;
font-weight: 500
}
.readers_title {
font-size: 22px;
text-align: center;
line-height: 64px
}
.readers_title.readers_title_zoom {
letter-spacing: -0.8px
}
.readers_li {
font-size: 0;
margin-bottom: 38px
}
.readers_li li {
width: 25%;
display: inline-block;
vertical-align: middle;
margin-bottom: -1px
}
.readers_li li a {
height: 76px;
display: block;
position: relative;
}
.readers_li li a img {
max-width: 70%;
max-height: 60%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
transition: .2s
}
.readers_li li a:after {
position: absolute;
content: "";
top: 0;
left: -1px;
right: 0;
bottom: 0;
border: 1px solid #e5e5e5
}
.readers_li li:first-child a:after, .readers_li li:nth-child(4n+1) a:after {
left: 0
}
.readers_li li:hover a img {
transform: translate(-50%,-50%) scale(1.1)
}
.leaders_club_box .readers_li {
margin-bottom: 0
}
.leaders_club_box .readers_li li {
width: 50%
}
.leaders_club_box .readers_li li a {
height: 70px
}
.leaders_club_box .readers_li li:first-child a:after, .leaders_club_box .readers_li li:nth-child(2n+1) a:after {
left: 0
}
.readers_service {
width: 100%;
position: relative;
border-top: 2px solid #000;
border-bottom: 1px solid #000;
margin-bottom: 37px
}
.readers_service th, .readers_service td {
vertical-align: middle;
font-size: 16px;
line-height: 30px;
border-bottom: 1px solid #dbdbdb;
letter-spacing: -0.5px
}
.readers_service th {
width: 180px;
font-weight: 400
}
.readers_service td {
padding: 22px 0;
font-weight: 300;
color: #666
}
.readers_service tr:last-child th, .readers_service tr:last-child td {
border: none
}
.readers_info {
position: relative;
margin-bottom: 36px
}
.readers_info_top {
font-size: 0;
padding: 22px 0 17px
}
.readers_info_top_l, .readers_info_top_r {
display: inline-block;
vertical-align: middle
}
.readers_info_top_l {
width: calc(100% - 230px)
}
.readers_info_top_r {
width: 230px;
color: #999;
font-size: 13px;
font-weight: 300;
text-align: right;
letter-spacing: -0.3px
}
.readers_info_top_r_icon {
width: 32px;
height: 32px;
display: inline-block;
margin-bottom: 12px
}
.readers_info_top_r_icon svg {
width: 100%;
height: 100%;
transition: .2s;
fill: #888
}
.readers_info_top_r_icon:hover svg {
fill: #000
}
.readers_info_top_l_top {
margin-bottom: 6px
}
.readers_info_top_l_top strong, .readers_info_top_l_top b, .readers_info_top_l_top span, .readers_info_top_l_bottom b, .readers_info_top_l_bottom_arrow, .readers_info_top_l_bottom_num_bg, .readers_info_top_l_bottom_num {
display: inline-block;
vertical-align: middle
}
.readers_info_top_l_top strong {
font-size: 25px;
font-weight: 500;
line-height: 25px
}
.readers_info_top_l_top b {
font-size: 18px;
font-weight: 300;
line-height: 25px;
letter-spacing: -0.5px;
margin: 0 10px 0 18px
}
.readers_info_top_l_top span {
font-size: 14px;
font-weight: 300;
line-height: 25px;
letter-spacing: -0.5px;
border: 1px solid #f82525;
line-height: 18px;
color: #f82525;
border-radius: 10px;
padding: 0 9px
}
.readers_info_top_l_bottom.up, .readers_info_chart_info_tb td.up {
color: #f82525
}
.readers_info_top_l_bottom.down, .readers_info_chart_info_tb td.down {
color: #0caafe
}
.readers_info_top_l_bottom b {
font-size: 31px;
font-weight: 500;
margin-right: 13px;
letter-spacing: -1.5px;
line-height: 40px
}
.readers_info_top_l_bottom_arrow {
font-size: 12px;
line-height: 20px
}
.readers_info_top_l_bottom_arrow_sign {
font-size: 20px;
margin-left: 13px
}
.readers_info_top_l_bottom_num_bg {
line-height: 20px;
margin-top: 7px
}
.readers_info_top_l_bottom_num {
font-size: 18px;
font-weight: 300;
letter-spacing: -0.5px;
line-height: 20px
}
.readers_info_top_l_bottom.up .readers_info_top_l_bottom_arrow_down, .readers_info_top_l_bottom.down .readers_info_top_l_bottom_arrow_up {
display: none
}
.readers_info_chart_bg {
border: 1px solid #000;
font-size: 0
}
.readers_info_chart {
padding-top: 4px
}
.readers_info_chart_menu {
position: relative
}
.readers_info_chart_menu_li {
text-align: center;
background: #f6f6f6;
border-bottom: 1px solid #dbdbdb
}
.readers_info_chart_menu_li li {
display: inline-block;
vertical-align: top;
width: 60px;
position: relative;
margin: 0 50px
}
.readers_info_chart_menu_li li a {
display: block;
font-size: 16px;
text-align: center;
line-height: 42px;
font-weight: 300;
color: #999;
letter-spacing: -0.5px
}
.readers_info_chart_menu_li li a:after {
position: absolute;
content: "";
left: 0;
right: 0;
bottom: -1px;
height: 1px;
background: transparent
}
.readers_info_chart_menu_li li.on a {
color: #000
}
.readers_info_chart_menu_li li.on a:after {
background: #000
}
.readers_info_chart .chart {
width: 100%;
padding: 0;
margin: 0;
border: none;
border-radius: 0;
box-shadow: none;
}
.readers_info_chart .chart .chart_graph {
width: calc(100% - 10px) !important
}
/*
.readers_info_chart_canvas{width:100%; height:265px}
.readers_info_chart_canvas canvas{width:448px !important; height:194px !important; padding:30px}
*/
.readers_info_chart_info {
border-bottom: 1px solid #dbdbdb;
padding: 10px 0
}
.readers_info_chart_info_tb {
width: 100%;
}
.readers_info_chart_info_tb th, .readers_info_chart_info_tb td {
vertical-align: middle;
color: #333;
line-height: 20px;
letter-spacing: -0.3px;
padding: 4px 30px
}
.readers_info_chart_info_tb th {
font-size: 15px;
text-align: left;
padding-right: 0;
font-weight: 300;
}
.readers_info_chart_info_tb td {
font-size: 14px;
text-align: right;
padding-left: 0;
font-weight: 400;
word-break: break-all;
width: 20%
}
.readers_info_chart_info_tb_line {
height: 1px;
background: #dbdbdb;
margin: 11px 0 14px
}
.readers_info_cate {
border: 3px solid #cdcdcd;
margin-bottom: 37px
}
.readers_info_cate_li {
font-size: 0
}
.readers_info_cate_li li {
display: inline-block;
vertical-align: middle;
width: 33.33%;
position: relative;
}
.readers_info_cate_li li a {
display: block;
text-align: center;
position: relative;
padding: 23px 0;
transition: .2s
}
.readers_info_cate_li li a:after {
position: absolute;
content: "";
width: 1px;
height: 30px;
background: #dbdbdb;
right: 0;
top: 33px
}
.readers_info_cate_li li:last-child a:after {
display: none
}
.readers_info_cate_li li a:hover {
background: #f6f6f6
}
.readers_info_cate_li_t1 {
font-size: 18px;
font-weight: 400;
line-height: 25px;
margin-bottom: 5px;
letter-spacing: -0.2px
}
.readers_info_cate_li_t2 {
font-size: 14px;
font-weight: 300;
line-height: 20px;
color: #999;
letter-spacing: -0.7px
}
.readers_detail_tb {
position: relative;
width: 100%;
border-top: 2px solid #000;
border-bottom: 1px solid #000;
margin-bottom: 36px
}
.readers_detail_tb th, .readers_detail_tb td {
vertical-align: middle;
line-height: 26px;
padding: 5px 0
}
.readers_detail_tb th {
text-align: left;
width: 640px
}
.readers_detail_tb th a {
display: block;
width: 640px;
font-size: 16px;
font-weight: 300;
letter-spacing: -0.5px
}
.readers_detail_tb td {
text-align: right;
word-break: break-all;
font-size: 14px;
color: #999;
font-weight: 300;
letter-spacing: -0.8px;
padding-right: 10px
}
.readers_detail_tb tr:first-child th, .readers_detail_tb tr:first-child td {
padding-top: 24px
}
.readers_detail_tb tr:last-child th, .readers_detail_tb tr:last-child td {
padding-bottom: 24px
}
.readers_detail_tb th a:hover span {
text-decoration: underline;
}
/* chart_box */
.chart_box{font-size:0; margin:0 -6px}
.chart{display:inline-block; vertical-align:top}
.chart_graph, .chart_tb_bg{display:inline-block; vertical-align:top}
.chart{position:relative; border-radius:20px; border:1px solid #e5e5e5; box-shadow:0 4px 20px rgb(0,0,0,.04); margin:0 5px 12px; padding-bottom:10px}
/* chart type */
.chart_box.chart_box_type1 .chart{width:calc(100% - 12px)}
.chart_box.chart_box_type2 .chart{width:calc(50% - 12px)}
.chart_box.chart_box_type3 .chart{width:calc(33.33% - 12px)}
.chart_box.chart_box_type4 .chart{width:calc(33.33% - 12px)}
.chart_box.chart_box_type3_2 .chart{width:calc(33.33% - 12px)}
.chart_box.chart_box_type3_2 .chart:last-child{width:calc(66.66% - 12px)}
.chart_box.chart_box_type3_2 .chart:last-child .chart_graph{width:calc(100% - 22px)}
.chart_box.chart_box_type3_3 .chart{width:calc(66.66% - 12px)}
.chart_box.chart_box_type3_3 .chart:last-child{width:calc(33.33% - 12px)}
.chart_box.chart_box_type3_3 .chart:first-child .chart_graph{width:calc(100% - 22px)}
.chart_box.chart_box_type5 .chart{width:calc(75% - 12px)}
.chart_box.chart_box_type5 .chart:last-child{width:calc(25% - 12px)}
.chart_box.chart_box_type5 .chart:first-child .chart_graph{width:calc(100% - 22px)}
.chart_box.chart_box_type5_2 .chart{width:calc(25% - 12px)}
.chart_box.chart_box_type5_2 .chart:last-child{width:calc(75% - 12px)}
.chart_box.chart_box_type6 .chart{width:calc(80% - 12px)}
.chart_box.chart_box_type6 .chart:last-child{width:calc(20% - 12px)}
.chart_box.chart_box_type6 .chart:first-child .chart_graph{width:calc(100% - 22px)}
.chart_title{font-size:16px; padding:10px 30px; margin:0 0 10px; font-weight:600; letter-spacing:-1px; color:#222; line-height:30px; border-bottom:1px solid #efefef}
.chart_graph{width:calc(50% - 20px); margin-left:10px}
.chart_graph_no_data{font-size:14px; line-height:150px; text-align:center; display:block; color:#999}
.chart_tb_bg{width:calc(50% - 50px); margin:0 30px 0 20px}
.chart_tb{width:100%; max-width:800px; margin:0 auto}
.chart_tb th, .chart_tb td{border:1px solid #e5e5e5; padding:4px 0; text-align:center; font-size:11px; line-height:1.5}
.chart_tb th{font-weight:600; color:#222; background:#f9f9f9}
.chart_tb td{font-weight:300; color:#555}
.chart_high{color:#fa113d; font-weight:600}
.chart_low{color:#01A3FF; font-weight:600}
article.leader .leader_content {
display: none;
}
article.leader .leader_content.on {
display: block;
}
/* fortune */
/* main.fortune .section_title {
padding: 0 15px 20px;
font-size: 32px;
border-top: 0;
} */
main.fortune .view_sns {
position: absolute;
top: 314px;
left: 50%;
margin-left: -620px;
}
main.fortune .view_sns li {
height: 38px;
margin-bottom: 8px
}
main.fortune .view_sns .btn_twitter {
box-sizing: border-box;
display: inline-block;
width: 38px;
height: 38px;
padding: 3px 5px;
border-radius: 100%;
background: #000
}
main.fortune .view_sns .btn_twitter svg {
display: block;
width: 28px;
height: 30px;
fill: #e7e9ea
}
/* window popup / print */
.pop_window {
box-sizing: border-box;
position: relative;
width: 630px;
min-width: 630px;
margin: 0 auto;
padding: 30px 30px 40px;
}
.pop_window .btn_area {
font-size: 0;
text-align: center;
}
.pop_window .btn_area a {
box-sizing: border-box;
display: inline-block;
min-width: 86px;
padding: 0 22px;
font-size: 15px;
font-weight: 500;
line-height: 32px;
border: 1px solid #1D9BF0;
border-radius: 30px;
}
.pop_window .btn_area a.btn_blue {
color: #fff;
background: #1D9BF0;
}
.pop_window .btn_area a.btn_white {
color: #1D9BF0;
background: #fff
}
.pop_window .btn_area a + a {
margin-left: 8px
}
.pop_window .news_content {
padding-top: 20px
}
.pop_window .news_content .news_title_area {
color: #111;
font-size: 26px;
line-height: 32px;
}
.pop_window .news_content .news_title_area h1.news_title {
color: #111;
font-size: 26px;
line-height: 32px
}
.pop_window .news_content .news_title_area h2.news_title {
margin: 14px 0 0;
color: #666;
font-size: 18px;
line-height: 22px
}
.pop_window .news_content .news_title_area .news_date {
margin-top: 20px;
font-size: 15px
}
.pop_window .news_content .news_text_area {
padding: 30px 0;
border-bottom: 1px solid #e5e5e5;
}
.pop_window .news_content .news_text_area .text_box p {
font-size: 16px;
line-height: 24px
}
.pop_window .news_content .news_text_area .text_box p+p {
margin-top: 20px
}
.pop_window .news_content .news_text_area .img_box {
text-align: center
}
.pop_window .news_content .news_text_area .img_box img {
display: inline-block;
width: 100%;
height: auto
}
.pop_window .news_content .news_text_area .img_box .img_caption {
box-sizing: border-box;
display: block;
padding: 15px 0 25px;
color: #999;
font-size: 14px;
line-height: 22px;
text-align: left;
}
.pop_window .news_content .news_text_area .article-view p,
.pop_window .news_content .news_text_area .article-view-text {
font-size: 16px !important;
line-height: 24px !important;
}
.pop_window .news_content .news_text_area .text_box p {
color: #333
}
.pop_window .news_content .news_text_area .text_box p em {
font-style: italic
}
.pop_window .news_content .news_text_area .text_box p strong {
font-weight: 700
}
.pop_window .news_content .news_text_area .text_box p u {
text-decoration: underline
}
.pop_window .news_content .news_text_area .text_box p strike {
text-decoration: line-through
}
.pop_window .news_content .news_text_area .text_box p+p {
margin-top: 40px
}
.pop_window .news_content .news_text_area .text_box+.img_box {
margin-top: 40px
}
.pop_window .news_content .news_text_area .news_url {
margin-top: 30px;
color: #999;
font-size: 14px;
}
.pop_window .copy {
padding-top: 30px;
color: #999;
font-size: 12px;
text-align: center
}
.pop_window .copy + .btn_area {
padding-top: 30px
}
.pop_window .pop_join {
box-sizing: border-box;
position: relative;
background: #333;
border-radius: 15px;
text-align: center;
padding: 30px 50px;
word-break: keep-all;
margin-top: -60px;
}
.pop_window .pop_join::before {
content: "";
position: absolute;
top: -80px;
left: 0;
width: 100%;
height: 80px;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, rgba(255, 255, 255, .9) 50%, rgba(255, 255, 255, 1) 100%);
}
.pop_window .pop_join .pop_join_title {
color: #fff;
text-align: center;
font-size: 28px;
font-weight: 400;
line-height: 1.3;
letter-spacing: 0.75px;
}
.pop_window .pop_join .pop_join_title + .pop_join_title {
color: #1D9BF0;
font-weight: 600;
}
.pop_window.pop_join .pop_join_btn {
width: 150px;
margin-top: 20px;
color: var(--Color, #FFF);
text-align: center;
font-family: Pretendard;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 24px */
padding: 10px 0;
border-radius: 22px;
border: 1px solid #1D9BF0;
background: rgba(29, 155, 240, .9);
backdrop-filter: blur(150px);
-webkit-backdrop-filter: blur(150px);
display: inline-block;
vertical-align: top;
margin-top: 20px;
}
.pop_window .pop_join .pop_join_sub {
margin-top: 20px;
color: rgba(255, 255, 255, .6);
font-size: 16px;
font-weight: 200;
line-height: 1.5;
letter-spacing: -0.16px;
}
.pop_window .pop_join .pop_join_btn_2 {
box-sizing: border-box;
display: inline-block;
margin-top: 12px;
padding: 5px 5px 5px 15px;
border: 1px solid #fff;
border-radius: 25px;
font-size: 0;
vertical-align: middle;
}
.pop_window .pop_join .pop_join_btn_2 span {
display: inline-block;
color: #FFF;
font-size: 13px;
font-weight: 400;
line-height: 1;
vertical-align: middle;
}
.pop_window .pop_join .pop_join_btn_2 i {
display: inline-block;
vertical-align: middle;
}
.pop_window .pop_join .pop_join_btn_2 i svg {
width: 15px;
height: 15px;
}
@media print {
.pop_window .btn_area {
display: none
}
}
/* climate */
#ccw-container-1 ccw-panel[deadline] {
background: linear-gradient(30deg,#cf0a05,rgba(207,10,5,0) 90.71%),/*Our CClock Red*/ linear-gradient(172deg,#dda1a3,rgba(221,161,163,0) 99.71%),/*Clean Creative Pink*/ linear-gradient(250deg,#ffce07,rgba(0,0,255,0) 97.71%) !important
}
#ccw-container-1 ccw-panel[lifeline] {
background: linear-gradient(127deg,#2caf7e,rgba(255,0,0,0) 70.71%),/*Clean Creative Green*/ linear-gradient(10deg,#5887a8,rgba(0,255,0,0) 70.71%),/*Clean Creative Blue*/ linear-gradient(300deg,rgba(0,0,255,.8),rgba(0,0,255,0) 70.71%) !important
}
ccw-panel[lifeline],ccw-panel[deadline],ccw-panel[lifeline] ccw-div ccw-span,ccw-panel[deadline] ccw-div ccw-span,#ccw-container-1 ccw-panel[lifeline] ccw-span:first-of-type,#ccw-container-1 ccw-panel[deadline] ccw-span:first-of-type,#ccw-container-1 ccw-ticker {
color: #d7d7d7 !important
}
#ccw-container-1 ccw-panel[deadline] ccw-span:first-of-type {
background-color: rgba(255,0,0,0) !important
}
#ccw-container-1 ccw-panel[lifeline] ccw-span:first-of-type {
background-color: rgba(255,0,0,0) !important
}
climate-clock ccw-brand {
display: none !important;
}
/* view style guide */
.article-wrap {position: relative;overflow: hidden; margin: 0 auto;}
.article-wrap .left-main-news {width: 860px; float:left;}
.article-wrap .left-main-news .sub-news-list-wrap{margin-top:0;}
.article-wrap .right-sub-conts {float:right;}
.article-wrap .article-header {position: relative; border-bottom: 1px solid #DDDDDD; margin-bottom: 40px;}
.article-wrap .article-header .navi-area {margin-bottom:20px;font-size: 18px;font-weight: 400;color: #171717; line-height: 28px;}
.article-wrap .article-header .navi-area .nav-area-pick{font-weight:bold;}
.article-header .navi-area span{position:relative; margin-right:19px;}
.article-header .navi-area span::after {content: "";position: absolute;right: -16px; top:9px; width: 7px; display: inline-block;height: 14px; background-repeat: no-repeat;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='12' fill='none'%3E%3Cpath fill='%23333' d='M.266 1.18a.907.907 0 0 0 0 1.286L3.802 6 .266 9.536a.908.908 0 1 0 1.285 1.285l4.183-4.182a.908.908 0 0 0 0-1.285L1.55 1.172a.916.916 0 0 0-1.285.009Z'/%3E%3C/svg%3E");}
.article-header .navi-area span:last-child::after {content: " "; background-image:none;}
.article-wrap .article-header .headline {font-size: 38px; line-height:48px;font-weight: bold; color: #171717; margin-bottom: 50px;}
.article-wrap .article-header h2{font-size:24px; color:#1D9BF0; margin:16px 0; font-weight:500;}
.article-wrap .article-header .headline .ico-pay{background: #1D9BF0; font-size: 20px; color: #fff; margin-right: 5px; /* padding: 0px 9px 5px 8px; */ font-style: normal; border-radius: 5px; float: left; height: 36px; width: 36px; text-align: center; margin-top:8px; line-height:36px;}
.article-wrap .article-header .group {display: flex;align-items: flex-end;position: relative; position: relative;line-height: 24px;margin-bottom: 24px;}
.article-wrap .article-header .group .datetime span{margin-right: 14px;font-size: 14px;font-weight: 300;color: #666;letter-spacing: -0.1px;}
.article-wrap .article-header h2.title-interview{color:#043B72 !important;}
/* 확대보기 추가 */
.btn-zoom{width:34px; height:34px; cursor:pointer; float:right; margin:-35px 15px 0 0; display:flex; z-index:1; position:relative;}
.ico-zoom{width:34px; height:34px; cursor:pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' fill='none'%3E%3Cpath fill='%23000' fill-opacity='.6' d='M0 0h34v34H0z'/%3E%3Cpath fill='%23fff' d='M7 13.25a1.21 1.21 0 0 1-.891-.36c-.24-.24-.36-.537-.359-.89V7c0-.354.12-.651.36-.891s.537-.36.89-.359h5c.354 0 .651.12.891.36s.36.537.359.89c0 .354-.12.651-.36.891s-.537.36-.89.359h-2l3.031 3.031c.23.23.344.51.344.844A1.2 1.2 0 0 1 13 13c-.23.23-.52.344-.875.344-.354 0-.646-.115-.875-.344l-3-3v2c0 .354-.12.651-.359.891s-.536.36-.891.359ZM21 13c-.23-.23-.344-.52-.344-.875 0-.354.115-.646.344-.875l3-3h-2c-.354 0-.651-.12-.891-.359s-.36-.536-.359-.891c0-.354.12-.651.36-.891s.537-.36.89-.359h5c.354 0 .651.12.891.36s.36.537.359.89v5c0 .354-.12.651-.36.891s-.537.36-.89.359a1.21 1.21 0 0 1-.891-.36c-.24-.24-.36-.537-.359-.89v-2l-3.031 3.031c-.23.23-.51.344-.844.344A1.2 1.2 0 0 1 21 13Zm1 15.25a1.21 1.21 0 0 1-.891-.36c-.24-.24-.36-.537-.359-.89 0-.354.12-.651.36-.891s.537-.36.89-.359h2l-3.031-3.031c-.23-.23-.344-.51-.344-.844A1.2 1.2 0 0 1 21 21c.23-.23.52-.344.875-.344.354 0 .646.115.875.344l3 3v-2c0-.354.12-.651.36-.891s.537-.36.89-.359c.354 0 .651.12.891.36s.36.537.359.89v5c0 .354-.12.651-.36.891s-.537.36-.89.359h-5Zm-15 0a1.21 1.21 0 0 1-.891-.36c-.24-.24-.36-.537-.359-.89v-5c0-.354.12-.651.36-.891s.537-.36.89-.359c.354 0 .651.12.891.36s.36.537.359.89v2l3.031-3.031c.23-.23.51-.344.844-.344A1.2 1.2 0 0 1 13 21c.23.23.344.52.344.875 0 .354-.115.646-.344.875l-3 3h2c.354 0 .651.12.891.36s.36.537.359.89c0 .354-.12.651-.36.891s-.537.36-.89.359H7Z'/%3E%3C/svg%3E");}
.popup-zoom{width:100%; height:100%; background:#222; position:fixed; top:0; left:0; z-index:999;}
.btn-zoom-close{width:24px; height:24px; cursor:pointer; position:absolute; right:40px; top:40px;}
.btn-zoom-close .ico-close{width:24px; height:24px; cursor:pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23fff' d='m13.96 11.934 9.72-9.72A1.333 1.333 0 0 0 21.8.334l-9.72 9.72L2.36.32A1.333 1.333 0 0 0 .48 2.2l9.72 9.733-9.734 9.72a1.335 1.335 0 1 0 1.88 1.88l9.733-9.72 9.72 9.72a1.333 1.333 0 0 0 1.88-1.88l-9.72-9.72Z'/%3E%3C/svg%3E");}
.popup-zoom{display:none;}
.zoom-area{display:flex; width:100%; height:100%; justify-content:center; align-items:center;}
.zoom-area figure img{width:100%; max-width:100vw; max-height:100vh;}
/* 본문이미지크기 */
.size-l{max-width:860px !important;}
.size-m{max-width:540px !important;}
.size-s{max-width:300px !important;}
/* 본문이미지정렬 */
.align-c{text-align:center; margin:0 auto 40px auto !important; width: 100% !important;}
.align-l{text-align:left; float:left; margin:0 20px 40px auto !important;}
.align-r{text-align:right; float:right; margin:0 auto 40px 20px !important;}
/*본문 sns영역*/
.article-wrap .article-header .group .sns-area-wrap [class*="btn-"] {display: block;margin-left: 22px; width: 30px;height: 30px; border: 1px solid #f3f3f300; border-radius: 100%;}
.article-wrap .article-header .group .sns-area-wrap {display: flex;margin-left: auto;}
.ico-bookmark {width: 34px;height: 34px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath stroke='%23333' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M22.333 9H11.667A2.667 2.667 0 0 0 9 11.667V32.11L17 25l8 7.111V11.667A2.667 2.667 0 0 0 22.333 9Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M4 8h25v25H4z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}
.ico-bookmark.on{width:34px; height:34px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' fill='none'%3E%3Cmask id='a' width='25' height='25' x='4' y='8' maskUnits='userSpaceOnUse' style='mask-type:luminance'%3E%3Cpath fill='%23fff' d='M29 8H4v25h25V8Z'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath fill='%231D9BF0' stroke='%231D9BF0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M22.333 9H11.667A2.667 2.667 0 0 0 9 11.667V32.11L17 25l8 7.111V11.667A2.667 2.667 0 0 0 22.333 9Z'/%3E%3C/g%3E%3C/svg%3E");}
/*.ico-bookmark.on{ left: -2px; width:38px; height:40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' fill='none'%3E%3Cpath fill='%231D9BF0' stroke='%231D9BF0' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.563' d='M21.188 7.344h-9.375a2.344 2.344 0 0 0-2.344 2.343v17.97l7.031-6.25 7.031 6.25V9.686a2.344 2.344 0 0 0-2.343-2.343Z'/%3E%3C/svg%3E");}
.ico-bookmark.on {width: 34px;height: 34px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' fill='none'%3E%3Cmask id='a' width='25' height='25' x='4' y='8' maskUnits='userSpaceOnUse' style='mask-type:luminance'%3E%3Cpath fill='%23fff' d='M29 8H4v25h25V8Z'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath fill='%231D9BF0' stroke='%231D9BF0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M22.333 9H11.667A2.667 2.667 0 0 0 9 11.667V32.11L17 25l8 7.111V11.667A2.667 2.667 0 0 0 22.333 9Z'/%3E%3C/g%3E%3C/svg%3E");}*/
.group .sns-area-wrap .btn-share-open .ico-share-open{width:28px; height:28px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' fill='none'%3E%3Cpath fill='%23333' d='m25.494 10.745-5.25 5.25a.876.876 0 1 1-1.238-1.239l3.757-3.755h-4.341A9.625 9.625 0 0 0 9.1 18.218a.875.875 0 1 1-1.695-.437A11.369 11.369 0 0 1 18.422 9.25h4.343l-3.76-3.755a.875.875 0 0 1 1.24-1.239l5.25 5.25a.875.875 0 0 1 0 1.239ZM21.375 21.5H4.75V8.375a.875.875 0 1 0-1.75 0V21.5a1.75 1.75 0 0 0 1.75 1.75h16.625a.875.875 0 1 0 0-1.75Z'/%3E%3C/svg%3E");}
.group .sns-area-wrap .btn-print .ico-print {width:30px; height:30px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' fill='none'%3E%3Cpath fill='%23000' stroke='%23000' stroke-width='.3' d='M23.48 8.313h-2.043V4.374A.438.438 0 0 0 21 3.937H7a.437.437 0 0 0-.438.438v3.938H4.52c-1.286 0-2.332.984-2.332 2.187v8.75a.438.438 0 0 0 .437.438h3.938v3.937a.438.438 0 0 0 .437.438h14a.438.438 0 0 0 .438-.438v-3.938h3.937a.438.438 0 0 0 .438-.437V10.5c0-1.203-1.047-2.188-2.333-2.188Zm-16.043-3.5h13.125v3.5H7.438v-3.5Zm13.125 18.375H7.438v-6.125h13.125v6.125Zm4.375-4.375h-3.5v-2.188a.438.438 0 0 0-.437-.438H7a.438.438 0 0 0-.438.438v2.188h-3.5V10.5c0-.724.657-1.313 1.458-1.313h18.96c.801 0 1.457.589 1.457 1.313v8.313Zm-3.5-6.125a.874.874 0 1 1-1.748 0 .874.874 0 0 1 1.748 0Z'/%3E%3C/svg%3E");}
.group .sns-area-wrap .btn-email .ico-email {width:26px; height:26px;top: 2px; right: -3px;position: relative; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.2' d='M21.429 3H2.57C1.625 3 .857 3.768.857 4.714v14.572c0 .947.768 1.714 1.714 1.714H21.43c.946 0 1.714-.767 1.714-1.714V4.714c0-.946-.768-1.714-1.714-1.714Z'/%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.2' d='m.857 5.143 10.046 8.571a1.714 1.714 0 0 0 2.194 0l10.046-8.571'/%3E%3C/svg%3E");}
.group .sns-area-wrap .btn-font .ico-font{font-size:22px; width:22px; height:32px; position: relative; top: -1px; /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='21' fill='none'%3E%3Cpath fill='%23333' d='M1.09 2.918h9.218c0 5.764-2.464 10.868-8.954 14.146L.1 15.326c4.862-2.486 7.48-5.984 7.942-10.56H1.09V2.918ZM18.514 8.66v1.892H15.5v10.12h-2.266V.806H15.5V8.66h3.014Z'/%3E%3C/svg%3E");*/}
.article-wrap .article-header .group .popup-sns-wrap {position: absolute;top: 40px;right: 150px;z-index: 2;width: 270px;height: 240px;background: #fff;border: 1px solid #ddd;border-radius: 5px;padding: 12px;}
.popup-title{font-size:15px; color:#333; font-weight:500; line-height:22px; margin-left:9px; float:left;}
.btn-pop-close{width:14px; height:14px; float:right; margin-right: 6px;}
.btn-pop-close .ico-share-close{width:14px; height:14px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' fill='none'%3E%3Cpath fill='%23999' d='m7.94 6 4.86-4.86a.667.667 0 0 0-.94-.94L7 5.06 2.14.194a.667.667 0 0 0-.94.94L6.06 6l-4.867 4.86a.666.666 0 1 0 .94.94L7 6.94l4.86 4.86a.667.667 0 0 0 .94-.94L7.94 6Z'/%3E%3C/svg%3E");}
.popup-sns-wrap-box .popup-sns-list{position: relative;width: 212px;height: 164px; margin: 0 auto;margin-top: 18px; display:flex; flex-wrap: wrap;}
.popup-sns-wrap-box .popup-sns-list li{width: 30%; height: 72px; margin-right: 10.5px;margin-bottom: 21px; text-align: center;}
.popup-sns-wrap-box .popup-sns-list li:nth-child(3n){margin-right:0;}
.popup-sns-wrap-box .popup-sns-list li button .ico-facebook{width:50px; height:71px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='71' fill='none'%3E%3Cpath fill='%23444' d='M3.232 56.998H4.8v5.894c-.532.028-1.05.042-1.568.056v-5.95Zm2.618 0h1.036v-.924h-5.74v.924h1.036v5.978c-.476.014-.896.014-1.274.014l.112.952c1.638 0 4.27-.056 6.216-.42l-.07-.84c-.406.056-.868.098-1.316.14v-5.824Zm2.38 2.268H6.522v1.008H8.23v6.104h1.078V54.786H8.23v4.48Zm2.422-4.774v12.544h1.106V54.492h-1.106Zm11.69-.014v12.586h1.147V54.478h-1.148Zm-5.475.966c-1.862 0-3.192 1.708-3.192 4.382 0 2.674 1.33 4.382 3.192 4.382s3.192-1.708 3.192-4.382c0-2.674-1.33-4.382-3.192-4.382Zm0 1.036c1.218 0 2.086 1.316 2.086 3.346 0 2.044-.868 3.36-2.086 3.36-1.232 0-2.1-1.316-2.1-3.36 0-2.03.868-3.346 2.1-3.346Zm19.347 4.312c-2.198-.42-4.578-2.324-4.578-4.466v-.966h-1.204v.966c0 2.142-2.366 4.032-4.564 4.466l.518.952c1.89-.448 3.85-1.792 4.648-3.626.798 1.848 2.758 3.192 4.662 3.626l.518-.952Zm-10.822 3.612v.952h11.382v-.952H25.392Zm20.915-5.852h-6.104v-1.456h6.104v1.456Zm1.134-3.78h-1.134V56.2h-6.104v-1.428h-1.134v4.69h8.372v-4.69Zm1.484 6.79v-.938H37.557v.938h5.11v1.47H38.83v.924h7.546v3.094h1.148v-4.018h-3.71v-1.47h5.11Z'/%3E%3Cg clip-path='url(%23a)'%3E%3Crect width='44' height='44' x='3' fill='%23365FB7' rx='22'/%3E%3Cpath fill='%23fff' d='M14 8.25h26.125v26.125H14z'/%3E%3Cpath fill='%23365FB7' d='M25 0C12.85 0 3 9.85 3 22s9.85 22 22 22 22-9.85 22-22S37.15 0 25 0Zm5.211 15.203h-3.307c-.392 0-.827.516-.827 1.2v2.389h4.136l-.625 3.405h-3.51V32.42h-3.904V22.197h-3.54v-3.405h3.54v-2.003c0-2.874 1.994-5.21 4.73-5.21h3.307v3.624Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='44' height='44' x='3' fill='%23fff' rx='22'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}
/*.popup-sns-wrap-box .popup-sns-list li button .ico-twit{width:44px; height:71px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='71' fill='none'%3E%3Cpath fill='%23444' d='M14.204 61.254H6.742v-1.988h7.056v-.91H6.742v-1.862h7.336v-.924H5.58v6.608h8.624v-.924ZM4.11 64.474v.938h11.396v-.938H4.11Zm16.309-8.456c1.218 0 2.085.658 2.085 1.638 0 .98-.867 1.638-2.085 1.638-1.233 0-2.1-.658-2.1-1.638 0-.98.867-1.638 2.1-1.638Zm0 4.214c1.861 0 3.191-1.05 3.191-2.576 0-1.54-1.33-2.59-3.191-2.59-1.877 0-3.207 1.05-3.207 2.59 0 1.526 1.33 2.576 3.207 2.576Zm4.13.616c-2.758.42-5.936.448-8.274.448l.154.966c1.036 0 2.226-.014 3.472-.07v4.452h1.148v-4.522a31.48 31.48 0 0 0 3.598-.42l-.098-.854Zm.91-6.356V67.05h1.148V54.492h-1.148Zm4.744 5.586h4.116v-.924h-4.116v-2.59h4.662v-.952h-5.81v8.414h.966c2.395 0 3.92-.07 5.74-.392l-.126-.938c-1.707.308-3.163.392-5.431.392v-3.01Zm7.476-5.614v4.746h-2.59v.952h2.59v6.888h1.148V54.464H37.68Z'/%3E%3Cg clip-path='url(%23a)'%3E%3Crect width='44' height='44' fill='%2301C1FF' rx='22'/%3E%3Cpath fill='%23fff' d='M11 8.25h26.125v26.125H11z'/%3E%3Cpath fill='%2301C1FF' d='M22 0C9.85 0 0 9.85 0 22s9.85 22 22 22 22-9.85 22-22S34.15 0 22 0Zm8.949 18.022c.01.188.011.376.011.559 0 5.729-4.356 12.331-12.326 12.331a12.226 12.226 0 0 1-6.642-1.948c.337.042.683.058 1.034.058 2.03 0 3.898-.69 5.38-1.854a4.342 4.342 0 0 1-4.046-3.007 4.353 4.353 0 0 0 1.954-.076 4.336 4.336 0 0 1-3.476-4.248v-.053c.584.323 1.254.52 1.964.543a4.331 4.331 0 0 1-1.34-5.789 12.321 12.321 0 0 0 8.93 4.531 4.333 4.333 0 0 1 7.384-3.953c.97-.192 1.9-.548 2.75-1.052a4.354 4.354 0 0 1-1.905 2.4 8.703 8.703 0 0 0 2.489-.686 8.788 8.788 0 0 1-2.161 2.244Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='44' height='44' fill='%23fff' rx='22'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}*/
.popup-sns-wrap-box .popup-sns-list li button .ico-kakaostory{width:74px; height:71px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='74' height='71' fill='none'%3E%3Cpath fill='%23444' d='M1.653 55.78v.938h4.522a9.376 9.376 0 0 1-.378 2.198l-4.774.322.196 1.008 4.228-.406c-.77 1.68-2.156 3.108-4.48 4.256l.63.882c4.494-2.24 5.726-5.558 5.726-9.198h-5.67Zm10.878 3.794h-2.016v-5.096H9.367v12.558h1.148v-6.51h2.016v-.952Zm1.301-3.794v.938h4.522a9.376 9.376 0 0 1-.378 2.198l-4.774.322.196 1.008 4.228-.406c-.77 1.68-2.156 3.108-4.48 4.256l.63.882c4.494-2.24 5.726-5.558 5.726-9.198h-5.67Zm10.878 3.794h-2.016v-5.096h-1.148v12.558h1.148v-6.51h2.016v-.952Zm2.715-.98c0-1.442 1.47-2.38 3.472-2.38s3.458.938 3.458 2.38-1.456 2.38-3.458 2.38c-2.002 0-3.472-.938-3.472-2.38Zm4.046 5.88v-2.618c2.338-.168 3.976-1.414 3.976-3.262 0-2.002-1.904-3.29-4.55-3.29-2.66 0-4.578 1.288-4.578 3.29 0 1.848 1.652 3.094 3.99 3.262v2.618H25.2v.952h11.41v-.952h-5.138Zm16.743-3.682c-2.198-.42-4.578-2.324-4.578-4.466v-.966h-1.204v.966c0 2.142-2.366 4.032-4.564 4.466l.518.952c1.89-.448 3.85-1.792 4.648-3.626.798 1.848 2.758 3.192 4.662 3.626l.518-.952Zm-10.822 3.612v.952h11.382v-.952H37.392Zm18.437.126v-2.59h3.836v-.938h-7.476v-1.89h7.07v-.91h-7.07v-1.764h7.35V55.5h-8.512v6.44h3.654v2.59h-5.124v.952h11.41v-.952h-5.138Zm7.797-4.396h4.634V55.64h-5.824v.938h4.662v2.618h-4.62v4.816h1.036c2.156 0 4.06-.084 6.328-.462l-.112-.938c-2.198.35-4.046.448-6.104.448v-2.926Zm7.28-5.67V67.05h1.148V54.464h-1.148Z'/%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23FFE109' d='M54.477 0H17.524A3.526 3.526 0 0 0 14 3.522v36.955A3.525 3.525 0 0 0 17.524 44h36.953A3.524 3.524 0 0 0 58 40.477V3.522A3.525 3.525 0 0 0 54.477 0Z'/%3E%3Cpath fill='%23fff' d='M40.038 11.648H30.67c-.632 0-1.14.507-1.14 1.132v9.293c0 .627.508 1.133 1.14 1.133h4.32c-.032 1.103-.493 2.306-1.161 3.373-.754 1.203-2.358 2.534-2.371 2.545-.127.12-.22.258-.222.452 0 .151.076.263.16.382l3.013 3.381s.147.155.27.181c.136.037.288.037.398-.046 5.214-4.01 5.968-9.038 6.1-11.76V12.78c0-.625-.51-1.132-1.139-1.132Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='44' height='44' x='14' fill='%23fff' rx='22'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}
.popup-sns-wrap-box .popup-sns-list li button .ico-naverband{width:44px; height:71px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='71' fill='none'%3E%3Cpath fill='%23444' d='M18.11 59.112h1.595v4.76h1.106v-9.38h-1.106v3.682H18.11v-3.458h-1.092v8.694h1.092v-4.298Zm-3.543 1.484h-2.702v-2.128h2.702v2.128Zm1.078-5.096h-1.078v2.058h-2.702V55.5h-1.092v6.02h4.872V55.5ZM13.77 65.818V62.71h-1.148v4.046h8.554v-.938H13.77Zm18.689-5.32h-7.49v-3.92h7.364v-.952h-8.498v5.81h8.624v-.938Zm-10.08 3.892v.952h11.396v-.952H22.378Z'/%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='url(%23b)' d='M34.13 0H9.87C3.965 0 0 4.004 0 9.45v25.101c0 5.448 3.964 9.45 9.87 9.45h24.26c5.906 0 9.87-4.002 9.87-9.45v-25.1C44 4.003 40.036 0 34.13 0Z'/%3E%3Cpath fill='%23fff' d='M22 15.34a10 10 0 0 0-2.463.306V13.75a.65.65 0 0 0-.014-.129C19.366 11.54 17.746 10 15.77 10c-1.978 0-3.599 1.54-3.755 3.621-.01.043-.014 7.117-.014 7.117v4.602l.001.096c.052 5.478 4.509 9.904 10 9.904 5.521 0 9.999-4.478 9.999-10 0-5.523-4.477-10-10-10Zm0 18.465a8.465 8.465 0 0 1-8.464-8.465V13.824c0-1.244 1-2.252 2.232-2.252A2.242 2.242 0 0 1 18 13.824l-.004 11.416c0 2.213 1.789 4.109 4.003 4.109a4.008 4.008 0 1 0-2.463-7.17v-1.715a5.464 5.464 0 1 1-3 4.877v-11.59c0-.376-.345-.732-.769-.732-.424 0-.768.356-.768.732v11.59a7 7 0 1 0 4.537-6.553v-1.546A8.464 8.464 0 1 1 22 33.805Zm-2.463-8.465a2.463 2.463 0 1 1 4.926 0 2.463 2.463 0 0 1-4.926 0Z'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='b' x1='22' x2='22' y1='0' y2='44.001' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2386C440'/%3E%3Cstop offset='1' stop-color='%2317A44A'/%3E%3C/linearGradient%3E%3CclipPath id='a'%3E%3Crect width='44' height='44.002' fill='%23fff' rx='22'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}
.popup-sns-wrap-box .popup-sns-list li button .ico-kakaotalk{width:50px; height:71px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='71' fill='none'%3E%3Cpath fill='%23444' d='M1.832 55.779v.938h4.522a9.376 9.376 0 0 1-.378 2.198l-4.774.322.196 1.008 4.228-.406c-.77 1.68-2.156 3.108-4.48 4.256l.63.882c4.494-2.24 5.726-5.558 5.726-9.198h-5.67Zm10.878 3.794h-2.016v-5.096H9.546v12.558h1.148v-6.51h2.016v-.952Zm1.301-3.794v.938h4.522a9.376 9.376 0 0 1-.378 2.198l-4.774.322.196 1.008 4.228-.406c-.77 1.68-2.156 3.108-4.48 4.256l.63.882c4.494-2.24 5.726-5.558 5.726-9.198h-5.67Zm10.878 3.794h-2.016v-5.096h-1.148v12.558h1.148v-6.51h2.016v-.952Zm2.715-.98c0-1.442 1.47-2.38 3.472-2.38s3.458.938 3.458 2.38-1.456 2.38-3.458 2.38c-2.002 0-3.472-.938-3.472-2.38Zm4.046 5.88v-2.618c2.338-.168 3.976-1.414 3.976-3.262 0-2.002-1.904-3.29-4.55-3.29-2.66 0-4.578 1.288-4.578 3.29 0 1.848 1.652 3.094 3.99 3.262v2.618h-5.11v.952h11.41v-.952H31.65Zm7.18-.252h7.477v2.828h1.148v-3.752H38.83v.924Zm4.985-2.968v-1.33h3.78v-.896h-7.392v-1.26h6.986v-.868h-6.986v-1.19h7.322v-.896h-8.47v5.11h3.612v1.33h-5.11v.924h11.368v-.924h-5.11Z'/%3E%3Ccircle cx='25' cy='22' r='22' fill='%23FFE600'/%3E%3Cpath fill='%23392020' d='M25.49 9.796c-7.676 0-13.9 4.914-13.9 10.98 0 3.9 2.58 7.316 6.451 9.27l-1.311 4.89a.406.406 0 0 0 .383.534.404.404 0 0 0 .242-.093l5.633-3.804a17.48 17.48 0 0 0 2.502.183c7.676 0 13.901-4.915 13.901-10.98.001-6.066-6.225-10.98-13.9-10.98Z'/%3E%3Cpath fill='%23FFE600' d='M16.469 19.031h-1.513a.992.992 0 0 1-.537-.144.593.593 0 0 1-.277-.405 1.85 1.85 0 0 1-.023-.156c0-.22.08-.394.238-.514a.94.94 0 0 1 .595-.186h4.625a.98.98 0 0 1 .536.143.597.597 0 0 1 .29.558.633.633 0 0 1-.23.522.93.93 0 0 1-.592.182h-1.513l-.002 5.213c-.001.25-.073.452-.219.602-.142.154-.341.228-.586.228a.816.816 0 0 1-.512-.164.758.758 0 0 1-.27-.453.87.87 0 0 1-.013-.213l.003-5.213Zm4.323-1.027a.715.715 0 0 1 .291-.391.923.923 0 0 1 .49-.118h.385c.207 0 .382.043.522.127.14.082.253.246.331.483l1.933 5.601c.063.173.105.322.13.446.016.082.026.147.03.192a.705.705 0 0 1-.227.517.724.724 0 0 1-.531.212c-.37 0-.61-.153-.719-.456l-.413-1.22h-2.577l-.416 1.22c-.1.303-.34.456-.716.456a.746.746 0 0 1-.473-.145.67.67 0 0 1-.246-.413.784.784 0 0 1-.014-.17.896.896 0 0 1 .043-.295 4.03 4.03 0 0 1 .108-.345l2.069-5.701Zm.968 1.299h-.02l-.943 2.939h1.873l-.91-2.94Zm3.391-.977c0-.248.073-.45.22-.603.143-.152.34-.228.586-.228.202 0 .373.055.513.167a.763.763 0 0 1 .267.452c.014.07.02.14.014.212l-.002 5.215h2.675a.96.96 0 0 1 .54.143.609.609 0 0 1 .272.407c.011.046.018.1.023.153a.616.616 0 0 1-.236.517.953.953 0 0 1-.596.183h-3.339c-.248 0-.448-.05-.602-.154-.155-.099-.255-.264-.303-.494a2.366 2.366 0 0 1-.035-.327l.003-5.643Zm5.27 0c.002-.248.072-.45.217-.603.145-.152.34-.228.586-.228a.79.79 0 0 1 .512.167c.142.111.23.263.269.452.014.07.02.14.016.212l.004 2.424 2.514-2.89c.114-.124.213-.214.305-.276a.598.598 0 0 1 .333-.089.82.82 0 0 1 .479.148.598.598 0 0 1 .266.391l.011.062a.624.624 0 0 1-.07.372 1.449 1.449 0 0 1-.19.267l-1.644 1.796 1.946 3.082.058.093c.132.21.21.362.23.464.002.006.005.026.012.05a.324.324 0 0 0 0 .052c0 .286-.079.49-.24.615a.928.928 0 0 1-.581.186.804.804 0 0 1-.4-.087 1.05 1.05 0 0 1-.314-.348l-1.844-2.969-.88.916.01 1.658c-.003.25-.075.452-.22.602-.146.154-.342.228-.587.228a.818.818 0 0 1-.513-.164.758.758 0 0 1-.268-.453 1.021 1.021 0 0 1-.014-.213l-.003-5.917Z'/%3E%3C/svg%3E");}
.popup-sns-wrap-box .popup-sns-list li button .ico-urlcopy{width:52px; height:71px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='71' fill='none'%3E%3Cpath fill='%23444' d='M5.063 66.182c2.1 0 3.696-1.12 3.696-4.424v-6.02H7.513V61.8c0 2.478-1.078 3.248-2.45 3.248-1.33 0-2.38-.77-2.38-3.248v-6.062H1.381v6.02c0 3.304 1.596 4.424 3.682 4.424Zm7.052-9.394h1.722c1.61 0 2.492.476 2.492 1.834 0 1.33-.882 1.974-2.492 1.974h-1.722v-3.808ZM17.925 66l-2.632-4.494c1.4-.336 2.324-1.288 2.324-2.884 0-2.142-1.498-2.884-3.584-2.884h-3.22V66h1.302v-4.354h1.848L16.455 66h1.47ZM19 66h5.782v-1.106h-4.48v-9.156H19V66Zm9.92-1.96h7.547v2.996h1.148v-3.92H28.92v.924Zm1.373-6.944h6.104v1.456h-6.104v-1.456Zm3.626 3.864v-1.498h3.612v-4.69h-1.134V56.2h-6.104v-1.428h-1.134v4.69h3.612v1.498h-5.124v.938h11.368v-.938h-5.096Zm10.135-5.39H42.92v2.254c0 2.282-1.428 4.69-3.234 5.614l.686.924c1.414-.756 2.576-2.324 3.122-4.158.574 1.722 1.708 3.192 3.038 3.906l.714-.91c-1.764-.882-3.192-3.164-3.192-5.376V55.57Zm7.518 4.004H49.5v-5.082h-1.148v12.544H49.5v-6.51h2.072v-.952Z'/%3E%3Crect width='44' height='44' x='3' y='.001' fill='%23999' rx='22'/%3E%3Cpath fill='%23fff' d='M28.53 18.47a.747.747 0 0 1 0 1.061l-6 6a.75.75 0 1 1-1.06-1.061l6-6a.75.75 0 0 1 1.06 0Zm4.682-4.682a5.25 5.25 0 0 0-7.425 0l-2.818 2.817a.75.75 0 0 0 1.062 1.061l2.818-2.812a3.75 3.75 0 0 1 5.303 5.302l-2.819 2.818a.75.75 0 0 0 1.06 1.062l2.82-2.823a5.25 5.25 0 0 0 0-7.425ZM25.97 26.334l-2.818 2.818a3.75 3.75 0 1 1-5.302-5.304l2.817-2.817a.75.75 0 1 0-1.061-1.061l-2.817 2.818a5.25 5.25 0 0 0 7.424 7.425l2.819-2.82a.75.75 0 1 0-1.062-1.06Z'/%3E%3C/svg%3E");}
.popup-sns-wrap-box .popup-sns-list li button .ico-twit{width:44px; height:71px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='71' fill='none'%3E%3Cpath fill='%23444' d='m18.725 66 2.996-5.306-2.8-4.956h1.428l1.4 2.618c.266.476.476.91.812 1.498h.056c.28-.588.476-1.022.728-1.498l1.372-2.618h1.358l-2.8 5.026L26.271 66h-1.428l-1.512-2.772c-.266-.504-.546-1.036-.882-1.652h-.056c-.294.616-.56 1.148-.826 1.652L20.083 66h-1.358Z'/%3E%3Crect width='44' height='44' fill='%23000' rx='22'/%3E%3Cpath fill='%23fff' d='m12.049 12.25 7.721 10.325L12 30.968h1.749l6.803-7.35 5.497 7.35H32l-8.156-10.905 7.232-7.814h-1.749l-6.265 6.769L18 12.25h-5.951Zm2.572 1.288h2.734l12.073 16.143h-2.734L14.62 13.538Z'/%3E%3C/svg%3E");}
.stk-font-popup{position: absolute;top: 50px;right:0px;z-index: 2;width: 246px;height: 110px;background: #fff;border: 1px solid #ddd;border-radius: 5px;padding: 12px;}
.stk-popup-sns-wrap {position: absolute;top: 50px;right: 90px; z-index: 2;width: 270px;height: 240px;background: #fff;border: 1px solid #ddd;border-radius: 5px;padding: 12px;}
.font-popup{position: absolute;top: 32px;right: 0px;z-index: 2;width: 246px;height: 110px;background: #fff;border: 1px solid #ddd;border-radius: 5px;padding: 12px;}
.popup-header{overflow:hidden;}
.font-popup-box .popup-title{margin-left:0;}
.font-popup-box .btn-pop-close{margin-right:0;}
.font-popup-box .popup-font-list{position: relative; margin: 0 auto;margin-top: 18px;display: flex; overflow:hidden; justify-content:space-between;}
.popup-font-list li{width:34px; height:34px; border-radius:30px; border:1px solid #bbb; line-height:30px; text-align:center; cursor:pointer;}
.popup-font-list .font-size01{font-size:14px;}
.popup-font-list .font-size02{font-size:16px;}
.popup-font-list .font-size03{font-size:18px;}
.popup-font-list .font-size04{font-size:20px;}
.popup-font-list .font-size05{font-size:22px;}
.popup-font-list li.active{background:#eee;}
.article-wrap .left-main-news .article-view-main{position:relative; width:100%;}
.article-wrap .article-view-head{margin-bottom:43px;}
.article-wrap .article-view-head h4{position: relative;display: block;margin: 0;padding: 0 0 0 22px; line-height:28px; font-weight:600; font-size: 20px; color: #171717; letter-spacing: -1px;}
.article-wrap .article-view-head h4:before {content: '';position: absolute;top: -7px;left: 0;width: 4px;height:100px; background: #333;}
.article-view,.article-view p,.article-view-text{font-size:18px; color:#171717; font-weight:400; line-height:30px; margin-bottom: 40px;}
.article-view .article-photo{position: relative;width: 800px; margin:0 auto; text-align: center; margin-bottom:40px;}
.article-view .article-photo a{display: block;}
.article-view .article-photo a img{max-width:100%;}
.article-view .article-photo .atc-photo-sub-txt{font-size:14px; color:#333; line-height:20px; font-weight:300; padding: 0 26px; text-align: left; margin-top: 10px;}
.article-view p .inner-img {width:100%; text-align:center; display:inline-block; margin:0 auto 30px auto;}
.article-view p .inner-img:has(img.fade), .article-view p .inner-img:has(img[align="left"]), .article-view p .inner-img:has(img[align="right"]) {display: inline;}
.article-view p .inner-img:has(img[align="center"]) {display: inline-block;}
.article-view p .inner-img > img.fade {margin: 0 4px;}
.article-view p .inner-img > img[align="left"] {margin: 0 30px 30px auto;}
.article-view p .inner-img > img[align="right"] {margin: 0 30px 0 30px;}
/* 본문내 주요기사 */
.article-view-main .major-news{overflow: hidden; width: 100%;}
.article-view-main .reporter-news-more{margin-bottom: 40px;}
.article-view-main .major-news .major-list{width:100% ;}
.article-view-main .major-news .major-list li{float: left; margin-right: 40px; width:calc(50% - 20px);}
.article-view-main .major-news .major-list li:nth-child(even){margin-right: 0px;}
.article-view-main .major-news .bundle{padding-left:15px; padding-right:28px; line-height: 30px;position: relative;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='3' height='3' fill='none'%3E%3Cpath fill='%23333' d='M0 0h3v3H0z'/%3E%3C/svg%3E"); background-repeat: no-repeat;background-position-y: 10px; letter-spacing: -.7px; margin: 14px 0 0 0; border-bottom: 1px solid #ddd; width: auto; padding-bottom: 14px;}
.article-view-main .major-news .bundle a .major-text{font-size: 16px;color: #333;line-height: 23px;}
.article-view-main .major-news .pay{background: #1D9BF0; font-size: 13px; color: #fff; /* padding: 0px 9px 5px 8px; */ font-style: normal; border-radius: 3px; float: left; height: 22px; width: 22px; text-align: center; line-height:21px; margin-right:4px; font-weight:400;}
.article-view-main .major-news .ico-cart{position:absolute; top:0px; right:0;}
/* 본문내 광고 */
.article-view-main .horizon-ad{width:100%; /*height:140px;*/}
/* 폰트크기 */
.article-view.font-size01 p{font-size:16px; line-height:26px;}
.article-view.font-size02 p{font-size:18px; line-height:30px;}
.article-view.font-size03 p{font-size:20px; line-height:34px;}
.article-view.font-size04 p{font-size:22px; line-height:38px;}
.article-view.font-size05 p{font-size:24px; line-height:42px;}
/* p태그 누락 */
.article-view.font-size01{font-size:16px; line-height:26px; color:#171717;}
.article-view.font-size02{font-size:18px; line-height:30px; color:#171717;}
.article-view.font-size03{font-size:20px; line-height:34px; color:#171717;}
.article-view.font-size04{font-size:22px; line-height:38px; color:#171717;}
.article-view.font-size05{font-size:24px; line-height:42px; color:#171717;}
/* 본문소재 */
.article-tool{margin:0 auto;}
.article-wrap .article-body{padding-top:0; width:860px; margin:0 auto;}
.article-wrap .article-body div[data-item]{display:none;}
.article-wrap h3{margin:40px 0 20px 0; font-size:18px; color:#171717; font-weight:600;}
/* 01 제목 */
.article-wrap .headline{font-size: 36px; line-height: 54px; font-weight: 500; color: #171717; width:1200px;}
/* 02 부제목 */
.article-subtitle{border-left:4px solid #1D9BF0; padding:2px 0 5px 5px; width:calc(100% - 5px); max-width:860px; margin:0px auto 40px auto;}
.article-subtitle p{font-size:22px; line-height:32px; font-weight:800; padding-left:9px; letter-spacing:-0.35px; color:#171717; margin-bottom: 0;}
.article-subtitle.type02{border-left:0;}
/* 03 중간제목 */
.article-mtitle{padding: 12px 0 16px; border-top: 4px solid #1D9BF0; border-bottom: 1px solid #CED4DA; max-width:860px; margin:0px auto 40px auto;}
.article-mtitle p{padding: 0 6px; font-size: 22px; line-height: 32px; font-weight: 500; color: #111; margin-bottom: 0;}
/*.article-mtitle.type02{border-bottom:4px solid #002e6e;}*/
.article-mtitle.type02{border-top:0; border-bottom:0 none; border-left:4px solid #1D9BF0; padding:0px 0 0px 5px; width:calc(100% - 5px); max-width:860px; margin:0px auto 40px auto;}
.article-mtitle.type03{border:0 none;}
.article-mtitle.type03 p{font-weight:700;}
/* 05 이미지 */
.article-photo-wrap{max-width: 860px; margin: auto;display: table;}/* 0920 이미지와 텍스트 정렬 수정 */
.article-photo-wrap figure{max-width: 860px; margin: auto; display:table; position:relative;}
.article-photo-wrap img {max-width: 100%; width:100%; min-width:150px; max-height:840px;}
.article-photo-wrap .title{margin-bottom: 0 !important; line-height: normal !important; font-size: 16px !important; font-weight: 500; letter-spacing: -0.04px; color: #333333; text-align:left; margin-top:5px;}
.article-photo-wrap .caption{width: 100%; text-align: left; margin-top: 5px; font-size: 14px; font-weight: 400; color: #171717; display:inline-block; color:#7a7a7a; line-height:22px; display:table-caption; caption-side:bottom;}
.txc-image{width:540px; margin:0 auto;}
/* 06 유튜브(영상) */
.article-video{margin-bottom:30px;}
.article-video .video-wrap{margin:0 auto; padding-top:0; margin-bottom:40px;}
.video-wrap .video{width:auto; margin:0 auto; text-align: center;}
.video-wrap .title{margin:2px auto 0 auto; font-size: 16px !important; line-height: normal !important; font-weight: 500; letter-spacing: -0.04px; color: #333333;}
.video-wrap .caption{width: 100%; text-align: left; margin:0 auto; margin-top: 2px; font-size: 14px; font-weight: 300; letter-spacing: -0.04px; color: #7a7a7a;}
.article-video .video-horizontal{position:relative;padding-bottom:56%;}
.article-video .video-horizontal iframe{position: absolute;top: 0;left: 0;width: 100% !important;height: 100% !important;}
/* 07 지도 */
.article-map{max-width:780px; margin:0px auto 40px auto; display: table;/*text-align: center;*/}
.article-map .caption{font-size:14px; text-align: left;color: #7a7a7a;font-weight: 300;}
/* 08 GIF */
.gif-area{max-width:800px; margin:0px auto 0px auto; text-align:center;}
.gif-area{width:100%; max-width:500px;}
.gif-area figure{max-width:500px; height:auto; margin:0 auto 6px auto;}
.gif-area figure img{width: 100%; max-width:500px; height:auto;}
.gif-area .title{margin-bottom: 0; font-size: 16px !important; line-height: normal !important; font-weight: 500; letter-spacing: -0.04px; color: #333333; text-align:left;}
.gif-area .caption{ margin-top: 2px; font-size: 14px; font-weight: 300; letter-spacing: -0.04px; color: #7a7a7a; text-align:left;}
.article-gif{margin:0px auto 40px auto; text-align:center; overflow:hidden;}
.article-gif.gif-left{float:left;}
.article-gif.gif-center{margin:0 auto;}
.article-gif.gif-right{float:right;}
/* 09 오픈링크 */
/* 오픈링크 가로형 */
.article-openlink-horizontal{padding: 15px; border: 1px solid #CED4DA; padding:15px; margin:0px auto 40px auto;}
.article-openlink-horizontal a{}
.article-openlink-horizontal .article-link-img {float:left; width:100px; height: 100px; margin-right:20px; background:#eee; line-height:96px;}
.article-openlink-horizontal .article-link-img img{max-width:100px; max-height: 100px; text-align:center; vertical-align:middle; overflow: hidden; background-color: #eee;}
.article-openlink-horizontal .article-link-body {min-height:100px;}
.article-openlink-horizontal .article-link-body .title{font-size: 18px !important; line-height: 18px !important; font-weight: 500; color: #171717; margin-bottom: 10px;}
.article-openlink-horizontal .article-link-body .caption{font-size: 16px; font-weight: 300; color: #171717;}
.article-openlink-horizontal .article-link-body .link{word-break: break-all; display: block; margin-top: 16px; text-decoration: underline; color: #063BFF; font-size:15px;}
/* 오픈링크 세로형 */
.article-openlink-vertical{width:344px; border: 1px solid #CED4DA; padding:20px; margin:0px auto 40px auto;}
.article-openlink-vertical .article-link-img {width:174px; height:165px; margin:0 auto 16px auto; background:#fff; line-height:160px; text-align:center;}
.article-openlink-vertical .article-link-img img{max-width:174px; max-height: 165px; text-align:center; vertical-align:middle; overflow: hidden; background-color: #eee;}
.article-openlink-vertical .article-link-body .title{font-size: 18px; font-weight: 500; color: #171717; margin-bottom: 10px;}
.article-openlink-vertical .article-link-body .caption{font-size: 16px; font-weight: 300; color: #171717;}
.article-openlink-vertical .article-link-body .link{word-break: break-all; display: block; margin-top: 16px; text-decoration: underline; color: #063BFF; font-size:15px;}
/* 10 인용구_1 */
.article-quotation01{margin:0px auto 40px auto;}
.article-quotation01:before{content:""; width:60px; height:60px; display:inline-block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='60' height='60' fill='none'%3E%3Cpath fill='url(%23a)' d='M0 0h60v60H0z'/%3E%3Cdefs%3E%3Cpattern id='a' width='1' height='1' patternContentUnits='objectBoundingBox'%3E%3Cuse xlink:href='%23b' transform='scale(.01667)'/%3E%3C/pattern%3E%3Cimage xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAIAAAC1nk4lAAADMklEQVRoge2YP0hCQRzHz572+ocZFgnhIkhBWOKiBmURhbkGkUM8iJKgoaH1LUaI6OAQjkLRHyha3iYtVi7SJAiCFBXUFJGLkmLxGgR56N0ldV4E99nu+7vf4/Med+fzqXp7e8F/o+2vBX4Ck0bT09Pzm3ae5zUaTW3YcmlBEJLJ5N3dndPp/EH72NjY0dHR4+NjKBSqharWbUSHwxEIBGw2W3WYyWSmp6c/Pz+bbNdqtbu7u8vLy+3t7QCASqWyuLh4fX0NAOA6OjpaYSyKYiQSMRqNtWRwcFCj0VxdXTXTPjMzc3Z25nK5OI6rJhzHWa3W/f19WZbJS/M8f3h4KAiCWq2uK1mt1ouLi5eXF/wV1tbWotFof39/XT4wMNDV1ZVIJAgvD57nz8/PJycnURNubm7m5+cxV9jc3NzZ2ak94DpKpZLH4yH8pI+Pj2dnZzEThoaGSqVSKpWCVr1ebzgcRhkDANRqtcViIXl6iKLodrvxc56fn0dGRqAli8USDAYxxgCAYrFYLpeJLY/x8fF4PN7Z2YmakE6nI5GIJEmoCfF43OFwoKpvb28HBwfRaPT19bV+r/wYv9+PMv74+Njb2/P7/Zj2lZUVjHEqlVpfX396eqoOyUhPTExMTU1BS+/v79vb2ycnJ/grbGxsoEqSJK2urioPeDLSPp+vrQ2yPWRZFkXxW+O5ubnR0VFoKZlMCoJQFxLYiBzHuVwuaCmRSMRisW+vsLS0BM0LhcLW1lZjTkDa7Xb39fU15rIsK18YMNjtdmguSdL9/X1jTkAatYFub29R57ESg8Gg/LVXcnp6Cs0JSJvNZmieTqebaXc6nSqVqjHP5/PV16NGCEgbDAZons1mm2k3mUzQ/OHhAdVC4PTQ6/XQ3G63Q9d0LpdT7k7UPet0OtSWICDd3d0NzRcWFqD55eWlUlqr1UKnmUwmn88HLRFYHpif7mZA3TMGAtLQbdTSdgLSv3y5/ZsnTR8mTQsmTQsmTQsmTQsmTYt/KU3gCxPmIwuUfD6fy+Vqw+HhYej/Ygwt/KjeOv7l8mDStGDStGDStGDStGDStGDStGDStGDStGDStGDStPgCsg7m/9AM43YAAAAASUVORK5CYII=' id='b' width='60' height='60'/%3E%3C/defs%3E%3C/svg%3E");}
.article-quotation01 .content-quotation{box-sizing:border-box;width:100%;margin-top:-25px;padding:0 30px 0 80px;}
.article-quotation01 .content-quotation p{margin-bottom: 0px; font-size:19px; font-weight:700; font-style:italic; letter-spacing:-0.025em; color:#111; line-height:1.7em; text-shadow:0 0 1px rgb(0 0 0 / 30%);}
.article-quotation01 .content-quotation span.source{display:inline-block; margin-top:10px; color:#999; font-size:14px; font-weight:500;}
/* 10 인용구_2 */
.article-quotation02{border-left:3px solid #474747; padding:10px 0 10px 20px; margin:0px auto 40px auto;}
.article-quotation02 .content-quotation p{margin-bottom: 0px; font-size:19px; font-weight:700; font-style:italic; letter-spacing:-0.025em; line-height:1.7em; text-shadow:0 0 1px rgb(0 0 0 / 30%); color:#111;}
.article-quotation02 .content-quotation span.source{display:inline-block; margin-top:10px; color:#999; font-size:14px; font-weight:500;}
/* 10 인용구_3 */
.article-quotation03{box-sizing:border-box; border:2px solid #CED4DA; border-radius:10px; padding:20px; text-align:center; position:relative; margin:0px auto 40px auto;}
.article-quotation03 .content-quotation{display:inline-block;}
.article-quotation03 .content-quotation p{margin-bottom: 0px; font-size:19px; font-weight:700; color:#111; font-style:italic; letter-spacing:-0.025em; line-height:1.7em; text-shadow:0 0 1px rgb(0 0 0 / 30%); text-align:left;}
.article-quotation03::after{content:"";display:block;width:35px;height: 20px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='21' fill='none'%3E%3Cpath stroke='%23CED4DA' stroke-width='2' d='M1 19C11 19 13.167 9 13 4h21.5c0 13.6-22.333 15.667-33.5 15Z'/%3E%3Cpath fill='%23fff' d='M14 1h20v5H14z'/%3E%3C/svg%3E");position:absolute;bottom: -17px;left:0;right:0;margin:0 auto;}
.article-quotation03 .content-quotation span.source{display:inline-block; margin-top:10px; color:#999; font-size:14px; font-weight:500;}
/* 11 구분선 */
.article-line{ margin:28px auto 28px auto; max-width:700px; overflow:hidden;}
.article-line hr{ border:0 none;}
.article-line.type01 hr{background:#333; height:2px; margin:0; padding:0; width:100%; display:inline-block;}
.article-line.type02{border: 1px dashed #333;}
.article-line.type03{width:100%; border-top:2px dotted #333;}
.article-line.type04{border-top: 4px double #333;}
/* 12 sns_공유 */
.article-share{max-width:700px; margin:0px auto 40px auto;}
.sns-share{max-width:500px; height:auto; overflow:hidden; margin:20px auto;}
/* 13 텍스트 박스*/
.text-box{margin:0 auto; margin-bottom: 20px;padding:20px 45px;border: solid 1px #ddd;font-size: 18px;line-height: 1.8;background-color: #f5f5f5;}
.text-box p{margin:10px 0;}
.text-box.type01{border: 1px solid #ddd; background-color: #f5f5f5;}
.text-box.type02{border: 1px solid #d3d9ff; background-color: #f3f4fd;}
.text-box.type03{border: 1px solid #d3ecc5; background-color: rgba(211,236,197,.3137254901960784);}
.text-box.type04{border: 1px solid #fcf0c5; background-color: rgba(252,240,197,.3137254901960784);}
.text-box.type05{border: 1px solid #f8dfd8; background-color: rgba(248,223,216,.3137254901960784);}
/* 14 사진그룹_슬라이드 */
.group-slide{margin:0 auto 20px auto; position:relative !important;}
.swiper-pagination-bullet-active{background:#5670D1 !important;}
.swiper-button-prev,.swiper-button-next{--swiper-theme-color:#ccc; top:43% !important;}
.slide-img{height:400px; background:#eee; margin:0 auto; position:relative;}
.slide-img img{max-width:545px; max-height:400px;position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
.group-slide .swiper-pagination{position:initial;}
.swiper-pointer-events{max-height:520px;}
.swiper-horizontal.swiper-css-mode>.swiper-wrapper{height:400px;}
.group-slide .title{width:600px; margin:6px auto 0 auto !important; font-size: 16px !important; line-height: normal !important; font-weight: 500; letter-spacing: -0.04px; color: #333333; text-align:left;}
.group-slide .caption{font-size:14px !important; line-height:22px !important; margin: 10px auto; text-align: left; width: calc(100% - 100px);}
.group-slide .swiper-pagination-bullet{margin:0 3px;}
/* 13 사진그룹_바둑판형 */
.group-layout{margin:0 auto 20px auto; overflow:hidden;}
.group-layout h4{margin-bottom:10px;}
.group-layout figure{width:700px; height:467px;}
.group-layout .title{font-size: 16px !important; line-height: normal !important; font-weight: 500; letter-spacing: -0.04px; color: #333333; margin-bottom: 0; margin-top: 5px;}
.group-layout .caption{margin:3px auto 0 auto; left:0; right:0;font-size: 14px; font-weight: 300; letter-spacing: -0.04px; color: #7a7a7a; text-align:left;}
/* 1개 */
.group-layout .layout-1 figure{width:700px; height:467px; text-align:center; vertical-align:middle; display:table-cell; background:url(https://3.bp.blogspot.com/-x4gLW4b7sB4/XHE3SYQbIpI/AAAAAAAA4nM/SFGGsj7HgyELAWCFQfanqqQwwBJfg30YACLcBGAs/s1600/01.jpg); background-position-x:center; background-size:cover;}
.group-layout .layout-1 img{max-width:700px; max-height:467px;}
/* 2개 */
.group-layout .layout-2{width:700px; height:467px;}
.group-layout .layout-2 figure{float:left; width:350px; height:467px; text-align:center; overflow:hidden; position:relative;}
.group-layout .layout-2 figure img{text-align:center; min-height:467px; transform:translateX(-50%); position:absolute; left:50%;}
.group-layout .layout-2 figure:nth-child(1){background:url(https://3.bp.blogspot.com/-x4gLW4b7sB4/XHE3SYQbIpI/AAAAAAAA4nM/SFGGsj7HgyELAWCFQfanqqQwwBJfg30YACLcBGAs/s1600/01.jpg); background-position-x:center; background-size:cover;}
.group-layout .layout-2 figure:nth-child(2){background:url(https://png.pngtree.com/background/20210716/original/pngtree-sakura-vertical-version-of-romantic-cherry-blossom-spring-phone-wallpaper-picture-image_1342988.jpg); background-position-x:center; background-size:cover;}
/* 3개 */
.group-layout .layout-3{width:700px; height:467px;}
.group-layout .layout-3 figure:first-child{float:left; width:350px; height:467px; text-align:center; overflow:hidden; position:relative; background:url(https://images.khan.co.kr/article/2022/03/17/l_2022031702001002800191961.webp) no-repeat 0 0; background-position-x:center; background-size:cover;}
.group-layout .layout-3 figure:first-child img{text-align:center; min-height:467px; transform:translateX(-50%); position:absolute; left:50%;}
.group-layout .layout-3 figure:nth-child(2) img,.group-layout .layout-3 figure:nth-child(3) img{max-width:350px; min-height:233.5px; transform:translateX(-50%); position:absolute; left:50%;}
.group-layout .layout-3 figure:nth-child(2),.group-layout .layout-3 figure:nth-child(3){width:350px; height:233.5px; float:right; overflow:hidden; position:relative;}
.group-layout .layout-3 figure:nth-child(2){background:url(https://img.khan.co.kr/news/2022/03/15/l_2022031401001751400154221.webp) no-repeat 0 0; background-position-x:center; background-size:cover;}
.group-layout .layout-3 figure:nth-child(3){background:url(https://images.khan.co.kr/PhotoDB/P0015/2022/03/09/h_PYH2022030910740001300.jpg) no-repeat 0 0; background-position-x:center; background-size:cover;}
/* 4개이상 */
.group-layout .layout-4{width:700px; height:467px; position:relative;}
.group-layout .layout-4 figure{width:350px; height:233.5px; float:left; overflow:hidden; position:relative;}
.group-layout .layout-4 figure img{max-width:350px; min-height:233.5px; transform:translateX(-50%); position:absolute; left:50%;}
.group-layout .layout-4 figure:nth-child(1){background:url(https://img.khan.co.kr/news/2022/03/16/l_2022031601002024400179511.webp) no-repeat 0 0; background-position-x:center; background-size:cover;}
.group-layout .layout-4 figure:nth-child(2){background:url( https://png.pngtree.com/background/20210716/original/pngtree-sakura-vertical-version-of-romantic-cherry-blossom-spring-phone-wallpaper-picture-image_1342988.jpg) no-repeat 0 0; background-position-x:center; background-size:cover;}
.group-layout .layout-4 figure:nth-child(3){background:url(https://3.bp.blogspot.com/-x4gLW4b7sB4/XHE3SYQbIpI/AAAAAAAA4nM/SFGGsj7HgyELAWCFQfanqqQwwBJfg30YACLcBGAs/s1600/01.jpg) no-repeat 0 0; background-position-x:center; background-size:cover;}
.group-layout .layout-4 figure:nth-child(4){background:url(https://img.khan.co.kr/ranking/khan/mobile/MHTopA/1_1647468788_GHc3dxId9DIfmoPZ.webp) no-repeat 0 0; background-position-x:center; background-size:cover;}
/* 표 */
.article-tbl{text-align:center; margin: 0px auto 40px auto;}
.article-tbl img{display:block;width:100%;object-fit:contain}
/* 글머리 기호/번호 매기기 */
.text-list li{font-size:18px; font-weight:400; line-height:32px; color:#171717;}
.text-list.type01 li{list-style-type:disc; margin-left:20px;/* position:relative; padding-left:15px;*/}
/*.text-list.type01 li::before{content:""; width:5px; height:5px; display:inline-block; border-radius:10px; position:absolute; top:14px; left:0; background:#333; margin-right:10px;}*/
.text-list.type02 li{list-style-type:decimal; margin-left:20px;}
.article-chart{width:100%; max-width:760px;}
.article-chart .title{margin-bottom: 0 !important; line-height: normal !important; font-size: 16px !important; font-weight: 500; letter-spacing: -0.04px; color: #333333; text-align:left; margin-top:5px;}
.article-chart .caption{width: 100%; text-align: left; margin-top: 5px; font-size: 14px; font-weight: 300; color: #171717; display:inline-block; color:#7a7a7a;}
.article-chart img{display:block;width:100%;object-fit:contain}
/* 230108 기사본문 sns메뉴 추가 사항 */
.group .sns-area-wrap .btn-font {font-size: 18px;font-weight: 500;color: #999; border:1px solid #999; border-radius:30px; line-height:20px;}
.group .sns-area-wrap .btn-font .ico-font{width: 17px; height: 19px; font-size:22px; color:#333; font-weight:600; /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='19' fill='none'%3E%3Cpath d='M.9 2.38v1.68h6.32C6.8 8.22 4.42 11.4 0 13.66l1.14 1.58c5.9-2.98 8.14-7.62 8.14-12.86H.9ZM16.74 7.6H14V.46h-2.06v18.06H14v-9.2h2.74V7.6Z' fill='%23AAA'/%3E%3C/svg%3E");*/}
.font-popup {position: absolute;z-index: 18;top: 40px;right: 0;width: 272px;padding: 16px;border: 1px solid #DDDDDD;background: #fff;}
.font-popup .popup-header {position: relative;display: flex;margin-bottom: 15px; justify-content: space-between;}
.font-popup .popup-header .title {font-size: 18px;font-weight: 500;color: #333;}
.font-popup .popup-header .btn-close {width: 13px;height: 13px;position: absolute;top: 0;right: 4px;}
.font-popup .popup-font p {font-size: 14px;font-weight: 300;color: #333;margin-bottom: 18px;}
.font-popup .popup-font ul {display: flex;align-items: center;justify-content: center;}
.font-popup .popup-font ul li {cursor: pointer;margin-right: 12px;position: relative;width: 32px;height: 32px;border-radius: 50%;border: 1px solid #DDDDDD;}
.font-popup .popup-font ul li.active {background: #DDDDDD;border: 1px solid #CCCCCC; color:#555; font-weight:600;}
.font-popup .popup-font ul li:nth-last-child(1) {margin-right: 0;}
.font-popup .popup-font ul li span {position: absolute;top: 49%;left: 48%;transform: translate(-50%,-50%);}
.font-popup .popup-font ul li:nth-of-type(1) span{font-size:12px;}
.font-popup .popup-font ul li:nth-of-type(2) span{font-size:14px;}
.font-popup .popup-font ul li:nth-of-type(3) span{font-size:16px;}
.font-popup .popup-font ul li:nth-of-type(4) span{font-size:18px;}
.font-popup .popup-font ul li:nth-of-type(5) span{font-size:20px;}
/* 본문 스티키 sns 공유 수정 */
.sticky-header .sticky-share{cursor:pointer;}
.sticky-header .popup-sns-wrap{display:none;}
.sticky-header .popup-sns-wrap.open{display:block; position:absolute; left:120px;}
/* 본문 스티키 폰트설정 추가 */
.sticky-header .btn-font{font-size: 18px;font-weight: 500; width:30px; height:30px; color: #999; border-radius:30px; line-height:20px; text-align:center; line-height:30px; cursor:pointer;}
.sticky-header .font-popup{display:none;}
.sticky-header .font-popup.open{display:block; position:absolute; top:51px; right:33px;}
/* 첨부파일 0904 */
.article-attachment{overflow:hidden; position: relative; margin-bottom: 40px; background: #F9F9F9;}
.article-attachment .atc-attachment-head {margin-bottom: 60px;font-size: 16px;color: #171717;line-height: 30px;font-weight: 500;padding-left: 20px;}
.article-attachment .atc-attachment-head::after {content: "";top: 2px;position: relative;left: -40px;width: 4px;height: 16px;display: inline-block;background: #1D9BF0;}
.article-attachment .attachment-list{overflow: hidden; padding: 0px 15px 26px 15px;}
.article-attachment .attachment-list li{box-shadow: 0px 5px 10px 3px #ddd;overflow: hidden;position: relative; width: 100%;height: 60px; background: #fff;border-radius: 10px;padding: 10px 20px; margin-bottom:10px; border: 2px solid #fff;}
.article-attachment .attachment-list li:last-child{margin-bottom:0;}
.article-attachment .attachment-list li:hover{border:2px solid #1D9BF0;}
.article-attachment .attachment-list li:hover .btn-attachment{display:block;}
.article-attachment .attachment-list li a{display: flex;}
.article-attachment .attachment-list li span{font-size:15px; color:#333; font-weight:500; line-height: 38px; width: 85%;}
.article-attachment .btn-attachment{padding: 8px 12px; border: 1px solid #D0D0D0;border-radius: 5px;font-weight: 600;letter-spacing: -2px; width: 80px; display:none;}
.attachment-list .btn-attach{position: relative; margin:0 10px; top: 2px;}
.btn-attach .ico-attachment{width:20px; height:25px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='26' fill='none'%3E%3Cpath fill='%231D9BF0' d='M19.879 8.732a1.246 1.246 0 0 0-.245-.366l-7.5-7.5a1.245 1.245 0 0 0-.367-.245C11.73.604 11.69.594 11.65.58a1.24 1.24 0 0 0-.324-.064C11.3.514 11.276.5 11.25.5H2.5A2.503 2.503 0 0 0 0 3v20c0 1.379 1.121 2.5 2.5 2.5h15c1.379 0 2.5-1.121 2.5-2.5V9.25c0-.026-.014-.05-.016-.078a1.189 1.189 0 0 0-.064-.323c-.013-.04-.024-.079-.041-.117ZM15.732 8H12.5V4.768L15.732 8ZM2.5 23V3H10v6.25a1.25 1.25 0 0 0 1.25 1.25h6.25l.003 12.5H2.5Z'/%3E%3Cpath fill='%231D9BF0' d='M5 13h10v2.5H5V13Zm0 5h10v2.5H5V18ZM5 8h2.5v2.5H5V8Z'/%3E%3C/svg%3E");}
.article-attachment .attachment-list li:hover .btn-attach .ico-attachment{width:20px; height:25px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='26' fill='none'%3E%3Cpath fill='%231D9BF0' d='M17.5 25.5A2.5 2.5 0 0 0 20 23V8L12.5.5h-10A2.5 2.5 0 0 0 0 3v20a2.5 2.5 0 0 0 2.5 2.5h15ZM11.25 3l6.25 6.25h-6.25V3Zm-7.5 5H7.5v2.5H3.75V8Zm0 5h12.5v2.5H3.75V13Zm0 5h12.5v2.5H3.75V18Z'/%3E%3C/svg%3E");}
/* 본문내 하이퍼링크 추가 */
.view-hyperlink{color:#1D9BF0 !important;}
/* 2XL Size 그룹사진 0923 */
.group-layout-2xl{
width:1200px;
position: relative;
left: 50%;
transform: translateX(-50%);
margin-bottom:40px;
}
.group-layout-2xl .caption{
height:72px; max-height:100px;
}
.group-layout-2xl .group-layout-row{
width:1200px;
display:flex;
clear:both;
justify-content:space-between;
gap:10px;
}
/* L Size 그룹사진 */
.group-layout-l{
max-width: 700px !important;
width: 700px;
position: relative;
left: 50%;
transform: translateX(-50%);
}
.group-layout-l .group-layout-row{
width:700px;
display:flex;
clear:both;
justify-content:space-between;
gap:10px;
}
.group-layout-row .layout-2{
width:50%
}
.group-layout-row .layout-3{
width:33.3%
}
.group-layout-row .layout-4{
width:25%
}
.group-layout-l .caption{
height:150px; max-height:170px;
}
.group-layout .layout-num figure {
float: left;
width: 100%;
max-height: 680px;
text-align: center;
overflow: hidden;
position: relative;
display:flex;
justify-content: center;
align-items: center;
margin-bottom:5px;
border:1px solid #ddd;
min-height: 240px;
height: 100%;
}
.group-layout .layout-num figure img{
max-width:100%;
width:auto;
/* max-height:100%; */
height:auto;
/* min-height: 680px; */
width: auto;
min-width: 100%;
max-width: fit-content;
height: 100%;
object-fit: cover;
object-position: top;
}
.group-layout .layout-2 {
overflow: hidden;
display:flex;
flex-direction:column;
}
.group-layout .layout-2 figure img {
text-align: center;
max-width:100%;
width: auto;
/* height: 100%; */
/* object-fit: cover;
object-position: top; */
}
/* 3개그룹 */
.group-layout .layout-3 {
display:flex;
flex-direction:column;
}
.group-layout .layout-3 figure img {
text-align: center;
/* max-width:100%; */
width: 100%;
/* height: auto; */
}
/* 4개그룹 */
.group-layout .layout-4 {
display:flex;
flex-direction:column;
}
.group-layout .layout-4 figure img {
text-align: center;
/* max-height: 467px; */
max-width:100%;
width: auto;
/* height: auto; */
}
/* 오픈링크9_3 추가 */
.article-openlink-box{border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:20px;}
.openlink-date{color: #6487cf;
font-size: 14px !important;
font-weight: 500;
text-align: left;
margin-bottom:10px;
}
.openlink-title{
font-size: 22px;
font-weight: 500;
line-height:28px;
}
.openlink-view{
font-size: 15px !important;
line-height: 150%;
display:-webkit-box;
word-wrap:break-word;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
text-overflow:ellipsis;
}
.openlink-name{align-items: center;
color: #acacac;
display: flex;
font-size: 13px;
text-align: left;
vertical-align: middle;}
.openlink-source{
align-items: center;
color: #acacac;
display: flex;
font-size: 13px;
font-weight: 500;
justify-content: flex-end;
padding-right: 10px;
vertical-align: middle;
}
.btn-openlink{align-items: center;
background-color: #0064c0;
border-color: #dae0e5;
border-radius: 30px;
color: #fff !important;
display: flex;
font-size: 15px;
height: 35px;
justify-content: center;
width: 155px !important;
margin:0 auto 10px;}
.btn-openlink .ico-share{
width:17px; height:17px; margin-left:5px;display: inline-block;vertical-align: middle;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M9.33333 2H14V6.66667M14 9.82467V13C14 13.2652 13.8946 13.5196 13.7071 13.7071C13.5196 13.8946 13.2652 14 13 14H3C2.73478 14 2.48043 13.8946 2.29289 13.7071C2.10536 13.5196 2 13.2652 2 13V3C2 2.73478 2.10536 2.48043 2.29289 2.29289C2.48043 2.10536 2.73478 2 3 2H6M8.6 7.4L13.7 2.3' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.article-openlink-box + .article-openlink-box{border-top:0;}
/* embed tag */
.article-embedtag{}
.article-embedtag .title{margin:4px 0 5px !important;}
/* 13 사진그룹_바둑판형 *
/* 1개 */
.group-layout .layout-1 figure{width:700px; height:467px; text-align:center; vertical-align:middle; display:table-cell; background:url(https://3.bp.blogspot.com/-x4gLW4b7sB4/XHE3SYQbIpI/AAAAAAAA4nM/SFGGsj7HgyELAWCFQfanqqQwwBJfg30YACLcBGAs/s1600/01.jpg); background-position-x:center; background-size:cover;}
.group-layout .layout-1 img{max-width:700px; max-height:467px;}
/* 241030 서울측 전달코드 */
.size-l{max-width:550px !important;}
.size-m{max-width:400px !important;}
.size-s{max-width:300px !important;}
/* 14 사진그룹_슬라이드 */
.group-slide{width:100%; margin:0 auto 20px; position:relative !important;}
.swiper-pagination-bullet-active{background:#5670D1 !important;}
.swiper-button-prev,.swiper-button-next{--swiper-theme-color:#ccc; top:34% !important;}
.swiper-button-prev{left:0}
.swiper-button-next{right:0}
.slide-img{width:calc(100% - 70px); height:400px; background:#eee; margin:0 auto; position:relative;}
.slide-img img{width:auto; height:auto; max-width:100%; max-height:400px; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
.group-slide .swiper-pagination{position:initial;}
.swiper-pointer-events{max-height:520px;}
/*.swiper-horizontal.swiper-css-mode>.swiper-wrapper{height:250px;}*/
.group-slide .title{width:100%; margin:2px 0px 0 0px; font-size: 14px; font-weight: 500; letter-spacing: -0.04px; color: #333333; padding:0 !important;}
.group-slide .caption{width:100%; margin-top: 2px; margin-bottom:5px; font-size: 13px; font-weight: 300; line-height:20px; letter-spacing: -0.04px; color: #888; text-align:left;}
/* 13 사진그룹_바둑판형 */
.group-layout{ margin:0 0px 20px 0px; overflow:hidden;}
.group-layout h4{margin-bottom:10px;}
.group-layout img{width:100%; height:auto;}
.group-layout .title{font-size: 16px !important; line-height: normal !important; font-weight: 500; letter-spacing: -0.04px; color: #333333; margin-bottom: 0; margin-top: 5px;}
.group-layout .caption{margin:3px 0; padding:0 !important; font-size: 13px; line-height: 19px; color: #888; text-align:left;}