@charset "UTF-8"; 

body, html {
    /*height: 100%;*/
    min-height:100%;
}

body {
    letter-spacing: -0.001em;
    min-width: 320px;
    display: flex;
    flex-direction: column;
}
body.lnb-is-open{overflow:hidden}
body.lnb-is-open, body.sch-is-open {
    /*position: fixed;
    width: 100%;
    height: 100%;
    overflow: hidden;*/
    touch-action: none;
}

body .popwrap {
    display: block;
}

body.main .popwrap {
    display: block;
}

body.main header .logo.special a {
    background-image: none;
}

body.main header .logo.special img {
    display: block;
}

.more_link {position:absolute;top:3px; right:0; color:#2D2D2D; font-size:12px; line-height:20px; font-weight:500;}
.more_link::after {content:"\e93f"; position:relative; top:3px; font-family: 'xeicon';  font-size:18px; line-height:1;}

/* ========== banner ========== */
.popwrap .container {
    max-width: 1024px;
    margin: 0 auto;
}

.main_top_banner {
    text-align: center;
}

.main_top_banner .box {
    display: block;
}

.main_top_banner .box img {
    max-height: 100px;
}

.main_top_banner .btn {
    background-color: #ededed;
    width: 100%;
    font-size: 0;
    display: block;
    padding: 0 !important;
}

.main_top_banner .btn button {
    display: inline-block;
    width: 50%;
    padding: 10px;
    color: #6d6d6d;
    font-size: 14px;
}

.main_top_banner .btn button:first-child {
    border-right: 1px solid #d9d9d9;
}

.main_top_banner .open {
    width: 50px;
    height: 32px;
    position: absolute;
    top: -32px;
    right: 0;
    z-index: 100;
    transition: all .2s ease;
    opacity: 0;
    z-index: 2;
}

.main_top_banner .open span {
    font-size: 0;
    line-height: 1;
}

.main_top_banner .open span:after {
    content: '\e941';
    font-family: 'xeicon';
    color: #333;
    font-size: 15px;
}

.main_top_banner .hide + .open {
    display: block;
    opacity: 1;
}

#main {
    flex: 1;
    background-color: #f2f4f7;
	overflow: hidden;
}

.accessibility a {
    position: absolute;
    top: -99px;
    left: 0;
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    width: 100%;
    padding: 10px 0;
    text-align: center;
    text-decoration: none;
    z-index: 999;
}

.accessibility a:hover, .accessibility a:focus, .accessibility a:active {
    display: block;
    top: 0;
}

.eg_info {
    position: relative;
    top: 0;
    z-index: 2;
    width: 100%;
    background-color: #F6F6F6;
}

.eg_info p {
    max-width: 1024px;
    margin: 0 auto;
    color: #2D2D2D;
    font-weight: 400;
    font-size: 13px;
    line-height: 32px;
    text-align: left;
    letter-spacing: -0.05em;
    padding: 0 10px;
}

.eg_info p img {
    vertical-align: middle;
    margin-right: 3px;
    margin-top: -1px;
    width:24px;
}

.container {
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.container:after {
    content: "";
    clear: both;
    display: table;
}

/* ========== common ========== */
.sns a {
    font-size: 18px;
    color: #78909c;
}

.sns a ~ a {
    margin-left: 12px;
}

[class*="sns-"] {
    border-radius: 100%;
    overflow: hidden;
    display: inline-block;
}

[class*="sns-"] span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    padding: 0;
    margin: -1px;
    border: 0;
}

[class*="sns-"]:before {
    content: "";
    border-radius: 100%;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    background-size: auto 50px;
    background-image: url("../images/common/sns_icon.svg");
}

.sns-pres:before {
    background-image: url("../images/common/president_m.svg");
    border-radius: 0;
    width: 30px;
    height: 25px;
    background-repeat: no-repeat;
}

.sns-fb:before {
    background-position: 0 0;
}

.sns-tw:before {
    background-position: -25px 0;
}

.sns-nv:before {
    background-position: -50px 0;
}

.sns-ut:before {
    background-position: -75px 0;
}

.sns-is:before {
    background-position: -100px 0;
}

.sns-nvb:before {
    background-position: -125px 0;
}

strong, b, th, dt, h1, h2, h3, h4, h5, h6 {
    letter-spacing: -.01em;
    color: #2d2d2d;
}

/*.lead {line-height: 1.6;}*/
.box a {
    display: block;
}

.thumb {
    display: block;
    position: relative;
    /*border:1px solid #dee2e6;*/
    background: #b1bab9 url("../images/common/noimage_default.svg") 50% 50% no-repeat;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding-bottom: 64.56%;
    background-size: contain;
}

.thumb img {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover;
}
.photo_list.short .thumb img{
	width:101%;
	height:101%;
	margin-top:-1px;
}

/* ========== header ========== */
header {
    /*position: relative;*/
    position:sticky;
    top:0;
    background-color: #fff;
    width: 100%;
    box-shadow: 0 10px 20px rgb(0 0 0 / 0%);
    z-index: 12;
    
}

/*.hd_fixed .eg_info {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
}

.hd_fixed header {
    position: fixed;
    top: 32px !important;
    left: 0;
}*/

header > .container {
    position: relative;
    height: 60px;
    align-items: center;
    padding: 0 0;
    z-index: 100;
    display: flex;
    justify-content: flex-end;
}

main {
    background-color: #fff !important;
    min-width: 320px;
}

/*main .thumb img {
    object-fit: cover;
    object-position: top;
}*/

header .logo {
    width: auto;
    height: 52px;
    margin-right: auto;
    max-width: 90px;
    margin-left: 16px;
}

header .logo a {
    position: relative;
    display: inline-block;
    width: 95px;
    background-image: url('../images/common/logo.svg');
    background-repeat: no-repeat;
    background-position: 50% 50%;
    height: 52px;
    line-height: 1;
    font-size: 1rem;
    overflow: hidden;
}

header .logo.special {width: auto !important; max-width: none !important; height: 100% !important;}
header .logo.special a {background-image: none !important; width: auto !important; height: 100% !important;}
header .logo.special a img {max-width: none !important; height: 100% !important;}

header .logo i {
    display: none;
}

header .logo a img {
    vertical-align: top;
}

header .logo span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    padding: 0;
    margin: 0;
    border: 0;
}

