@charset "UTF-8";
@import url("/static/font/NotoSans/notosans.css");
@import '../../font/line-awesome/css/line-awesome.css';
@import '../../font/font-awesome-4.7.0/css/font-awesome.min.css';
@import url("/static/font/NotoSans/notosans.css");
@import url("https://webfontworld.github.io/sunn/SUIT.css");
@import url("https://webfontworld.github.io/gmarket/GmarketSans.css");
*::before,
*::after,
* {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}

body {
margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
display: block;
}

audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline;
}

img {
max-width: 100%;
}

i {
font-style: normal;
}

audio:not([controls]) {
display: none;
height: 0;
}

[hidden],
template {
display: none;
}

a {
background-color: transparent;
text-decoration: none;
}

abbr[title] {
border-bottom: 1px dotted;
}

b,
strong {
font-weight: bold;
}

em {
font-style: normal;
}

dfn {
font-style: italic;
}

h1 {
margin: 0;
}

mark {
background: #ff0;
color: #000;
}

small {
font-size: 80%;
}

sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}

sup {
top: -0.5em;
}

sub {
bottom: -0.25em;
}

img {
border: 0;
}

svg:not(:root) {
overflow: hidden;
}

hr {
-webkit-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}

pre {
overflow: auto;
margin: 10px 0;
}

code,
kbd,
pre,
samp {
font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0;
}

button {
border: 0;
padding: 0;
overflow: visible;
background-color: transparent;
}

button,
select {
text-transform: none;
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
-webkit-appearance: button;
cursor: pointer;
}

button[disabled],
html input[disabled],
input[disabled] {
cursor: not-allowed;
}

input[readonly] {
cursor: not-allowed;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}

input {
line-height: normal;
}

input[type=checkbox],
input[type=radio] {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
height: auto;
}

input[type=search] {
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}

fieldset {
border: 0;
margin: 0;
padding: 0;
}

legend {
border: 0;
padding: 0;
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}

textarea {
overflow: auto;
}

optgroup {
font-weight: bold;
color: #000;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

caption {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}

td,
th {
padding: 0;
}

p {
margin: 0;
}

ul,
ol {
list-style-type: none;
padding: 0;
margin: 0;
}

dl {
margin: 0;
}

dd {
margin: 0;
}

label {
font-weight: normal;
cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
}

.sr-only,
.hidden,
#mobile-gnb .top-nav-right span,
.accessibility {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}

.hide {
display: none;
}

.clear {
clear: both;
}

.clearfix {
display: inline-block;
}

.clearfix {
display: block;
}

.clearfix:before,
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.skip a {
position: absolute;
top: 0;
left: 0;
width: 100%;
text-align: center;
z-index: 5000;
font-size: 1.3em;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}

.skip a:hover,
.skip a:focus,
.skip a:active {
padding: 15px 0;
font-weight: bold;
color: #fff;
background: #e4477a;
line-height: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}

.nobg {
background: none !important;
}

.fl {
float: left !important;
}

.fr {
float: right !important;
}

.tac {
text-align: center !important;
}

.tal {
text-align: left !important;
}

.tar {
text-align: right !important;
}

.jf {
text-align: justify !important;
}

.vt {
vertical-align: top !important;
}

.vm {
vertical-align: middle !important;
}

.vb {
vertical-align: bottom !important;
}

.oh {
overflow: hidden !important;
}

.dn {
display: none !important;
}

.db {
display: block !important;
}

.bn {
border: none !important;
}

.bdt_n {
border-top: none !important;
}

.bdb_n {
border-bottom: none !important;
}

.bdl_n {
border-left: none !important;
}

.bdr_n {
border-right: none !important;
}

.bgn {
background: none !important;
}

.fb {
font-weight: bold !important;
}

.posr {
position: relative !important;
}

.posa {
position: absolute !important;
}

.posf {
position: fixed !important;
}

.poss {
position: static !important;
}

.rel {
position: relative !important;
}

.fb {
font-weight: 500 !important;
}

/* margin */
.mt0 {
margin-top: 0px !important;
}

.mt5 {
margin-top: 5px !important;
}

.mt10 {
margin-top: 10px !important;
}

.mt15 {
margin-top: 15px !important;
}

.mt20 {
margin-top: 20px !important;
}

.mt25 {
margin-top: 25px !important;
}

.mt30 {
margin-top: 30px !important;
}

.mt35 {
margin-top: 35px !important;
}

.mt40 {
margin-top: 40px !important;
}

.mt45 {
margin-top: 45px !important;
}

.mt50 {
margin-top: 50px !important;
}

.mr0 {
margin-right: 0px !important;
}

.mr5 {
margin-right: 5px !important;
}

.mr10 {
margin-right: 10px !important;
}

.mr15 {
margin-right: 15px !important;
}

.mr20 {
margin-right: 20px !important;
}

.mr25 {
margin-right: 25px !important;
}

.mr30 {
margin-right: 30px !important;
}

.mr35 {
margin-right: 35px !important;
}

.mr40 {
margin-right: 40px !important;
}

.mr45 {
margin-right: 45px !important;
}

.mr50 {
margin-right: 50px !important;
}

.mb0 {
margin-bottom: 0px !important;
}

.mb5 {
margin-bottom: 5px !important;
}

.mb10 {
margin-bottom: 10px !important;
}

.mb15 {
margin-bottom: 15px !important;
}

.mb20 {
margin-bottom: 20px !important;
}

.mb25 {
margin-bottom: 25px !important;
}

.mb30 {
margin-bottom: 30px !important;
}

.mb35 {
margin-bottom: 35px !important;
}

.mb40 {
margin-bottom: 40px !important;
}

.mb45 {
margin-bottom: 45px !important;
}

.mb50 {
margin-bottom: 50px !important;
}

.ml0 {
margin-left: 0px !important;
}

.ml5 {
margin-left: 5px !important;
}

.ml10 {
margin-left: 10px !important;
}

.ml15 {
margin-left: 15px !important;
}

.ml20 {
margin-left: 20px !important;
}

.ml25 {
margin-left: 25px !important;
}

.ml30 {
margin-left: 30px !important;
}

.ml35 {
margin-left: 35px !important;
}

.ml40 {
margin-left: 40px !important;
}

.ml45 {
margin-left: 45px !important;
}

.ml50 {
margin-left: 50px !important;
}

/* padding */
.pt0 {
padding-top: 0px !important;
}

.pt5 {
padding-top: 5px !important;
}

.pt10 {
padding-top: 10px !important;
}

.pt15 {
padding-top: 15px !important;
}

.pt20 {
padding-top: 20px !important;
}

.pt25 {
padding-top: 25px !important;
}

.pt30 {
padding-top: 30px !important;
}

.pt35 {
padding-top: 35px !important;
}

.pt40 {
padding-top: 40px !important;
}

.pt45 {
padding-top: 45px !important;
}

.pt50 {
padding-top: 50px !important;
}

.pr0 {
padding-right: 0px !important;
}

.pr5 {
padding-right: 5px !important;
}

.pr10 {
padding-right: 10px !important;
}

.pr15 {
padding-right: 15px !important;
}

.pr20 {
padding-right: 20px !important;
}

.pr25 {
padding-right: 25px !important;
}

.pr30 {
padding-right: 30px !important;
}

.pr35 {
padding-right: 35px !important;
}

.pr40 {
padding-right: 40px !important;
}

.pr45 {
padding-right: 45px !important;
}

.pr50 {
padding-right: 50px !important;
}

.pb0 {
padding-bottom: 0px !important;
}

.pb5 {
padding-bottom: 5px !important;
}

.pb10 {
padding-bottom: 10px !important;
}

.pb15 {
padding-bottom: 15px !important;
}

.pb20 {
padding-bottom: 20px !important;
}

.pb25 {
padding-bottom: 25px !important;
}

.pb30 {
padding-bottom: 30px !important;
}

.pb35 {
padding-bottom: 35px !important;
}

.pb40 {
padding-bottom: 40px !important;
}

.pb45 {
padding-bottom: 45px !important;
}

.pb50 {
padding-bottom: 50px !important;
}

.pl0 {
padding-left: 0px !important;
}

.pl5 {
padding-left: 5px !important;
}

.pl10 {
padding-left: 10px !important;
}

.pl15 {
padding-left: 15px !important;
}

.pl20 {
padding-left: 20px !important;
}

.pl25 {
padding-left: 25px !important;
}

.pl30 {
padding-left: 30px !important;
}

.pl35 {
padding-left: 35px !important;
}

.pl40 {
padding-left: 40px !important;
}

.pl45 {
padding-left: 45px !important;
}

.pl50 {
padding-left: 50px !important;
}

.w1p {
width: 1%;
}

.w2p {
width: 2%;
}

.w3p {
width: 3%;
}

.w4p {
width: 4%;
}

.w5p {
width: 5%;
}

.w6p {
width: 6%;
}

.w7p {
width: 7%;
}

.w8p {
width: 8%;
}

.w9p {
width: 9%;
}

.w10p {
width: 10%;
}

.w11p {
width: 11%;
}

.w12p {
width: 12%;
}

.w13p {
width: 13%;
}

.w14p {
width: 14%;
}

.w15p {
width: 15%;
}

.w16p {
width: 16%;
}

.w17p {
width: 17%;
}

.w18p {
width: 18%;
}

.w19p {
width: 19%;
}

.w20p {
width: 20%;
}

.w21p {
width: 21%;
}

.w22p {
width: 22%;
}

.w23p {
width: 23%;
}

.w24p {
width: 24%;
}

.w25p {
width: 25%;
}

.w26p {
width: 26%;
}

.w27p {
width: 27%;
}

.w28p {
width: 28%;
}

.w29p {
width: 29%;
}

.w30p {
width: 30%;
}

.w31p {
width: 31%;
}

.w32p {
width: 32%;
}

.w33p {
width: 33%;
}

.w34p {
width: 34%;
}

.w35p {
width: 35%;
}

.w36p {
width: 36%;
}

.w37p {
width: 37%;
}

.w38p {
width: 38%;
}

.w39p {
width: 39%;
}

.w40p {
width: 40%;
}

.w41p {
width: 41%;
}

.w42p {
width: 42%;
}

.w43p {
width: 43%;
}

.w44p {
width: 44%;
}

.w45p {
width: 45%;
}

.w46p {
width: 46%;
}

.w47p {
width: 47%;
}

.w48p {
width: 48%;
}

.w49p {
width: 49%;
}

.w50p {
width: 50%;
}

.w51p {
width: 51%;
}

.w52p {
width: 52%;
}

.w53p {
width: 53%;
}

.w54p {
width: 54%;
}

.w55p {
width: 55%;
}

.w56p {
width: 56%;
}

.w57p {
width: 57%;
}

.w58p {
width: 58%;
}

.w59p {
width: 59%;
}

.w60p {
width: 60%;
}

.w61p {
width: 61%;
}

.w62p {
width: 62%;
}

.w63p {
width: 63%;
}

.w64p {
width: 64%;
}

.w65p {
width: 65%;
}

.w66p {
width: 66%;
}

.w67p {
width: 67%;
}

.w68p {
width: 68%;
}

.w69p {
width: 69%;
}

.w70p {
width: 70%;
}

.w71p {
width: 71%;
}

.w72p {
width: 72%;
}

.w73p {
width: 73%;
}

.w74p {
width: 74%;
}

.w75p {
width: 75%;
}

.w76p {
width: 76%;
}

.w77p {
width: 77%;
}

.w78p {
width: 78%;
}

.w79p {
width: 79%;
}

.w80p {
width: 80%;
}

.w81p {
width: 81%;
}

.w82p {
width: 82%;
}

.w83p {
width: 83%;
}

.w84p {
width: 84%;
}

.w85p {
width: 85%;
}

.w86p {
width: 86%;
}

.w87p {
width: 87%;
}

.w88p {
width: 88%;
}

.w89p {
width: 89%;
}

.w90p {
width: 90%;
}

.w91p {
width: 91%;
}

.w92p {
width: 92%;
}

.w93p {
width: 93%;
}

.w94p {
width: 94%;
}

.w95p {
width: 95%;
}

.w96p {
width: 96%;
}

.w97p {
width: 97%;
}

.w98p {
width: 98%;
}

.w99p {
width: 99%;
}

.w100p {
width: 100%;
}

/* 버튼 정렬 */
.btnSet {
margin: 10px 0;
text-align: right;
overflow: hidden;
position: relative;
}

.btnSet .c {
text-align: center;
}

.btnSet .c + .fr {
position: absolute;
right: 0;
top: 0;
}

.btnSet.c {
text-align: center;
}

.btnSet.l {
text-align: left;
}

.btnSet .fl {
width: 50%;
text-align: left;
}

.btnSet .tar {
text-align: right;
}

.line {
text-decoration: underline;
}

.dib {
display: inline-block !important;
}

.di {
display: inline !important;
}

.kakaomap_box {
width: 100%;
clear: both;
height: 360px;
}

.content-commingsoon {
height: 140px;
min-width: 96%;
max-width: 710px;
margin: 0 auto;
background: url(/static/commons/img/ready_ing.png) center 0 no-repeat;
background-size: 100%;
}

#sitebug a {
position: fixed;
z-index: 1000;
right: 10px;
top: calc(50% - 20px);
text-align: center;
width: 80px;
height: 80px;
background-color: #860053;
color: #fff;
border-radius: 50px;
white-space: normal;
word-break: break-all;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #fff;
font-weight: 300;
font-size: 15px;
}

.mobile-scroller-x {
position: relative;
height: 0;
display: block;
}
.mobile-scroller-x + .table.ovx {
margin-top: 0;
}
h2 + .mobile-scroller-x + .table.ovx {
margin-top: -20px;
}
@media screen and (max-width: 749px) {
.mobile-scroller-x {
margin-top: 30px;
width: 100%;
/* border:none;
padding-top: 20px;
background:#fff url('/static/portal/img/common/hand.png') 48% 0 no-repeat;
animation: tableScrollAni 4s infinite;
&::before{
	content:'';
	position: absolute;
	top: -1px;
	border-top: 1px solid #fff;
}
table{
	border-top: 2px solid $bdtopcolor;
} */
}
h2 + .mobile-scroller-x {
margin-top: 0;
}
.mobile-scroller-x::after {
content: "\f25a";
display: block;
position: absolute;
z-index: 1;
top: 0;
height: 20px;
font-family: "FontAwesome", "dotum", Helvetica, Arial, sans-serif;
-webkit-animation: tableScrollAni 4s infinite;
animation: tableScrollAni 4s infinite;
}
h2 + .mobile-scroller-x::after {
top: -9px;
}
}

@-webkit-keyframes tableScrollAni {
/* 0% {background-position:46% 0;}
50% {background-position:54% 0;}
100% {background-position:46% 0;} */
0% {
left: 46%;
opacity: 0.2;
}
50% {
left: 54%;
opacity: 1;
}
100% {
left: 46%;
opacity: 0.2;
}
}

@keyframes tableScrollAni {
/* 0% {background-position:46% 0;}
50% {background-position:54% 0;}
100% {background-position:46% 0;} */
0% {
left: 46%;
opacity: 0.2;
}
50% {
left: 54%;
opacity: 1;
}
100% {
left: 46%;
opacity: 0.2;
}
}
/* font style */
.fs-1 {
font-size: 1px;
}

.fs-2 {
font-size: 2px;
}

.fs-3 {
font-size: 3px;
}

.fs-4 {
font-size: 4px;
}

.fs-5 {
font-size: 5px;
}

.fs-6 {
font-size: 6px;
}

.fs-7 {
font-size: 7px;
}

.fs-8 {
font-size: 8px;
}

.fs-9 {
font-size: 9px;
}

.fs-10 {
font-size: 10px;
}

.fs-11 {
font-size: 11px;
}

.fs-12 {
font-size: 12px;
}

.fs-13 {
font-size: 13px;
}

.fs-14 {
font-size: 14px;
}

.fs-15 {
font-size: 15px;
}

.fs-16 {
font-size: 16px;
}

.fs-17 {
font-size: 17px;
}

.fs-18 {
font-size: 18px;
}

.fs-19 {
font-size: 19px;
}

.fs-20 {
font-size: 20px;
}

.fs-21 {
font-size: 21px;
}

.fs-22 {
font-size: 22px;
}

.fs-23 {
font-size: 23px;
}

.fs-24 {
font-size: 24px;
}

.fs-25 {
font-size: 25px;
}

.fs-26 {
font-size: 26px;
}

.fs-27 {
font-size: 27px;
}

.fs-28 {
font-size: 28px;
}

.fs-29 {
font-size: 29px;
}

.fs-30 {
font-size: 30px;
}

.fs-31 {
font-size: 31px;
}

.fs-32 {
font-size: 32px;
}

.fs-33 {
font-size: 33px;
}

.fs-34 {
font-size: 34px;
}

.fs-35 {
font-size: 35px;
}

.fs-36 {
font-size: 36px;
}

.fs-37 {
font-size: 37px;
}

.fs-38 {
font-size: 38px;
}

.fs-39 {
font-size: 39px;
}

.fs-40 {
font-size: 40px;
}

.fs-41 {
font-size: 41px;
}

.fs-42 {
font-size: 42px;
}

.fs-43 {
font-size: 43px;
}

.fs-44 {
font-size: 44px;
}

.fs-45 {
font-size: 45px;
}

.fw-heavy {
font-weight: 900;
}

.fw-light {
font-weight: 400;
}

.fw-etLight {
font-weight: 100;
}

.container {
margin-right: auto;
margin-left: auto;
padding-left: 10px;
padding-right: 10px;
}
.container:before, .container:after {
content: " ";
display: table;
}
.container:after {
clear: both;
}
@media (min-width: 740px) {
.container {
max-width: 740px;
}
}
@media (min-width: 992px) {
.container {
max-width: 960px;
}
}
@media (min-width: 1240px) {
.container {
max-width: 1220px;
}
}
@media (min-width: 1300px) {
.container {
max-width: 1292px;
}
}

.container-fluid {
margin-right: auto;
margin-left: auto;
padding-left: 10px;
padding-right: 10px;
}
.container-fluid:before, .container-fluid:after {
content: " ";
display: table;
}
.container-fluid:after {
clear: both;
}

.row {
margin-left: -10px;
margin-right: -10px;
}
.row:before, .row:after {
content: " ";
display: table;
}
.row:after {
clear: both;
}

@media (min-width: 740px) {
.row + .row {
margin-top: 6px;
}
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
position: relative;
min-height: 1px;
padding-left: 10px;
padding-right: 10px;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
float: left;
}

.col-xs-1 {
width: 8.3333333333%;
}

.col-xs-2 {
width: 16.6666666667%;
}

.col-xs-3 {
width: 25%;
}

.col-xs-4 {
width: 33.3333333333%;
}

.col-xs-5 {
width: 41.6666666667%;
}

.col-xs-6 {
width: 50%;
}

.col-xs-7 {
width: 58.3333333333%;
}

.col-xs-8 {
width: 66.6666666667%;
}

.col-xs-9 {
width: 75%;
}

.col-xs-10 {
width: 83.3333333333%;
}

.col-xs-11 {
width: 91.6666666667%;
}

.col-xs-12 {
width: 100%;
}

.col-xs-pull-0 {
right: auto;
}

.col-xs-pull-1 {
right: 8.3333333333%;
}

.col-xs-pull-2 {
right: 16.6666666667%;
}

.col-xs-pull-3 {
right: 25%;
}

.col-xs-pull-4 {
right: 33.3333333333%;
}

.col-xs-pull-5 {
right: 41.6666666667%;
}

.col-xs-pull-6 {
right: 50%;
}

.col-xs-pull-7 {
right: 58.3333333333%;
}

.col-xs-pull-8 {
right: 66.6666666667%;
}

.col-xs-pull-9 {
right: 75%;
}

.col-xs-pull-10 {
right: 83.3333333333%;
}

.col-xs-pull-11 {
right: 91.6666666667%;
}

.col-xs-pull-12 {
right: 100%;
}

.col-xs-push-0 {
left: auto;
}

.col-xs-push-1 {
left: 8.3333333333%;
}

.col-xs-push-2 {
left: 16.6666666667%;
}

.col-xs-push-3 {
left: 25%;
}

.col-xs-push-4 {
left: 33.3333333333%;
}

.col-xs-push-5 {
left: 41.6666666667%;
}

.col-xs-push-6 {
left: 50%;
}

.col-xs-push-7 {
left: 58.3333333333%;
}

.col-xs-push-8 {
left: 66.6666666667%;
}

.col-xs-push-9 {
left: 75%;
}

.col-xs-push-10 {
left: 83.3333333333%;
}

.col-xs-push-11 {
left: 91.6666666667%;
}

.col-xs-push-12 {
left: 100%;
}

.col-xs-offset-0 {
margin-left: 0%;
}

.col-xs-offset-1 {
margin-left: 8.3333333333%;
}

.col-xs-offset-2 {
margin-left: 16.6666666667%;
}

.col-xs-offset-3 {
margin-left: 25%;
}

.col-xs-offset-4 {
margin-left: 33.3333333333%;
}

.col-xs-offset-5 {
margin-left: 41.6666666667%;
}

.col-xs-offset-6 {
margin-left: 50%;
}

.col-xs-offset-7 {
margin-left: 58.3333333333%;
}

.col-xs-offset-8 {
margin-left: 66.6666666667%;
}

.col-xs-offset-9 {
margin-left: 75%;
}

.col-xs-offset-10 {
margin-left: 83.3333333333%;
}

.col-xs-offset-11 {
margin-left: 91.6666666667%;
}

.col-xs-offset-12 {
margin-left: 100%;
}

