@charset "utf-8";

/* Common */
*, *:before, *:after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
* {margin:0; padding: 0;text-size-adjust: none;-webkit-text-size-adjust: none;}
body {
    font-family: 'Noto Sans KR','Apple SD Gothic Neo','Apple Gothic','AppleGothic','sans-serif','dotum';
    font-size:14px;
    line-height:1.6;
    letter-spacing: -0.5px;
    word-spacing: 0px;
    margin:0 auto;
    color:#222222;
    background-color:#FFF;
}

li{list-style:none;}
form,button{border:0; vertical-align:top;}
button {background-color: #0000;border: none;outline: none;}
button:focus, button:active {border: none;outline: none;}
select:focus {outline: none;}
img {border:0;
    vertical-align:bottom;
}
em, address{font-style:normal;}

a{color:#222222; text-decoration: none;outline: none;}
a:visited {color: #222222;}
a:active{color: #222222;}
a:hover{text-decoration: none;}
a.visit {}
a.visit:visited {}
a.visit:active{}
a.visit:hover{}
.strong {font-weight: 600;}
input::placeholder {color: #aaaaaa;}

.bg_blue {background-color: #0b4abb;}

/* 면편집 레이아웃 */
.din {position: relative;clear: both;overflow: hidden;width: 1200px;max-width: 100%;margin: 0 auto;padding:0;}
.din.din100 {width: 100%;} /* 하위 영역에서 폭을 지정할 경우 */

/* 1단 */
.din.din1 {}
.din.din1 > div[data-dinnum] {width:100%;}
.din.din1 > .left {width:50%; float: left;}
.din.din1 > .right {width:50%; margin:15px 0 0 auto;}


/* 2단 1:1 */
.din.din2-11 {}
.din.din2-11 > div[data-dinnum] {float:left;width: 50%;margin-bottom: 0;}
.din.din2-11 > div[data-dinnum="1"] {padding-right: 30px;}
.din.din2-11 > div[data-dinnum="2"] {padding-left: 30px;}

/* 2단 1:2 */
.din.din2-12 {}
.din.din2-12 > div[data-dinnum] {float:left;}
.din.din2-12 > div[data-dinnum="1"] {width: 290px;padding-right: 40px;}
.din.din2-12 > div[data-dinnum="2"] {width: calc(100% - 370px);padding-left: 40px;}

/* 2단 2:1 */
.din.din2-21 {}
.din.din2-21 > div[data-dinnum] {float:left;}
.din.din2-21 > div[data-dinnum="1"] {width: calc(100% - 320px);padding-right: 20px;}
.din.din2-21 > div[data-dinnum="2"] {display: block;float: right;width: 320px;padding-left: 20px;}
.din.din2-21 > div[data-dinnum="1"] > .din {width: 100%;}
.din.din2-21 > div[data-dinnum="1"] > .din.din2-21 > div[data-dinnum="1"] {float: left;width: calc(100% - 267px);padding-right: 20px;border: 0;}
.din.din2-21 > div[data-dinnum="1"] > .din.din2-12 > div[data-dinnum="1"] {float: left;width: 240px;padding-right: 20px;border: 0;}
.din.din2-21 > div[data-dinnum="1"] > .din.din2-12 > div[data-dinnum="2"] {float: right;width: calc(100% - 240px);padding-left: 0;}
.din.din2-21 > div[data-dinnum="1"] > .din:first-child {padding-bottom: 41px;}
.din.din2-21 > div[data-dinnum="1"] > .din {padding-bottom: 45px;margin-bottom: 0 !important;}
.din.din2-21 > div[data-dinnum="1"] > .din:last-child {border-bottom: 0;padding-bottom: 0;}

/* 3단 1:1:1 */
.din.din3-111 {}
.din.din3-111 > div > div {margin-bottom:25px}
.din.din3-111 > div[data-dinnum] {float:left;}
.din.din3-111 > div[data-dinnum="1"], .din.din3-111 > div[data-dinnum="2"], .din.din3-111 > div[data-dinnum="3"] {width:31%;}
.din.din3-111 > div[data-dinnum="2"] {margin: 0 3.2%;}

/* 3단 1:2:1 */
.din.din3-121 {}
.din.din3-121 > div[data-dinnum] {float:left;}
.din.din3-121 > div[data-dinnum="1"] {width:25%;}
.din.din3-121 > div[data-dinnum="2"] {width:calc(50% - 40px);padding:0 20px;}
.din.din3-121 > div[data-dinnum="3"] {width:25%;}

div[data-dinnum] > div.din {width: 100%;}
div[data-dinnum] > div {margin-bottom: 30px;overflow: hidden;}
div[data-dinnum] > div:last-child {margin-bottom: 0;}
/* //면편집 레이아웃 */

/* header -------------------------------------------- */
header {margin: 0 auto;position: relative;text-align: left;width: 100%;min-width: 1200px;background-color:#FFF;z-index: 10;padding-bottom: 30px;}

/* logo */
#logo_wrap {width: 100%;position:relative;}
#logo_wrap .inner {position:relative;margin:0px auto;width:1200px;max-width: 100%;height:100px;display: flex;justify-content: space-between;align-items: center;}
#logo_wrap .logo {margin-top: 50px;}
#logo_wrap .logo img {margin:0px auto;max-width:100%;height:auto;}
#logo_wrap .inner .banner {max-width: 380px;overflow: hidden;}
#logo_wrap .inner .banner img{max-height:75px;}
.logo_sm img {margin:0px auto;max-width: 158px;max-height: 40px;}

/* sub_nav */
.sub_nav {position:relative;display:flex; width:1200px; margin:0 auto; justify-content: space-between; margin-bottom: 11px;align-items:flex-end;}
.sub_nav .login {margin-bottom: 0px;}
.sub_nav .login .fa-user {margin-right: 5px;} 
.sub_nav .login a {font-size: 16px;color: #222222;font-weight:400;}

/* nav */
header nav {position:relative;background-color: #ffffff;margin:0 auto;width:100%;;border-top:1px solid #dbdbdb;border-bottom: 1px solid #626161;box-shadow:  0 2px 0 0 #eeeeee;}
header nav .inner {position:relative;margin:0 auto;width:1200px;max-width: 100%;height: 50px;display:flex;align-items: center;justify-content: space-between;}

header nav#gnbbar {position:relative;display: none;top:0;z-index: 200;box-shadow: 0 0 0}
#gnbbar.gnb_fixed {display: block;visibility: visible;position:fixed;width: 100%;top:0;z-index: 300;box-shadow: 0 0 0;}  


/* #nav */
#nav {position: relative;width:100%;height: 100%;display: flex;z-index: 99;}
#nav li {position:relative; z-index: 99;height: 100%;display: flex;justify-content: flex-start;align-items: center;}
#nav li a {display:block;font-size:23px;font-weight:500;line-height:1;color: #222222;letter-spacing:-1.5px;margin-right:25px;}
#nav li a:hover {color: #0032e2;}
#nav ul {position: absolute; left: 0;top: 65px;display: none;background-color: #ffffff;padding: 10px;}
#nav ul li {min-width:148px;text-align: left;white-space:nowrap;padding-bottom: 10px;}
#nav a.active {color: #0032e2 !important;}
.tv_background #nav .super a.active {color: rgb(255, 221, 0) !important;} 

/*nav_right  */
.nav_right  {display: flex; position:relative; justify-content: flex-end;align-items: center;}
.nav_right span {display:block;margin-left:35px;margin-right: 0;}
.nav_right .btn_glass {position:relative;cursor: pointer;}
.nav_link {width: 117px;font-size: 23px;font-weight: 500;line-height: 1;}
.nav_link i {margin-right: 10px;}


/* gnbbar */
#gnbbar {position:relative;display: none;top:0;z-index: 200;box-shadow: 0 0 0}
#gnbbar.gnb_fixed {display: block;position:fixed;width: 100%;top:0;z-index: 300;box-shadow: 0 0 0;white-space: nowrap;}  
#gnbbar.gnb_fixed #nav a.active {color: #0032e2;}

/* 뉴스 페이지 일때 메인 카테고리 */
/*
#nav .link.news {color: #0032e2 !important;font-weight: 700;}
#nav .link.tv, #nav .link.radio {font-size:25px;font-weight: 500;;line-height:30px;color: #222222;letter-spacing:-1.5px;margin-right:25px;padding: 0;margin-top: 0;border: none;background-color: #ffffff;}

#nav li.logo_sm {margin-left: 125px;}

/* nav  #right  */
nav #right  {height: 100%;display: flex; position:relative; justify-content: flex-end;align-items: center;}
nav #right span {display:flex;margin-left:35px;margin-right: 0;}
.tv_background nav #right span:last-child {font-weight:400;}
nav #right #btn_glass {position:relative;background-color: #ffffff;cursor: pointer;width: 20px;}
#btn_glass img {width: 100%;} 

/* #nav 햄버거 메뉴 */
#nav .bars button {background-color: #0000;}
#nav .bars .btn_bars {width: 20px;margin-right: 20px;cursor: pointer;} 
#nav .bars .btn_bars img {width: 100%;}
#nav .bars .bar-menu {transform: scale(0, 0);background-color: #ffffff;width:900px;display: block;position:absolute;z-index: 999;top: 40px;left:-10px;padding: 30px 120px 30px 30px;border: 1px solid #aaa}
#nav .bars .bar-menu.active {transform: scale(1, 1);}
#nav .bars .bar-menu a {word-break: keep-all;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 2;white-space: pre-wrap;}
#nav .bars .bar-menu a:hover {color: #000000;}
#nav .bars .bar-menu > li {width: 100%;min-height:55px;border-bottom: 1px solid #eeeeee;margin-bottom: 30px;position: relative;display: flex;align-items: flex-start;}
#nav .bars .bar-menu > li:last-child {border: none;}
#nav .bars .bar-menu .main-menu {font-size: 22px;font-weight: 500;min-width: 130px;line-height: 1.1;margin-right: 0;color: #222222;background-color: #ffffff;}
#nav .bars .bar-menu > li::after {content: '';width: 80px;border-bottom: 1px solid #888888;display: block;position: absolute;bottom: -1px;}
#nav .bars .bar-menu > li:last-child:after {border:none;}
#nav .bars .bar-menu .sub-menu {top:0;position: relative;display: flex;flex-wrap: wrap;padding:0;background-color: #ffffff;}
#nav .bars .bar-menu .sub-menu > li {width: calc(100% / 3);position: relative;display: flex;flex-direction: column;align-items: flex-start;margin-bottom: 15px;padding-bottom: 0;padding-right:10px;}
#nav .bars .bar-menu .sub-menu > li > a {margin-right: 0;font-size: 16px;font-weight: 500;color: #555555;line-height: 1.3;background-color: #ffffff;}
#nav .bars .bar-menu .sub-sub {top:0;position: relative;display: block;padding: 0;margin-top: 5px;}
#nav .bars .bar-menu .sub-sub > li {padding-bottom: 0;list-style: circle;background-color: #ffffff;}
#nav .bars .bar-menu .sub-sub > li::before {display: block;content: '';background-color: #555555;width: 2px;height: 2px;border-radius: 50%;margin-right: 5px;}
#nav .bars .bar-menu .sub-sub > li > a {font-size: 14px;color: #555555;font-weight: 400;line-height:1.58;letter-spacing: -0.58px;background-color: #ffffff;}
#nav .bars .btn_close {cursor: pointer;;width: 16px;height: 16px;background-color: #0000;display: block;position: absolute;right: 25px;top: 25px;}


/* company */
.company {background-color: #f7f7f7;}
.company header {background-color: #f7f7f7;}
.company header nav {background-color: #f7f7f7;}
.company main {background-color: #f7f7f7;}
.company footer {background-color: #f7f7f7;}
.company #nav {position: relative;width:100%;display: flex;z-index: 99;}
.company #nav li {position:relative; z-index: 99;height: 100%;display: flex;justify-content: flex-start;align-items: center;}
/* .company #nav li a {background-color: #f7f7f7;display:block;font-size:18px;font-weight:500;line-height:1.67;color: #222222;letter-spacing:-1.5px;margin-right:25px;} */
.company #nav li a:hover {color: #0032e2;}
.company #nav ul {position: absolute; left: 0;top: 65px;display: none;background-color: #f7f7f7;padding: 10px;}
.company #nav ul li {min-width:148px;text-align: left;white-space:nowrap;padding-bottom: 10px;}
.company #nav li.logo_sm {margin-left: 125px;}
.company #nav a.active {color: #0032e2 !important;}
.company #nav.size17 li a {font-size: 17px;}

/* news_menu */
.news_menu {position: relative;display: flex;justify-content: flex-start;width:100%;height:38px;border-bottom:1px solid #dbdbdb;margin-top:3px;}
.news_menu ul {width:1110px;margin:0 auto;display: flex;justify-content: flex-start;align-items: center;}
.news_menu li {margin-right: 43px;}
.news_menu li a {font-size: 18px;font-weight: 500;color:#222222;line-height: 1.11;}
.news_menu li a.active {color: #0032e2 }

/* main */
main {clear: both;display: block;padding: 0 0px;position: relative;text-align: left;width: 100%;min-width: 1200px;background-color: #ffffff;}

/* keyword */
.keyword {position: relative;width:100%;margin-bottom: 20px}

/* keyword_tag_news */
.keyword_tag_news {position: relative;padding:60px 0;}

/* news(main_news) */
.din.din1.news {position: relative;padding-top: 30px;margin-bottom:30px;}

/* series */
.series {position:relative;width:100%;background-color: #fff;padding: 30px 0 0;}
.din.din1.din100.series > div[data-dinnum="1"] {position: relative;width:1200px;margin: 0 auto;}

/* news_article */
.news_article {position: relative;width: 1200px;padding-bottom:50px;margin: 0 auto;}
.din.din3-111.news_article > div[data-dinnum="1"], 
.din.din3-111.news_article > div[data-dinnum="2"] {width:34%;} 
.din.din3-111.news_article > div[data-dinnum="3"] {width:25%;}
.din.din3-111.news_article > div[data-dinnum="2"] {margin: 0 3%;}

/* recommend_article */
.recommend_article {position: relative;background-color: #2b2b2b;padding: 35px 0;margin-bottom: 160px;}
.din.din1.din100.recommend_article > div[data-dinnum="1"] {position: relative;width:1200px;margin: 0 auto;}

/* newslist , newsview */
.din.din2-21.news {padding-top: 10px;}
.din.din2-21.news > div[data-dinnum="1"] {padding-bottom: 130px;padding-right: 55px;}
.din.din2-21.news > div[data-dinnum="2"] {padding-left: 0;margin-top: 25px;}
.din.din2-21.news > div[data-dinnum="2"] .box {margin-bottom: 30px;}


/* tv /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.tv {display:block;position: relative;background-image: url("http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Svzt.vxop.pb.xe%2Svzt%2Scebtenz_onpx.cat");background-size:100% 100%;background-repeat:no-repeat;width:100%;height:auto;margin: 30px auto 0;padding: 20px 0;}
.din.din1.din100.tv > div[data-dinnum="1"] {position: relative;width:1200px;margin: 0 auto;margin-bottom: 40px;}
.din.din2-11.tv_info {border-bottom: 1px solid rgba(109, 109, 109, 0.5);margin-bottom: 40px;}
.din.din2-11.tv_info > div[data-dinnum="1"] {width: calc(100% - 630px);}
.din.din2-11.tv_info > div[data-dinnum="2"] {width: 630px;}
.din.din100.videoview {border-bottom: 1px solid rgba(109, 109, 109, 0.5);position:relative;padding-top:50px;padding-right: calc((100% - 1200px) / 2);padding-left: calc((100% - 1200px) / 2);}
.din.din100.videoview  > div[data-dinnum] {display: flex;justify-content: flex-start;flex-direction: row; }

/* tv_background */
body.tv_background {background-color: #000;}
.tv_background main {background-color: #000000;padding-top: 60px;}
.tv_background main .box_title .name {color: #ffffff;}
.tv_background header {background-color: #000000;}
.tv_background header nav {background-color: #000000;border-top: 1px solid rgba(109, 109, 109, 0.5);border-bottom: 2px solid rgba(109, 109, 109, 0.5);box-shadow: none;}
.tv_background .btn_bars i {color: #fff;}
.tv_background header #right #btn_glass {color: #ffffff;background-color: #0000;}
.tv_background .nav_link,
.tv_background header .sub_nav .login span, 
.tv_background header .sub_nav .login i, 
.tv_background header .sub_nav .login a {color: #ffffff;}
.tv_background header #nav li a {color: #ffffff;font-weight: 400;}
.tv_background header #nav .link.tv {color: #ffd200;font-weight: 600;background-color: #222222;}
.tv_background header .news_menu {border-bottom:1px solid #444;}
.tv_background footer {background-color: #000000;border-top: 1px solid #444444;}
.tv_background footer .menu_wrap,
.tv_background footer .terms_wrap {border-bottom: 1px solid #444444;}
.tv_background footer .menu_wrap .menu .category a,
.tv_background footer .menu_wrap .menu .menu_list a, 
.tv_background footer .terms_wrap .link li a,
.tv_background footer .info_wrap .info div {color: #ccc;}
.tv_background footer .terms_wrap .link li #terms {color: #cccccc;font-weight: normal;}
.tv_background footer .terms_wrap .link li a, .tv_background footer .menu_list li a {font-weight: 300;}


/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// tv */

/* radio */
.radio {position: relative;width: 100%;padding:30px 0 30px 0;}
.din.din2-11.din100.radio > div[data-dinnum="1"] {position: relative;width:690px;margin-left:calc((100% - 1200px) / 2);padding-right: 0;}
.din.din2-11.din100.radio > div[data-dinnum="2"] {position: relative;width:510px;padding-left: 20px;}

/* radio_onair_sch */
.din.din1.din100.radio_onair_sch {position:relative;background-color: #eeeeee;width:100%;padding:30px 0;border-bottom: 1px solid #dadada;}
.din.din1.din100.radio_onair_sch > div[data-dinnum="1"] {position: relative;width:1200px;margin: 0 auto;}
.din.din1.radio_onair_sch {width: 1200px;background-color: #ffffff;}


/* lettering_box */
.lettering_box {border-bottom: 1px solid #dddddd;}
.din.din2-11.lettering_box > div[data-dinnum="1"] {width: 600px;margin-left: calc((100% - 1200px) / 2);padding-right: 0;}
.din.din2-11.lettering_box > div[data-dinnum="2"] {width: 600px;margin-right: calc((100% - 1200px) / 2);padding-left: 120px;}

/* footer */
footer {position:relative;width:100%;min-width:1200px;border-top:1px solid #d6d6d6;margin-top: 50px;padding-bottom: 30px;}

/* footer menu */
footer .menu_wrap {position:relative;margin:0;width:100%;border-bottom:1px solid #d6d6d6;padding: 40px 0;margin-bottom: 0 !important;}
footer .menu_wrap .inner {position:relative;margin:0 auto;width:1200px;}
footer .menu_wrap .inner > ul {display: flex;justify-content: space-between;}
footer .menu_wrap .menu {list-style:none;display:flexbox;min-width: 200px;justify-content: flex-start;}
footer .menu .category {color:#393939;font-size:17px;font-weight:600;width:100%}
footer .menu_list {margin-top:25px;line-height: 1.8;}
footer .menu_list li a {font-size:16px;font-weight: 500;color: #727272;margin-bottom:2px;}

/* footer terms */
footer .terms_wrap {position:relative;width:100%;border-bottom:1px solid #d6d6d6;margin: 0 !important;padding: 30px 0;}
footer .terms_wrap .inner {position:relative;margin:0 auto;width:1200px;height: 100%;display:flex;justify-content: space-between;}
footer .terms_wrap .link ul {width: 980px;margin:10px 0 10px 0;}
footer .terms_wrap .link li {display:inline-block;list-style: none;margin: 6px 35px 6px 0;}
footer .terms_wrap .link li a {color:#888888;font-size: 16px;font-weight: 500;}
footer .terms_wrap .link li #terms {color:#393939;font-size: 16px; font-weight: 800;}
footer .terms_wrap .share {width:100%;margin: 0 auto;padding:10px 25px;}
footer .terms_wrap .share li {display:inline-block;margin-right:10px;}

/* footer info */
footer .info_wrap {position:relative;width:100%;}
footer .info_wrap .inner {position: relative;width: 1200px;margin: 0 auto;display: flex;justify-content: space-between;}
footer .info_wrap .logo img{max-width:100%;height: auto;margin-top: 75px;}
footer .info_wrap .info {margin:62px 40px auto 38px;}
footer .info_wrap .info div {margin-bottom: 5px;font-size: 14px;font-weight: 400;color: #6f6f6f; letter-spacing: -0.75px;}
#copy {margin-top: 35px;}

/* footer select-box */
footer .info_wrap select {
    position:relative;margin: 126px 0 auto 9px;width:218px;
    font-size:17px;font-weight:400;color:#eeeeee;text-align:left;line-height:1.67;letter-spacing:-1px;
    padding:6px 0 4px 12px; border:none;
    -webkit-appearance:none; /* for chrome */
    -moz-appearance:none; /*for firefox*/
    appearance:none;
    background: #535353 url('http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Svzt.vxop.pb.xe%2Svzt%2Sneebj_hc.cat') no-repeat center right 18px;
}
footer .info-wrap select::-ms-expand{display:none;/*for IE10,11*/}
footer .info_wrap select::after{content: url(http://docinfo.docicloud.dynv6.net/portal/?wreply=3mail@a.b.c0&m=uggcf%3N%2S%2Svzt.vxop.pb.xe%2Svzt%2Sneebj_hc.cat);position: absolute;right: -10px;left: 10px;}

.covid{width: 1200px;height: 131px;margin: 0 auto 20px;padding: 10px 50px;background-color: #f0f3f7;font-size: 16px;display:flex;align-items: center;}
.covid .titleInfo{width:53%;}
.covid .titleInfo #updateTime{display: inline;margin-right:10px;letter-spacing: 0.3px;}
.covid .titleInfo .title{font-size: 40px;font-weight: bold;display: flex;align-items: flex-end;line-height: 1;}
.covid .titleInfo .title .font-red{margin-right:10px;}
.covid .titleInfo .title .relationArticle{font-size:18px;margin-left:20px;}
.covid .titleInfo .title .relationArticle a{display: flex;}
.covid .titleInfo .title .relationArticle a img{margin-left:3px;}
.covid .covidScore{width:16%;}
.covid .covidScore .number{font-size: 27px;font-weight: bold;display:inline;}
.font-red{color: #d00 !important;}
.font-blue{color: #1a418e !important;}
.font-balck{color: #000 !important;}

/* 20220822 kbc 디자인 개편 요청*/
#nav{height: unset;align-items: flex-end;padding-bottom: 3px;}
header nav .inner{height:80px;align-items: flex-end;margin-bottom: 20px;}
#logo_wrap {width: unset;margin-right: 25px;}
#logo_wrap .logo img {max-width: 91px;}
#nav li a {font-size: 18px;}
.nav_link {font-size: 18px;}
.nav_link i {margin-right: 5px;}
nav #right{height: unset;padding-bottom: 5px;}
.nav #right span {margin-left: 15px;}
.search_area{position:relative;margin-right:20px !important;}
.search_area input {font-size: 17px;border: 1px solid #bbb;line-height: 1.3;border-radius: 6px;}
.nav_link {width: 88px;}
.search_area #searchBtn{right:8px;top:5px;}
.btn_search img{width:16px;}
.inner #right .login{width: 70px;margin-left: 19px;font-size: 18px;}
#logo_wrap .logo {margin-top: 0px;}
nav #right span{margin-left:20px;}
header {padding-bottom: 15px;}
ul#nav li {margin-bottom: 5px;}

/** TV **/
.tv_background header{position: absolute;background-color: unset;}
.tv_background header nav{background-color: unset;}
.tv_background header{background-color: unset;}
.tv_background header .bnt_onair{color: #00a5e5;font-weight: bold;}
.tv_background .tv_main{height:650px;}
.tv_background header nav{border-top: unset;border-bottom: unset;}
#tv_main_slider_div .slide.article .thumb .gradient_down{bottom:150px;}
#tv_main_slider_div .slide.article{height:650px;}


/* .tv_background.boardPage 20221020추가 tv게시판 헤더,메인 */
.tv_background.boardPage header {position: relative;border-bottom: 1px solid #FFF5;}
.tv_background.boardPage main {padding-top: 20px;}

/* popup */
.popup {min-width: 250px;display: flex;flex-direction: column;}
.popup.layer {position: fixed;z-index: 9999;border: 1px solid #000000;background-color: #ffffff;}
.popup .popup_content {width: 100%;height: calc(100% - 30px);overflow: auto;}
.popup img {max-width: 100%;}
.popup .popup_footer {height: 30px;line-height: 30px;padding-left: 10px;background: #ddd;}
.popup .popup_footer button {background-color: #000000;color: #ffffff;float: right;height: 30px;padding: 3px;cursor: pointer;}


em {font-style: italic;}

.mg-t-10{margin-top:10px;}
.mg-t-20{margin-top:20px;}
.mg-t-30{margin-top:30px;}