header .logo .xe-icon {
    font-size: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

header .logo .xe-icon:before {
    content: '\e902';
}

header .lnb_open {position: relative; line-height: 0; width: 24px; height: 24px; margin-right: 16px; vertical-align: middle;}
header .lnb_open i {content: ''; display: inline-block; position: absolute; top:50%; left:50%; width: 24px; height: 24px; background:url("../images/v3/icon_menu.svg") no-repeat 50% 50% / cover; transform: translate(-50%,-50%);}
header .lnb_open span {position: absolute; top: 50%; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; border: 0;}
header .lnb_close {position: absolute; top: -42px; right: 16px; width:24px; height:24px; background-color:#fff; z-index: 4;}
header .lnb_close:after {content: ""; display:block; position:absolute; left:50%; top:50%; width:22px; height:22px; background:url("../images/v3/icon_close.svg") no-repeat 50% 50% / cover; transform: translate(-50%, -50%);}
header .lnb_close span {position: absolute; top: 50%; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; border: 0;}

header .lnb {position: fixed; /*top: 92px;*/top:92px; bottom: 0; width: 100%; z-index: 100; display: block; opacity: 1; visibility: hidden;}
.eg_none header .lnb{top:60px}
header .lnb:before {content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 100vh; background-color: rgba(0,0,0,0.5); opacity: 0; visibility: hidden; z-index: 1;}
/*header .lnb:after {content: ''; position: fixed; left: 0; top: 0; right: 0; bottom: 0; height: 100vh; background-color: rgba(0, 0, 0, 0.7); opacity: 0; visibility: hidden; z-index: -1; transition: all .5s;}*/
header .lnb .util{display:none;}

header .lnb .scroll {position: absolute; right:-85%; top:0; z-index: 3; width:85%; height:100%; overflow: hidden; overflow-y: scroll; display: flex; flex-direction: column; justify-content: space-between; background-color:#fff; border-top:1px solid #f0f0f0; transition: all .8s;}
header .lnb.lnb-is-open .scroll {right:0;}

header .lnb .out_links {
    background-color: #F8F8F8;
    padding: 16px 30px;
}

header .lnb .out_links > li + li {
    margin-top: 8px;
}

header .lnb .out_links > li a {
    display: inline-block;
    padding: 4px 0;
    color: #2D2D2D;
    font-size: 16px;
    line-height: 1.6;
}

header .lnb .out_links > li a[title='새창으로 열림']:after {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    margin-left: 8px;
    background: url("../images/v3/icon_link_arr.svg") no-repeat 50% 50% / cover;
}

header .lnb .sns {
    position: relative;
    z-index: 4;
}

header .lnb .sns .lst {
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}

header .lnb .sns .lst li a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
    transition: all .3s;
}

header .lnb .sns .lst li a:hover, header .lnb .sns .lst li a:focus {
    border-color: #1d1d1d;
}

header .lnb .sns .lst li a:after {
    content: '';
    display: inline-block;
    width: 20px;
    height: 30px;
    background-size: 100% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

header .lnb .sns .lst li a span {
    position: absolute;
    top: 50%;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    border: 0;
}

header .lnb .sns .lst li a.fb:after {
    background-image: url("../images/v3/icon_sns_fb.svg")
}

header .lnb .sns .lst li a.tw:after {
    background-image: url("../images/v3/icon_sns_tw.svg")
}

header .lnb .sns .lst li a.nbg:after {
    background-image: url("../images/v3/icon_sns_nbg.svg")
}

header .lnb .sns .lst li a.yt:after {
    background-image: url("../images/v3/icon_sns_yt.svg")
}

header .lnb .sns .lst li a.ig:after {
    background-image: url("../images/v3/icon_sns_ig.svg")
}

header .lnb .nav {padding:20px;}
header .lnb .nav > li > a {position: relative; font-size:18px; font-weight: 700; color: #212429; display: flex; align-items: center; min-height: 57px; transition: all .3s;}
header .lnb .nav > li.small > a {font-size: 17px; font-weight: 400;}
header .lnb .nav > li > a:after {content: '\e941'; font-family: "xeicon"; display:inline-block; vertical-align: middle; margin-left:8px; font-size: 16px; font-weight: 400;}
header .lnb .nav > li > a[title='새창으로 열림']:after {content: ''; display:inline-block; vertical-align: middle; width:20px; height:20px; margin-left:8px; background:url("../images/v3/icon_link_arr.svg") no-repeat 50% 50% / cover;}
header .lnb .nav > li.active > a:after {transform: rotate(0.5turn);}
header .lnb .nav > li > a > span {}
header .lnb .nav > li > ul {padding: 0 0 12px 16px; display: none;}
header .lnb .nav > li > ul li {display:inline-block; vertical-align: top; width: calc(50% - 5px);}
header .lnb .nav > li > ul li a {padding: 4px 0; display: block; font-size: 16px; line-height:1.4; letter-spacing: -0.02em; color: #1D1D1D; transition: all .3s;}
header .lnb .nav > li > ul li a span {position: relative;}
header .lnb .nav > li.active > a {color: #212429; font-size: 18px;}
header .lnb .nav > li.active >  ul {display: block;}
header .lnb .nav > li > ul li.active a {color: #D41115; text-decoration: underline;}
header .lnb.lnb-is-open {right: 0;}
header .lnb.lnb-is-open,
header .lnb.lnb-is-open:before,
header .lnb.lnb-is-open:after {opacity: 1; visibility: visible;}

header .notify_btn {
    position: relative;
    line-height: 0;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    margin-right: 20px;
}

header .notify_btn::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    background: url("../images/v3/icon_bell1.svg") no-repeat 50% 50% / cover;
    transform: translate(-50%,-50%);
}

header .notify_btn.on::after {
    background-image: url("../images/v3/icon_bell2.svg");
}

header .sch_open {
    position: relative;
    line-height: 0;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    margin-right: 20px;
}

header .sch_open i {
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 22px;
    height: 22px;
    background: url(../images/v3/icon_sch.svg) no-repeat 50% 50% / cover;
    transform: translate(-50%, -50%);
}

header .sch_open span {
    position: absolute;
    top: 50%;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    border: 0;
}

header .sch_layer {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 20px;
    height: 100%;
    z-index: 200;
    overflow: hidden;
    overflow-y: scroll;
    min-width: 320px;
}

header .sch_layer:before {
    content: '';
    display: block;
    background: linear-gradient(to right, #df2123 0%, #a4328a 52%, #6742dd 99%);
    width: 100%;
    height: 100px;
    position: fixed;
    left: 0;
    top: 0;
}

header .sch_layer:after {
    content: '';
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: -1;
}

header .sch_layer.on {
    display: block;
}

header .sch_layer .container {
    padding: 40px 16px 20px;
    height: auto;
    min-height: 240px;
    max-width: none;
    z-index: 2;
    display: flex;
    flex-direction: column;
}

/* header .sch_layer .container:after {content: ''; display: block; background: linear-gradient(to right, #df2123 0%, #a4328a 52%, #6742dd 99%); width: 100%; height: 200px; position: absolute; left: 0; top: 0; z-index: -1;} */
header .sch_layer .container:after {
    content: '';
    display: block;
    background: #F3F3F6;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}

header .sch_layer .sch_btn_close {
    position: absolute;
    right: 15px;
    top: 45px;
    font-size: 28px;
    width: 41px;
    color:#1d1d1d;
    -webkit-appearance:none;
}

header .sch_layer .sch_btn_close i {
    font-weight: 700;
}

header .sch_layer .sch_btn_close .xe-icon:before {
    content: '\e9af';
    font-weight: bold;
}

header .sch_layer .sch_btn_close span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    padding: 0;
    margin: -1px;
    border: 0;
}

header .sch_layer h1 {
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    display: inline-block;
}

header .sch_layer h1 img {
    width: 94px;
}

header .sch_layer h1 span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    padding: 0;
    margin: 0;
    border: 0;
}

header .sch_layer .form_box {
    display: block;
    margin-top: 25px;
}

header .sch_layer .form_box fieldset {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
}

header .sch_layer .sch {
    position: relative;
    width: 100%;
    padding: 2px;
    border-radius: 45px;
    background: linear-gradient(to right, rgb(223, 33, 35) 0%, rgb(164, 50, 138) 52%, rgb(103, 66, 221) 99%);
}

header .sch_layer .sch input[type="text"] {
    width: 100%;
    vertical-align: top;
    height: 56px;
    font-size: 16px;
    font-weight: 700;
    color: #1d1d1d;
    border-radius: 45px;
    border: 0;
    padding: 12px 90px 12px 20px;
}

header .sch_layer .sch input[type="text"]::placeholder {
    color: #8E8E8E;
    font-weight: 400;
}

header .sch_layer .sch .submit {
    color: #212429;
    width: 45px;
    height: 52px;
    background: url("../images/v3/icon_sch.svg") no-repeat 50% 50% / 26px;
    font-size: 28px;
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
}

header .sch_layer .sch .submit .xi-search {
    display: none;
}

header .sch_layer .sch .submit span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    padding: 0;
    margin: -1px;
    border: 0;
}

header .sch_layer .sch .clear_input {
    position: absolute;
    top: 50%;
    right: 50px;
    transform: translateY(-50%);
    width: 40px;
    height: 38px;
    font-size: 0;
    line-height: 0;
}

header .sch_layer .sch .clear_input:after {
    content: "\e924";
    display: inline-block;
    font-family: 'xeicon';
    font-size: 22px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #c5c5c5;
}

header .sch_layer .dtl {
}

header .sch_layer .dtl .dtl_sch_open {
    white-space: nowrap;
    height: 36px;
    margin-top: 20px;
    padding: 0 12px;
    border-radius: 30px;
    background: #E2E2E7;
    color: #1D1D1D;
    -webkit-appearance:none;
    font-size: 14px;
    font-weight: 700;
    transition: all 0.3s;
}

header .sch_layer .dtl .dtl_sch_open span:after {
    content: "\e941";
    font-family: "xeicon";
    margin-left: 4px;
    font-size: 12px;
}

header .sch_layer .dtl .dtl_sch_open span i {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}

header .sch_layer .dtl .dtl_sch_open.active span:after {
    content: "\e944";
}

header .sch_layer .dtl .dtl_sch_post {
    position: absolute;
    left: 0;
    right: 0;
    background-color: #fff;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .15);
    max-width: 600px;
    margin: 20px auto 0 auto;
    display: none;
}

header .sch_layer .dtl .tab {
    position: relative;
    margin: 0 auto;
    text-align: center;
    font-size: 0;
    padding: 0 10px;
    display: flex;
    justify-content: center;
}

header .sch_layer .dtl .tab:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    border-bottom: 1px solid #cfd2dc;
}

header .sch_layer .dtl .tab li button {
    position: relative;
    padding: 15px 8px;
    font-size: 15px;
    font-weight: 500;
    display: inline-block;
    color: #1D1D1D;
    z-index: 2;
    white-space: nowrap;
}

header .sch_layer .dtl .tab li button:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    border-bottom: 2px solid transparent;
    transition: all .2s;
}

header .sch_layer .dtl .tab li.active button {
    color: #D41115;
}

header .sch_layer .dtl .tab li.active button:after {
    border-bottom: 2px solid #D41115;
}

header .sch_layer .dtl .tab_cont {
    padding: 30px 16px 20px;
}

header .sch_layer .dtl .tab_cont .cont {
    display: none;
}

header .sch_layer .dtl .tab_cont .cont:first-child {
    display: block;
}

header .sch_layer .dtl .tab_cont .cont:first-child .post {
    border: none;
    padding: 0;
    background-color: transparent;
}

header .sch_layer .dtl .tab_cont .post {
    border: 1px solid #ddd;
    padding: 3px;
    background-color: #fff;
    overflow: hidden;
}

header .sch_layer .dtl .tab_cont .post .box {
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 200px;
    max-height: 200px;
    padding: 10px 15px;
}

header .sch_layer .dtl .tab_cont .post .box::-webkit-scrollbar {
    width: 5px;
}

header .sch_layer .dtl .tab_cont .post .box::-webkit-scrollbar-thumb {
    width: 100%;
    border-radius: 5px;
    background: #6b778a;
}

header .sch_layer .dtl .tab_cont .post strong {
    display: block;
    font-weight: 600;
    color: #1d1d1d;
    text-align: left;
    font-size: 16px;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
}

header .sch_layer .dtl .tab_cont #detailSchCont4 .post .box > ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

header .sch_layer .dtl .tab_cont .post .box ul > li {
    padding: 3px 0 3px 0;
    position: relative;
}

header .sch_layer .dtl .tab_cont .post .box ul > li > label {
    z-index: 2;
}

header .sch_layer .dtl .tab_cont .post .box ul > li > ul {
    position: relative;
    padding: 5px 0 0 0;
    overflow: hidden;
}

header .sch_layer .dtl .tab_cont .post .box ul > li > ul > li {
    position: relative;
    padding: 3px 0 3px 25px;
}

header .sch_layer .dtl .tab_cont .post .sort ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

header .sch_layer .dtl .tab_cont .post .sort ul > li {
    padding: 0 1px;
    flex: 1;
    white-space: nowrap;
}

header .sch_layer .dtl .tab_cont .post .sort ul > li > button {
    position: relative;
    display: inline-block;
    font-weight: 400;
    letter-spacing: -0.025em;
    font-size: 14px;
    color: #757575;
    background-color: #fff;
    padding: 8px 10px;
    width: 100%;
    text-align: center;
    border: 1px solid #ddd;
}

header .sch_layer .dtl .tab_cont .post .sort ul > li > button span {
    position: relative;
}

header .sch_layer .dtl .tab_cont .post .sort ul > li > button.on {
    background-color: #1974dd;
    border: 1px solid #1974dd;
    color: #fff;
}

header .sch_layer .dtl .tab_cont .post .sort ul > li > button.on span:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    border-bottom: 1px solid #fff;
}

header .sch_layer .dtl .tab_cont .post .sort li.period {
    width: 100%;
    padding-top: 10px;
    flex: auto;
}

header .sch_layer .dtl .tab_cont .post .sort li.period label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

header .sch_layer .dtl .tab_cont .post .sort li.period > span {
    position: relative;
    float: left;
    padding: 0 0 0 30px;
    border: 1px solid #c6c6c6;
    background-color: #fff;
    width: calc(50% - 13px);
}

header .sch_layer .dtl .tab_cont .post .sort li.period > span > input {
    padding: 0 0 0 10px;
    width: 99px;
    height: 34px;
    vertical-align: middle;
    border: none;
    font-size: 14px;
}

header .sch_layer .dtl .tab_cont .post .sort li.period > span > button {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    display: block;
    width: 35px;
    font-size: 23px;
    border: none;
    color: #868e96;
}

header .sch_layer .dtl .tab_cont .post .sort li.period > span > button:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 24px;
    height: 24px;
    background: url("../images/v3/icon_calendar.svg") no-repeat center center / 100% auto;
}

header .sch_layer .dtl .tab_cont .post .sort li.period > span > button span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

header .sch_layer .dtl .tab_cont .post .sort li.period > em {
    float: left;
    width: 26px;
    padding-top: 10px;
    text-align: center;
}

header .sch_layer .dtl .tab_cont .post .sort + .title {
    margin-top: 25px;
}

header .sch_layer .dtl .tab_cont .post .sort + .title + .sort {
    margin-bottom: 15px;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"], header .sch_layer .dtl .tab_cont .post input[type="radio"] {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"] + label, header .sch_layer .dtl .tab_cont .post input[type="radio"] + label {
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    letter-spacing: -1px;
    display: inline-block;
    font-weight: 400;
    color: #2d2d2d;
    font-size: 16px;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"] + label span, header .sch_layer .dtl .tab_cont .post input[type="radio"] + label span {
    display: inline-block;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"] + label:before, header .sch_layer .dtl .tab_cont .post input[type="radio"] + label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    background-color: #fff;
    border: 1px solid #C6C6C6;
    border-radius: 2px;
    cursor: pointer;
    transition: all .2s;
    line-height: 1;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"] + label:after, header .sch_layer .dtl .tab_cont .post input[type="radio"] + label:after {
    opacity: 0;
    position: absolute;
    z-index: 2;
    transition: all .2s;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"] + label:after, header .sch_layer .dtl .tab_cont .post input[type="radio"] + label:after {
    content: "";
    font-family: "xeicon";
    display: block;
    color: #D41115;
    line-height: 1;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"] + label:after {
    content: "\e929";
    font-size: 18px;
    left: 0;
    top: 0;
}

header .sch_layer .dtl .tab_cont .post input[type="radio"] + label:before {
    border-radius: 50%;
    width: 19px;
    height: 19px;
    top: 1px;
}

header .sch_layer .dtl .tab_cont .post input[type="radio"] + label:after {
    opacity: 0;
    background-color: #D41115;
    left: 5px;
    top: 6px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    z-index: 1;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"]:checked + label:after, header .sch_layer .dtl .tab_cont .post input[type="radio"]:checked + label:after {
    opacity: 1;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"]:checked + label:before, header .sch_layer .dtl .tab_cont .post input[type="radio"]:checked + label:before {
    background-color: #fff;
    border-color: #D41115;
}

header .sch_layer .dtl .tab_cont .post input[type="checkbox"]:focus + label, header .sch_layer .dtl .tab_cont .post input[type="radio"]:focus + label {
    outline: 1px solid #95b9f2;
}

header .sch_layer .dtl .tab_cont #detailSchCont1 .post .sort ul {
    gap: 8px 4px;
}