@media (min-width: 740px) {
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
float: left;
}
.col-sm-1 {
width: 8.3333333333%;
}
.col-sm-2 {
width: 16.6666666667%;
}
.col-sm-3 {
width: 25%;
}
.col-sm-4 {
width: 33.3333333333%;
}
.col-sm-5 {
width: 41.6666666667%;
}
.col-sm-6 {
width: 50%;
}
.col-sm-7 {
width: 58.3333333333%;
}
.col-sm-8 {
width: 66.6666666667%;
}
.col-sm-9 {
width: 75%;
}
.col-sm-10 {
width: 83.3333333333%;
}
.col-sm-11 {
width: 91.6666666667%;
}
.col-sm-12 {
width: 100%;
}
.col-sm-pull-0 {
right: auto;
}
.col-sm-pull-1 {
right: 8.3333333333%;
}
.col-sm-pull-2 {
right: 16.6666666667%;
}
.col-sm-pull-3 {
right: 25%;
}
.col-sm-pull-4 {
right: 33.3333333333%;
}
.col-sm-pull-5 {
right: 41.6666666667%;
}
.col-sm-pull-6 {
right: 50%;
}
.col-sm-pull-7 {
right: 58.3333333333%;
}
.col-sm-pull-8 {
right: 66.6666666667%;
}
.col-sm-pull-9 {
right: 75%;
}
.col-sm-pull-10 {
right: 83.3333333333%;
}
.col-sm-pull-11 {
right: 91.6666666667%;
}
.col-sm-pull-12 {
right: 100%;
}
.col-sm-push-0 {
left: auto;
}
.col-sm-push-1 {
left: 8.3333333333%;
}
.col-sm-push-2 {
left: 16.6666666667%;
}
.col-sm-push-3 {
left: 25%;
}
.col-sm-push-4 {
left: 33.3333333333%;
}
.col-sm-push-5 {
left: 41.6666666667%;
}
.col-sm-push-6 {
left: 50%;
}
.col-sm-push-7 {
left: 58.3333333333%;
}
.col-sm-push-8 {
left: 66.6666666667%;
}
.col-sm-push-9 {
left: 75%;
}
.col-sm-push-10 {
left: 83.3333333333%;
}
.col-sm-push-11 {
left: 91.6666666667%;
}
.col-sm-push-12 {
left: 100%;
}
.col-sm-offset-0 {
margin-left: 0%;
}
.col-sm-offset-1 {
margin-left: 8.3333333333%;
}
.col-sm-offset-2 {
margin-left: 16.6666666667%;
}
.col-sm-offset-3 {
margin-left: 25%;
}
.col-sm-offset-4 {
margin-left: 33.3333333333%;
}
.col-sm-offset-5 {
margin-left: 41.6666666667%;
}
.col-sm-offset-6 {
margin-left: 50%;
}
.col-sm-offset-7 {
margin-left: 58.3333333333%;
}
.col-sm-offset-8 {
margin-left: 66.6666666667%;
}
.col-sm-offset-9 {
margin-left: 75%;
}
.col-sm-offset-10 {
margin-left: 83.3333333333%;
}
.col-sm-offset-11 {
margin-left: 91.6666666667%;
}
.col-sm-offset-12 {
margin-left: 100%;
}
}
@media (min-width: 992px) {
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
float: left;
}
.col-md-1 {
width: 8.3333333333%;
}
.col-md-2 {
width: 16.6666666667%;
}
.col-md-3 {
width: 25%;
}
.col-md-4 {
width: 33.3333333333%;
}
.col-md-5 {
width: 41.6666666667%;
}
.col-md-6 {
width: 50%;
}
.col-md-7 {
width: 58.3333333333%;
}
.col-md-8 {
width: 66.6666666667%;
}
.col-md-9 {
width: 75%;
}
.col-md-10 {
width: 83.3333333333%;
}
.col-md-11 {
width: 91.6666666667%;
}
.col-md-12 {
width: 100%;
}
.col-md-pull-0 {
right: auto;
}
.col-md-pull-1 {
right: 8.3333333333%;
}
.col-md-pull-2 {
right: 16.6666666667%;
}
.col-md-pull-3 {
right: 25%;
}
.col-md-pull-4 {
right: 33.3333333333%;
}
.col-md-pull-5 {
right: 41.6666666667%;
}
.col-md-pull-6 {
right: 50%;
}
.col-md-pull-7 {
right: 58.3333333333%;
}
.col-md-pull-8 {
right: 66.6666666667%;
}
.col-md-pull-9 {
right: 75%;
}
.col-md-pull-10 {
right: 83.3333333333%;
}
.col-md-pull-11 {
right: 91.6666666667%;
}
.col-md-pull-12 {
right: 100%;
}
.col-md-push-0 {
left: auto;
}
.col-md-push-1 {
left: 8.3333333333%;
}
.col-md-push-2 {
left: 16.6666666667%;
}
.col-md-push-3 {
left: 25%;
}
.col-md-push-4 {
left: 33.3333333333%;
}
.col-md-push-5 {
left: 41.6666666667%;
}
.col-md-push-6 {
left: 50%;
}
.col-md-push-7 {
left: 58.3333333333%;
}
.col-md-push-8 {
left: 66.6666666667%;
}
.col-md-push-9 {
left: 75%;
}
.col-md-push-10 {
left: 83.3333333333%;
}
.col-md-push-11 {
left: 91.6666666667%;
}
.col-md-push-12 {
left: 100%;
}
.col-md-offset-0 {
margin-left: 0%;
}
.col-md-offset-1 {
margin-left: 8.3333333333%;
}
.col-md-offset-2 {
margin-left: 16.6666666667%;
}
.col-md-offset-3 {
margin-left: 25%;
}
.col-md-offset-4 {
margin-left: 33.3333333333%;
}
.col-md-offset-5 {
margin-left: 41.6666666667%;
}
.col-md-offset-6 {
margin-left: 50%;
}
.col-md-offset-7 {
margin-left: 58.3333333333%;
}
.col-md-offset-8 {
margin-left: 66.6666666667%;
}
.col-md-offset-9 {
margin-left: 75%;
}
.col-md-offset-10 {
margin-left: 83.3333333333%;
}
.col-md-offset-11 {
margin-left: 91.6666666667%;
}
.col-md-offset-12 {
margin-left: 100%;
}
}
@media (min-width: 1240px) {
.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
float: left;
}
.col-lg-1 {
width: 8.3333333333%;
}
.col-lg-2 {
width: 16.6666666667%;
}
.col-lg-3 {
width: 25%;
}
.col-lg-4 {
width: 33.3333333333%;
}
.col-lg-5 {
width: 41.6666666667%;
}
.col-lg-6 {
width: 50%;
}
.col-lg-7 {
width: 58.3333333333%;
}
.col-lg-8 {
width: 66.6666666667%;
}
.col-lg-9 {
width: 75%;
}
.col-lg-10 {
width: 83.3333333333%;
}
.col-lg-11 {
width: 91.6666666667%;
}
.col-lg-12 {
width: 100%;
}
.col-lg-pull-0 {
right: auto;
}
.col-lg-pull-1 {
right: 8.3333333333%;
}
.col-lg-pull-2 {
right: 16.6666666667%;
}
.col-lg-pull-3 {
right: 25%;
}
.col-lg-pull-4 {
right: 33.3333333333%;
}
.col-lg-pull-5 {
right: 41.6666666667%;
}
.col-lg-pull-6 {
right: 50%;
}
.col-lg-pull-7 {
right: 58.3333333333%;
}
.col-lg-pull-8 {
right: 66.6666666667%;
}
.col-lg-pull-9 {
right: 75%;
}
.col-lg-pull-10 {
right: 83.3333333333%;
}
.col-lg-pull-11 {
right: 91.6666666667%;
}
.col-lg-pull-12 {
right: 100%;
}
.col-lg-push-0 {
left: auto;
}
.col-lg-push-1 {
left: 8.3333333333%;
}
.col-lg-push-2 {
left: 16.6666666667%;
}
.col-lg-push-3 {
left: 25%;
}
.col-lg-push-4 {
left: 33.3333333333%;
}
.col-lg-push-5 {
left: 41.6666666667%;
}
.col-lg-push-6 {
left: 50%;
}
.col-lg-push-7 {
left: 58.3333333333%;
}
.col-lg-push-8 {
left: 66.6666666667%;
}
.col-lg-push-9 {
left: 75%;
}
.col-lg-push-10 {
left: 83.3333333333%;
}
.col-lg-push-11 {
left: 91.6666666667%;
}
.col-lg-push-12 {
left: 100%;
}
.col-lg-offset-0 {
margin-left: 0%;
}
.col-lg-offset-1 {
margin-left: 8.3333333333%;
}
.col-lg-offset-2 {
margin-left: 16.6666666667%;
}
.col-lg-offset-3 {
margin-left: 25%;
}
.col-lg-offset-4 {
margin-left: 33.3333333333%;
}
.col-lg-offset-5 {
margin-left: 41.6666666667%;
}
.col-lg-offset-6 {
margin-left: 50%;
}
.col-lg-offset-7 {
margin-left: 58.3333333333%;
}
.col-lg-offset-8 {
margin-left: 66.6666666667%;
}
.col-lg-offset-9 {
margin-left: 75%;
}
.col-lg-offset-10 {
margin-left: 83.3333333333%;
}
.col-lg-offset-11 {
margin-left: 91.6666666667%;
}
.col-lg-offset-12 {
margin-left: 100%;
}
}
@media (min-width: 1300px) {
.col-xg-1, .col-xg-2, .col-xg-3, .col-xg-4, .col-xg-5, .col-xg-6, .col-xg-7, .col-xg-8, .col-xg-9, .col-xg-10, .col-xg-11, .col-xg-12 {
float: left;
}
.col-xg-1 {
width: 8.3333333333%;
}
.col-xg-2 {
width: 16.6666666667%;
}
.col-xg-3 {
width: 25%;
}
.col-xg-4 {
width: 33.3333333333%;
}
.col-xg-5 {
width: 41.6666666667%;
}
.col-xg-6 {
width: 50%;
}
.col-xg-7 {
width: 58.3333333333%;
}
.col-xg-8 {
width: 66.6666666667%;
}
.col-xg-9 {
width: 75%;
}
.col-xg-10 {
width: 83.3333333333%;
}
.col-xg-11 {
width: 91.6666666667%;
}
.col-xg-12 {
width: 100%;
}
.col-xg-pull-0 {
right: auto;
}
.col-xg-pull-1 {
right: 8.3333333333%;
}
.col-xg-pull-2 {
right: 16.6666666667%;
}
.col-xg-pull-3 {
right: 25%;
}
.col-xg-pull-4 {
right: 33.3333333333%;
}
.col-xg-pull-5 {
right: 41.6666666667%;
}
.col-xg-pull-6 {
right: 50%;
}
.col-xg-pull-7 {
right: 58.3333333333%;
}
.col-xg-pull-8 {
right: 66.6666666667%;
}
.col-xg-pull-9 {
right: 75%;
}
.col-xg-pull-10 {
right: 83.3333333333%;
}
.col-xg-pull-11 {
right: 91.6666666667%;
}
.col-xg-pull-12 {
right: 100%;
}
.col-xg-push-0 {
left: auto;
}
.col-xg-push-1 {
left: 8.3333333333%;
}
.col-xg-push-2 {
left: 16.6666666667%;
}
.col-xg-push-3 {
left: 25%;
}
.col-xg-push-4 {
left: 33.3333333333%;
}
.col-xg-push-5 {
left: 41.6666666667%;
}
.col-xg-push-6 {
left: 50%;
}
.col-xg-push-7 {
left: 58.3333333333%;
}
.col-xg-push-8 {
left: 66.6666666667%;
}
.col-xg-push-9 {
left: 75%;
}
.col-xg-push-10 {
left: 83.3333333333%;
}
.col-xg-push-11 {
left: 91.6666666667%;
}
.col-xg-push-12 {
left: 100%;
}
.col-xg-offset-0 {
margin-left: 0%;
}
.col-xg-offset-1 {
margin-left: 8.3333333333%;
}
.col-xg-offset-2 {
margin-left: 16.6666666667%;
}
.col-xg-offset-3 {
margin-left: 25%;
}
.col-xg-offset-4 {
margin-left: 33.3333333333%;
}
.col-xg-offset-5 {
margin-left: 41.6666666667%;
}
.col-xg-offset-6 {
margin-left: 50%;
}
.col-xg-offset-7 {
margin-left: 58.3333333333%;
}
.col-xg-offset-8 {
margin-left: 66.6666666667%;
}
.col-xg-offset-9 {
margin-left: 75%;
}
.col-xg-offset-10 {
margin-left: 83.3333333333%;
}
.col-xg-offset-11 {
margin-left: 91.6666666667%;
}
.col-xg-offset-12 {
margin-left: 100%;
}
}
@-ms-viewport {
width: device-width;
}
.visible-xs {
display: none !important;
}

.visible-sm {
display: none !important;
}

.visible-md {
display: none !important;
}

.visible-lg {
display: none !important;
}

.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
display: none !important;
}

@media (max-width: 739px) {
.visible-xs {
display: block !important;
}
table.visible-xs {
display: table;
}
tr.visible-xs {
display: table-row !important;
}
th.visible-xs,
td.visible-xs {
display: table-cell !important;
}
}
@media (max-width: 739px) {
.visible-xs-block {
display: block !important;
}
}

@media (max-width: 739px) {
.visible-xs-inline {
display: inline !important;
}
}

@media (max-width: 739px) {
.visible-xs-inline-block {
display: inline-block !important;
}
}

@media (min-width: 740px) and (max-width: 991px) {
.visible-sm {
display: block !important;
}
table.visible-sm {
display: table;
}
tr.visible-sm {
display: table-row !important;
}
th.visible-sm,
td.visible-sm {
display: table-cell !important;
}
}
@media (min-width: 740px) and (max-width: 991px) {
.visible-sm-block {
display: block !important;
}
}

@media (min-width: 740px) and (max-width: 991px) {
.visible-sm-inline {
display: inline !important;
}
}

@media (min-width: 740px) and (max-width: 991px) {
.visible-sm-inline-block {
display: inline-block !important;
}
}

@media (min-width: 992px) and (max-width: 1239px) {
.visible-md {
display: block !important;
}
table.visible-md {
display: table;
}
tr.visible-md {
display: table-row !important;
}
th.visible-md,
td.visible-md {
display: table-cell !important;
}
}
@media (min-width: 992px) and (max-width: 1239px) {
.visible-md-block {
display: block !important;
}
}

@media (min-width: 992px) and (max-width: 1239px) {
.visible-md-inline {
display: inline !important;
}
}

@media (min-width: 992px) and (max-width: 1239px) {
.visible-md-inline-block {
display: inline-block !important;
}
}

@media (min-width: 1240px) {
.visible-lg {
display: block !important;
}
table.visible-lg {
display: table;
}
tr.visible-lg {
display: table-row !important;
}
th.visible-lg,
td.visible-lg {
display: table-cell !important;
}
}
@media (min-width: 1240px) {
.visible-lg-block {
display: block !important;
}
}

@media (min-width: 1240px) {
.visible-lg-inline {
display: inline !important;
}
}

@media (min-width: 1240px) {
.visible-lg-inline-block {
display: inline-block !important;
}
}

@media (max-width: 739px) {
.hidden-xs {
display: none !important;
}
}
@media (min-width: 740px) and (max-width: 991px) {
.hidden-sm {
display: none !important;
}
}
@media (min-width: 992px) and (max-width: 1239px) {
.hidden-md {
display: none !important;
}
}
@media (min-width: 1240px) {
.hidden-lg {
display: none !important;
}
}
.visible-print {
display: none !important;
}

@media print {
.visible-print {
display: block !important;
}
table.visible-print {
display: table;
}
tr.visible-print {
display: table-row !important;
}
th.visible-print,
td.visible-print {
display: table-cell !important;
}
}
.visible-print-block {
display: none !important;
}
@media print {
.visible-print-block {
display: block !important;
}
}

.visible-print-inline {
display: none !important;
}
@media print {
.visible-print-inline {
display: inline !important;
}
}

.visible-print-inline-block {
display: none !important;
}
@media print {
.visible-print-inline-block {
display: inline-block !important;
}
}

@media print {
.hidden-print {
display: none !important;
}
}
@font-face {
font-family: "Gmarket Sans";
font-style: normal;
font-weight: 500;
src: local("Gmarket Sans Medium"), local("GmarketSans-Medium"), url("/static/font/gmarket/GmarketSansMedium.woff2") format("woff2");
}
.lightred {
color: #c54804;
}

.blue {
color: #005aab !important;
}

.blue2 {
color: #005baa !important;
}

.skyblue {
color: #0C9EBD !important;
}

.green {
color: #009344 !important;
}

.gray {
color: #888 !important;
}

.red {
color: #ed1b2f !important;
}

.pink {
color: #e4477a !important;
}

.black {
color: #000 !important;
}

.orange {
color: #D8761F !important;
}

.subway6 {
color: #c7792e !important;
}

.white {
color: #fff !important;
}

.bg_orange {
background-color: #D8761F !important;
}

.bg_skyblue {
background-color: #0C9EBD !important;
}

.bg_blue {
background-color: #005aab !important;
}

.bg_deepblue {
background-color: #005baa !important;
}

.bg_green {
background-color: #009344 !important;
}

.bg_gray {
background: #eff2f7 !important;
}

.bg_whitegray {
background: #fafafa;
}

.bg_red {
background: #ed1b2f !important;
}

.bg_white {
background: #fff !important;
}

@font-face {
font-family: "yg-jalnan";
src: url("//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff") format("woff");
font-weight: normal;
font-style: normal;
}
[class^=ico-] {
display: inline-block;
}

.ico-01 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: 0px 0px;
width: 78px;
height: 60px;
}

.ico-02 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -98px 0px;
width: 78px;
height: 60px;
}

.ico-03 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: 0px -80px;
width: 78px;
height: 60px;
}

.ico-04 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -98px -80px;
width: 78px;
height: 60px;
}

.ico-05 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -196px 0px;
width: 78px;
height: 60px;
}

.ico-06 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -196px -80px;
width: 78px;
height: 60px;
}

.ico-07 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: 0px -160px;
width: 78px;
height: 60px;
}

.ico-08 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -98px -160px;
width: 78px;
height: 60px;
}

.ico-09 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -196px -160px;
width: 78px;
height: 60px;
}

.ico-10 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -294px 0px;
width: 78px;
height: 60px;
}

.ico-11 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -294px -80px;
width: 78px;
height: 60px;
}

.ico-12 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -294px -160px;
width: 78px;
height: 60px;
}

.ico-13 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: 0px -240px;
width: 78px;
height: 60px;
}

.ico-14 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -98px -240px;
width: 78px;
height: 60px;
}

.ico-15 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -196px -240px;
width: 78px;
height: 60px;
}

.ico-16 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -294px -240px;
width: 78px;
height: 60px;
}

.ico-17 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -392px 0px;
width: 78px;
height: 60px;
}

.ico-18 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -392px -80px;
width: 78px;
height: 60px;
}

.ico-19 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -392px -160px;
width: 78px;
height: 60px;
}

.ico-20 {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -392px -240px;
width: 78px;
height: 60px;
}

.ico-computer {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: 0px -320px;
width: 22px;
height: 16px;
}

.ico-lang {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -114px -320px;
width: 15px;
height: 15px;
}

.ico-login {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -42px -320px;
width: 16px;
height: 16px;
}

.ico-logout {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -78px -320px;
width: 16px;
height: 16px;
}

.ico-mypage {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: 0px -356px;
width: 18px;
height: 18px;
}

.ico-next {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: 0px -394px;
width: 14px;
height: 20px;
}

.ico-prev {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -38px -356px;
width: 11px;
height: 17px;
}

.jumpo01-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: 0px 0px;
width: 84px;
height: 84px;
}

.jumpo01 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -104px 0px;
width: 84px;
height: 84px;
}

.jumpo02-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: 0px -104px;
width: 84px;
height: 84px;
}

.jumpo02 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -104px -104px;
width: 84px;
height: 84px;
}

.jumpo03-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -208px 0px;
width: 84px;
height: 84px;
}

.jumpo03 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -208px -104px;
width: 84px;
height: 84px;
}

.jumpo04-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: 0px -208px;
width: 84px;
height: 84px;
}

.jumpo04 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -104px -208px;
width: 84px;
height: 84px;
}

.jumpo05-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -208px -208px;
width: 84px;
height: 84px;
}

.jumpo05 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -312px 0px;
width: 84px;
height: 84px;
}

.jumpo06-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -312px -104px;
width: 84px;
height: 84px;
}

.jumpo06 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -312px -208px;
width: 84px;
height: 84px;
}

.jumpo07-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: 0px -312px;
width: 84px;
height: 84px;
}

.jumpo07 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -104px -312px;
width: 84px;
height: 84px;
}

.jumpo08-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -208px -312px;
width: 84px;
height: 84px;
}

.jumpo08 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -312px -312px;
width: 84px;
height: 84px;
}

.jumpo09-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -416px 0px;
width: 84px;
height: 84px;
}

.jumpo09 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -416px -104px;
width: 84px;
height: 84px;
}

.jumpo10-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -416px -208px;
width: 84px;
height: 84px;
}

.jumpo10 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -416px -312px;
width: 84px;
height: 84px;
}

.jumpo11-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: 0px -416px;
width: 84px;
height: 84px;
}

.jumpo11 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -104px -416px;
width: 84px;
height: 84px;
}

.jumpo12-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -208px -416px;
width: 84px;
height: 84px;
}

.jumpo12 {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -312px -416px;
width: 84px;
height: 84px;
}

.jumpoall-on {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -416px -416px;
width: 84px;
height: 84px;
}

.jumpoall {
background-image: url(/static/portal/img/sprite-tab.png);
background-position: -520px 0px;
width: 84px;
height: 84px;
}

/* layout */
html,
body {
width: 100%;
height: 100%;
}
.ie html,
.ie body {
overflow-x: hidden;
}

a:hover, a:focus, a:active {
color: #222;
}

hr {
margin-top: 40px;
margin-bottom: 30px;
}
dl hr {
margin: 20px 0;
}

.radius-lg {
border-radius: 0.9375em;
overflow: hidden;
}

.radius-sm {
border-radius: 0.3125em;
overflow: hidden;
}

.radius-none {
border-radius: 0 !important;
}

.container {
padding: 0 20px;
margin: 0 auto;
width: 100%;
max-width: none;
}
@media (min-width: 1300px) {
.container {
max-width: 1860px;
}
}
.container:before, .container:after {
display: none;
}
@media (min-width: 1200px) {
#mainContent .container {
padding: 0 40px;
max-width: 1680px;
}
}

#mainContent {
position: relative;
}
.ie #mainContent {
overflow: hidden;
}

#allmenu {
position: absolute;
left: 0;
top: 0;
padding-top: 20px;
}
@media (min-width: 1200px) {
#allmenu {
position: static;
padding: 0;
float: right;
}
}
#allmenu > button {
width: 48px;
height: 30px;
text-align: center;
background: none;
font-size: 20px;
}
@media (min-width: 1200px) {
#allmenu > button {
margin-top: 30px;
}
}
#allmenu > button:after {
content: "\f0c9";
font-family: "FontAwesome";
}

#subvisual {
display: none;
clear: both;
}
@media (max-width: 1199px) {
#subvisual {
height: 120px;
border-top: 1px solid #dee0e6;
background: url(/static/portal/img/common/subvisual1.jpg) center 0 no-repeat;
background-size: cover;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#subvisual p {
text-align: center;
font-family: "Noto-Light";
font-size: 30px;
color: #fff;
}
}

#container {
display: block;
max-width: 1276px;
margin: 60px auto 20px auto;
padding: 0 11px;
}
#container:before, #container:after {
display: block;
height: 0;
clear: both;
visibility: hidden;
content: ".";
}
#container main {
margin-bottom: 70px;
}
@media (min-width: 1200px) {
#container main {
float: right;
width: calc(100% - 228px - 20px);
}
}
@media (min-width: 1276px) {
#container main {
width: calc(100% - 228px - 50px);
}
}
#container .hgroup {
position: relative;
margin-bottom: 16px;
border-bottom: 1px solid #dee0e6;
}
@media (min-width: 1200px) {
#container .hgroup {
margin-bottom: 25px;
}
}
#container .hgroup h1 {
font-size: 24px;
color: #000;
line-height: 1;
margin-bottom: 8px;
}
@media (min-width: 1200px) {
#container .hgroup h1 {
font-size: 1.875rem;
}
}
#container .hgroup p {
color: #757575;
line-height: 1;
font-size: 14px;
}
@media (min-width: 1200px) {
#container .hgroup p {
font-size: 1em;
}
}
#container .hgroup p span {
vertical-align: middle;
display: inline-block;
line-height: 1;
vertical-align: top;
}
@media (max-width: 749px) {
#container .hgroup p span {
margin-bottom: 5px;
}
}
#container .hgroup p .t:last-child {
color: #222;
font-weight: bold;
}
#container .hgroup .home:after {
content: "\f015";
font-family: "FontAwesome";
color: #1f497d;
}