header .sch_layer .dtl .tab_cont #detailSchCont1 .post .sort ul > li {
    flex: none;
}

header .sch_layer .dtl .tab_cont #detailSchCont1 .post input[type="checkbox"] + label, header .sch_layer .dtl .tab_cont #detailSchCont1 .post input[type="radio"] + label {
    display: inline-block;
    vertical-align: middle;
    padding: 6px 12px;
    border-radius: 40px;
    border: 1px solid #D8D8D8;
    color: #2d2d2d;
    font-size: 14px;
    line-height: 1.6;
}

header .sch_layer .dtl .tab_cont #detailSchCont1 .post input[type="checkbox"]:checked + label, header .sch_layer .dtl .tab_cont #detailSchCont1 .post input[type="radio"]:checked + label {
    padding: 6px 16px 6px 36px;
    border-color: rgba(237, 31, 35, 0.5);
    background: #FEF2F2;
    color: #D41115;
}

header .sch_layer .dtl .tab_cont #detailSchCont1 .post input[type="checkbox"] + label:before, header .sch_layer .dtl .tab_cont #detailSchCont1 .post input[type="radio"] + label:before {
    display: none;
}

header .sch_layer .dtl .tab_cont #detailSchCont1 .post input[type="checkbox"] + label:after, header .sch_layer .dtl .tab_cont #detailSchCont1 .post input[type="radio"] + label:after {
    content: "\e929";
    position: absolute;
    top: 50%;
    left: 10px;
    width: auto;
    height: auto;
    background-color: rgba(0,0,0,0);
    margin-right: 2px;
    font-family: "xeicon";
    font-size: 22px;
    transform: translateY(-50%);
    transition: none;
}