#content .hgroup {
margin-bottom: 0;
border: none;
margin-top: 20px;
}
#content .hgroup .first {
margin-top: 10px;
}
#content .hgroup h2,
#content .hgroup h3,
#content .hgroup h4 {
display: inline-block;
border: none;
margin: 0;
}
#content .hgroup .reqInfor {
float: right;
margin-top: 9px;
}
#content .hgroup .reqInfor2 {
display: inline-block;
vertical-align: middle;
}
#content .hgroup .reqInfor2 button {
min-height: 30px;
padding: 5px;
margin-left: 20px;
margin-right: 10px;
}
#content .hgroup .reqInfor2 p {
display: inline-block;
color: #ed1b2f;
line-height: 1.4;
}
@media (max-width: 749px) {
#content .hgroup .reqInfor2 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#content .hgroup .reqInfor2 button + p {
margin-bottom: 0;
}
}

.utilSet {
display: none;
position: absolute;
width: 74px;
right: 0;
bottom: 10px;
}
@media (min-width: 1200px) {
.utilSet {
display: block;
}
}
.utilSet > button {
background: none;
border: 1px solid #ddd;
border-radius: 50%;
width: 32px;
height: 32px;
float: left;
}
.utilSet > button:after {
display: inline-block;
-webkit-font-smoothing: antialiased;
text-rendering: auto;
font-family: "Line Awesome Free";
font-weight: 900;
font-style: normal;
font-variant: normal;
line-height: 1;
font-size: 24px;
color: #1f497d;
}
.utilSet .btn-sns {
margin-right: 10px;
background: url(/static/commons/img/sns/snsOpener.svg) no-repeat 50% 50%;
background-size: 15px auto;
}
.utilSet .btn-print {
font-size: 22px;
line-height: 32px;
text-align: center;
color: #888;
}

.snsWrap {
position: absolute;
right: 50px;
top: -8px;
display: none;
width: 185px;
height: 46px;
padding: 8px 10px;
border-radius: 15px;
background-color: #f1f1f1;
}
.snsWrap.active {
display: block;
}
.snsWrap i {
display: inline-block;
}
.snsWrap button {
width: 30px;
height: 30px;
}
.snsWrap button i {
display: inline-block;
}
.snsWrap button i.sns-talk, .snsWrap button i.sns-blog-c {
width: 30px;
height: 30px;
border-radius: 8px;
background-position: center;
background-repeat: no-repeat;
}
.snsWrap button i.sns-talk {
background-image: url(/static/commons/img/sns/kakao.svg);
background-color: #fae100;
background-size: 22px 20px;
}
.snsWrap button i.sns-blog-c {
background-image: url(/static/commons/img/sns/blog.svg);
background-color: #32b44a;
background-size: 12px 16px;
}
.snsWrap .sns-closer {
position: absolute;
right: 0;
top: 3px;
}

/* header */
.header {
position: relative;
}
@media (max-width: 1199px) {
.header {
height: 72px;
}
}
.header .logo {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 126px;
height: 44px;
margin-right: auto;
background: url(/static/portal/img/main/bi-new.jpg) 0 0 no-repeat;
background-size: contain;
}
@media (max-width: 1199px) {
.header .logo {
width: 100px;
}
}
@media (min-width: 1200px) {
.header .logo {
height: 60px;
margin-top: 6px;
}
}
.header .logo a {
display: block;
width: 100%;
height: 100%;
/*&.awards {
    background: url(/static/portal/img/main/awards-icon.png) 0 0 no-repeat;
    width: 76px;
    height: 68px;
    margin-right: 10px;
}*/
}

.header-search {
margin: 0 auto;
height: 70px;
padding-top: 30px;
max-width: 550px;
}
.header-search form {
position: relative;
}
.header-search input[type=text] {
border: 1px solid #cfcfcf;
width: 100%;
padding-left: 21px;
padding-right: 34px;
height: 40px;
line-height: 38px;
border-radius: 20px;
}
.header-search .tshsubmit {
position: absolute;
top: 3px;
right: 4px;
height: 34px;
width: 34px;
border-radius: 50%;
background: #e4477a;
text-align: center;
}
.header-search .tshsubmit i {
font-size: 22px;
color: #fff;
vertical-align: middle;
}
@media (max-width: 749px) {
.header-search {
width: 100%;
}
.header-search form {
padding-top: 0;
}
}

/* gnb */
.gnb-right {
-ms-flex-negative: 0;
flex-shrink: 0;
}
@media (min-width: 1200px) {
.gnb-right {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
}
.gnb-stiky .gnb-right {
margin-bottom: 0;
}

#gnb {
font-family: "SUIT";
}
@media (max-width: 1199px) {
#gnb {
padding-top: 10px;
}
}
#gnb > .container {
padding: 0;
}
#gnb .gnb-set {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
padding: 0;
}
.ie #gnb .gnb-set {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
#gnb .gnb-set > ul {
display: none;
}
@media (min-width: 1200px) {
#gnb .gnb-set > ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
max-width: 1000px;
margin: 0 10px;
position: relative;
}
}
@media (min-width: 1200px) and (max-width: 1800px) {
#gnb .gnb-set > ul {
margin-top: 16px;
}
}
@media (min-width: 1200px) {
.gnb-stiky #gnb {
padding: 0;
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 2000;
}
.gnb-stiky #gnb::before {
background-color: rgb(255, 255, 255);
-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.13);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.13);
}
.gnb-stiky #gnb .container {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
max-width: 1640px;
padding: 0 20px;
}
.gnb-stiky #gnb .container ul {
margin: 0 10px;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
max-width: 1200px;
}
.gnb-stiky #gnb .gnb-set {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.gnb-stiky #gnb .logo {
width: 100px;
height: 50px;
-webkit-animation: logo 0.5s linear;
animation: logo 0.5s linear;
margin-top: 0;
}
.gnb-stiky #gnb .dp1 {
border-left: 1px solid #ddd;
}
.gnb-stiky #gnb .dp1 > a::before {
display: none;
}
.gnb-stiky #gnb .dp1 > .s {
top: 58px;
}
.gnb-stiky #gnb .all-toggle-set {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-left: 10px;
margin-top: 0;
}
#gnb::before {
content: "";
background-color: rgba(255, 255, 255, 0.7);
height: 60px;
position: absolute;
left: 0;
width: 100vw;
max-width: 100%;
z-index: -1;
}
}
@media (min-width: 1200px) and (max-width: 749px) {
#gnb::before {
height: 58px;
}
}
@media (min-width: 1200px) {
#gnb .container > ul {
-webkit-transition: all 0.25s linear;
transition: all 0.25s linear;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
#gnb .dp1 {
-ms-flex-preferred-size: 116px;
flex-basis: 116px;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.gnb-stiky #gnb .dp1 > a {
padding: 12px 0;
}
#gnb .dp1 > a {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
color: #2c2c2c;
font-size: 24px;
font-weight: 700;
padding: 36px 0;
}
#gnb .dp1 > a::after {
content: "";
display: inline-block;
width: 8px;
height: 8px;
margin-left: 4px;
background-color: #de3a75;
border-radius: 50%;
opacity: 0;
}
.gnb-stiky #gnb .dp1 > a {
color: #141414;
}
#gnb .dp1.active > a, #gnb .dp1.on > a {
position: relative;
font-weight: 900;
}
#gnb .dp1.active > a::after, #gnb .dp1.on > a::after {
opacity: 1;
}
#gnb .dp1.active > a span, #gnb .dp1.on > a span {
color: #de3a75;
}
.gnb-stiky #gnb .dp1.active > a span, .gnb-stiky #gnb .dp1.on > a span {
color: #141414;
}
#gnb .dp1.active .dp2-set {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
#gnb .dp1.menu5 .dp2 {
margin-bottom: 20px;
padding: 0 5px;
}
#gnb .dp1.menu5 .dp2-set {
width: 100%;
}
#gnb .dp1.menu5 .dp2-set ul {
max-width: 1270px;
}
#gnb .dp1.menu5 .dp3-set {
position: absolute;
top: 150px;
width: 100%;
left: 0;
background: #fff3f7;
}
#gnb .dp1.menu5 .dp3-set > ul {
max-width: 1280px;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
}
#gnb .dp1.menu5 .dp3-set > ul > li {
width: auto;
}
#gnb .dp1.menu5 .dp3-set > ul > li > a {
text-indent: 0;
margin: 0 10px;
}
#gnb .dp1.menu5 .dp3-set > ul > li > a::before {
display: none;
}
#gnb .dp1.menu5 .dp2:nth-child(n+6) .dp3-set > ul {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
#gnb .dp1.menu5 .dp2:nth-child(3) .dp3-set > ul {
padding-left: 277px;
}
#gnb .dp1.menu5 .dp2:nth-child(5) .dp3-set > ul {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding-right: 20px;
}
#gnb .dp1.menu5 .dp2:nth-child(6) .dp3-set > ul {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding-left: 132px;
}
#gnb .dp1.menu5 .dp2:nth-child(8) .dp3-set > ul {
padding-right: 132px;
}
#gnb .dp1 > .s {
position: absolute;
z-index: 1000;
top: 108px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 1200px;
margin: 0 auto;
-webkit-box-shadow: 0.125rem 0.188rem 0.625rem rgba(0, 0, 0, 0.05);
box-shadow: 0.125rem 0.188rem 0.625rem rgba(0, 0, 0, 0.05);
background: #fff;
}
#gnb .dp1 > .s::before {
content: "";
position: absolute;
left: 0;
background: #f00;
}
#gnb .dp1.menu5 .dp2-set .title {
display: none;
}
#gnb .dp1.menu5 .dp2-set > ul {
width: 100%;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
padding: 30px 0;
}
#gnb .dp1.menu1 .dp2-set .title::after {
background-image: url(/static/portal/img/sprite.png);
background-position: 0px -213px;
width: 67px;
height: 107px;
}
#gnb .dp1.menu2 .dp2-set .title::after {
background-image: url(/static/portal/img/sprite.png);
background-position: -123px -88px;
width: 66px;
height: 105px;
}
#gnb .dp1.menu3 .dp2-set .title::after {
background-image: url(/static/portal/img/sprite.png);
background-position: 0px -88px;
width: 103px;
height: 105px;
}
#gnb .dp1.menu4 .dp2-set .title::after {
background-image: url(/static/portal/img/sprite.png);
background-position: -248px 0px;
width: 87px;
height: 107px;
}
#gnb .dp2-set {
display: none;
width: 100%;
max-width: 1280px;
margin: 0 auto;
background: #fff;
}
#gnb .dp2-set h3 {
font-family: "Noto Sans KR", "맑은고딕", "malgun gothic", sans-serif;
font-weight: 300;
font-size: 24px;
font-weight: 500 !important;
}
#gnb .dp2-set .title {
width: 20%;
background-color: #939393;
color: #fff;
padding: 38px 30px 0 30px;
position: relative;
}
#gnb .dp2-set .title::after {
content: "";
position: absolute;
right: 44px;
bottom: 23px;
width: 67px;
height: 107px;
background-position: right bottom;
background-repeat: no-repeat;
}
#gnb .dp2-set .title span {
color: #fff;
font-size: 1.563rem;
line-height: 1;
}
#gnb .dp2-set .title span::before {
content: "";
background-color: #505d63;
width: 3px;
height: 18px;
display: inline-block;
margin-right: 20px;
vertical-align: middle;
border-radius: 3px;
}
#gnb .dp2-set .title > p {
position: relative;
padding-top: 42px;
}
#gnb .dp2-set .title > p::before {
content: "";
position: absolute;
top: 20px;
left: -30px;
width: 60px;
height: 2px;
background-color: rgba(255, 255, 255, 0.5);
}
#gnb .dp2-set > ul {
max-width: 1200px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
width: 80%;
table-layout: fixed;
float: left;
padding: 30px;
}
#gnb .dp2-set > ul > * {
display: table-cell;
vertical-align: top;
}
#gnb .dp2-set > ul > li {
float: left;
padding: 0 10px 0;
display: inline-block;
width: 20%;
}
#gnb .menu1 .dp2-set > ul > li {
width: 25%;
}
#gnb .menu3 .dp2-set > ul > li {
width: 25%;
}
#gnb .menu4 .dp2-set > ul > li {
width: 20%;
}
#gnb .menu5 .dp2 > a {
position: relative;
padding: 10px 5px 21px 5px;
border-radius: 10px;
font-size: 1rem;
border: 2px solid transparent;
}
#gnb .menu5 .dp2 > a::before {
content: "";
vertical-align: middle;
display: block;
margin: 0 auto 10px;
}
#gnb .menu5 .dp2 > a:hover, #gnb .menu5 .dp2 > a:focus, #gnb .menu5 .dp2 > a:active, #gnb .menu5 .dp2 > a.current {
border: 2px solid #939393;
background-color: #fff;
-webkit-box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15);
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15);
}
#gnb .menu5 .dp2 > a:hover .dp3-set, #gnb .menu5 .dp2 > a:focus .dp3-set, #gnb .menu5 .dp2 > a:active .dp3-set, #gnb .menu5 .dp2 > a.current .dp3-set {
display: block;
}
#gnb .menu5 .dp3-set {
display: none;
border-top: 1px solid #e4477a;
}
#gnb .menu5 .dp3-set.current {
display: block;
}
#gnb .dp5-1 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -152px -283px;
width: 44px;
height: 36px;
}
#gnb .dp5-2 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -278px -283px;
width: 41px;
height: 36px;
}
#gnb .dp5-3 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -216px -283px;
width: 42px;
height: 36px;
}
#gnb .dp5-4 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -87px -283px;
width: 45px;
height: 36px;
}
#gnb .dp5-5 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -168px;
width: 35px;
height: 36px;
}
#gnb .dp5-6 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -112px;
width: 36px;
height: 36px;
}
#gnb .dp5-7 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -56px;
width: 39px;
height: 36px;
}
#gnb .dp5-8 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -280px;
width: 27px;
height: 36px;
}
#gnb .dp5-9 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -224px;
width: 34px;
height: 36px;
}
#gnb .dp5-10 > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px 0px;
width: 40px;
height: 36px;
}
#gnb [class^=dp5-] {
margin-bottom: 20px;
}
#gnb .dp2 > a {
display: block;
color: #222;
font-size: 1.125rem;
line-height: 1;
padding: 11px 10px;
background-color: #fff3f7;
white-space: nowrap;
text-align: center;
font-weight: 600;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
#gnb .dp2 > a::before {
content: "";
}
#gnb .dp2 > a i {
margin-left: 4px;
}
#gnb .dp2 > ul {
padding-top: 10px;
}
#gnb .dp3 {
padding: 3px 0 3px 9px;
}
#gnb .dp3 > a {
display: block;
display: inline-block;
color: #1d1d1d;
color: #000;
font-size: 0.938rem;
font-weight: 300;
line-height: 1.5rem;
padding-left: 14px;
text-indent: -14px;
}
#gnb .dp3 > a::before {
content: "";
display: inline-block;
margin-right: 8px;
text-indent: 0;
margin-top: -4px;
vertical-align: middle;
}
#gnb .dp3 > a:focus, #gnb .dp3 > a:hover {
position: relative;
color: #525d64;
}
#gnb .dp3 > a:focus::after, #gnb .dp3 > a:hover::after {
content: "";
position: absolute;
width: calc(100% - 14px);
left: 14px;
bottom: -4px;
border-bottom: 1px solid #ddd;
}
#gnb .dp3 > a i {
margin-left: 4px;
}
#gnb .dp4-set {
display: none;
}

@media (max-width: 1199px) {
.gnb-set > ul {
display: none;
}
}
.mobile-login {
display: none;
}
@media (max-width: 749px) {
.mobile-login {
display: block;
position: absolute;
z-index: 2;
top: 0;
right: 48px;
width: 48px;
height: 58px;
background: url(/static/kdhc/img/common/ico-mypage.png) center center no-repeat;
background-size: 24px 25px;
}
}

.all-toggle-set {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 0;
z-index: 20;
}
@media (min-width: 1200px) {
.all-toggle-set {
margin-top: -44px;
}
}
.all-toggle-set button {
width: 52px;
height: 52px;
}
@media (min-width: 1200px) {
.all-toggle-set button {
width: 80px;
height: 80px;
}
}
.all-toggle-set button:focus {
outline-offset: -4px;
outline-style: dashed;
outline-width: 2px;
outline-color: #fff;
}
.gnb-stiky .all-toggle-set button {
display: inline-block;
width: 60px;
height: 60px;
background-image: none;
background-color: #fff;
}
.gnb-stiky .all-toggle-set button::before {
-webkit-filter: grayscale(100%) brightness(0);
filter: grayscale(100%) brightness(0);
}
.all-toggle-set .all-nav-toggle {
position: relative;
background-image: -webkit-gradient(linear, left top, right top, from(#711298), to(#4c0f76));
background-image: linear-gradient(to right, #711298, #4c0f76);
}
.all-toggle-set .all-nav-toggle::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 21px;
height: 19px;
background: url(/static/portal/img/main2024/i-hamberBtn.png) no-repeat center;
background-size: 21px 19px;
}
@media (max-width: 1199px) {
.all-toggle-set .all-nav-toggle::before {
background-size: 15px 14px;
}
}
.gnb-stiky .all-toggle-set .all-nav-toggle {
border-left: 1px solid #dddddd;
border-right: 1px solid #dddddd;
}
.all-toggle-set .all-search-toggle {
position: relative;
background-color: #de3a75;
}
.all-toggle-set .all-search-toggle::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 21px;
height: 21px;
background: url(/static/portal/img/main2024/i-search-white.png) no-repeat center;
background-size: 21px 21px;
}
@media (max-width: 1199px) {
.all-toggle-set .all-search-toggle::before {
background-size: 15px 15px;
}
}
.all-toggle-set .all-site-toggle {
display: none;
}
@media (max-width: 1199px) {
.all-toggle-set .all-site-toggle {
display: block;
margin-right: 10px;
}
}

@media (min-width: 1200px) {
.dp3-set > ul {
display: block;
width: 100%;
padding: 10px;
}
.dp3-set > ul > li {
width: 100%;
padding: 0;
margin-bottom: 8px;
}
.dp3-set > ul > li.active > a {
color: #222;
font-weight: bold;
text-decoration: underline;
}
.dp3-set > ul > li > a {
display: block;
line-height: 22px;
padding: 0;
text-indent: -12px;
margin-left: 12px;
word-break: normal;
font-size: 15px;
text-align: left;
}
.dp3-set > ul > li > a:hover, .dp3-set > ul > li > a:focus, .dp3-set > ul > li > a:active {
color: #222;
font-weight: bold;
text-decoration: underline;
}
.dp3-set > ul > li > a:hover #all-gnb .set .dp2 > a, .dp3-set > ul > li > a:focus #all-gnb .set .dp2 > a, .dp3-set > ul > li > a:active #all-gnb .set .dp2 > a {
background: #222;
color: #fff;
}
.dp3-set > ul > li > a::before {
content: "";
width: 5px;
height: 5px;
border-radius: 50%;
background: #D8761F;
vertical-align: middle;
display: inline-block;
margin-right: 8px;
}
.all-nav .dp3-set > ul > li .dp4-set {
margin-top: 5px;
margin-bottom: 5px;
}
.all-nav .dp3-set > ul > li .dp4-set ul {
padding: 5px 15px;
border-radius: 5px;
background-color: #f1f1f1;
}
.all-nav .dp3-set > ul > li .dp4-set ul li {
line-height: 26px;
}
.all-nav .dp3-set > ul > li .dp4-set ul li.active a {
color: #005aab;
font-weight: bold;
text-decoration: underline;
}
.all-nav .dp3-set > ul > li .dp4-set ul li a {
font-size: 0.9375rem;
color: #888;
}
.all-nav .dp3-set > ul > li .dp4-set ul li a:hover, .all-nav .dp3-set > ul > li .dp4-set ul li a:focus, .all-nav .dp3-set > ul > li .dp4-set ul li a:active {
color: #005aab;
font-weight: bold;
text-decoration: underline;
}
.all-nav .dp3-set > ul > li .dp4-set ul li a::before {
content: "- ";
}
.menu5 .dp3-set > ul > li > a {
background: #fff;
color: #222;
font-size: 0.9375rem;
display: block;
padding: 8px 20px;
border-radius: 5px;
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
.menu5 .dp3-set > ul > li > a:hover, .menu5 .dp3-set > ul > li > a:focus, .menu5 .dp3-set > ul > li > a:active {
text-decoration: underline;
}
#gnb .dp1.menu5 .dp2:nth-child(1) > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -152px -283px;
width: 44px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(2) > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -278px -283px;
width: 41px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(3) > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -216px -283px;
width: 42px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(4) > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -87px -283px;
width: 45px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(5) > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -168px;
width: 35px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(6) > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -112px;
width: 36px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(7) > a::before {
background-image: url(/static/portal/img/main2024/ico_10.png);
width: 40px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(8) > a::before {
background-image: url(/static/portal/img/main2024/ico_11.png);
width: 40px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(9) > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -280px;
width: 27px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(10) > a::before {
background-image: url(/static/portal/img/sprite.png);
background-position: -417px -224px;
width: 34px;
height: 36px;
}
#gnb .dp1.menu5 .dp2:nth-child(4) .dp3-set > ul > li > a {
padding: 8px 10px;
margin: 0 5px;
}
}
#all-gnb {
max-height: 80vh;
display: none;
position: absolute;
top: 120px;
left: 0;
width: 100%;
background-color: #fff;
z-index: 1000;
line-height: 1;
padding-bottom: 20px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
#all-gnb .title {
display: none;
}
@media (min-width: 1200px) {
#all-gnb.active {
display: block;
}
}
.gnb-stiky #all-gnb {
position: fixed;
top: 60px;
}
@media (min-width: 1800px) {
#all-gnb {
top: 104px;
}
}
#all-gnb .all-gnbheader {
line-height: 61px;
border-bottom: 1px solid #222;
}
#all-gnb h3 {
color: #e4477a;
}
#all-gnb .ctrl {
width: 100%;
max-width: 1280px;
margin: 0 auto;
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 10000;
}
#all-gnb .ctrl .all-nav-toggle-close {
position: absolute;
right: 0;
top: 0;
background: #e4477a url(/static/commons/img/close-white.svg) no-repeat 50% 50%;
width: 60px;
height: 62px;
}
#all-gnb .all-nav {
height: 550px;
overflow: hidden;
overflow-y: scroll;
}
#all-gnb .set {
max-width: 1280px;
margin: 0 auto;
}
#all-gnb .set > ul {
width: 100%;
}
#all-gnb .set > ul > li {
vertical-align: top;
position: relative;
clear: both;
border-bottom: 1px solid #fff;
}
#all-gnb .set > ul > li + li::before {
content: "";
position: absolute;
left: 0;
top: 50px;
height: 100%;
}
#all-gnb .set .active-manual > a {
background-color: #d9d9d9 !important;
}
#all-gnb .set .dp1 {
padding: 20px 0;
border-bottom: 1px solid #ddd;
}
#all-gnb .set .dp1 > a {
color: #e4477a;
font-size: 1.125rem;
font-weight: 600;
width: 100%;
background: #fff3f7;
display: block;
clear: both;
height: 3.75rem;
line-height: 3.75rem;
text-align: center;
}
#all-gnb .set .dp1 > a span {
display: inline-block;
}
#all-gnb .set .dp1 > a:hover, #all-gnb .set .dp1 > a:focus, #all-gnb .set .dp1 > a:active {
border: 1px dotted #fff;
}
#all-gnb .set .dp1 > .s {
width: 100%;
display: block;
}
#all-gnb .set .dp1 > .s:before, #all-gnb .set .dp1 > .s:after {
display: block;
height: 0;
clear: both;
visibility: hidden;
content: ".";
}
#all-gnb .set .dp1.menu5 .dp2-set > ul {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
}
#all-gnb .set .dp1.menu5 .dp2-set > ul > li {
width: 20%;
}
#all-gnb .set .dp1 .dp2-set {
width: 100%;
float: left;
}
#all-gnb .set .dp1 .dp2-set > ul {
margin-left: -12px;
margin-right: -12px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
}
#all-gnb .set .dp1 .dp2-set > ul > li {
padding: 10px 12px;
width: 25%;
float: left;
}
#all-gnb .set .dp1 .dp2-set > ul > li.active > a {
background: #e4477a;
color: #fff;
}
#all-gnb .set .dp2 > a {
position: relative;
display: block;
color: #e4477a;
border: 1px solid #ddb4c2;
font-size: 1.125rem;
font-weight: 600;
line-height: 1.5625rem;
padding: 6px 0 7px 0;
border-radius: 0.3125em;
text-align: center;
}
#all-gnb .set .dp2 > a:hover, #all-gnb .set .dp2 > a:focus, #all-gnb .set .dp2 > a:active {
color: #fff;
background-color: #e4477a;
}
#all-gnb .set .dp2 > a::before {
content: "";
position: absolute;
left: 0;
top: 4px;
width: 3px;
height: 18px;
display: inline-block;
margin-right: 10px;
vertical-align: top;
border-radius: 10px;
overflow: hidden;
margin-top: 1px;
}
#all-gnb .set .dp2 > a:focus::after, #all-gnb .set .dp2 > a:hover::after {
display: none;
}
#all-gnb .set .dp2 > a:focus span span, #all-gnb .set .dp2 > a:hover span span {
display: inline-block;
position: relative;
}
#all-gnb .set .dp2 > a:focus span span::after, #all-gnb .set .dp2 > a:hover span span::after {
content: "";
position: absolute;
width: 100%;
bottom: -2px;
left: 0;
border-bottom: 3px solid #005aab;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
#all-gnb .set .dp2 > a:focus span:focus span::after, #all-gnb .set .dp2 > a:focus span:hover span::after, #all-gnb .set .dp2 > a:hover span:focus span::after, #all-gnb .set .dp2 > a:hover span:hover span::after {
content: "";
position: absolute;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
#all-gnb .set .dp2 > a:focus span.on span::after, #all-gnb .set .dp2 > a:hover span.on span::after {
-webkit-transform: scaleX(1);
transform: scaleX(1);
font-weight: 700;
}
#all-gnb .set .dp2 > a i {
margin-left: 4px;
}
#all-gnb .set .dp2 > ul {
background-color: #000E18;
padding: 20px;
}
#all-gnb .set .dp2 > ul > li {
margin-bottom: 6px;
}
#all-gnb .set .dp2 > ul > li > a {
display: inline-block;
color: #fff;
font-size: 1.25rem;
line-height: 1.5rem;
padding-left: 14px;
text-indent: -14px;
position: relative;
}
#all-gnb .set .dp2 > ul > li > a::before {
content: "-";
display: inline-block;
margin-right: 8px;
text-indent: 0;
margin-top: -5px;
vertical-align: middle;
}
#all-gnb .set .dp2 > ul > li > a span {
display: inline-block;
position: relative;
}
#all-gnb .set .dp2 > ul > li > a span::after {
content: "";
position: absolute;
width: calc(100% - 14px);
bottom: -2px;
left: 14px;
border-bottom: 3px solid #005aab;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
#all-gnb .set .dp2 > ul > li > a:focus span::after, #all-gnb .set .dp2 > ul > li > a:hover span::after {
content: "";
position: absolute;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
#all-gnb .set .dp2 > ul > li > a.on span::after {
-webkit-transform: scaleX(1);
transform: scaleX(1);
font-weight: 700;
}
#all-gnb .set .dp2 > ul > li > a i {
margin-left: 4px;
}
#all-gnb .set .dp2 > ul > li > ul {
padding: 10px 14px;
}
#all-gnb .set .dp2 > ul > li > ul a span {
display: inline-block;
position: relative;
}
#all-gnb .set .dp2 > ul > li > ul a span::after {
content: "";
position: absolute;
width: 100%;
bottom: -2px;
left: 0;
border-bottom: 3px solid #005aab;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
#all-gnb .set .dp2 > ul > li > ul a:focus span::after, #all-gnb .set .dp2 > ul > li > ul a:hover span::after {
content: "";
position: absolute;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
#all-gnb .set .dp2 > ul > li > ul a.on span::after {
-webkit-transform: scaleX(1);
transform: scaleX(1);
font-weight: 700;
}
#all-gnb .set .dp2 > ul > li > ul > li > a {
font-size: 18px;
line-height: 28px;
}
#all-gnb .set .dp2 > ul > li > ul > li > ul {
padding-top: 5px;
padding-bottom: 10px;
}
#all-gnb .set .dp2 > ul > li > ul > li > ul > li > a {
line-height: 24px;
}
#all-gnb .set .dp2 > ul > li > ul > li > ul > li > a::before {
content: "•";
display: inline-block;
margin-right: 8px;
vertical-align: middle;
}