header .sch_layer .dtl .select_opt {
    position: relative;
    width: calc(100% - 32px);
    margin: 0 auto;
    padding: 16px 20px;
    background: #F3F3F6;
}

header .sch_layer .dtl .select_opt strong {
    font-weight: 400;
    color: #2D2D2D;
    font-size: 14px;
    display: block;
}

header .sch_layer .dtl .select_opt > div {
    width: 100%;
    margin-top: 8px;
    max-height: 100px;
    overflow-y: auto;
}

header .sch_layer .dtl .select_opt > div::-webkit-scrollbar {
    width: 5px;
}

header .sch_layer .dtl .select_opt > div::-webkit-scrollbar-thumb {
    width: 100%;
    border-radius: 5px;
    background: #6b778a;
}

header .sch_layer .dtl .select_opt ul:after {
    content: '';
    clear: both;
    display: table;
}

header .sch_layer .dtl .select_opt ul li {
    font-size: 15px;
    color: #2D2D2D;
    letter-spacing: -0.05em;
    float: left;
    padding: 0 3px 3px 0;
}

header .sch_layer .dtl .select_opt ul li button {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
    padding: 2px 0;
    color: #2D2D2D;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
}

header .sch_layer .dtl .select_opt ul li button:after {
    content: "\e921";
    font-family: "xeicon";
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -1px;
    width: 13px;
    height: 13px;
    margin-left: 4px;
    background: #A8AAB1;
    color: #fff;
    font-size: 10px;
    line-height: 1.3;
    text-align: center;
}

header .sch_layer .dtl .select_opt ul li button span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}

header .sch_layer .dtl .dtl_sch_btn {
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 20px 15px;
    font-size: 0;
    display: flex;
}

header .sch_layer .dtl .dtl_sch_btn button {
    flex: 1;
    height: 44px;
    font-weight: 400;
    font-size: 16px;
    letter-spacing: -0.05em;
    border: 1px solid #D8D8D8;
    padding: 8px 20px;
    color: #666;
    -webkit-appearance:none;
    width: auto;
    background-color: #fff;
    border-radius: 48px;
}

header .sch_layer .dtl .dtl_sch_btn button:after {
    display: none;
}

header .sch_layer .dtl .dtl_sch_btn button span:before {
    position: relative;
    top: -2px;
    margin-right: 5px;
}

header .sch_layer .dtl .dtl_sch_btn .restart span:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    background: url("../images/v3/icon_refresh.svg") no-repeat 50% 50% / cover;
}

header .sch_layer .dtl .dtl_sch_btn .sch {
    background: #2D2D2D;
    color: #fff;
    border: 2px solid #202529;
    margin-left: 8px;
}

header .sch_layer .dtl .dtl_sch_btn .sch span:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    margin-left: 4px;
    background: url("../images/v3/icon_sch_white.svg") no-repeat 50% 50% / 18px;
}

header .sch_layer .dtl .dtl_sch_close {
    text-align: center;
    width: 100%;
    border-top: 1px solid #E4E4E4;
    font-size: 14px;
    font-weight: 500;
    color: #1D1D1D;
    line-height: 1;
    padding: 0 15px;
    margin-top: 10px;
}

header .sch_layer .dtl .dtl_sch_close button{
	color:#1d1d1d;
    -webkit-appearance:none;
}

header .sch_layer .dtl .dtl_sch_close span {
    position: relative;
    padding: 14px 0 14px 24px;
}

header .sch_layer .dtl .dtl_sch_close span:after {
    content: "\e922";
    font-family: "xeicon";
    font-size: 22px;
    line-height: 1;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-47%);
}

header .sch_layer .best_keyword {
    text-align: center;
    font-weight: 500;
    position: absolute;
    top: 70px;
    left: calc(50% - 48px);
    transform: translateX(-50%);
}

header .sch_layer .best_keyword a {
    color: #fff;
    display: inline-block;
    margin: 0 10px;
}

header .page_title {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    z-index: -1;
    font-size: 1.313rem;
    text-indent: 0;
}

header .scroll_indicator {
    position: absolute;
    width: 100%;
    bottom: 0px;
    left: 0;
    display: none;
    transition: all .3s;
    z-index: 99;
}

header .scroll_indicator span {
    background-color: #ed1f23;
    height: 3px;
    position: absolute;
    transform: rotate(0deg);
}
.eg_none .header{
	box-shadow: 0 10px 10px rgb(0 0 0 / 15%);
}
/*header.fixed {
    position: fixed;
    top: 0;
    border-bottom: 3px solid #fff;
    box-shadow: 0 10px 10px rgb(0 0 0 / 15%);
}*/

header.fixed:after {
    visibility: visible;
    opacity: 1;
}

header.fixed .scroll_indicator {
    display: block;
}

header.fixed .article_list {
    padding-top: 54px;
}

.blind {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 50;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.75);
}

header .sch_layer .dtl .dtl_sch_post .post .box.control {
    padding: 2px 10px;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control ul {
}

header .sch_layer .dtl .dtl_sch_post .post .box.control ul > li {
    padding: 3px 0;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control ul > li > div {
    padding: 15px 33px 15px 0;
    background: #fff;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control > ul > li ~ li {
    border-top: 1px solid #e4e4e4;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control ul > li > ul {
    padding: 0 0 12px;
    display: none;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control ul > li.active > ul {
    display: grid !important;
    grid-template-columns: repeat(2,1fr);
    gap: 8px;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control ul > li > ul > li {
    padding: 3px 0 3px 12px;
    border: none;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control .sbtn {
    width: 20px;
    height: 20px;
    position: absolute;
    right: 7px;
    top: 17px;
    background: #fff;
    z-index: 2;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control .sbtn span:before {
    content: "\e941";
    font-family: 'xeicon' !important;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    color: #2D2D2D;
    transform: translate(-50%, -50%);
}

header .sch_layer .dtl .dtl_sch_post .post .box.control .sbtn i {
    position: absolute;
    top: 50%;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    border: 0;
}

header .sch_layer .dtl .dtl_sch_post .post .box.control .sbtn.close span:before {
    transform: translate(-50%, -50%) rotate(0.5turn);
}

/* ========== footer ========== */
footer {
    position: relative;
    padding: 0 16px 40px !important;
    background-color: #F3F3F6;
    z-index: 10;
}

footer.on {
    z-index: 14;
}

footer .foot_nav {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
}

footer .foot_nav li {
    position: relative;
}

footer .foot_nav li:not(:last-child):after {
    content: "";
    display: block;
    position: absolute;
    right: -8px;
    top: 5px;
    width: 1px;
    height: 12px;
    background: #C6C6C6;
}

footer .foot_nav li a {
    font-size: 14px;
    font-weight: 500;
    color: #2D2D2D;
}

footer .foot_nav li:first-child a {
    color: #D41115;
}

footer address {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    font-size: 13px;
    margin-top: 30px;
    color: #555;
    flex-direction:column;
}

footer address b {
    color: #2D2D2D;
    font-weight: 700;
}
footer address span{display:block;}
footer address span i {
	display:block;
    vertical-align: middle;
    margin-top:3px;
}

footer .control {
    display: flex;
    margin-top: 20px;
}

footer .control button {
    width: 50%;
    padding: 10px;
    font-size: 14px;
}

footer .control .pc {
    color: #fff;
    border-radius: 5px;
    width: 100%;
    background-color: #262a2d;
    border: 1px solid #262a2d;
}

footer .control .quick {
    position: fixed;
    right: 16px;
    bottom: 40px;
}

footer .control .quick.audio_top {
    bottom:100px;
}

footer .control .ft_share.active::before {
    content: "";
    display: block;
    position: fixed;
    left: 50%;
    top: 50%;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.2);
    transform: translate(-50%, -50%);
    z-index: 99;
}

footer .control .ft_share .sh_btn {
    position: relative;
    border: 1px solid #E2E2E7;
    color: #2d2d2d;
    border-radius: 43px;
    width: 40px;
    height: 40px;
    text-align: center;
    display: block;
    background-color: #fff;
    transition: all 0.3s;
    font-size: 17px;
    box-shadow: 0 5px 10px rgba(0,0,0,0.15);
    z-index: 100;
}

footer .control .ft_share .sh_btn::after {
    content: "\e9ea";
    font-family: 'xeicon';
    line-height: 1;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font-weight: normal;
}

footer .control .ft_share .layer {
    position: fixed;
    left: 50%;
    top: 50%;
    width: calc(100% - 60px);
    border: 1px solid #dee2e6;
    border-radius: 12px;
    background-color: #fff;
    padding: 20px 20px 32px;
    box-shadow: 0px 0px 10px rgb(5 5 6 / 8%);
    transform: translate(-50%,-50%);
    z-index: 100;
    display: none;
}

footer .control .ft_share.active .layer {
    display: block;
}

footer .control .ft_share .layer b {
    font-size: 15px;
    letter-spacing: -0.02em;
    color: #1D1D1D;
    font-weight: 500;
    display: block;
}

footer .control .ft_share .layer ul:after {
    content: "";
    clear: both;
    display: table;
}

footer .control .ft_share .layer ul li {
    float: left;
    width: calc(100% / 3);
    padding: 20px 0 0;
    margin: 0;
}

footer .control .ft_share .layer ul li button {
    width: 100%;
    padding: 0;
    vertical-align: top;
}

footer .control .ft_share .layer ul li button:before {
    content: '';
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-bottom: 8px;
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

footer .control .ft_share .layer ul li button span {
    display: block;
    width: 100%;
    font-size: 12px;
    font-weight: 500;
    color: #555;
}

footer .control .ft_share .layer ul li button.fb:before {
    background-image: url("../images/v3/sns_icon_fb.svg");
}

footer .control .ft_share .layer ul li button.tw:before {
    background-image: url("../images/v3/sns_icon_tw.svg")
}

footer .control .ft_share .layer ul li button.bd:before {
    background-image: url("../images/v3/sns_icon_bd.svg")
}

footer .control .ft_share .layer ul li button.kt:before {
    background-image: url("../images/v3/sns_icon_kkc.svg")
}

footer .control .ft_share .layer ul li button.ks:before {
    background-image: url("../images/v3/sns_icon_bmk.svg");
}

footer .control .ft_share .layer ul li button.uc:before {
    background-image: url("../images/v3/sns_icon_copy.svg")
}

footer .control .ft_share .layer .close {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 24px;
    height: 24px;
    padding: 0;
    line-height: 1;
}

footer .control .ft_share .layer .close:before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url("../images/common/ico_tool@x1.svg");
    background-size: auto 20px;
    background-repeat: no-repeat;
    background-position: -169px 0;
}

footer .control .top {
    position: relative;
    bottom: 0 !important;
    border-left: none;
    border: 1px solid #313238;
    color: #fff;
    border-radius: 43px;
    width: 40px;
    height: 40px;
    text-align: center;
    display: block;
    background-color: #313238;
    transition: all 0.3s;
    font-size: 17px;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 5px 10px rgba(0,0,0,0.15);
    z-index: 100;
}

footer .control .top:after {
    content: "\e915";
    font-family: "xeicon";
    line-height: 1;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font-weight: normal;
}

footer .control .top span {
    position: absolute;
    top: 50%;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    border: 0;
}

footer .control .top.active {
    opacity: 1;
    visibility: visible;
    margin-top: 12px;
}

footer .foot_notice {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 32px;
    border-bottom: 1px solid #D8D8D8;
}

footer .foot_notice h3 {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 700;
}

footer .foot_notice .desc {
    width: calc(100% - 50px);
    position: relative;
    padding: 14.25px 0;
    color: #2D2D2D;
    font-size: 14px;
}

footer .foot_notice .desc a {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

footer .foot_notice .desc a:after {
    content: "\e93e";
    position: absolute;
    right: -15px;
    top: 50%;
    font-family: "xeicon";
    transform: translateY(-50%);
}

footer .link {
    margin-top: 32px;
}

footer .related_link {
    position: relative;
}

footer .related_link .rel_btn {
    display: block;
    position: relative;
    width: 100%;
    padding: 11.5px 42px 11.5px 12px;
    border-radius: 4px;
    background-color: #E7E7EA;
    color: #2D2D2D;
    font-size: 14px;
    text-align: start;
}

footer .related_link .rel_btn::after {
    content: "\e944";
    position: absolute;
    right: 12px;
    top: 50%;
    font-family: "xeicon";
    transform: translateY(-50%);
}

footer .related_link .rel_btn.active::after {
    transform: translateY(-50%) rotate(0.5turn);
}

footer .related_link .rel_btn.active {
    border-radius: 0 0 4px 4px;
    border-top: 1px solid #eee;
}

footer .related_link .rel_btn.active + .lst {
    display: block;
}

footer .related_link .lst {
    display: none;
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 100%;
    border: 1px solid #E7E7EA;
    background: #E7E7EA;
    z-index: 10;
}

footer .related_link .lst > li {
    border-top: 1px solid #eee;
}

footer .related_link .lst > li a {
	display:block;
    font-size: 14px;
    padding: 8px 12px;
}

footer .related_link .lst > li a:hover, footer .related_link .lst > li a:focus {
    background-color: #fff;
}

footer .link_bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 4px;
    margin-top: 32px;
}

footer .link_bottom .sns {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    position: relative;
}

footer .link_bottom .sns a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
    background-color: #fff;
    transition: all .3s;
}

footer .link_bottom .sns a span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}

footer .link_bottom .sns a:hover, footer .link_bottom .sns a:focus {
    border-color: #1d1d1d;
}

footer .link_bottom .sns a:after {
    content: '';
    display: inline-block;
    width: 26px;
    height: 24px;
    background-image:url(../images/common/sns_icon_out.svg);
    background-size:130px 26px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

footer .link_bottom .sns a.fb:after {
	background-position:0 -1px;
    /*background-image: url("../images/v3/icon_sns_fb.svg")*/
}

footer .link_bottom .sns a.tw:after {
	background-position:-26px -1px;
    /*background-image: url("../images/v3/icon_sns_tw.svg")*/
}

footer .link_bottom .sns a.nv:after {
	background-position:-52px 1px;
    /*background-image: url("../images/v3/icon_sns_nbg.svg")*/
}

footer .link_bottom .sns a.ut:after {
	background-position:-78px 1px;
    /*background-image: url("../images/v3/icon_sns_yt.svg")*/
}

footer .link_bottom .sns a.is:after {
	background-position:-104px -1px;
    /*background-image: url("../images/v3/icon_sns_ig.svg")*/
}

footer .ministry {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    margin-bottom: 0;
    padding: 11.5px 35px 11.5px 12px;
    border: 1px solid #e4e4e4;
    border-radius: 30px;
    background: #fff;
    color: #2d2d2d;
    font-size: 14px;
    font-weight: 500;
}

footer .ministry::before {
    display: none;
}

footer .ministry::after {
    content: "\e93e";
    position: absolute;
    top: 50%;
    right: 12px;
    font-size: 14px;
    font-weight: 600;
    font-family: "xeicon";
    transform: translateY(-50%);
}

/* ========== sub head ========== */
.sub_page_titles {
    position: relative;
}

.title_sel {
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.title_sel .swiper-wrapper {
}

.title_sel .swiper-slide {
    height: auto;
    margin-top: 4px;
    border-radius: 8px;
    color: #1D1D1D;
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: -0.02em;
}

.title_sel .swiper-slide:not(.active) {
    background: #fff;
}

.title_sel .swiper-slide.active {
    background: #FEF2F2;
    color: #D41115;
}

.title_sel .swiper-slide a {
	width:100%;
    padding: 8px;
}

/*
.title_sel .swiper-slide.active {position:absolute; top:0; left:0; height:auto; background:rgba(0,0,0,0); color:#fff; font-size:28px; line-height:32px; font-weight:700;}
.title_sel .swiper-slide.active a::after {content:"\e941"; display:inline-block; vertical-align: middle; position:relative; top:-2px; margin-left:8px; font-family: "xeicon"; font-size:20px; transition: all .3s;}
.title_sel.on .swiper-slide:not(.active) {display:block;}
.title_sel.on .swiper-slide.active a::after {transform: rotate(0.5turn);}
*/
.depth_title {
    position: relative;
    width: 100%;
    padding: 0 16px;
    color: #fff;
    font-size: 28px;
    font-weight: 700;
    text-align: center;
    line-height: 1.4;
    letter-spacing: -0.02em;
    z-index: 1;
}

.depth_title.down_arr::after {
    content: "\e941";
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -2px;
    margin-left: 8px;
    font-family: "xeicon";
    font-size: 20px;
    transition: all .3s;
}

.sub_page_titles::after {
    content: "";
    position: absolute;
    top: -20px;
    left: 50%;
    width: 100%;
    height: 0;
    background: rgba(0,0,0,0.3);
    transform: translateX(-50%);
}

.sub_page_titles.on::after {
    height: 10000%;
}

.sub_page_titles.on .title_hidden_chk {
    display: block
}

.title_hidden_chk {
    position: absolute;
    display: none;
    top: -20px;
    left: 50%;
    width: calc(100% + 1px);
    padding: 24px 36px;
    border-radius: 0 0 16px 16px;
    background: #fff;
    transform: translateX(-50%);
    z-index: 5;
}

.title_hidden_chk .page_title {
    margin-bottom: 16px;
    color: #1d1d1d;
    font-size: 18px;
    text-align: start;
}

.area_nav .title_hidden_chk .page_title {
    color: #1d1d1d;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    text-align: start;
}

.title_hidden_chk .close_btn {
    position: absolute;
    top: 24px;
    right: 32px;
    color:#1d1d1d;
    -webkit-appearance:none;
}

.title_hidden_chk .close_btn::before {
    content: "\e921";
    font-family: 'xeicon';
    font-size: 22px;
}

.area_nav {
    position: relative;
    width: 100%;
    padding: 20px 0;
    z-index: 3;
    background: linear-gradient(to left, rgb(0, 24, 69) 0%, rgb(0, 32, 92) 100%);
    color: #fff;
    /*border-bottom: 1px solid #e9e9e9;*/
}

.area_nav::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: -4px;
    width: 126px;
    height: 120px;
    max-height: 100%;
    background: url("../images/v3/sub_page_title_bg.png") no-repeat 50% 50% / cover;
    transform: translateX(-50%);
}

.area_nav .page_title {
    margin-bottom: 8px;
    color: #fff;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -0.2px;
    text-align: center;
}

.area_nav .sub_nav {
    position: relative;
    /*width: calc(100% - 88px);*/
    max-width: 1024px;
    margin: 8px auto 0;
    z-index: 2;
    overflow: hidden;
    padding: 0 44px;
}

.area_nav .sub_nav::after, .area_nav .sub_nav::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 40px;
    right: 0;
    height: 100%;
    z-index: 10;
}
.area_nav .sub_nav::after {
    right: 0;
    left:auto;
    background:linear-gradient(45deg, rgba(0, 0, 0, 0), rgba(0,25,71,0.5), #001947);
}
.area_nav .sub_nav::before {
    right: auto;
    left: 0;
    background: linear-gradient(270deg, rgba(0, 0, 0, 0), rgba(0,25,71,0.5), #001947);
}

.area_nav .sub_nav ul {
    display: table;
    width: auto;
    margin: 0 auto;
    position: relative;
    white-space: nowrap;
}

.area_nav .sub_nav ul li {
    position: relative;
    display: table-cell;
    width: auto !important;
}

.area_nav .sub_nav ul li a {
    position: relative;
    display: block;
    padding: 4px 0;
    margin: 0 10px;
    border: 1.5px solid rgba(255,255,255,0);
    border-radius: 60px;
    background: rgba(255,255,255,0);
    font-size: 15px;
    color: #fff;
    line-height: 24px;
}

/*.area_nav .sub_nav ul li.active a, .area_nav .sub_nav ul li.swiper-slide-active a {
    padding: 4px 16px;
    border-color: rgba(255,255,255,0.3);
    background: rgba(255,255,255,0.1);
    font-weight: 800;
}*/

.area_nav .sub_nav ul li.active a{
    padding: 4px 16px;
    border-color: rgba(255,255,255,0.3);
    background: rgba(255,255,255,0.1);
    font-weight: 800;
}

.area_contents {
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    background-color: #fff;
    /* overflow: hidden; touch-action:none;*/
	overflow: visible !important;
	z-index: 2;
}

.area_contents:after {
    content: "";
    clear: both;
    display: table;
}

.h2_page_tit {
    padding: 20px 16px 0;
    margin-bottom: 20px;
    color: #1d1d1d;
    font-size: 24px;
    line-height: 1.4;
}

/* ========== area page ========== */
.area_page {
    width: 100%;
    margin-bottom:16px;
}

#article_newsLetter .area_page{width:calc(100% - 32px);margin-left:16px}

.area_page a {
    position: relative;
    display: flex;
    gap: 8px;
    margin-top: 16px;
    font-weight: 400;
    width: 100%;
    padding: 12px;
    border: 1px solid #E4E4E4;
    background: #F6F6F8;
}

.area_page a span {
    font-size: 14px;
    color: #1D1D1D;
    font-weight: 600;
    display: inline-block;
    line-height: 1.4;
    letter-spacing: -0.02em;
}

.area_page a strong {
    display: block;
    max-width: calc(100% - 38px);
    font-size: 14px;
    font-weight: 400;
    color: #2D2D2D;
    line-height: 1.4;
    letter-spacing: -0.02em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ========== area banner ========== */
.area_banner {
    position: relative;
    width: 100%;
    z-index: 1;
    text-align: center;
}

.area_banner .container {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
}

.area_banner.actually {
    background-color: #6248d3;
}

.area_banner.actually .container {
    padding: 20px 20px 20px 20px;
}

.area_banner.actually h3 {
    margin-bottom: 10px;
}

.area_banner.actually h3 a {
    width: 148px;
    height: 14px;
    background: url("../images/sub/area_banner_actually_tit.png") 0 0/contain no-repeat;
    color: transparent;
    display: inline-block;
    margin: 0 auto;
}

.area_banner.actually h3 a span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    border: 0;
}

.area_banner.actually a {
    display: block;
}

.area_banner.actually a strong {
    font-weight: 500;
    color: #fff;
    font-size: 0.875rem;
    letter-spacing: -0.025em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-break: keep-all;
    word-wrap: break-word;
    display: block;
}

.area_banner.slider .container {
    max-width: 1024px;
    background-color: #fff;
}

.area_banner.slider .slick-track {
    display: flex !important;
}

.area_banner.slider .slick-slide {
    height: inherit !important;
}

.area_banner.slider .slick-slide > div {
    font-size: 0;
    height: 100%;
    background: red;
}

.area_banner.slider .slick-slide > div > div {
    height: inherit;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.area_banner.slider .actually {
    background-color: #6248d3;
    padding: 20px;
}

.area_banner.slider .actually h3 {
    margin-bottom: 10px;
}

.area_banner.slider .actually h3 a {
    width: 148px;
    height: 14px;
    background: url("../images/sub/area_banner_actually_tit.png") 0 0/contain no-repeat;
    color: transparent;
    display: inline-block;
    margin: 0 auto;
}

.area_banner.slider .actually h3 a span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    border: 0;
}

.area_banner.slider .actually a {
    display: block;
    width: 100%;
}

.area_banner.slider .actually a strong {
    font-weight: 500;
    color: #fff;
    font-size: 0.875rem;
    letter-spacing: -0.025em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-break: keep-all;
    word-wrap: break-word;
    display: block;
}

.area_banner.slider .control {
    display: flex;
    justify-content: center;
}

.area_banner.slider .control .slick-dots {
    position: relative;
    display: flex;
}

.area_banner.slider .control .slick-dots li button {
    position: relative;
    width: 20px;
    height: 32px;
    background: none;
    opacity: 1;
    border-radius: 2px;
    font-size: 0;
}

.area_banner.slider .control .slick-dots li button:before {
    content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: #cbcbcb;
    width: 10px;
    height: 10px;
    box-sizing: border-box;
    font-size: 0;
    line-height: 0;
    border-radius: 10px;
    transition: all 0.3s;
    opacity: 1;
}

.area_banner.slider .control .slick-dots li.slick-active button:before {
    background-color: #ed1f23;
    width: 20px;
}

.area_banner.slider .control .playing {
    position: relative;
    width: 20px;
    height: 32px;
    margin-right: -10px;
    font-size: 0;
}

.area_banner.slider .control .playing:before {
    font-family: 'xeicon';
    display: inline-block;
    font-size: 15px;
    transition: all 0.3s ease-in-out;
    color: #676767;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.area_banner.slider .control .playing.pause:before {
    content: '\ea3b'
}

.area_banner.slider .control .playing.play:before {
    content: '\ea3e'
}

.area_banner_choice {
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: center;
    flex-direction: column;
    /*padding: 0 15px;*/
}

.area_banner_choice + .area_banner_choice{margin-top:10px}

.area_banner_choice a {
    display: block;
    width: 100%;
    text-align: center;
}

.area_banner_choice img {
    max-height: 100px;
}

.area_banner_choice + .area_tab {
    padding: 25px 0 15px 0;
}

/* ========== area news like ========== */
.area_newsremd {
    padding: 40px 16px 15px;
    overflow: hidden;
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
}

.area_newsremd h2 {
    position: relative;
    max-width: 1024px;
    margin: 0 auto;
    font-size: 18px;
    font-weight: 700;
    color: #1D1D1D;
    letter-spacing: -0.02em;
}

.area_newsremd .container {
    max-width: 1024px;
    margin: 0 auto;
}

.area_newsremd .slider {
    margin: 0 auto;
}

.area_newsremd .slick-list {
    margin: 0 -7.5px;
    overflow: visible;
}

.area_newsremd .box {
    display: flex !important;
    flex-wrap: wrap;
    align-content: flex-start;
}

.area_newsremd a {
    position: relative;
    display: inline-block;
    width: calc(100% / 2);
    padding: 8px 7.5px;
    margin-top: 15px;
}

.area_newsremd a .thumb {
    position: relative;
    width: 100%;
    padding-bottom: 56.21621621622%;
    overflow: hidden;
    margin-bottom: 15px;
}

.area_newsremd a .thumb img {
    object-fit: cover;
    object-position: center;
}

.area_newsremd a .sort {
    position: absolute;
    left: 7.5px;
    top: 8px;
    font-size: 11px;
    color: #fff;
    background-color: rgba(0,0,0,0.7);
    padding: 9px 10px;
    line-height: 1;
    z-index: 2;
}

.area_newsremd a .sort:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 100%;
    background: #ed1f23;
    transition: width 0.3s
}

.area_newsremd a .sort > span {
    position: relative;
    z-index: 2;
}

.area_newsremd a .sort .xe-icon {
    position: relative;
    z-index: 2;
}

.area_newsremd a .sort .xe-icon:before {
    content: '\e93f';
}

.area_newsremd a.gonggam .sort:after {
    width: 100%;
    background-color: #eb5f36;
}

.area_newsremd a.video .thumb:before {
    content: '\ea3f';
    font-family: "xeicon";
    font-size: 50px;
    color: #fff;
    line-height: 1;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

.area_newsremd a:hover .sort:after {
    width: 100%;
}

.area_newsremd a .text {
    display: block;
}

.area_newsremd a .text strong {
    display: block;
    font-size: 15px;
    color: #212529;
    line-height: 1.375rem;
    font-weight: 400;
    max-height: 45px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

.area_newsremd a .text span {
    display: none;
    font-size: 15px;
    line-height: 1.313rem;
    font-weight: 300;
    margin-top: 10px;
    max-height: 42px;
    overflow: hidden;
}

.area_newsremd .slick-dots {
    text-align: center;
}

.area_newsremd .slick-dots li {
    display: inline-block;
    margin: 0 5px;
    height: 12px;
}

.area_newsremd .slick-dots li button {
    background-color: #c2c2c2;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    text-indent: -9999px;
    color: transparent;
}

.area_newsremd .slick-dots li.slick-active button {
    background-color: #ed1f23;
}

@media (min-width: 769px) {
    .area_newsremd a {
        width: calc(100% / 4);
    }

    .area_newsremd .slider {
        max-width: 1024px;
    }

    .area_newsremd .slick-list {
        overflow: hidden;
    }
}

.area_tab {
    padding: 15px 0 0;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
}

.area_tab .article ~ .article {
    margin-top: 30px;
}

.area_tab .article .tab {
    position: relative;
    padding-top: 35px;
    width: 100%;
}

.area_tab .article .tab:after {
    content: "";
    clear: both;
    display: table;
}

.area_tab .article .tab li {
    width: 100%;
}

.area_tab .article .tab li > button {
    background-color: #f0f0f0;
    color: #888;
    width: 50%;
    position: absolute;
    left: 0;
    top: 0;
    height: 35px;
    font-weight: 500;
    transition: all 0.3s ease-out;
}

.area_tab .article .tab li:nth-child(2) > button {
    left: 50%;
}

.area_tab .article .tab li > .cont {
    display: none;
}

.area_tab .article .tab li.active > button {
    border: 1px solid #ed1f23;
    background-color: #fff;
    color: #ed1f23;
}

.area_tab .article .tab li.active > .cont {
    display: block;
}

.area_tab .article .tab .more {
    display: block;
    text-align: right;
    font-size: 14px;
}

.area_tab .article .tab .more a {
    padding: 10px;
    color: #707070;
}

.area_tab .article .tab .more a .xe-icon:before {
    content: '\e93e';
}

.area_tab .article .tab .lst {
    counter-reset: list-number;
    margin-top: 4px;
}

.area_tab .article .tab .lst li {
    border-bottom: 1px solid #dee2e6;
}

.area_tab .article .tab .lst li a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    padding: 12px 0;
    flex-direction: row-reverse;
}

.area_tab .article .tab .lst li .thumb {
    width: 80px;
    height: 50px;
    padding-bottom: 0;
}

.area_tab .article .tab .lst li .text {
    width: 100%;
}

.area_tab .article .tab .lst li .text span {
    position: relative;
    display: block;
    max-height: 40px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

.area_tab .article .tab .lst li .thumb + .text {
    width: calc(100% - 80px);
    padding-right: 10px;
}

.area_tab .article .tab .lst.num {
    counter-reset: list-number;
}

.area_tab .article .tab .lst.num li .text span {
    padding-left: 15px;
}

.area_tab .article .tab .lst.num li .text span:before {
    counter-increment : list-number;
    content : counter(list-number);
    position: absolute;
    left: 0;
    top: 0;
    color: #ed1f23;
}

.area_tab .article .tab .lst.num li:nth-child(3) ~ li .text span:before {
    color: #333;
}

.area_tab .article .tab .photo, .area_tab .article .tab .media {
    margin-top: 18px;
}

.area_tab .article .tab .photo li a, .area_tab .article .tab .media li a {
    position: relative;
    display: block;
}

.area_tab .article .tab .photo li a:before, .area_tab .article .tab .media li a:before {
    content: '';
    display: block;
    width: 100%;
    height: 100px;
    background: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
}

.area_tab .article .tab .photo li .thumb, .area_tab .article .tab .media li .thumb {
    width: 100%;
    padding-bottom: 63.40579710145%;
}

.area_tab .article .tab .photo li .text, .area_tab .article .tab .media li .text {
    position: absolute;
    bottom: 0;
    z-index: 2;
    color: #fff;
    padding: 20px;
    width: 100%;
}

.area_tab .article .tab .photo li .text span, .area_tab .article .tab .media li .text span {
    position: relative;
    display: block;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

.area_tab .article .tab_nav {
    display: flex;
    position: relative;
    width: 100%;
    padding: 0 16px;
}

.area_tab .article .tab_nav > div {
    flex: 1;
}

.area_tab .article .tab_nav .slick-track {
    width: 100% !important;
    display: flex;
    flex-wrap: nowrap;
}

.area_tab .article .tab_nav .slick-slide {
    width: 50% !important;
}

.area_tab .article .tab_nav button {
    background-color: #F3F3F6;
    border: 1px solid #E4E4E4;
    color: #555;
    width: 100%;
    height: 36px;
    font-weight: 500;
    font-size: 14px;
    transition: all 0.3s ease-out;
}

.area_tab .article .tab_nav .slick-current button {
    border: 1px solid #555;
    background-color: #fff;
    color: #1D1D1D;
}

.area_tab .article .tab_for .slick-slide {
    margin: 0 16px;
}

.area_tab .article .tab_for .lst {
    counter-reset: list-number;
    margin-top: 4px;
}

.area_tab .article .tab_for .lst li {
    border-bottom: 1px solid #dee2e6;
}

.area_tab .article .tab_for .lst li a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    padding: 12px 0;
    flex-direction: row-reverse;
}

.area_tab .article .tab_for .lst li .thumb {
    width: 90px;
    height: 55px;
    padding-bottom: 0;
}

.area_tab .article .tab_for .lst li .text {
    width: 100%;
}

.area_tab .article .tab_for .lst li .text span {
    position: relative;
    display: block;
    max-height: 60px;
    font-size: 15px;
    font-weight:700;
    line-height: 1.4;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    color:#1d1d1d;
}

.area_tab .article .tab_for .lst li .thumb + .text {
    width: calc(100% - 90px);
    padding-right: 10px;
}

.area_tab .article .tab_for .lst.num {
    counter-reset: list-number;
}

.area_tab .article .tab_for .lst.num li:nth-child(5) ~ li {
    display:none;
}

.area_tab .article .tab_for .more {
    display: block;
    text-align: right;
    font-size: 14px;
}

.area_tab .article .tab_for .more a {
    padding: 10px;
    color: #707070;
}

.area_tab .article .tab_for .more a .xe-icon:before {
    content: '\e93e';
}

.area_tab .article .tab_for .photo, .area_tab .article .tab_for .media {
    margin-top: 18px;
}

.area_tab .article .tab_for .photo li a, .area_tab .article .tab_for .media li a {
    position: relative;
    display: block;
}

.area_tab .article .tab_for .photo li .thumb, .area_tab .article .tab_for .media li .thumb {
    width: 100%;
    padding-bottom: 63.40579710145%;
}

.area_tab .article .tab_for .photo li .thumb:after, .area_tab .article .tab_for .media li .thumb:after {
    content: '';
    display: block;
    width: 100%;
    height: 100px;
    background: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
}

.area_tab .article .tab_for .photo li .text, .area_tab .article .tab_for .media li .text {
    position: absolute;
    bottom: 0;
    z-index: 2;
    color: #fff;
    padding: 20px;
    width: 100%;
}

.area_tab .article .tab_for .photo li .text span, .area_tab .article .tab_for .media li .text span {
    position: relative;
    display: block;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

.area_tab .article .tab_for .media li .thumb:before {
    content: '';
    content: "\ea3f";
    font-family: "xeicon";
    font-size: 50px;
    position: absolute;
    left: 50%;
    top: 40%;
    z-index: 2;
    color: #fff;
    transform: translate(-50%, -50%);
    text-shadow: 3px 3px 7px rgba(0, 0, 0, 0.28)
}
.bott_colum .article{position:relative}

.bott_colum .lst {
    margin-top: 4px;
}

.bott_colum .lst li {
    border-bottom: 1px solid #dee2e6;
}

.bott_colum .lst li a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    padding: 12px 0;
    flex-direction: row-reverse;
}

.bott_colum .lst li .thumb {
    width: 90px;
    height: 55px;
    padding-bottom: 0;
}

.bott_colum .lst li .text {
    width: 100%;
}

.bott_colum .lst li .text span {
    position: relative;
    display: block;
    max-height: 60px;
    font-size: 15px;
    font-weight:700;
    line-height: 1.4;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    color:#1d1d1d;
}

.bott_colum .lst li .thumb + .text {
    width: calc(100% - 90px);
    padding-right: 10px;
}

@media (min-width: 769px) {
    .area_tab {
        display: flex !important;
        flex-wrap: wrap;
        align-content: flex-start;
        max-width: 1024px;
    }

    .area_tab .article {
        width: 100%;
    }

    .area_tab .article .tab_for .photo li a, .area_tab .article .tab_for .media li a {
        max-width: 50%;
        margin: 0 auto;
    }
}

/* 댓글 */
.view_cont .livere_comment {
    padding:14px 0 30px;
}

.livere_comment {
    padding: 30px 16px;
    width: 100%;
    text-align: center;
    background-color: #fff;
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 2;
}

.livere_comment button {
    position: relative;
    width: 100%;
    border: 1px solid #AAAAAA;
    color: #2D2D2D;
    font-weight: 500;
    font-size: 15px;
    padding: 8px 30px;
}

.livere_comment button span {
    position: relative;
    display: inline-block;
    line-height: 1;
}

.livere_comment button span:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    margin-right: 4px;
    background: url('../images/v3/icon_view_tool.png');
    background-size: auto 24px;
    background-position: 119px 0;
}

/* .livere_comment button span:after { font-family: "xeicon"; content: '\e941'; font-size: 13px; color: #212529; line-height: 1; position: absolute; right: -20px; top: 50%; transform: translateY(-50%); font-weight: bold;} */
.livere_comment button em {
    color: #ED1F23;
    font-size: 12px;
    font-weight: 500;
    display: inline-block;
    vertical-align: middle;
}

/*.livere_comment button i {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    padding: 0;
    margin: -1px;
    border: 0;
}
.livere_comment.close button span:after {content: '\e944';} */
.livere_box {
    position: relative;
    min-height: 319px;
    padding: 15px;
    position: relative;
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    display: none;
    margin-top: -35px;
}

.livere_box .open {
    display: block;
    line-height: 0;
    position: absolute;
    right: 20px;
    z-index: 2;
    font-size: 13px;
    display: inline-block;
    line-height: 20px;
    height: 20px;
    color: #757575;
    padding-right: 13px;
}

.livere_box .open span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    padding: 0;
    margin: -1px;
    border: 0;
}

.livere_box .open:after {
    content: '';
    display: inline-block;
    content: '\e9ac';
    font-family: 'xeicon';
    font-size: 22px;
    color: #757575;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.livere_box .open i {
    position: absolute;
    left: -10000%;
    top: 0;
    overflow: hidden;
    width: 0;
    height: 0;
    font-size: 0;
    line-height: 0;
    text-indent: -10000px;
}

.livere_box .livere_info {
    display: none;
    position: absolute;
    left: 20px;
    top: 35px;
    right: 20px;
    z-index: 2;
    border: 1px solid #adb5bd;
    background: #f9fafc;
}

.livere_box .livere_info.on {
    display: block;
}

.livere_box .livere_info p {
    font-size: 15px;
    color: #000;
    background: #e9ecef;
    padding: 10px 30px 10px 10px;
    font-weight: 400;
    border-bottom: 1px solid #adb5bd;
}

.livere_box .livere_info ul {
    padding: 10px;
}

.livere_box .livere_info ul li {
    padding: 3px 0;
    font-size: 14px;
}

.livere_box .livere_info .close {
    position: absolute;
    top: 10px;
    right: 10px;
    display: block;
    width: 20px;
    height: 20px;
    background-color: #333;
    border-radius: 100%;
}

.livere_box .livere_info .close:before {
    content: '\e922';
    font-family: "xeicon";
    font-size: 16px;
    color: #fff;
    line-height: 1;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.livere_box .livere_info .close span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    padding: 0;
    margin: -1px;
    border: 0;
}