#mobile-gnb {
position: fixed;
right: -100%;
top: 0;
z-index: 10000;
background-color: rgba(0, 0, 0, 0.7);
width: 100%;
height: 100vh;
}
#mobile-gnb .nav {
background: #fff;
overflow-y: auto;
height: calc(100vh - 150px);
padding-bottom: 100px;
}
#mobile-gnb .top-nav-right .mem_g_info > i,
#mobile-gnb .top-nav-right .mem_g_info > em {
display: none;
}
#mobile-gnb .m-ctr {
display: none;
}
@media (max-width: 1199px) {
#mobile-gnb .m-ctr {
display: block;
position: absolute;
right: 0;
top: 0;
}
#mobile-gnb .m-ctr button {
float: left;
width: 80px;
height: 80px;
font-size: 32px;
color: #3d3d3d;
line-height: 80px;
text-align: center;
overflow: hidden;
}
#mobile-gnb .m-ctr a {
width: 42px;
}
}
@media (min-width: 1200px) {
#mobile-gnb {
display: none;
}
}
#mobile-gnb.active {
right: 0;
}
#mobile-gnb.active > .set {
right: 0;
width: 100%;
visibility: visible;
border-radius: 15px 0 0;
}
#mobile-gnb > .set {
position: absolute;
right: -100%;
visibility: hidden;
width: 0%;
max-width: 100%;
height: 100%;
-webkit-transition: all 0.5s;
transition: all 0.5s;
background-color: #fff;
}
#mobile-gnb .global-m {
position: relative;
background-color: #f0f0f0;
height: 80px;
border-radius: 15px 0 0;
}
#mobile-gnb .global-m a.eng {
color: #3d3d3d;
position: absolute;
top: 26px;
left: 16px;
}
#mobile-gnb .global-m a.m-search {
position: absolute;
top: 22px;
right: 56px;
font-size: 1.5rem;
color: #ffffff;
}
#mobile-gnb .global-m .mobile-gnb-close {
position: absolute;
right: 20px;
top: 23px;
font-size: 1.5rem;
color: rgb(135, 135, 135);
}
#mobile-gnb .global-m p {
color: rgb(249, 146, 8);
line-height: 1;
}
#mobile-gnb .global-m .logout {
display: block;
width: 120px;
border-radius: 1.25rem;
background-color: rgb(255, 255, 255);
margin: 17px auto 15px;
line-height: 1;
padding: 13px 0;
font-weight: 500;
}
#mobile-gnb .global-m .b {
color: rgb(249, 146, 8);
}
#mobile-gnb .global-m .b .la {
font-size: 1.125rem;
display: inline-block;
vertical-align: middle;
margin-top: -2px;
}
#mobile-gnb .global-m .b .time {
font-weight: 300;
}
#mobile-gnb .global-m .b .time-reset {
margin-left: 35px;
display: inline-block;
color: #ffffff;
border-bottom: 1px solid #ddd;
}
#mobile-gnb .global-m .top-nav-user > li + li {
margin-left: 10px;
}
#mobile-gnb li.on > ul, #mobile-gnb li.on > div {
display: block;
}
#mobile-gnb .dp1 {
border-bottom: 1px solid #ddd;
}
#mobile-gnb .dp1.one > a:before {
display: none;
}
#mobile-gnb .dp1 .title {
display: none;
}
#mobile-gnb .dp1 a {
display: block;
position: relative;
z-index: 1;
}
#mobile-gnb .dp1 > a {
padding: 16px 20px 17px 20px;
font-size: 18px;
color: rgb(0, 0, 0);
}
#mobile-gnb .dp1 > a::before {
content: "\f107";
display: inline-block;
-webkit-font-smoothing: antialiased;
text-rendering: auto;
font-family: "Line Awesome Free";
font-weight: 900;
font-style: normal;
font-variant: normal;
line-height: 1;
position: absolute;
right: 15px;
top: 18px;
-webkit-transition: -webkit-transform 0.3s;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
font-size: 24px;
}
#mobile-gnb .dp1 li {
display: none;
}
#mobile-gnb .dp1.on > div > div > ul {
display: block;
}
#mobile-gnb .dp1.on > div > div > ul > li {
display: block;
}
#mobile-gnb .dp1.on > a {
color: #fff;
}
#mobile-gnb .dp1.on > a::before {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
#mobile-gnb .dp1.on > a::after {
content: "";
background-color: #e4477a;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 60px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
z-index: -1;
}
#mobile-gnb .dp2 {
position: relative;
}
#mobile-gnb .dp2 > a {
color: #888;
padding: 13px 37px;
}
#mobile-gnb .dp2 > a::after {
content: "";
background-color: rgb(249, 146, 8);
width: 5px;
height: 5px;
border-radius: 3px;
position: absolute;
left: 20px;
top: 22px;
}
#mobile-gnb .dp2.on > a {
color: #e4477a;
}
#mobile-gnb .dp2.on > div > ul {
display: block;
background-color: #fff3f7;
padding: 10px 0;
}
#mobile-gnb .dp2.on > div > ul > li {
display: block;
position: relative;
padding: 3px 0;
}
#mobile-gnb .dp2.on > div > ul > li > a {
padding: 5px 10px 5px 47px;
line-height: 30px;
}
#mobile-gnb .dp2.on > div > ul > li > a::before {
content: "- ";
position: absolute;
left: 36px;
top: 4px;
vertical-align: middle;
}
#mobile-gnb .dp2.on > div > ul::before {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
#mobile-gnb .dp3-set {
border-top: 1px solid #e4e3e3;
}
#mobile-gnb .dp3-set > a {
padding: 10px 22px;
color: #888;
font-size: 0.875rem;
font-weight: 600;
}
#mobile-gnb .dp3-set > a::before {
content: "- ";
}
#mobile-gnb .dp3-set li.on > a {
color: #222;
}
#mobile-gnb .dp3-set li.on ul {
display: block;
background-color: #fff;
padding: 10px 0;
position: relative;
}
#mobile-gnb .dp3-set li.on ul > li {
display: block;
}
#mobile-gnb .dp3-set li.on > ul::before {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
#mobile-gnb .dp3-set li.on .dp4-set ul::after {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
#mobile-gnb .dp3-set > ul::before {
content: "\f105";
display: inline-block;
-webkit-font-smoothing: antialiased;
text-rendering: auto;
font-family: "Line Awesome Free";
font-weight: 900;
font-style: normal;
font-variant: normal;
line-height: 1;
position: absolute;
right: 15px;
top: 12px;
color: rgb(61, 61, 61);
font-size: 22px;
-webkit-transition: -webkit-transform 0.3s;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
#mobile-gnb .dp4-set {
margin: 0 20px;
}
#mobile-gnb .dp4-set ul {
position: relative;
}
#mobile-gnb .dp4-set ul::before, #mobile-gnb .dp4-set ul::after {
content: "";
position: absolute;
right: 10px;
top: -20px;
width: 13px;
height: 1px;
background-color: #e4477a;
-webkit-transition: -webkit-transform 0.3s;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
#mobile-gnb .dp4-set ul:after {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
#mobile-gnb .dp4-set ul li a {
color: #888;
padding: 5px 20px;
font-size: 15px;
}
#mobile-gnb .dp4-set ul li a::before {
content: "· ";
}
#mobile-gnb .dp4-set ul li:hover a, #mobile-gnb .dp4-set ul li:active a, #mobile-gnb .dp4-set ul li:focus a, #mobile-gnb .dp4-set ul li.acive a {
color: #0C9EBD;
text-decoration: underline;
font-weight: 600;
}

/* 검색창 */
.favkeyword {
font-size: 0.875rem;
margin-top: 7px;
padding-left: 10px;
}
.favkeyword dl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.favkeyword dt {
color: #000000;
margin-right: 13px;
line-height: 1;
background: url(/static/commons/img/vbar.png) no-repeat 100% 50%;
font-weight: 400;
padding-right: 10px;
}
.favkeyword dd {
line-height: 1;
white-space: nowrap;
overflow: hidden;
position: relative;
}
.favkeyword dd a {
display: inline-block;
padding: 0 5px;
color: #888;
}
.favkeyword .favkeywordList .item {
display: inline-block;
}
@media (max-width: 749px) {
.favkeyword {
display: none;
}
}

#search-set {
display: none;
padding: 50px 0;
position: absolute;
top: 72px;
left: 0;
width: 100%;
height: 198px;
background-color: #fff;
z-index: 1000;
border-top: 1px solid #ddd;
font-family: "SUIT";
}
@media (min-width: 1200px) {
#search-set {
top: 120px;
left: 0;
}
}
@media (min-width: 1800px) {
#search-set {
top: 104px;
}
}
.gnb-stiky #search-set {
position: fixed;
top: 60px;
z-index: 2000;
}
#search-set.active {
display: block;
}
#search-set.active::before {
content: "";
position: absolute;
top: 196px;
left: 0;
z-index: 10;
width: 100%;
height: 100vh;
background-color: rgba(0, 0, 0, 0.8);
-webkit-animation: show 0.25s linear;
animation: show 0.25s linear;
}
@media (max-width: 1199px) {
.gnb-stiky #search-set.active {
display: none;
}
}
#search-set .ctrl {
width: 100%;
margin: 0 auto;
position: relative;
top: 0;
right: 0;
z-index: 10000;
}
#search-set .ctrl .all-search-toggle-close {
position: absolute;
right: 52px;
top: -112px;
background: #de3a75 url(/static/commons/img/close.svg) no-repeat 50% 50%;
background-size: 16px 16px;
width: 50px;
height: 50px;
border-radius: 50%;
}
@media (min-width: 1200px) {
#search-set .ctrl .all-search-toggle-close {
right: 94px;
top: -154px;
}
}
@media (min-width: 1800px) {
#search-set .ctrl .all-search-toggle-close {
top: -148px;
}
}
.gnb-stiky #search-set .ctrl {
max-width: 1600px;
}
.gnb-stiky #search-set .ctrl .all-search-toggle-close {
right: 70px;
top: -105px;
}
#search-set .searchheader .header-search {
padding: 0;
}
#search-set .searchheader .header-search input[type=text] {
border: none;
border-bottom: 1px solid #0C9EBD;
border-radius: 0;
padding-right: 54px;
height: 50px;
line-height: 48px;
}
#search-set .searchheader .header-search .tshsubmit {
top: -3px;
width: 50px;
height: 50px;
background-color: #0C9EBD;
}
#search-set .searchheader .favkeyword {
margin-top: 20px;
width: 100%;
}
#search-set .searchheader .favkeyword .favkeywordList .item a {
border: 1px solid #ddd;
border-radius: 20px;
padding: 5px 10px;
}
#search-set .searchheader .favkeyword .favkeywordList .item a:hover, #search-set .searchheader .favkeyword .favkeywordList .item a:focus, #search-set .searchheader .favkeyword .favkeywordList .item a:active {
border-color: #0C9EBD;
font-weight: 600;
}

@-webkit-keyframes show {
0% {
opacity: 0.6;
}
50% {
opacity: 1;
}
}

@keyframes show {
0% {
opacity: 0.6;
}
50% {
opacity: 1;
}
}
@-webkit-keyframes logo {
0% {
opacity: 0.6;
}
50% {
opacity: 1;
}
}
@keyframes logo {
0% {
opacity: 0.6;
}
50% {
opacity: 1;
}
}
.detailSearch {
visibility: hidden;
opacity: 0;
width: 100%;
margin: 0 auto;
position: relative;
top: 24px;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
@media (min-width: 1200px) {
.detailSearch {
height: 0;
}
}
@media (max-width: 1199px) {
.detailSearch {
display: none;
}
}
.detailSearch .box-tsh {
background-color: #f8f7f5;
padding: 10px;
width: 100%;
}
.detailSearch .box-tsh::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 1px;
background-color: #e4477a;
}
.detailSearch .box-tsh label {
margin-right: 6px;
min-width: 40%;
font-weight: 600;
}
.detailSearch .box-tsh label + label {
margin-left: 0;
}
@media (max-width: 749px) {
.detailSearch .box-tsh label {
min-width: auto;
font-size: 14px;
}
}
.detailSearch .box-tsh .labelTit {
display: block;
color: #e4477a;
}
.detailSearch .box-tsh .btn {
background-color: #e4477a;
color: #fff;
border: none;
height: 40px;
min-width: 40px;
border-radius: 5px;
padding: 0;
}
.detailSearch .box-tsh .b-reset {
background-color: #fff;
color: #e4477a;
border: 1px solid #dddddd;
height: 40px;
min-width: 40px;
border-radius: 5px;
padding: 0;
}
.detailSearch .box-tsh .sdate,
.detailSearch .box-tsh .edate {
width: 140px;
}
@media (max-width: 749px) {
.detailSearch .box-tsh .sdate,
.detailSearch .box-tsh .edate {
width: 100px;
font-size: 12px;
}
}
.detailSearch .box-tsh .container-fluid > div {
margin-bottom: 10px;
padding-top: 10px;
}
.detailSearch .box-tsh dl dt,
.detailSearch .box-tsh dl dd {
display: inline-block;
}
.detailSearch .box-tsh dl dt {
vertical-align: top;
color: #005aab;
font-size: 18px;
position: relative;
padding-right: 30px;
}
.detailSearch .box-tsh dl dt::before {
content: "";
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
right: 20px;
width: 1px;
height: 16px;
background-color: #e4477a;
}
@media (max-width: 749px) {
.detailSearch .box-tsh dl dt {
font-size: 16px;
}
}
.detailSearch .box-tsh dl dd {
vertical-align: middle;
}
@media (max-width: 1199px) {
.detailSearch .box-tsh dl dd {
width: calc(100% - 131px);
}
}
.detailSearch .box-tsh dl dd label i {
-webkit-transform: scale(0.84);
transform: scale(0.84);
}
.detailSearch .box-tsh dl dd.date {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
margin-top: 20px;
}
@media (max-width: 749px) {
.detailSearch .box-tsh dl dd.date {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.detailSearch .box-tsh dl dd.date .btn {
margin: 0 5px;
}
@media (max-width: 1200px) {
.detailSearch .box-tsh dl dd.date {
width: 100%;
margin-top: 10px;
}
}
.detailSearch.active {
visibility: visible;
opacity: 1;
z-index: 2;
}
@media (max-width: 1199px) {
.detailSearch.active {
display: block;
}
}

input {
cursor: auto;
}

input[type=checkbox],
input[type=radio] {
opacity: 0;
position: relative;
z-index: 1;
width: 24px;
height: 24px;
vertical-align: middle;
}

input[type=number],
input[type=date],
input[type=text],
input[type=password],
input[type=file],
select,
textarea {
border: 1px solid #ccc;
background-color: #ffffff;
padding: 4px 10px;
line-height: 20px;
height: 40px;
vertical-align: middle;
border-radius: 5px;
}

input[type=checkbox]:hover + i,
input[type=checkbox]:focus + i,
input[type=radio]:hover + i,
input[type=radio]:focus + i {
outline: dotted 1px #000;
}

input[type=checkbox] + i,
input[type=radio] + i {
display: inline-block;
vertical-align: middle;
width: 24px;
height: 24px;
border: 1px solid #cfcfcf;
background-color: #fff;
border-radius: 5px;
text-align: center;
margin-right: 5px;
vertical-align: middle;
line-height: 1;
margin-left: -24px;
}

input[type=checkbox].checked + i:before,
input[type=checkbox]:checked + i:before,
input[type=radio].checked + i:before,
input[type=radio]:checked + i:before {
content: "";
margin-top: 5px;
width: 12px;
height: 12px;
background-color: #ce3b7a;
display: inline-block;
border-radius: 3px;
}

input[type=radio] + i {
border-radius: 50%;
}

input[type=radio]:checked + i:before {
border-radius: 50%;
}

#top-nav {
display: none;
position: relative;
z-index: 3000;
font-family: "SUIT", "맑은고딕", "malgun gothic", sans-serif;
/*.set {
    max-width: $mw;
    height: 40px;
    margin: 0 auto;
}*/
}
@media (min-width: 1200px) {
#top-nav {
display: block;
padding-top: 4px;
}
}
.gnb-stiky #top-nav {
display: none;
}
#top-nav .top-nav-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: calc(100% - 180px);
margin-left: -10px;
}
#top-nav .a {
line-height: 30px;
}
#top-nav .a:hover, #top-nav .a:focus, #top-nav .a:active {
color: #005aab;
}

.top-navlink {
display: none;
}
@media (min-width: 1200px) {
.top-navlink {
display: block;
background-color: #f2f2f2;
border-radius: 20px;
padding: 4px;
}
.top-navlink .f1 li a:hover, .top-navlink .f1 li a:focus, .top-navlink .f1 li a:active {
color: #005aab;
}
.top-navlink .f1 li a:hover::before, .top-navlink .f1 li a:hover::after, .top-navlink .f1 li a:focus::before, .top-navlink .f1 li a:focus::after, .top-navlink .f1 li a:active::before, .top-navlink .f1 li a:active::after {
background-color: #005aab;
}
.top-navlink .f2 li a:hover, .top-navlink .f2 li a:focus, .top-navlink .f2 li a:active {
color: #008890;
}
.top-navlink .f2 li a:hover::before, .top-navlink .f2 li a:hover::after, .top-navlink .f2 li a:focus::before, .top-navlink .f2 li a:focus::after, .top-navlink .f2 li a:active::before, .top-navlink .f2 li a:active::after {
background-color: #008890;
}
.top-navlink .f3 li a:hover, .top-navlink .f3 li a:focus, .top-navlink .f3 li a:active {
color: #0C9EBD;
}
.top-navlink .f3 li a:hover::before, .top-navlink .f3 li a:hover::after, .top-navlink .f3 li a:focus::before, .top-navlink .f3 li a:focus::after, .top-navlink .f3 li a:active::before, .top-navlink .f3 li a:active::after {
background-color: #0C9EBD;
}
.top-navlink .f4 .on + div {
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
}
.top-navlink .f4 > div {
padding: 20px 20px 0 20px;
text-align: center;
}
.top-navlink .f4 > div > ul > li {
padding: 0px 20px;
}
.top-navlink .f4 > div dt {
display: block;
background: #D8761F;
color: #fff;
height: 34px;
line-height: 34px;
border-radius: 5px;
font-weight: bold;
margin-bottom: 5px;
}
.top-navlink .f4 > div dd li {
margin-bottom: 5px;
}
.top-navlink .f4 > div dd a {
display: block;
color: #D8761F;
border: 1px solid #D8761F;
border-radius: 5px;
height: 30px;
line-height: 28px !important;
padding: 0;
}
.top-navlink .f5 li a:hover, .top-navlink .f5 li a:focus, .top-navlink .f5 li a:active {
color: #fa5778;
}
.top-navlink .f5 li a:hover::before, .top-navlink .f5 li a:hover::after, .top-navlink .f5 li a:focus::before, .top-navlink .f5 li a:focus::after, .top-navlink .f5 li a:active::before, .top-navlink .f5 li a:active::after {
background-color: #fa5778;
}
.top-navlink .f6 li a:hover, .top-navlink .f6 li a:focus, .top-navlink .f6 li a:active {
color: #D8761F;
}
.top-navlink .f6 li a:hover::before, .top-navlink .f6 li a:hover::after, .top-navlink .f6 li a:focus::before, .top-navlink .f6 li a:focus::after, .top-navlink .f6 li a:active::before, .top-navlink .f6 li a:active::after {
background-color: #D8761F;
}
.top-navlink > ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.top-navlink > ul > li.active > a {
color: #de3a75;
}
.top-navlink > ul > li:last-child > a::after {
display: none;
}
.top-navlink > ul > li > a {
display: block;
line-height: 26px;
padding: 0 16px;
color: #545454;
position: relative;
font-weight: 600;
}
.top-navlink > ul > li > a::after {
content: "";
width: 1px;
height: 8px;
background-color: #c2c2c2;
position: absolute;
right: 0;
top: 10px;
}
.top-navlink > ul > li > a:hover + div, .top-navlink > ul > li > a:focus + div, .top-navlink > ul > li > a:active + div, .top-navlink > ul > li > a.on + div {
display: block;
}
.top-navlink > ul > li > a + div {
display: none;
}
.top-navlink li > div {
position: absolute;
top: 38px;
background-color: #fff;
border: 2px solid #f0f0f0;
border-top-width: 0;
margin-left: -2px;
}
.top-navlink li > div > ul {
padding-top: 10px;
padding-bottom: 10px;
}
.top-navlink li > div > ul > li > a {
display: block;
padding: 0 40px 0 30px;
line-height: 30px;
position: relative;
font-size: 16px;
}
.top-navlink li > div > ul > li > a i {
position: absolute;
font-size: 20px;
right: 10px;
top: 6px;
}
.top-navlink li > div > ul > li > a::before {
content: "";
position: absolute;
left: 17px;
top: 13px;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #888;
}
.top-navlink .department {
width: 540px;
float: left;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
margin-left: -5px;
margin-right: -5px;
padding-right: 20px;
}
.top-navlink .department dl {
float: left;
width: 25%;
padding: 0 5px;
}
.top-navlink .department dl ul {
margin-bottom: 20px;
}
.top-navlink .department + div {
padding-left: 20px;
border-left: 1px solid #005aab;
}
.top-navlink .department + div dt,
.top-navlink .department + div dd {
width: 250px;
}
.top-navlink .department + div ul {
margin-left: -5px;
margin-right: -5px;
}
.top-navlink .department + div ul li {
padding: 0 5px;
width: 50%;
float: left;
}
.top-navlink .center {
border-left: 1px solid #7fc5e6;
width: 190px;
float: right;
width: calc(16% + 30px);
padding: 0 15px;
}
.top-navlink .yongsan-list dl {
float: left;
width: 39%;
padding: 0 10px;
border-left: 1px solid #7fc5e6;
min-height: 440px;
}
.top-navlink .yongsan-list dl:last-child {
width: 22%;
}
.top-navlink .f8 .yongsan-list ul {
padding: 8px 0;
float: left;
width: 50%;
}
}

.top-nav-right {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 18px;
margin-left: auto;
}
#mobile-gnb .top-nav-right {
margin: 0 0 0 18px;
height: 80px;
}
.top-nav-right .top-nav-user {
position: relative;
z-index: 10;
color: #fff;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.top-nav-right .top-nav-user > li {
position: relative;
}
.top-nav-right .top-nav-user > li + li {
margin-left: 10px;
}
#mobile-gnb .top-nav-right .top-nav-user > li + li {
margin: 0;
}
.top-nav-right .top-nav-user > li:not(:last-child)::after {
content: "";
width: 3px;
height: 3px;
border-radius: 50%;
background-color: #505050;
position: absolute;
top: 15px;
right: -10px;
}
#mobile-gnb .top-nav-right .top-nav-user > li:not(:last-child)::after {
display: none;
}
@media (min-width: 1200px) {
.top-nav-right .top-nav-user > li:last-child::after {
display: none;
}
}
.top-nav-right .top-nav-user > li a {
color: #141414;
display: inline-block;
padding: 0 10px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
line-height: 30px;
font-weight: 500;
}
#mobile-gnb .top-nav-right .top-nav-user .mem_g_info em,
#mobile-gnb .top-nav-right .top-nav-user .mem_g_info i.mem_gp {
display: none;
}
@media (min-width: 1182px) {
.top-nav-right .top-nav-user .mem_g_info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
/*display: inline-block;
vertical-align: middle;*/
}
.top-nav-right .top-nav-user .mem_g_info .mem_gp,
.top-nav-right .top-nav-user .mem_g_info .mem_nm {
display: none;
}
.top-nav-right .top-nav-user .mem_g_info .mem_gp.active,
.top-nav-right .top-nav-user .mem_g_info .mem_nm.active {
display: inline-block;
}
.top-nav-right .top-nav-user .mem_g_info em.mem_nm {
display: inline-block;
vertical-align: baseline;
width: auto;
color: #141414;
line-height: 20px;
}
.top-nav-right .top-nav-user .mem_gp {
font-size: 14px;
color: white;
background: #00ab4e;
height: 18px;
border-radius: 9px;
line-height: 18px;
padding: 0 8px;
text-align: center;
vertical-align: middle;
display: inline-block;
}
.top-nav-right .top-nav-user .mem_gp.not_mem {
background: #d8761f;
}
.top-nav-right .top-nav-user em {
display: inline-block;
vertical-align: middle;
background-repeat: no-repeat;
width: 20px;
height: 20px;
margin-left: 2px;
line-height: 1;
}
.top-nav-right .top-nav-user em.sns_nv {
background: url(/static/commons/img/sns_naver.png);
}
.top-nav-right .top-nav-user em.sns_kt {
background: url(/static/commons/img/sns_kakao.png);
}
.top-nav-right .top-nav-user em.sns_fb {
background: url(/static/commons/img/sns_facebook.png);
}
.top-nav-right .top-nav-user em.sns_gl {
background: url(/static/commons/img/sns_google.png);
}
}
.top-nav-right .lang {
position: relative;
margin-left: 10px;
}
#mobile-gnb .top-nav-right .lang {
position: static;
margin: 0;
}
.top-nav-right .lang button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 32px;
padding: 2px 16px;
color: #2c2c2c;
font-family: Montserrat;
font-weight: 600;
border-radius: 16px;
background-color: #f2f2f2;
}
@media (max-width: 1200px) {
.top-nav-right .lang button {
color: #3d3d3d;
}
}
.top-nav-right .lang button.on + div {
display: block;
}
#mobile-gnb .top-nav-right .lang button {
display: block;
}
.top-nav-right .lang > div {
position: absolute;
z-index: 10010;
display: none;
background: #fff;
border: 2px solid #e3e3e3;
border-top-width: 0;
width: 100%;
left: 0;
}
.top-nav-right .lang > div ul {
padding: 5px 0;
}
.top-nav-right .lang > div li {
position: relative;
display: block;
width: 100%;
}
.top-nav-right .lang > div li a {
padding: 0 0 0 30px;
line-height: 30px;
display: block;
}
.top-nav-right .lang > div li a::before {
content: "";
position: absolute;
left: 17px;
top: 13px;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #888;
}
.top-nav-right .lang > div li a:hover::before, .top-nav-right .lang > div li a:focus::before, .top-nav-right .lang > div li a:active::before {
background-color: #888;
}
.top-nav-right [class^=ico] {
margin-right: 4px;
}

.navtab-total-m {
background-color: #939393;
height: 60px;
padding: 3px 2px 0;
}
.navtab-total-m button {
background: transparent;
height: 57px;
width: 50%;
float: left;
color: #fff;
}
.navtab-total-m button span {
display: inline-block;
font-size: 18px;
}
.navtab-total-m button.on {
background-color: #fff;
color: #939393;
border-radius: 10px 10px 0 0;
}

#nav-toplink-m {
display: none;
position: fixed;
left: 0;
top: 140px;
width: 100%;
height: 100vh;
overflow-y: auto;
z-index: 10001;
}
@media (max-width: 1199px) {
#nav-toplink-m.active {
display: block;
}
#nav-toplink-m.active .toplink-m {
right: 0;
}
#nav-toplink-m .toplink-m {
position: absolute;
background-color: #fff;
position: absolute;
right: -100%;
top: 0;
width: 100%;
max-width: 100%;
height: 100%;
overflow-y: auto;
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
#nav-toplink-m .top-navlink {
display: block;
width: 100%;
}
#nav-toplink-m .top-navlink > ul > li.f1 > div, #nav-toplink-m .top-navlink > ul > li.f2 > div, #nav-toplink-m .top-navlink > ul > li.f3 > div, #nav-toplink-m .top-navlink > ul > li.f5 > div, #nav-toplink-m .top-navlink > ul > li.f6 > div {
display: none;
}
#nav-toplink-m .top-navlink > ul > li > a {
display: block;
line-height: 60px;
padding: 0 20px;
border-bottom: 1px solid #ddd;
font-size: 18px;
color: #000;
position: relative;
z-index: 1;
}
#nav-toplink-m .top-navlink > ul > li > a::after {
content: "\f107";
display: inline-block;
-webkit-font-smoothing: antialiased;
text-rendering: auto;
font-family: "Line Awesome Free";
font-weight: 900;
font-style: normal;
font-variant: normal;
line-height: 1;
color: #005aab;
float: right;
line-height: 60px;
}
#nav-toplink-m .top-navlink > ul > li.active > a {
color: #fff;
}
#nav-toplink-m .top-navlink > ul > li.active > a::before {
content: "";
background-color: #D8761F;
position: absolute;
width: 100%;
height: 60px;
left: 0;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
z-index: -1;
}
#nav-toplink-m .top-navlink > ul > li.active > a::after {
color: #fff;
}
#nav-toplink-m .top-navlink > ul > li.f4.active > div {
display: block;
}
#nav-toplink-m .top-navlink > ul > li > div {
display: none;
}
#nav-toplink-m .top-navlink > ul > li > div > ul > li > a {
display: block;
line-height: 50px;
padding: 0 31px;
border-bottom: 1px solid #ddd;
}
#nav-toplink-m .top-navlink > ul > li > div > ul > li > a::before {
content: "";
width: 5px;
height: 5px;
display: inline-block;
vertical-align: middle;
background-color: #ddd;
margin-right: 11px;
border-radius: 3px;
}
#nav-toplink-m dt {
display: block;
line-height: 50px;
padding: 0 37px;
border-bottom: 1px solid #ddd;
background-color: #fff;
}
#nav-toplink-m dt::before {
content: "";
width: 5px;
height: 5px;
display: inline-block;
vertical-align: middle;
background-color: #ddd;
margin-right: 11px;
border-radius: 3px;
}
#nav-toplink-m dt.active {
color: #D8761F;
background-color: #FDF8F4;
}
#nav-toplink-m dt.active::before {
background-color: #D8761F;
}
#nav-toplink-m dd {
display: block;
background-color: #F2FCFE;
padding: 20px 36px;
}
#nav-toplink-m dd a {
display: block;
color: #757575;
line-height: 35px;
}
#nav-toplink-m dd a::before {
content: "- ";
}
#nav-toplink-m dd a.active, #nav-toplink-m dd a:hover, #nav-toplink-m dd a:focus, #nav-toplink-m dd a:active {
color: #005aab;
text-decoration: underline;
}
}

.weather-box {
display: none;
margin-right: 26px;
font-family: "SUIT";
}
@media (min-width: 1200px) {
.weather-box {
display: block;
position: relative;
}
}
@media (min-width: 1200px) and (max-width: 1799px) {
.weather-box {
position: absolute;
top: 4px;
right: 188px;
}
}
@media (min-width: 750px) {
.weather-box {
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.weather-box .weather {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
@media (min-width: 1800px) {
.weather-box .weather {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
@media (max-width: 1800px) {
.weather-box .weather .temper img {
height: 22px;
}
}
@media (min-width: 1200px) and (max-width: 1799px) {
.weather-box .weather .temper img {
vertical-align: middle;
}
}
.weather-box .weather .temper .w1 {
line-height: 1;
margin: 0 6px;
color: #2e2e2e;
font-size: 22px;
}
.weather-box .weather .temper .w1 small {
font-size: 14px;
}
.weather-box .weather .temper .w2 {
color: #2e2e2e;
font-size: 16px;
}
.weather-box .weather .cleanair {
margin-left: 10px;
}
@media (max-width: 1800px) {
.weather-box .weather .cleanair {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
}
}
.weather-box .weather .cleanair .t1,
.weather-box .weather .cleanair .t2 {
margin-right: 4px;
}
.weather-box .weather .cleanair > ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media (max-width: 1800px) {
.weather-box .weather .cleanair > ul {
margin-left: 10px;
}
}
@media (min-width: 1200px) and (max-width: 1799px) {
.weather-box .weather .cleanair > ul {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
}
}
.weather-box .weather .cleanair > ul > li {
font-size: 14px;
line-height: 1.38;
color: #555;
font-weight: 500;
}
@media (min-width: 750px) {
.weather-box .weather .cleanair > ul > li {
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.weather-box .weather .cleanair > ul > li:first-child {
position: relative;
padding-right: 7px;
}
@media (min-width: 1475px) {
.weather-box .weather .cleanair > ul > li:first-child::after {
content: "";
display: block;
position: absolute;
top: 4px;
right: 0;
width: 1px;
height: 10px;
background: #b7b7b7;
}
}
@media (min-width: 1475px) {
.weather-box .weather .cleanair > ul > li:last-child {
padding-left: 7px;
}
}
.weather-box .weather .cleanair > ul > li > span > i {
margin-right: 4px;
vertical-align: sub;
}
.weather-box .disaster {
position: absolute;
top: 0;
left: 10px;
width: 222px;
height: 80px;
margin-left: auto;
font-family: Gmarket Sans;
border-radius: 16px;
background: #fceede url(/static/portal/img/main2022/disaster/disaster-bg.png) no-repeat center;
}
@media (max-width: 1799px) {
.weather-box .disaster {
display: none;
}
}
@media (max-width: 1199px) {
.weather-box .disaster {
max-width: 154px;
height: 60px;
}
}
.weather-box .disaster .disaster-popup-open {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 12px;
padding: 12px 26px 12px 14px;
}
@media (min-width: 750px) {
.weather-box .disaster .disaster-popup-open {
padding: 8px 26px 8px 10px;
}
}
@media (min-width: 1200px) {
.weather-box .disaster .disaster-popup-open {
padding: 16px 22px;
}
}
.weather-box .disaster .disaster-popup-open .ico {
-ms-flex-preferred-size: 32px;
flex-basis: 32px;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.weather-box .disaster .tit {
font-size: clamp(14px, 1.4vw, 18px);
font-weight: 900;
color: #2f334c;
}
.weather-box .disaster .tit .orange {
font-weight: 500;
}
.weather-box .disaster .txts {
font-size: clamp(10px, 0.83vw, 12px);
font-weight: 500;
color: #444;
line-height: 1.27;
}
@media (max-width: 749px) {
.weather-box .disaster .txts {
line-height: 1.11;
}
}
.weather-box .disaster .txts > * {
display: block;
}
.weather-box .disaster .disaster-close {
position: absolute;
top: 0;
right: 0;
width: 24px;
height: 24px;
margin: 2px;
background: url(/static/portal/img/main2022/disaster/ico-closeBtn.png) no-repeat center;
background-size: 20px 20px;
}
@media (min-width: 1340px) {
.weather-box .disaster .disaster-close {
top: -18px;
right: -18px;
}
}
.gnb-stiky .weather-box {
display: none;
}

.disaster-popup-bg {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3098039216);
z-index: 9999;
}
@media (max-width: 1799px) {
.disaster-popup-bg {
display: none;
}
}

.disaster-popup {
position: absolute;
top: 146px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 100%;
max-width: 1460px;
z-index: 9999;
font-family: Gmarket Sans;
}
@media (max-width: 1799px) {
.disaster-popup {
display: none;
}
}
@media (max-width: 1199px) {
.disaster-popup {
top: 30px;
}
}
@media (max-width: 749px) {
.disaster-popup {
top: -52px;
}
}
.disaster-popup__box {
max-width: 400px;
background-color: #fff;
margin-left: auto;
border-radius: 16px;
font-family: Gmarket Sans;
}
@media (max-width: 1199px) {
.disaster-popup__box {
top: 130px;
}
}
.disaster-popup__box > div {
text-align: center;
background: #fff url(/static/portal/img/main2022/disaster/disaster-popup-bg.png) no-repeat 0 0;
border-radius: 16px 16px 0 0;
}
.disaster-popup__box > .tit {
padding: 22px 20px 12px 20px;
}
.disaster-popup__box > .tit h3 {
height: 56px;
margin-left: 24px;
font-weight: 800;
font-size: 28px;
color: #2f334c;
letter-spacing: -0.88px;
}
.disaster-popup__box > .tit h3:after {
content: "";
display: inline-block;
width: 29px;
height: 29px;
background: url(/static/portal/img/main2022/disaster/ico-speaker.png) no-repeat 3px 2px;
}
.disaster-popup__box > .tit h3 > span {
display: block;
padding-right: 30px;
line-height: 16px;
font-size: 18px;
font-weight: 500;
}
.disaster-popup__box > .tit p {
max-width: 264px;
height: 32px;
padding: 8px;
color: #fff;
font-size: 14px;
margin: 0 auto;
border-radius: 14px;
background-color: #2f334c;
}
.disaster-popup__box .disaster-list {
padding: 0 10px 10px;
overflow-x: hidden;
overflow-y: auto;
max-height: 498px;
}
.disaster-popup__box .disaster-list::-webkit-scrollbar {
width: 8px;
}
.disaster-popup__box .disaster-list::-webkit-scrollbar-thumb {
background: #eee;
height: 256px;
border-radius: 20px;
}
.disaster-popup__box .disaster-list::-webkit-scrollbar-thumb:hover {
background-color: #ddd;
}
.disaster-popup__box .disaster-list li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
padding: 12px 22px 10px 24px;
border-radius: 14px;
border: 1px solid #ddd;
}
.disaster-popup__box .disaster-list li > div {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.disaster-popup__box .disaster-list li > div img {
max-width: 28px;
}
.disaster-popup__box .disaster-list li > div .tit {
padding: 6px 0 0 6px;
font-size: 18px;
font-weight: 900;
color: #2f334c;
}
.disaster-popup__box .disaster-list li > div .tit .orange {
margin-left: 4px;
}
.disaster-popup__box .disaster-list li .time {
font-size: 14px;
font-weight: 600;
}
.disaster-popup__box .disaster-list li .time .black {
padding-left: 6px;
}
.disaster-popup__box .disaster-list li .txt {
width: 100%;
padding: 8px 0 0 34px;
margin-top: 2px;
font-size: 14px;
font-weight: 600;
line-height: 1.36;
color: #434343;
border-top: 1px solid #ddd;
}
.disaster-popup__box .disaster-list li + li {
margin-top: 14px;
}
.disaster-popup__close {
position: absolute;
top: 0;
right: 0;
width: 26px;
height: 26px;
margin: 2px;
background: url(/static/portal/img/main2022/disaster/ico-closeBtn.png) no-repeat center;
background-size: 23px 23px;
}
@media (min-width: 1340px) {
.disaster-popup__close {
top: 4px;
right: 8px;
}
}

.i-good {
display: inline-block;
width: 19px;
height: 19px;
background: url(/static/portal/img/main2024/i-emoji01.png) no-repeat center;
}

.i-normal {
display: inline-block;
width: 19px;
height: 19px;
background: url(/static/portal/img/main2024/i-emoji02.png) no-repeat center;
}

.i-bad {
display: inline-block;
width: 19px;
height: 19px;
background: url(/static/portal/img/main2024/i-emoji03.png) no-repeat center;
}

.i-veryBad {
display: inline-block;
width: 19px;
height: 19px;
background: url(/static/portal/img/main2024/i-emoji04.png) no-repeat center;
}

/* Slider */
.slick-slider {
position: relative;
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}

.slick-list {
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}

.slick-list:focus {
outline: none;
}

.slick-list.dragging {
cursor: pointer;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}

.slick-track {
position: relative;
top: 0;
left: 0;
display: block;
}

.slick-track:before,
.slick-track:after {
display: table;
content: "";
}

.slick-track:after {
clear: both;
}

.slick-loading .slick-track {
visibility: hidden;
}

.slick-slide {
display: none;
float: left;
height: 100%;
min-height: 1px;
}

[dir=rtl] .slick-slide {
float: right;
}

.slick-slide img {
display: block;
}

.slick-slide.slick-loading img {
display: none;
}

.slick-slide.dragging img {
pointer-events: none;
}

.slick-initialized .slick-slide {
display: block;
}

.slick-loading .slick-slide {
visibility: hidden;
}

.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
display: none;
}

.c200171 {
background-color: #f9f9f9;
margin-top: 25px;
margin-bottom: 30px;
text-align: center;
padding: 20px 0 30px;
}
@media (max-width: 749px) {
.c200171 {
display: none;
}
}
.c200171 .map {
float: none;
margin: 0 auto;
display: inline-block;
}
.c200171 #canvas {
display: none;
}
.map {
position: relative;
background: url(/static/portal/img/main/map-bg.png) 0 0 no-repeat;
float: left;
}
.map canvas {
position: absolute;
z-index: 9;
}
.map .over {
z-index: 10;
position: absolute;
left: 0;
top: 70px;
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
.map .over.l .s {
left: -28px;
background-position: right 0;
padding-left: 0;
padding-right: 27px;
}
.map .over.l .s span {
margin-left: 0;
margin-right: 20px;
}
.map .over.l .s span::before {
left: auto;
right: -10px;
border-right: none;
border-left: 14px solid #353535;
}
.map .over.active .s {
opacity: 1;
}
.map .over .s {
position: absolute;
left: -5px;
bottom: -4px;
background: url(/static/portal/img/main/map-pin-on.png) 0 0 no-repeat;
padding-left: 27px;
height: 44px;
opacity: 0;
}
.map .over .s span {
display: block;
padding: 8px 13px;
font-size: 1.688rem;
font-weight: 500;
line-height: 1;
color: #ffffff;
background-color: #353535;
border-radius: 4px;
margin-left: 8px;
position: relative;
}
.map .over .s span::before {
content: "";
position: absolute;
left: -10px;
top: 11px;
width: 0;
height: 0;
border-top: 11px solid transparent;
border-bottom: 11px solid transparent;
border-right: 14px solid #353535;
}
.map .amap {
position: relative;
z-index: 20;
}
.map .amap area {
outline: 1px solid;
outline: 0;
}

.sh-more-set {
margin: 20px 0;
}
.sh-more-set .set {
border-top: 1px solid #ddd;
}
.sh-more-set .set dl {
border-bottom: 1px solid #ddd;
display: table;
table-layout: fixed;
width: 100%;
}
.sh-more-set .set dl > * {
display: table-cell;
padding: 8px;
height: 56px;
vertical-align: middle;
}
@media (max-width: 749px) {
.sh-more-set .set dl > * {
display: block;
height: auto;
}
}
.sh-more-set .set dl dt {
width: 15%;
background-color: #f6f6f6;
text-align: center;
}
@media (max-width: 749px) {
.sh-more-set .set dl dt {
width: auto;
}
}
@media (min-width: 750px) {
.sh-more-set .set .date-set {
display: inline-block;
vertical-align: middle;
width: 330px;
}
}
@media (max-width: 749px) {
.sh-more-set .set .date-set {
display: block;
margin-bottom: 10px !important;
display: block;
}
.sh-more-set .set .date-set:before, .sh-more-set .set .date-set:after {
display: block;
height: 0;
clear: both;
visibility: hidden;
content: ".";
}
}
.sh-more-set .set .date-set .sdate {
float: left;
}
.sh-more-set .set .date-set .sdate,
.sh-more-set .set .date-set .edate {
width: calc(50% - 5px);
-webkit-appearance: none !important;
white-space: nowrap;
}
.sh-more-set .set .date-set .edate {
float: right;
}
@media (min-width: 1200px) {
.sh-more-set .set .range {
margin-left: 10px;
}
}
@media (min-width: 1200px) {
.sh-more-set .set .range label {
margin-right: 5px;
}
}
.sh-more-set .sh-more-set--submit {
margin-top: 20px;
text-align: center;
}

.tsh-search {
border: 0.063rem solid #ddd;
background-color: #f9f9fb;
padding: 20px;
text-align: center;
margin-bottom: 40px;
}
.tsh-search .s {
display: inline-block;
max-width: 533px;
width: 100%;
padding-right: 68px;
position: relative;
vertical-align: middle;
}
.tsh-search .s input[type=text] {
float: left;
width: 100%;
vertical-align: middle;
height: 40px;
border-right-width: 0;
}
.tsh-search .s button {
position: absolute;
right: 0;
top: 0;
vertical-align: middle;
width: 68px;
background-color: #555555;
color: #ffffff;
height: 40px;
}
.tsh-search label {
display: inline-block;
vertical-align: middle;
line-height: 40px;
color: #333;
font-size: 1.125rem;
font-weight: 500;
line-height: 2.44;
letter-spacing: -0.017rem;
}
@media (min-width: 1200px) {
.tsh-search label {
margin-left: 16px;
}
}

.tsh-result-infor {
padding: 11px 0 36px;
color: #333;
font-size: 1.25rem;
font-weight: 400;
line-height: 1.3;
text-align: center;
border-bottom: 1px solid #2276d2;
}
.tsh-result-infor strong {
color: #d0319b;
letter-spacing: -0.019rem;
}

mark {
color: #005aab;
background-color: #fff;
}

.tsh-result-set section {
margin: 20px 0;
padding-bottom: 30px;
border-bottom: 1px solid #ddd;
}
.tsh-result-set section:last-child {
border-bottom-width: 0;
}
.tsh-result-set section h1 {
float: left;
font-weight: 400;
line-height: 1.8;
color: #005aab;
font-size: 1.375rem;
letter-spacing: -0.021rem;
line-height: 1;
padding-top: 29px;
}
@media (max-width: 749px) {
.tsh-result-set section h1 {
font-size: 16px;
padding-top: 20px;
}
}
.tsh-result-set section h1 span {
color: #333;
font-weight: 400;
font-size: 1.25rem;
}
@media (max-width: 749px) {
.tsh-result-set section h1 span {
font-size: 1rem;
}
}
.tsh-result-set section h1 strong {
color: #d0319b;
letter-spacing: -0.019rem;
}
.tsh-result-set section .btns {
float: right;
}
.tsh-result-set section .btns a {
width: 124px;
min-width: 0;
}
.tsh-result-set .tsh-result-list {
clear: both;
padding-top: 18px;
}
.tsh-result-set .tsh-result-list ul li + li {
margin-top: 20px;
}
.tsh-result-set .tsh-result-list a {
display: block;
border: 1px solid #ddd;
padding: 21px 28px;
}
@media (max-width: 749px) {
.tsh-result-set .tsh-result-list a {
padding: 10px;
}
}
.tsh-result-set .tsh-result-list a em {
color: #333;
font-size: 1.188rem;
font-weight: 400;
line-height: 1.89;
letter-spacing: -0.017rem;
}
.tsh-result-set .tsh-result-list a span {
display: block;
}
.tsh-result-set .tsh-result-list a .bu-dot + .bu-dot, .tsh-result-set .tsh-result-list a .list-tsh > li > ul > li + .bu-dot, .tsh-result-set .tsh-result-list a .list-tsh > li > ul > .bu-dot + li, .tsh-result-set .tsh-result-list a .list-tsh > li > ul > li + li, .tsh-result-set .tsh-result-list a .list-tsh > li .txt + .bu-dot, .tsh-result-set .tsh-result-list a .list-tsh > li > ul > .txt + li, .list-tsh > li .tsh-result-set .tsh-result-list a .txt + .bu-dot, .tsh-result-set .tsh-result-list a .list-tsh > li .bu-dot + .txt, .tsh-result-set .tsh-result-list a .list-tsh > li > ul > li + .txt, .list-tsh > li .tsh-result-set .tsh-result-list a .bu-dot + .txt, .tsh-result-set .tsh-result-list a .list-tsh > li .txt + .txt, .list-tsh > li .tsh-result-set .tsh-result-list a .txt + .txt {
margin-top: 7px;
}

@media (max-width: 749px) {
.tsh--movielist {
margin: 0 -5px;
display: block;
}
.tsh--movielist:before, .tsh--movielist:after {
display: block;
height: 0;
clear: both;
visibility: hidden;
content: ".";
}
}
.tsh--movielist li {
margin-bottom: 15px;
}
@media (max-width: 749px) {
.tsh--movielist li {
float: left;
width: 50%;
padding: 0 5px;
}
}
.tsh--movielist li a {
display: block;
display: block;
}
.tsh--movielist li a:before, .tsh--movielist li a:after {
display: block;
height: 0;
clear: both;
visibility: hidden;
content: ".";
}
.tsh--movielist li a span {
display: block;
}
.tsh--movielist li a .img {
float: left;
margin-right: 20px;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
width: 200px;
border: 1px solid #ddd;
}
.tsh--movielist li a .img::before {
content: "";
display: block;
padding-top: 66%;
}
@media (max-width: 749px) {
.tsh--movielist li a .img {
float: none;
margin: 0;
width: 100%;
}
}
.tsh--movielist li a .subject {
font-size: 18px;
font-weight: 700;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
@media (max-width: 749px) {
.tsh--movielist li a .subject {
font-size: 1rem;
}
}
.tsh--movielist li a .deco {
color: #757575;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
@media (max-width: 749px) {
.tsh--movielist li a .deco {
font-size: 0.875rem;
}
}
.tsh--movielist li a .deco i {
color: #e1e1e1;
display: inline-block;
margin: 0 4px;
}
@media (max-width: 749px) {
.tsh--movielist li a .location {
display: none;
}
}

.tsh-nodata {
padding-top: 100px;
font-size: 20px;
text-align: center;
font-weight: 700;
color: #525d63;
}
.tsh-nodata .sh-result-nodata {
background: url(/static/portal/img/common/sh-result-nodata.png) center 0 no-repeat;
display: block;
height: 142px;
margin-bottom: 25px;
}
@media (max-width: 749px) {
.tsh-nodata .sh-result-nodata {
background-size: 127.5px auto;
height: 72px;
}
}
@media (max-width: 749px) {
.tsh-nodata {
padding-top: 25px;
}
}

.tsh-content {
margin-top: 40px;
overflow: hidden;
}
.tsh-content mark {
color: #D8761F !important;
}
.tsh-content .hgroup {
margin-bottom: 30px;
}
.tsh-content .hgroup h2 {
font-size: 22px;
}
@media (max-width: 749px) {
.tsh-content .hgroup h2 {
font-size: 18px;
}
}
@media (min-width: 750px) {
.tsh-content .left {
float: left;
width: calc(100% - 280px);
}
}
@media (min-width: 750px) {
.tsh-content .right {
float: right;
width: 240px;
}
}
@media (max-width: 749px) {
.tsh-content .right {
margin-top: 20px;
}
}
.tsh-content .tsh-list .bu1 {
margin-bottom: 0;
}
.tsh-content .tsh-list .more {
margin-bottom: 20px;
margin-top: -27px;
text-align: right;
font-size: 18px;
border-bottom: 1px solid #ddd;
padding-bottom: 10px;
position: relative;
z-index: 1;
}
.tsh-content .tsh-list .bu-dot, .tsh-content .tsh-list .list-tsh > li > ul > li, .tsh-content .tsh-list .list-tsh > li .txt, .list-tsh > li .tsh-content .tsh-list .txt {
font-weight: 400;
margin-top: 5px;
font-size: 1rem;
}
.tsh-content .tsh-list .location {
margin-left: 15px;
margin-top: 5px;
font-size: 15px;
font-weight: 300;
color: #000000;
}
@media (max-width: 749px) {
.tsh-content .tsh-list .location {
margin-left: 0;
}
}
.tsh-content .tsh-list .location strong {
font-weight: 700;
}
.tsh-content .tsh-list .location i {
color: #757575;
}
.tsh-content .tsh-list .location i.vline {
font-size: 13px;
font-family: arial;
margin: -2px 5px 0;
display: inline-block;
vertical-align: middle;
}
.tsh-content .tsh-list .tsh--filelist {
margin-left: 30px;
}
@media (max-width: 749px) {
.tsh-content .tsh-list .tsh--filelist {
margin-left: 0;
}
}
.tsh-content .tsh-list .tsh--filelist > li {
margin-top: 20px;
}
@media (max-width: 749px) {
.tsh-content .tsh-list .tsh--filelist > li .location {
margin-left: 15px;
}
}
.tsh-content .tsh-list .tsh--filelist a i {
margin-left: 10px;
vertical-align: top;
}
.tsh-content .sidebox {
border: 1px solid rgba(218, 218, 218, 0.5);
margin-bottom: 30px;
}
.tsh-content .sidebox h2 {
font-size: 1rem;
color: #525d63;
padding: 12px 20px;
border-bottom: 1px solid rgba(218, 218, 218, 0.5);
background-color: #f6f6f6;
text-align: center;
}
.tsh-content .best_blue .bestInfobox {
position: relative;
padding-top: 48px;
}
.tsh-content .best_blue .bestInfobox::before {
content: "";
width: 1px;
height: 18px;
background-color: #dadada;
position: absolute;
top: 10px;
left: 50%;
}
.tsh-content .best_blue .bestInfobox h3 a {
width: 54px;
top: 9px;
position: absolute;
font-size: 15px;
text-align: center;
font-weight: 600;
}
.tsh-content .best_blue .bestInfobox h3 a.on {
border-bottom: 3px solid #D8761F;
color: #D8761F;
}
.tsh-content .best_blue .bestInfobox h3 a.bestDayBtn {
left: calc((50% - 47px) / 2);
}
.tsh-content .best_blue .bestInfobox h3 a.bestMonthBtn {
right: 10px;
right: 0;
}
.tsh-content .best_blue .bestInfobox h3 a.bestWeekBtn {
left: calc((50% - 47px) / 2 + 50%);
}
.tsh-content .sideinBox {
display: none;
padding: 0 17px;
}
.tsh-content .sideinBox.on {
display: block;
}
.tsh-content .sideinBox ol {
padding-bottom: 22px;
}
.tsh-content .sideinBox li {
display: block;
overflow: hidden;
font-size: 14px;
}
.tsh-content .sideinBox li a {
display: inline-block;
width: 130px;
}
.tsh-content .sideinBox li a + button,
.tsh-content .sideinBox li a + span {
display: inline-block;
width: 36px;
text-align: center;
}
.tsh-content .sideinBox li + li {
margin-top: 10px;
}
.tsh-content .sideinBox li::before {
content: "1";
display: inline-block;
margin-right: 10px;
width: 19px;
height: 19px;
background-color: #f4f5f7;
border: 1px solid #cad0df;
border-radius: 30px;
text-align: center;
font-size: 14px;
line-height: 19px;
}
.tsh-content .sideinBox li.num2::before {
content: "2";
}
.tsh-content .sideinBox li.num3::before {
content: "3";
}
.tsh-content .sideinBox li.num4::before {
content: "4";
}
.tsh-content .sideinBox li.num5::before {
content: "5";
}
.tsh-content .sideinBox li.num6::before {
content: "6";
}
.tsh-content .sideinBox li.num7::before {
content: "7";
}
.tsh-content .sideinBox li.num8::before {
content: "8";
}
.tsh-content .sideinBox li.num9::before {
content: "9";
}
.tsh-content .sideinBox li.num10::before {
content: "10";
}
.tsh-content .icoUp,
.tsh-content .icoDn {
font-size: 12px;
}
.tsh-content .icoUp {
color: #d90000;
}
.tsh-content .icoUp:before {
content: "▲ ";
margin-right: 5px;
}
.tsh-content .icoDn {
color: #1f9ed9;
}
.tsh-content .icoDn:before {
content: "▼ ";
margin-right: 5px;
}
.tsh-content .icoNew {
color: #d90000;
}
.tsh-content .icoNew:before {
content: "NEW";
font-family: arial;
font-size: 12px;
}
.tsh-content .icoDel {
float: right;
width: 18%;
text-align: right;
}
.tsh-content .icoDel:before {
content: "";
display: inline-block;
width: 13px;
height: 12px;
vertical-align: middle;
}
.tsh-content .searchList .sideinBox {
padding: 17px;
display: block;
}

.tsh-tab {
margin: 30px 0 0 0;
}
.tsh-tab ul {
overflow: hidden;
border: 1px solid #dee0e6;
}
@media (max-width: 749px) {
.tsh-tab {
overflow-x: scroll;
}
.tsh-tab ul {
width: 450px;
}
}
.tsh-tab li {
float: left;
width: calc((100% - 1px) / 6);
}
.tsh-tab li + li {
border-left: 1px solid #dee0e6;
}
.tsh-tab li.active {
background-color: #525d63;
}
.tsh-tab li.active a {
color: #ffffff;
}
.tsh-tab a {
display: block;
font-size: 16px;
text-align: center;
padding: 12px 0 9px;
line-height: 1.2;
}
.tsh-tab a span {
font-size: 17px;
display: block;
}

.list-tsh {
font-weight: 300;
}
.list-tsh > li {
position: relative;
padding-left: 30px;
font-size: 1.125rem;
font-weight: 700;
color: #2e363a;
}
@media (max-width: 749px) {
.list-tsh > li {
margin-left: -15px;
font-size: 1.025rem;
}
}
.list-tsh > li::before {
content: "";
position: absolute;
top: 10px;
left: 15px;
}
.list-tsh > li strong {
font-weight: 700;
}
.list-tsh > li .txt {
font-weight: 400;
color: #666;
font-size: 1rem;
}
.list-tsh > li > ul {
margin-bottom: 10px;
}
@media (max-width: 749px) {
.list-tsh > li > ul {
margin-left: -15px;
}
}
.list-tsh > li > ul > li {
font-weight: 400;
color: #666;
font-size: 1rem;
}
.list-tsh.type-tsh > li + li {
margin-top: 25px;
}
@media (max-width: 749px) {
.list-tsh .bu-dot, .list-tsh > li .txt, .list-tsh > li > ul > li {
margin-left: -15px;
}
}

.ui-helper-hidden {
display: none;
}

.ui-helper-hidden-accessible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}

.ui-helper-reset {
margin: 0;
padding: 0;
border: 0;
outline: 0;
line-height: 1.3;
text-decoration: none;
font-size: 100%;
list-style: none;
}

.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
content: "";
display: table;
border-collapse: collapse;
}

.ui-helper-clearfix:after {
clear: both;
}

.ui-helper-zfix {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
opacity: 0;
filter: Alpha(Opacity=0); /*  */
}

.ui-front {
z-index: 100;
}

/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
cursor: default !important;
pointer-events: none;
}

/* Icons
----------------------------------*/
.ui-icon {
display: inline-block;
vertical-align: middle;
margin-top: -0.25em;
position: relative;
text-indent: -99999px;
overflow: hidden;
background-repeat: no-repeat;
}

.ui-widget-icon-block {
left: 50%;
margin-left: -8px;
display: block;
}

/* Overlays */
.ui-widget-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.ui-autocomplete {
position: absolute;
top: 0;
left: 0;
cursor: default;
z-index: 99999;
}

.ui-menu {
list-style: none;
padding: 0;
margin: 0;
display: block;
outline: 0;
}

.ui-menu .ui-menu {
position: absolute;
}

.ui-menu .ui-menu-item {
margin: 0;
cursor: pointer;
/* support: IE10, see #8844 */
list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}

.ui-menu .ui-menu-item-wrapper {
position: relative;
padding: 3px 1em 3px 0.4em;
}

.ui-menu .ui-menu-divider {
margin: 5px 0;
height: 0;
font-size: 0;
line-height: 0;
border-width: 1px 0 0 0;
}

.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
margin: -1px;
}

/* icon support */
.ui-menu-icons {
position: relative;
}

.ui-menu-icons .ui-menu-item-wrapper {
padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
position: absolute;
top: 0;
bottom: 0;
left: 0.2em;
margin: auto 0;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
left: auto;
right: 0;
}

/* Component containers
----------------------------------*/
.ui-widget {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
}

.ui-widget .ui-widget {
font-size: 1em;
}

.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
}

.ui-widget.ui-widget-content {
border: 1px solid #c5c5c5;
}

.ui-widget-content {
border: 1px solid #dddddd;
background: #ffffff;
color: #333333;
}

.ui-widget-content a {
color: #333333;
}

.ui-widget-header {
border: 1px solid #dddddd;
background: #e9e9e9;
color: #333333;
font-weight: bold;
}

.ui-widget-header a {
color: #333333;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
border: 1px solid #c5c5c5;
background: #f6f6f6;
font-weight: normal;
color: #454545;
}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button {
color: #454545;
text-decoration: none;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
border: 1px solid #cccccc;
background: #ededed;
font-weight: normal;
color: #2b2b2b;
}

.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited,
a.ui-button:hover,
a.ui-button:focus {
color: #2b2b2b;
text-decoration: none;
}

.ui-visual-focus {
-webkit-box-shadow: 0 0 3px 1px rgb(94, 158, 214);
box-shadow: 0 0 3px 1px rgb(94, 158, 214);
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
border: 1px solid #003eff;
background: #007fff;
font-weight: normal;
color: #ffffff;
}

.ui-icon-background,
.ui-state-active .ui-icon-background {
border: #003eff;
background-color: #ffffff;
}

.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
color: #ffffff;
text-decoration: none;
}

/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
border: 1px solid #dad55e;
background: #fffa90;
color: #777620;
}

.ui-state-checked {
border: 1px solid #dad55e;
background: #fffa90;
}

.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
color: #777620;
}

.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
border: 1px solid #f1a899;
background: #fddfdf;
color: #5f3f3f;
}

.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
color: #5f3f3f;
}

.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
color: #5f3f3f;
}

.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
font-weight: bold;
}

.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
opacity: 0.7;
font-weight: normal;
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
opacity: 0.35;
background-image: none;
}

.ui-widget-overlay {
background: #aaaaaa;
opacity: 0.3;
}

.ui-widget-shadow {
-webkit-box-shadow: 0px 0px 5px #666666;
box-shadow: 0px 0px 5px #666666;
}

.top-totalsearch {
margin: 2px 0;
border-radius: 20px;
font-size: 0.875rem;
text-indent: 10px;
overflow: hidden;
border: none !important;
}

::-webkit-input-placeholder {
color: #cfcfcf;
}

::-moz-placeholder {
color: #cfcfcf;
}

:-ms-input-placeholder {
color: #cfcfcf;
}

::-ms-input-placeholder {
color: #cfcfcf;
}

::placeholder {
color: #cfcfcf;
}

hr {
border-bottom: 1px solid #ddd;
border-top-width: 0;
}

.vline {
width: 1px;
height: 14px;
display: inline-block;
vertical-align: inherit;
border-right: 1px solid #ddd;
margin-left: 20px;
margin-right: 20px;
}
@media (max-width: 749px) {
.vline {
margin-left: 10px;
margin-right: 10px;
}
}

.refer {
position: relative;
margin-left: 18px;
margin-bottom: 0;
color: #888;
text-align: left;
}
.refer::before {
content: "※";
position: absolute;
left: -18px;
background: none !important;
top: 0 !important;
}

.required-text {
text-indent: -16px;
margin: 4px 0 4px 13px;
}
.required-text::before {
content: "\f06a";
font-family: "FontAwesome", "dotum", Helvetica, Arial, sans-serif;
margin-right: 5px;
}

span.border {
width: 100%;
height: 1px;
background-color: #ddd;
display: block;
margin-top: 20px;
margin-bottom: 20px;
}
span.border:before, span.border:after {
display: block;
height: 0;
clear: both;
visibility: hidden;
content: ".";
}

.badge {
display: inline-block;
padding: 6px 11px;
border-radius: 5px;
line-height: 1;
}
.badge.bg_red {
color: #fff;
}
.badge.fa-phone {
width: 30px;
height: 30px;
line-height: 30px;
padding: 0;
text-align: center;
background: url(/static/portal/img/sub01/bulls.png) no-repeat;
color: #fff;
margin-right: 10px;
}

strong.over-dot {
color: #D8761F;
-webkit-text-emphasis: "•";
text-emphasis: "•";
-webkit-text-emphasis-position: over;
text-emphasis-position: over left;
}

.bd1-line {
border-bottom: 1px solid #005aab;
color: #005aab;
padding-bottom: 10px;
}
.bd1-line.line2 {
min-height: 60px;
}

.ti-20 {
text-indent: -20px;
margin-left: 20px;
}
.ti-20.word {
word-break: break-all;
}

a {
color: #333;
}

.color-orange {
color: #D8761F !important;
}

.color-blue {
color: #005aab !important;
}

.color-red {
color: #ed1b2f !important;
}

html {
font-size: 16px;
}

body {
color: #666;
line-height: 1.5;
font-family: "맑은고딕", "malgun gothic", "AppleGothic", "돋움", "dotum", Helvetica, Arial, sans-serif;
letter-spacing: -0.015rem;
word-break: keep-all;
font-weight: 400;
}
@media (max-width: 749px) {
body {
word-break: keep-all;
}
}
body.ovh {
position: relative;
overflow: hidden;
height: 100vh;
}

.banner-m {
background: #ffedcf url(/static/portal/img/main2022/election.jpg) center center no-repeat;
height: 100px;
}

@media (max-width: 749px) {
.banner-m {
background-image: url(/static/portal/img/main2022/election_m.png);
background-size: auto 100px;
}
}
.banner-m a {
display: block;
padding: 10px 20px;
text-align: center;
height: 100px;
}

/* 코로나베너 포커스링 수정 */
.banner-m a:focus {
border: 1px solid #000;
outline-offset: -2px;
}

.banner-m a > span {
display: block;
color: #fff;
font-size: 24px;
font-family: "Gmarket Sans", "맑은고딕", "malgun gothic, sans-serif";
line-height: 1.4;
}

.banner-m a > span em {
color: #9fcf67;
font-weight: 700;
}

.banner-m a > span br {
display: none;
}

.banner-m a span.banner-p {
display: inline-block;
position: relative;
padding: 5px 30px;
color: #000;
border-radius: 15px;
border: 1px solid #fff;
font-size: 14px;
background-color: #fff;
line-height: 1;
}

.banner-m a span.banner-p::before {
content: "\f105";
display: inline-block;
-webkit-font-smoothing: antialiased;
text-rendering: auto;
font-family: "Line Awesome Free";
font-weight: 900;
font-style: normal;
font-variant: normal;
line-height: 1;
position: absolute;
top: 5px;
right: 13px;
}

.banner-wrap {
position: relative;
background: #dfdfdf;
}

.position {
position: relative;
max-width: 1280px;
margin: 0 auto;
}

.bannerf-btn {
position: absolute;
right: 0;
bottom: -35px;
height: 35px;
z-index: 9999;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #fff;
background-color: #333;
padding: 0 12px;
font-weight: 600;
letter-spacing: -0.05em;
border-radius: 0 0 4px 4px;
}

.bannerf-btn.active {
bottom: 0;
border-radius: 4px 4px 0 0;
}

@media all and (max-width: 1199px) {
.banner-f {
padding-bottom: 27px;
}
.bannerf-btn {
left: 15px;
right: auto;
font-size: 14px;
height: 25px;
bottom: -25px;
}
}
@font-face {
font-family: "yg-jalnan";
src: url("//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff") format("woff");
font-weight: normal;
font-style: normal;
}
.banner-f {
width: 100%;
/*background:#ccdeee;*/
position: relative;
/*height:100px;*/
}

.banner-f .text {
display: block;
width: 100%;
font-size: 0;
text-align: center;
/*margin-left: 3;*/
}

.banner-f .text img {
/*width:90%;*/
}

.banner-f .text .moblie-banner {
display: none;
}

.banner-wrap .banner-f .close-checkbox {
/* position:absolute; */
position: relative;
bottom: 0px;
right: 5%;
padding: 5px 5% 5px 0;
position: static;
background: #dfdfdf;
}

.close-checkbox {
position: relative;
width: 100%;
padding: 10px 20px;
font-family: "Noto Sans KR", "맑은고딕", "malgun gothic", sans-serif;
text-align: right;
}

.close-checkbox .lnfo-close {
display: inline-block;
background-color: #005aab;
color: #fff;
line-height: 20px;
border-radius: 5px;
font-size: 14px;
padding: 0 5px;
margin-left: 10px;
}

.close-checkbox label {
color: #333;
font-size: 14px;
}

@media (max-width: 1000px) {
.banner-wrap {
position: relative;
}
.banner-wrap .banner-f .close-checkbox {
bottom: 0px;
right: 0%;
}
}
@media (min-width: 1500px) {
.banner-wrap .banner-f .close-checkbox {
position: absolute;
background-color: transparent;
}
}
@media (max-width: 577px) {
.banner-wrap {
position: relative;
padding: -1px 0 30px 0;
/*background:#ccdeee;*/
}
.banner-f .text img {
display: none;
}
.banner-f .text .moblie-banner {
width: 100%;
display: block;
}
}
.info-pop {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 30000;
}

.info-pop .bg {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
}

.info-pop--content {
position: absolute;
top: 150px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 1800;
border-radius: 10px;
-webkit-box-shadow: 2.868px 4.096px 30px 0px rgba(0, 0, 0, 0.4);
box-shadow: 2.868px 4.096px 30px 0px rgba(0, 0, 0, 0.4);
text-align: center;
max-width: 900px;
height: auto;
overflow: hidden;
background: #fff;
background-size: cover;
}

.info-pop--content .text {
text-align: left;
width: 85%;
margin: 3% auto 2%;
}

.info-pop--content .text h2 {
text-align: center;
position: inherit;
padding: 0;
}

.info-pop--content .text h2 img {
width: 150px;
display: inline-block;
vertical-align: middle;
position: inherit;
left: inherit;
top: inherit;
margin-right: 15px;
}

.info-pop--content .text p {
margin-top: 2%;
}

.info-pop--content br {
font-family: "Dotum";
}

.info-pop--content .text p.last {
font-weight: bold;
font-size: 18px;
}

.info-pop--content .close-checkbox {
position: relative;
width: 100%;
padding: 10px 20px;
font-family: "Noto Sans KR", "맑은고딕", "malgun gothic", sans-serif;
text-align: right;
}

.info-pop--content .close-checkbox .lnfo-close {
display: inline-block;
background-color: #005aab;
color: #fff;
line-height: 20px;
border-radius: 5px;
font-size: 14px;
padding: 0 5px;
margin-left: 10px;
}

.info-pop--content .close-checkbox label {
color: #333;
font-size: 14px;
}

@media (min-width: 1600px) {
.info-pop--content .text h2 {
text-align: center;
position: relative;
padding: 25px 0;
}
.info-pop--content .text h2 img {
width: 150px;
position: absolute;
left: 1%;
top: -12px;
}
}
@media (max-width: 1199px) {
.info-pop--content .text h2 img {
display: block;
}
}
/* 코로나 팝업창 */
.info-pop {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 30000;
}

.info-pop .bg {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
}

.info-pop--content {
position: absolute;
top: 150px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 1800;
font-family: "GmarketSansMedium";
border-radius: 10px;
-webkit-box-shadow: 2.868px 4.096px 30px 0px rgba(0, 0, 0, 0.4);
box-shadow: 2.868px 4.096px 30px 0px rgba(0, 0, 0, 0.4);
text-align: center;
max-width: 900px;
height: auto;
background: url(/static/portal/img/popup/info-pop-bg.png);
overflow: hidden;
}

.info-pop--content h1 {
font-size: 30px;
font-weight: 600;
line-height: 1.333;
padding: 32px 10px 15px 10px;
color: #000;
position: relative;
z-index: 10;
}

.info-pop--table {
padding: 10px 20px 10px;
}

.info-pop--table table {
width: 100%;
}

.info-pop--table table thead th {
background-color: #005aab;
color: #fff;
font-size: 17px;
font-weight: 300;
padding: 6px 20px 3px;
}

.info-pop--table table tbody tr {
color: #000;
font-weight: 600;
border-bottom: 1px solid rgba(0, 90, 171, 0.5);
line-height: 1.6;
}

.info-pop--table table tbody th {
background-color: #e1e9f0;
font-size: 15px;
padding: 0 6px;
border-right: 1px solid rgba(0, 90, 171, 0.5);
}

.info-pop--table table tbody td {
background-color: #fff;
font-size: 14px;
padding: 16px 2px;
border-right: 1px solid rgba(0, 90, 171, 0.5);
}

.info-pop--table table tbody td:last-child {
border-right-width: 0px;
}

.info-pop--table table tbody td span.point {
display: block;
color: #005aab;
}

.info-pop--table table tbody td span.red {
color: #ed1b2f;
}

.info-pop--content .close-checkbox {
position: relative;
width: 100%;
padding-top: 0px;
font-family: "Noto Sans KR", "맑은고딕", "malgun gothic", sans-serif;
text-align: right;
}

.info-pop--content .close-checkbox .lnfo-close {
display: inline-block;
background-color: #005aab;
color: #fff;
line-height: 20px;
border-radius: 5px;
font-size: 14px;
padding: 0 5px;
margin-left: 10px;
}

.info-pop--content .close-checkbox label {
color: #333;
font-size: 14px;
}

/* 배너 모달 */
.container.modal {
width: 100%;
z-index: 10000000000;
}

.modal-wrap {
background-color: rgba(0, 0, 0, 0.3);
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: none;
padding: 15px;
z-index: 1000;
}

.modal-popup {
position: relative;
width: 100%;
max-width: 1200px;
height: 780px;
background-color: #ffffff;
border-radius: 20px;
background-color: #e4477a;
-webkit-box-shadow: 5px 10px 10px 1px rgba(0, 0, 0, 0.3);
box-shadow: 5px 10px 10px 1px rgba(0, 0, 0, 0.3);
margin: 0 auto;
margin-top: 3%;
}

.popup-head {
width: 100%;
height: 50px;
position: relative;
}

.popup-head .h-tit {
display: block;
font-weight: bold;
color: #fff;
font-size: 22px;
text-align: center;
padding-top: 5px;
}

.modal-popup .pop-btn.close {
position: absolute;
right: 1%;
top: 2%;
display: block;
background: url(/static/portal/img/main2022/close-btn.png) no-repeat;
width: 30px;
height: 30px;
cursor: pointer;
}

.modal-popup .pop-btn.close:focus {
outline: dotted white;
outline-offset: 1px;
}

.pop-cont {
width: 100%;
background-color: #ffffff;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
}

.pop-cont .cont-list {
height: 730px;
overflow: scroll;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
padding: 30px 20px 50px 20px;
margin-right: 20px;
}

.pop-cont .cont-list a:focus {
outline: dotted red;
outline-offset: -2px;
vertical-align: top;
}

@media (max-width: 749px) {
.modal-popup {
width: 100%;
max-width: 1200px;
height: 70%;
background-color: #ffffff;
border-radius: 20px;
background-color: #e4477a;
-webkit-box-shadow: 5px 10px 10px 1px rgba(0, 0, 0, 0.3);
box-shadow: 5px 10px 10px 1px rgba(0, 0, 0, 0.3);
margin: 0 auto;
margin-top: 0px;
}
.pop-cont {
width: 100%;
height: 89%;
background-color: #ffffff;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
}
.pop-cont .cont-list {
height: 100%;
overflow: scroll;
display: block;
padding: 20px 20px 40px 20px;
margin-right: 20px;
}
}
.pop-cont.two .cont-list {
height: 730px;
overflow: scroll;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
padding: 30px 20px 50px 20px;
margin-right: 20px;
}

@media (max-width: 749px) {
.pop-cont.two .cont-list {
height: 100%;
overflow: scroll;
display: block;
padding: 20px 20px 40px 20px;
margin-right: 20px;
}
}
/* 임의의 영역 생성 */
.pop-cont .cont-list::-webkit-scrollbar {
width: 8px; /* 스크롤바의 너비 */
}

.pop-cont .cont-list::-webkit-scrollbar-thumb {
height: 1%; /* 스크롤바의 길이 */
background: #e4477a; /* 스크롤바의 색상 */
border-radius: 10px;
}

.pop-cont .cont-list::-webkit-scrollbar-track {
background: rgba(178, 182, 189, 0.1); /*스크롤바 뒷 배경 색상*/
}

.pop-cont .cont-list .cont-item {
width: 100%;
}

.pop-cont .cont-list .cont-item img {
width: 100%;
}

body {
font-family: "SUIT", "malgun gothic", "AppleGothic", "돋움", "dotum", Helvetica, Arial, sans-serif;
font-weight: 400;
letter-spacing: normal;
}

.fc-pink {
color: #de3a75 !important;
}

/* mainContent */
section h2 {
margin-bottom: 28px;
}
@media (max-width: 749px) {
section h2 {
margin-bottom: 10px;
}
}

.section_tit {
color: #3d3d3d;
line-height: 1.32;
letter-spacing: normal;
font-size: 30px;
font-weight: 900;
}
@media (min-width: 1200px) {
.section_tit {
font-size: 56px;
}
}

.section_tit_eng {
padding-bottom: 18px;
color: #de3a75;
font-family: "Montserrat";
font-size: 16px;
font-weight: 800;
}
@media (min-width: 1200px) {
.section_tit_eng {
font-size: 20px;
}
}

.t-shadow {
color: #fff;
text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.9);
}

/* tab */
.tab-menu {
max-width: 426px;
}
.tab-menu.type2 .tab-btn {
height: 48px;
background-color: transparent;
color: #fff;
border-color: #fff;
-webkit-transition: 0.2s all;
transition: 0.2s all;
}
.tab-menu.type2 .tab-btn::after {
color: #fff;
}
.tab-menu.type2 .tab-btn:hover, .tab-menu.type2 .tab-btn:focus {
background-color: #de3a75;
border-color: #de3a75;
font-weight: 600;
color: #fff;
}
.tab-menu.type2 .tab-btn:hover::after, .tab-menu.type2 .tab-btn:focus::after {
color: #fff;
}
.tab-menu .tab-btn.bd-black {
color: #3c3c3c;
border-color: #3c3c3c;
}
.tab-menu .tab-btn.bd-black:hover, .tab-menu .tab-btn.bd-black:focus {
color: #fff;
}
.tab-menu .tab-btn.bd-black::after {
color: #000;
}

.tab-btn {
position: relative;
width: 134px;
height: 42px;
padding: 8px 18px 8px 22px;
border-radius: 22px;
overflow: hidden;
border: solid 1px #3d3d3d;
background-color: #fff;
color: #3d3d3d;
text-align: left;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
font-size: 18px;
font-weight: 600;
}
.tab-btn::after {
content: ">";
font-size: 12px;
font-weight: 800;
color: #3d3d3d;
display: inline-block;
}
.tab-btn.on {
border: solid 2px #de3a75;
color: #de3a75;
}
.tab-btn.on::after {
color: #de3a75;
}
.tab-btn:hover, .tab-btn:focus {
outline-offset: 4px;
}
.tab-btn:hover span, .tab-btn:focus span {
text-decoration: underline;
}
.tab-btn.lg {
height: 46px;
}
@media (min-width: 750px) {
.tab-btn.lg {
min-width: 156px;
}
}
.tab-btn.l {
width: 220px;
}

.tab-layout {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 12px;
}
.ie .tab-layout.max3 > li + li:not(:nth-child(4n)) {
margin-left: 12px;
}
.ie .tab-layout.max3 > li:nth-child(n+4) {
margin-top: 12px;
}
.tab-layout.max2 {
gap: 8px;
}
.ie .tab-layout.max2 > li + li:not(:nth-child(odd)) {
margin-left: 8px;
}
.ie .tab-layout.max2 > li:nth-child(n+3) {
margin-top: 8px;
}
.tab-layout.c {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.ie .tab-layout.c > li + li {
margin-top: 8px;
}

.tab-item {
display: none;
}
/* button */
.b-more {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: absolute;
font-weight: bold;
color: #3d3d3d;
}
@media (max-width: 1199px) {
.b-more {
bottom: -80px;
left: calc(50% - 40px);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
}
@media (min-width: 750px) {
.b-more {
font-size: 20px;
}
}
@media (min-width: 1200px) {
.b-more {
top: 282px;
left: 44px;
}
}
@media (min-width: 1300px) {
.b-more {
top: 438px;
}
}

.b-arr {
width: 56px;
height: 56px;
border-radius: 50%;
margin-left: 24px;
background: #de3a75 url(/static/portal/img/main2024/i-arr-next.png) no-repeat top 26px right 20px;
}

.b-arr2 {
position: relative;
width: 56px;
height: 56px;
border-radius: 50%;
border: 1px solid #fff;
}
.b-arr2::after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 66px;
height: 56px;
background: url(/static/portal/img/main2024/i-arr-next.png) no-repeat top 26px right 20px;
}
.b-arr2.prev {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}

.b-link {
font-weight: 600;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #fff;
padding: 4px;
}
.b-link::after {
content: "";
display: inline-block;
margin-left: 6px;
background: url(/static/portal/img/main2024/arr-small.png);
width: 10px;
height: 7px;
}
.light-pink .b-link, .b-link.dark-gray {
color: #454545;
}
.light-pink .b-link::after, .b-link.dark-gray::after {
background: url(/static/portal/img/main2024/arr-small-gray.png);
}
.b-link:hover, .b-link:focus {
text-decoration: underline;
}

/* box */
.round-box {
border-radius: 20px;
overflow: hidden;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
position: relative;
padding: 24px 30px;
background-color: #f9f9fd;
}
@media (min-width: 750px) {
.round-box {
padding: 32px 36px;
}
}
@media (min-width: 1200px) {
.round-box {
height: 188px;
}
}
.round-box h3 {
font-size: 32px;
font-weight: 900;
color: #3c3c3c;
}
@media (max-width: 749px) {
.round-box h3 {
font-size: 24px;
}
}
.round-box p {
font-weight: bold;
line-height: 1.75;
color: #7a7a7a;
font-size: 18px;
}
.round-box.pink {
background-color: #dc6188;
}
.round-box.pink h3,
.round-box.pink p {
color: #fff;
}
.round-box.light-pink {
background-color: #ffe8f0;
}
.round-box.bd {
border: solid 1px rgba(188, 188, 188, 0.4);
}
.round-box.l {
width: 100%;
}
.round-box.l h3 {
font-size: 24px;
font-weight: 900;
padding-bottom: 8px;
}
@media (min-width: 750px) {
.round-box.l h3 {
font-size: 32px;
}
}
.round-box.l p {
font-size: 20px;
font-weight: 300;
line-height: 1.19;
}
@media (min-width: 750px) {
.round-box.l p {
font-size: 26px;
}
}
.round-box.sm {
padding: 20px 40px;
}
.round-box .b-link::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.bimg-box {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 22px 28px 22px 28px;
border-radius: 16px;
overflow: hidden;
color: #fff;
}
@media (max-width: 749px) {
.bimg-box {
max-height: 170px;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
}
@media (min-width: 750px) {
.bimg-box {
padding: 46px 52px;
}
}
.bimg-box.flex-end {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.bimg-box::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000;
-webkit-transition: 0.4s all;
transition: 0.4s all;
opacity: 0;
}
.bimg-box > * {
z-index: 1;
}
.bimg-box:hover::after, .bimg-box:focus::after {
opacity: 0.4;
}
.bimg-box .tit {
font-size: 20px;
font-weight: 900;
padding-bottom: 4px;
}
@media (min-width: 750px) {
.bimg-box .tit {
font-size: 26px;
}
}
.bimg-box span {
font-weight: bold;
color: #fff;
}
.bimg-box > a {
color: #fff;
display: block;
}
.bimg-box > a::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media (min-width: 750px) {
.bimg-box .txt {
font-size: 20px;
}
}

/* swiper */
.swiper {
overflow: hidden;
width: 100%;
height: 100%;
}

.swiper-slide img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}

/* section_01 visual */
.visual {
position: relative;
/*&__item {
    aspect-ratio: 1920 / 811;
    background-size: cover;
    background-position: center;
    @include breakpoint($md) {
        min-height: 370px;
    }
    &.first {
        background-image: url('/static/portal/img/main2024/visual01.png');
    }
    &.second {
        background-image: url('/static/portal/img/main2024/visual01.png');
    }
}
&__container {
    width: 100%;
    height: calc(100% - 200px);
    min-height: 190px;
    margin: 0 auto;
    padding: 0 20px;
    @include breakpoint($lg) {
        max-width: 1544px;
    }
}*/
}
.visual .section_tit_eng {
font-size: 16px;
}

/*
.vsSwiper {
    &__ctrl {
        display: flex;
        align-items: center;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
        button {
            display: inline-block;
            @include circle(36px);
            @include breakpoint($lg) {
                @include circle(56px);
            }
            & + button {
                margin-left: 8px;
            }
            &:focus {
                outline-offset: 4px;
            }
        }
        .visual__container {
            display: flex;
            align-items: flex-end;
        }
    }
    &__prev {
        background: $pink url(/static/portal/img/main2024/ico-prev.png) no-repeat center;
    }
    &__next {
        background: url(/static/portal/img/main2024/ico-next.png) no-repeat center;
        border: solid 2px $white;
    }
}*/
.slide__item .section_tit {
color: #fff;
font-weight: 400;
}
.slide .swiper-slide {
height: 370px;
}
@media (min-width: 1200px) {
.slide .swiper-slide {
height: calc(80vh - 162px);
max-height: 810px;
}
}
.ie .slide .swiper-slide {
overflow: hidden;
}
.slide .swiper-slide > a {
display: block;
width: 100%;
height: 100%;
}
.slide__text {
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.slide__text .section_tit {
display: inline-block;
width: 100%;
line-height: 1.22;
letter-spacing: -0.2px;
font-size: 40px;
padding: 2%;
padding-bottom: 14vh;
}
@media (min-width: 1200px) {
.slide__text .section_tit {
font-size: 72px;
padding-bottom: 34vh;
}
}
.slide__text .section_tit > span {
display: block;
}
.slide__text .section_tit .ml10p {
margin-left: 10%;
}
@media (max-width: 359px) {
.slide__text .section_tit .ml10p {
margin-left: 0;
}
}
.slide__text .txt {
margin-top: 8px;
font-weight: 800;
opacity: 0.8;
}
@media (min-width: 1200px) {
.slide__text .txt {
margin-top: 18px;
font-size: 20px;
}
}
.slide__ctrl {
position: absolute;
z-index: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 100%;
height: 46%;
pointer-events: none;
}
@media (min-width: 1200px) {
.slide__ctrl {
height: 56%;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
}
.slide__ctrl button {
display: inline-block;
width: 36px;
height: 36px;
border-radius: 50%;
background-size: 30%;
pointer-events: all;
}
@media (min-width: 1200px) {
.slide__ctrl button {
width: 56px;
height: 56px;
border-radius: 50%;
}
}
.slide__ctrl button + button {
margin-left: 8px;
}
.slide__ctrl button:focus {
outline-offset: 4px;
}
.slide__ctrl .container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media (min-width: 1200px) {
.slide__ctrl .container {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
}
.slide__prev {
background: #de3a75 url(/static/portal/img/main2024/ico-prev.png) no-repeat center;
}
.slide__next {
background: url(/static/portal/img/main2024/ico-next.png) no-repeat center;
border: solid 2px #fff;
}

/* visual-video */
.visual-video .inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: #000;
aspect-ratio: 192/108;
max-height: 1080px;
min-width: 100%;
}
.visual-video .video {
max-width: 100%;
}

/* section_02 search */
.search {
margin-top: 60px;
}
@media (max-width: 749px) {
.search {
margin-top: 26px;
}
}
.search__layout {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media (max-width: 1199px) {
.search__layout {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
max-width: 580px;
}
}
.search .frm-search {
position: relative;
width: 100%;
max-width: 758px;
}
.search .frm-search .search-input {
width: 100%;
height: 56px;
padding: 0 30px;
border: solid 4px #e4477a;
border-radius: 40px;
color: #757575;
}
@media (min-width: 1200px) {
.search .frm-search .search-input {
height: 80px;
padding: 0 46px;
font-size: 20px;
}
}
.search .frm-search .search-input:focus {
outline-offset: 4px;
}
.search .frm-search .tshsubmit {
position: absolute;
top: 16px;
right: 30px;
}
@media (min-width: 1200px) {
.search .frm-search .tshsubmit {
top: 22px;
right: 26px;
}
}
.search .frm-search .tshsubmit::before {
display: block;
width: 24px;
height: 24px;
background: url(/static/portal/img/main2024/i-search.png) no-repeat center;
background-size: contain;
content: "";
}
@media (min-width: 1200px) {
.search .frm-search .tshsubmit::before {
width: 42px;
height: 42px;
}
}
.search .hotKeyword {
position: relative;
max-width: 738px;
margin-left: 12px;
}
@media (min-width: 750px) {
.search .hotKeyword {
min-width: 280px;
}
}
@media (max-width: 1199px) {
.search .hotKeyword {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
width: 100%;
margin-top: 10px;
}
}
@media (min-width: 1200px) {
.search .hotKeyword {
margin-left: 42px;
}
}
.search .hotKeyword h2 {
margin: 0;
font-size: 24px;
font-weight: 900;
line-height: 1.88;
color: #000;
}
@media (max-width: 1199px) {
.search .hotKeyword h2 {
margin-right: 20px;
}
}
@media (max-width: 749px) {
.search .hotKeyword h2 {
font-size: 20px;
}
}
.search .hotKeyword__list {
position: absolute;
top: 6px;
left: 100px;
width: calc(100% - 125px);
height: 30px;
padding: 0 0 10px 10px;
margin-left: -10px;
border-radius: 10px;
overflow: hidden;
z-index: 1;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
@media (min-width: 750px) {
.search .hotKeyword__list {
left: 126px;
}
}
@media (min-width: 1200px) {
.search .hotKeyword__list {
width: 100%;
top: 46px;
left: 0;
}
}
.search .hotKeyword__list > li {
display: inline-block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: block;
}
.search .hotKeyword__list.active {
width: 100%;
height: auto;
max-height: 280px;
overflow-y: scroll;
top: 46px;
left: 0;
background-color: #fff;
-webkit-box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.05);
box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.05);
}
.search .hotKeyword__list.active::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.search .hotKeyword__list.active::-webkit-scrollbar-thumb {
background: #a8adb5;
border-radius: 4px;
}
.search .hotKeyword__list.active::-webkit-scrollbar-thumb:hover {
background-color: #93979c;
}
.ie .search .hotKeyword__list.active {
scrollbar-arrow-color: #fff;
scrollbar-track-color: #fff;
scrollbar-face-color: #a8adb5;
}
@media (min-width: 1200px) {
.search .hotKeyword__list.active::-webkit-scrollbar-button:vertical:start:decrement, .search .hotKeyword__list.active::-webkit-scrollbar-button:vertical:start:increment {
display: block;
height: 16px;
}
}
.search .hotKeyword__list.active::-webkit-scrollbar {
width: 16px;
}
.search .hotKeyword__list.active::-webkit-scrollbar-thumb {
border-radius: 10px;
border: 4px solid rgb(255, 255, 255);
}
.search .hotKeyword .b-toggle {
position: absolute;
top: 10px;
right: 20px;
z-index: 1;
width: 16px;
height: 16px;
border-radius: 50%;
border: solid 1px #757575;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
@media (min-width: 1200px) {
.search .hotKeyword .b-toggle {
top: 50px;
}
}
.search .hotKeyword .b-toggle::before {
position: absolute;
top: -2px;
left: -3px;
width: 100%;
height: 100%;
padding: 10px;
background: url(/static/portal/img/main2024/i-triangle.png) no-repeat center;
content: "";
}
.search .hotKeyword .b-toggle.active {
-webkit-transform: scaleY(-1);
transform: scaleY(-1);
}

.list-circle {
counter-reset: circle 0;
}
.list-circle > li {
position: relative;
padding-left: 34px;
margin-right: 30px;
line-height: 26px;
font-weight: 600;
color: #757575;
}
.list-circle > li::before {
content: counter(circle);
position: absolute;
top: 0;
left: 0;
width: 26px;
height: 26px;
border-radius: 50%;
font-size: 16px;
font-weight: 800;
text-align: center;
background-color: #e4477a;
color: #fff;
counter-increment: circle 1;
}
.list-circle > li + li {
margin-top: 8px;
}

/* section_03 news */
.news {
margin-top: 26px;
background: url(/static/portal/img/main2024/news-bg.png) no-repeat center 0;
background-size: 2179px 819px;
}
@media (max-width: 1199px) {
.news {
padding-bottom: 80px;
}
}
@media (min-width: 1200px) {
.news {
padding-top: 50px;
margin-top: 70px;
}
}
@media (max-width: 1199px) {
.news__list {
padding: 20px 0;
overflow-x: scroll;
}
.news__list::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.news__list::-webkit-scrollbar-thumb {
background: #a8adb5;
border-radius: 4px;
}
.news__list::-webkit-scrollbar-thumb:hover {
background-color: #93979c;
}
.ie .news__list {
scrollbar-arrow-color: #fff;
scrollbar-track-color: #fff;
scrollbar-face-color: #a8adb5;
}
}
.news__list.on {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-top: 4px;
}
@media (max-width: 1199px) {
.news__list__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
@media (max-width: 1199px) and (min-width: 750px) {
.news__list__inner .news__item {
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
@media (min-width: 1200px) {
.news__list__inner {
-ms-flex-preferred-size: 312px;
flex-basis: 312px;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.news__list__inner + .news__list__inner {
margin-left: 18px;
}
}
@media (min-width: 1200px) {
.news__list__inner.column-1, .news__list__inner.column-3 {
margin-top: 106px;
}
.news__list__inner .news__item:nth-child(even) {
margin-top: 56px;
}
}
@media (max-width: 1199px) {
.news__list__inner.column-1 .news__item {
margin-left: 0;
}
}
.news__item {
position: relative;
width: 100%;
max-width: 228px;
height: 306px;
padding: 36px 26px;
border-radius: 26px;
overflow: hidden;
-webkit-box-shadow: 0px 3px 30px 0 rgba(0, 0, 0, 0.15);
box-shadow: 0px 3px 30px 0 rgba(0, 0, 0, 0.15);
border: solid 1px #ebebeb;
background-color: #fff;
}
@media (max-width: 1199px) {
.news__item {
margin-left: 14px;
}
}
@media (min-width: 750px) {
.news__item {
max-width: 312px;
padding: 36px;
}
}
.news__item.arr::after {
content: "";
position: absolute;
bottom: 22px;
right: 22px;
width: 36px;
height: 36px;
border-radius: 50%;
background: #de3a75 url(/static/portal/img/main2024/arr-diagonal.png) no-repeat center;
}
@media (min-width: 750px) {
.news__item.arr::after {
width: 52px;
height: 52px;
border-radius: 50%;
bottom: 30px;
right: 28px;
}
}
.news__item > a {
white-space: normal;
}
.news__item > a:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
}
.news__item .sub-tit {
display: block;
padding: 0 0 10px 2px;
font-size: 18px;
font-weight: 900;
color: #f03f7f;
}
@media (min-width: 750px) {
.news__item .sub-tit {
height: 48px;
}
}
.news__item .tit {
display: block;
margin-bottom: 12px;
font-size: 22px;
color: #000;
overflow: hidden;
white-space: normal;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
word-break: keep-all;
}
@media (max-width: 749px) {
.news__item .tit {
margin-bottom: 6px;
-webkit-line-clamp: 4;
}
}
@media (min-width: 750px) {
.news__item .department,
.news__item .date {
font-size: 18px;
}
}
.news__item .date::before {
content: "";
display: inline-block;
width: 1px;
height: 10px;
margin: 0 8px 0 4px;
opacity: 0.3;
background-color: #b0b1b5;
}
@media (min-width: 750px) {
.news__item .date::before {
margin: 0 12px 0 8px;
}
}
.news__item.active {
border: solid 1px rgba(219, 219, 219, 0.4);
background-color: #dc6188;
}
.news__item.active * {
color: #fff;
}
.news__item.active::after {
background: #fff url(/static/portal/img/main2024/arr-diagonal-pink.png) no-repeat center;
}

.news-layout {
position: relative;
}
@media (min-width: 1300px) {
.news-layout {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.news-layout .news__tit {
-ms-flex-preferred-size: 200px;
flex-basis: 200px;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
}
.news-layout .tab-list {
margin-top: 4px;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
max-width: 1050px;
}
@media (min-width: 1200px) {
.news-layout .tab-list {
margin-left: 20px;
}
}

/* section_04 information */
.information {
margin-top: 46px;
}
.information .layout-flex2 > div:first-child {
margin-top: 18px;
}

.info-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
position: relative;
min-height: 266px;
max-width: 100%;
padding: 28px;
border-radius: 20px;
overflow: hidden;
background: url(/static/portal/img/main2024/info-img.png) no-repeat 0 0;
background-size: cover;
}
@media (min-width: 750px) {
.info-box {
min-height: 236px;
aspect-ratio: 786/428;
}
}
@media (min-width: 1200px) {
.info-box {
padding: 44px 60px;
}
}
.info-box .bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
-webkit-transition: 0.4s all;
transition: 0.4s all;
background-color: #000;
}
.info-box:hover .bg, .info-box:focus .bg {
opacity: 0.4;
}
.info-box .tit-box {
position: relative;
}
.info-box .tit-box .tit {
font-size: 32px;
font-weight: 900;
line-height: 1.88;
}
@media (max-width: 749px) {
.info-box .tit-box .tit {
font-size: 24px;
}
}

.arr-circle {
display: block;
margin-top: 16px;
width: 33px;
height: 33px;
border-radius: 50%;
border: 2px solid #fff;
background: url(/static/portal/img/main2024/arr-right-white.png) no-repeat center;
background-size: 8px 12px;
}
@media (max-width: 749px) {
.arr-circle {
margin-top: 10px;
}
}

/* section_05 services */
.services {
margin-top: 54px;
}
@media (max-width: 749px) {
.services {
margin-top: 46px;
}
}
.services h2 {
margin-bottom: 14px;
}
.services .section_tit {
letter-spacing: -0.88px;
}
@media (min-width: 750px) {
.services .section_tit {
font-size: 34px;
}
}
.services .section_tit_eng {
margin-left: 10px;
}

.quickSwiper .swiper-slide img {
width: auto;
}

.quick-list {
position: relative;
padding: 32px 48px;
border-radius: 24px;
overflow: hidden;
background-color: #ffe8f0;
}
@media (max-width: 749px) {
.quick-list {
padding: 18px;
}
}
.quick-list li {
position: relative;
text-align: center;
/*img {
    display: block;
    height: 48px;
    margin: 0 auto 4px auto;
    @include breakpoint($mdw) {
        //padding-bottom: 10px;
        height: 68px;
    }
}*/
}
.quick-list li + li::before {
content: "";
position: absolute;
top: 6px;
left: 0;
width: 1px;
height: calc(100% - 12px);
background-color: #e1e1e1;
}
.quick-list li.swiper-slide-active::before {
display: none;
}
.quick-list li a {
display: block;
padding: 10px;
font-weight: bold;
line-height: 1.1;
letter-spacing: -0.88px;
color: #181818;
text-align: center;
}
@media (min-width: 750px) {
.quick-list li a {
font-size: 20px;
}
}
.quick-list li a:hover, .quick-list li a:focus {
color: #de3a75;
outline-offset: -8px;
}
.quick-list li a > span {
display: block;
}
.quick-list .swiper-button-next {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: 0px -394px;
width: 14px;
height: 20px;
right: 20px;
}
.quick-list .swiper-button-prev {
background-image: url(/static/portal/img/sprite2.png?20240731171615);
background-position: -38px -356px;
width: 11px;
height: 17px;
left: 20px;
}
.quick-list .swiper-button-next,
.quick-list .swiper-button-prev {
margin-top: -8px;
background-size: auto;
}
.quick-list .swiper-button-next.swiper-button-disabled,
.quick-list .swiper-button-prev.swiper-button-disabled {
display: none;
}

/* section_06 알림배너 */
.mainBanner {
position: relative;
padding: 56px 0 52px;
margin-top: 70px;
background-image: -webkit-gradient(linear, left bottom, left top, from(#e798b1), to(#be97eb));
background-image: linear-gradient(to top, #e798b1, #be97eb);
}
@media (max-width: 749px) {
.mainBanner {
margin-top: 40px;
}
}
.mainBanner::before {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background: url(/static/portal/img/main2024/YONGSAN.png) no-repeat top 13% right 14%;
background-size: 50%;
content: "";
}

.bnSwiper {
position: relative;
}
@media (min-width: 750px) {
.bnSwiper .bnSwiper_wrap {
width: calc(100% + 40px);
margin-left: -20px;
}
}
@media (min-width: 1200px) {
.bnSwiper .bnSwiper_wrap {
width: calc(100% - 260px);
min-width: 956px;
margin: 0 auto;
}
}
.bnSwiper .bannerSwiper {
padding-top: 2px;
}
.bnSwiper .bannerSwiper .swiper-slide {
border-radius: 24px;
overflow: hidden;
}
@media (max-width: 1199px) {
.bnSwiper .bannerSwiper .swiper-slide {
width: 64.8%;
}
}
@media (min-width: 1200px) {
.bnSwiper .bannerSwiper .swiper-slide {
max-width: 794px;
}
}
.bnSwiper .bannerSwiper .swiper-slide-prev,
.bnSwiper .bannerSwiper .swiper-slide-next {
position: relative;
}
.bnSwiper .bannerSwiper .swiper-slide-prev::before,
.bnSwiper .bannerSwiper .swiper-slide-next::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #fff;
opacity: 0.4;
}
.bnSwiper__ctrl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
pointer-events: none;
}
@media (min-width: 1200px) {
.bnSwiper__ctrl {
top: calc(50% - 33px);
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
}
.bnSwiper__ctrl button {
pointer-events: all;
}
.bnSwiper__pagination {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 128px;
height: 44px;
margin: 28px auto 0;
padding: 8px 16px;
border-radius: 24px;
border: solid 1px #fff;
}
.bnSwiper__pagination .swiper-pagination {
position: static;
margin-right: 8px;
font-family: "Montserrat";
color: #fff;
}
.bnSwiper__pagination .swiper-pagination .swiper-pagination-current {
font-weight: 700;
}
.bnSwiper__pagination button {
display: inline-block;
width: 12px;
height: 12px;
padding: 18px 4px;
}
.bnSwiper__stop {
background: url(/static/portal/img/main2024/i-stop.png) no-repeat center;
}
.bnSwiper__play {
background: url(/static/portal/img/main2024/i-play.png) no-repeat center;
}
.bnSwiper__watch {
margin-left: 8px;
background: url(/static/portal/img/main2024/i-watch.png) no-repeat center;
}

/* 소통채널 */
.communication {
margin: 76px 0;
}
@media (max-width: 749px) {
.communication {
margin: 36px 0;
}
}
.communication .cont-box.bg:nth-child(odd) {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
@media (min-width: 750px) {
.communication .section_tit_eng {
font-size: 18px;
}
}
.communication .bimg-01 {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.communication .bimg-01 > a {
font-family: "GmarketSans";
font-size: 20px;
}
.communication .bimg-01 > a .strong {
font-size: 48px;
margin: 0 4px;
}
.communication .bimg-01 > a > span {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
line-height: 1;
}
.communication .itv {
font-style: italic;
font-size: 48px;
color: #a2e850;
}
.communication .itv .orange {
font-style: italic;
color: #ff8204;
}

.communication-layout {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media (max-width: 1199px) {
.communication-layout {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
@media (min-width: 1400px) {
.communication-layout {
margin-top: -144px;
}
}
@media (max-width: 1199px) {
.communication-layout > li {
width: 100%;
}
.communication-layout > li + li {
margin-top: 16px;
}
}
@media (min-width: 1200px) {
.communication-layout > li:last-child {
margin-left: 26px;
}
}
.communication-layout + .communication-layout {
margin-top: 16px;
}
@media (min-width: 1200px) {
.communication-layout + .communication-layout {
margin-top: 28px;
}
}
.communication-layout.top {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
@media (min-width: 1200px) {
.communication-layout.top li:last-child {
margin-top: 60px;
}
}
@media (min-width: 1200px) {
.communication-layout.bottom {
margin-left: 24px;
}
}

.bimg-01 {
background: url(/static/portal/img/main2024/bimg-01.png) no-repeat center;
background-size: cover;
width: 524px;
height: 287px;
}

.bimg-02 {
background: url(/static/portal/img/main2024/bimg-02.png) no-repeat center;
background-size: cover;
width: 513px;
height: 228px;
}

.bimg-03 {
background: url(/static/portal/img/main2024/bimg-03.png) no-repeat center;
background-size: cover;
width: 655px;
height: 229px;
}

.bimg-04 {
background: url(/static/portal/img/main2024/bimg-04.png) no-repeat center;
background-size: cover;
width: 838px;
height: 271px;
}

.sns-list {
margin-top: 6px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.sns-list li + li {
margin-left: 16px;
}
.sns-list a {
width: 25px;
height: 25px;
background-size: contain;
}
@media (min-width: 1200px) {
.sns-list a {
width: 30px;
height: 30px;
}
}

/* sns icon*/
.i-instagram {
display: inline-block;
background: url(/static/portal/img/main2024/i-instagram.png) no-repeat center;
}

.i-facebook {
display: inline-block;
background: url(/static/portal/img/main2024/i-facebook.png) no-repeat center;
}

.i-blog {
display: inline-block;
background: url(/static/portal/img/main2024/i-blog.png) no-repeat center;
}

.i-youtube {
display: inline-block;
background: url(/static/portal/img/main2024/i-youtube.png) no-repeat center;
}

.i-kakaotalk {
display: inline-block;
background: url(/static/portal/img/main2024/i-kakaotalk.png) no-repeat center;
}

.i-twitter {
display: inline-block;
background: url(/static/portal/img/main2024/i-twitter.png) no-repeat center;
}

/* layout-flex */
@media (min-width: 1200px) {
.layout-flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.layout-flex > div {
width: calc(50% - 18px);
}
}
@media (min-width: 1200px) and (max-width: 1199px) {
.layout-flex {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}

.layout-flex2 {
-ms-flex-negative: 0;
flex-shrink: 0;
-ms-flex-preferred-size: 684px;
flex-basis: 684px;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
@media (max-width: 1199px) {
.layout-flex2 {
margin-top: 20px;
}
}
@media (min-width: 1200px) {
.layout-flex2 {
margin-left: 36px;
}
}
@media (min-width: 750px) {
.layout-flex2 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-line-pack: justify;
align-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.layout-flex2 > div:not(:last-child) {
width: calc(50% - 7px);
}
.ie .layout-flex2 > *:last-child {
margin-top: 18px;
}
}
@media (max-width: 749px) {
.layout-flex2 .round-box {
margin-top: 20px;
}
}
.layout-flex2 .round-box.l {
margin-top: 20px;
height: 200px;
}

/* footer */
#footer {
padding-bottom: 64px;
background-color: #3b434e;
}
#footer *::-webkit-scrollbar {
width: 16px;
background-color: #f5f5f5;
}
#footer *::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
background-color: #555;
}
#footer *::-webkit-scrollbar-thumb:hover {
background-color: #3b434e;
}
#footer .container {
padding: 0;
max-width: 1400px;
}

.footer-site {
overflow: hidden;
border-bottom: 1px solid #48515f;
}
.footer-site form {
width: 100%;
float: left;
border-bottom: 1px solid #48515f;
}
.footer-site form button {
width: 60px;
line-height: 60px;
color: #fff;
background-color: #455160;
}
.footer-site form select {
width: calc(100% - 60px);
height: 60px;
float: left;
padding-left: 20px;
border-width: 0;
border-color: #48515f;
color: #cfcfcf;
background: #3b434e url(/static/commons/img/angle-up.png) no-repeat 92% 50%;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
letter-spacing: -1px;
}
.footer-site form select::-ms-expand {
display: none;
}
.footer-site form select option,
.footer-site form select optgroup {
background: #48515f;
color: #fff;
letter-spacing: -1px;
}
.footer-site form select:focus,
.footer-site form button:focus {
outline-offset: -4px;
}
@media (min-width: 750px) {
.footer-site form {
width: 50%;
}
.footer-site form select {
border-width: 0 1px;
}
}
@media (min-width: 1200px) {
.footer-site {
height: 60px;
}
.footer-site form {
width: 25%;
}
}

.footer-nav ul {
padding: 0 20px 38px 20px;
margin-top: 28px;
border-bottom: 1px solid #48515f;
}
.footer-nav li {
float: left;
position: relative;
}
.footer-nav li:first-child a {
padding-left: 0;
}
.footer-nav li:last-child a {
border: none;
}
.footer-nav a {
display: block;
padding: 0 20px;
line-height: 1;
font-size: 15px;
text-transform: uppercase;
color: #fff;
}
.footer-nav a strong {
display: block;
color: #de628f;
font-weight: 600;
}
@media (max-width: 1199px) {
.footer-nav li {
float: none;
display: inline-block;
}
}
@media (max-width: 749px) {
.footer-nav ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding: 0 20px 18px 20px;
margin-top: 10px;
}
.footer-nav li {
padding: 10px 0;
margin-right: 0;
}
.footer-nav a {
padding: 2px 6px;
margin-right: 5px;
font-size: 0.9375rem;
}
}
@media (max-width: 359px) {
.footer-nav a {
padding: 2px 6px;
margin-right: 0;
font-size: 0.75rem;
}
}

.flogo {
width: 108px;
height: 45px;
margin: 10px 38px 10px 0;
background: url(/static/commons/img/logo-foot.svg) 0 0 no-repeat;
}

.footer-bottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-bottom: 45px;
position: relative;
color: #fff;
padding: 18px 20px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.footer-bottom a {
color: #fff;
}

.footer-bottom address {
margin: 10px auto 10px 0;
font-size: 14px;
line-height: 22px;
vertical-align: top;
font-style: normal;
display: inline-block;
}

.footer-bottom address p {
font-size: 15px;
line-height: 1.5;
}

.footer-bottom .footer-mark {
margin: 10px 0;
display: inline-block;
}

.footer-bottom .footer-mark .fs-con1 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}

.footer-bottom .mark-wa {
background: url(/static/commons/img/logo_wa.png) 0 0 no-repeat;
width: 76px;
height: 54px;
}

.footer-bottom .mark-wa + .foot-privacy {
margin-left: 30px;
}

.footer-bottom .foot-privacy {
background: #fff url(/static/commons/img/foot-privacy.png) 0 0 no-repeat;
width: 60px;
height: 55px;
}

.footer-bottom .mark-wa a,
.footer-bottom .foot-privacy button {
display: block;
width: 100%;
height: 100%;
}

@media (max-width: 749px) {
.footer-bottom {
width: 100%;
padding: 10px 20px;
}
.footer-bottom address span {
display: block;
}
}
/*# sourceMappingURL=main.css.map */