@charset "UTF-8";
@import url(/static/portal/css/default.css);
@import url("/static/portal/css/main_3.css");
@import url(/static/view/assets02/css/corona/corona2.css);
@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: #0294B3 !important; }
.green { color: #009344 !important; }
.gray { color: #888 !important; }
.red { color: #ed1b2f !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; }
.ad-pop { background-color: #f2ede6; position: relative; }
.ad-pop.closed { display: none; }
@media (min-width: 1200px) { .ad-pop { height: 130px; overflow: hidden; } }
.ad-pop--nav { position: absolute; z-index: 10; }
@media (min-width: 1200px) { .ad-pop--nav { left: 50%; top: 97px; margin-left: calc(1276px / 2 * -1); } }
@media (max-width: 1199px) { .ad-pop--nav { left: 15px; top: 13px; } }
.ad-pop--nav button { width: 22px; height: 22px; display: inline-block; vertical-align: top; line-height: 0; font-size: 22px; overflow: hidden; }
@media (max-width: 1199px) { .ad-pop--nav button { float: left; color: #000000; font-size: 18px; } }
@media (min-width: 1200px) { .ad-pop--nav--next { border-width: 1px 0 !important; display: none !important; } }
@media (max-width: 1199px) { .ad-pop--nav--next:before { content: '\f138'; } }
@media (min-width: 1200px) { .ad-pop--nav--prev { display: none !important; } }
@media (max-width: 1199px) { .ad-pop--nav--prev:before { content: '\f137'; } }
@media (max-width: 1199px) { .ad-pop--nav--Pause { font-size: 19px !important; }
  .ad-pop--nav--Pause x i:before { content: '\f28b'; } }
.ad-pop--nav--Play { vertical-align: top; display: inline-block; }
@media (max-width: 1199px) { .ad-pop--nav--Play { font-size: 19px !important; } }
.ad-pop--nav--paging { float: left; padding: 4px 0 0 21px; font-size: 0.875rem; color: #757575; }
@media (max-width: 1199px) { .ad-pop--nav--paging { display: none; } }
.ad-pop--todayClose { position: absolute; }
@media (min-width: 1200px) { .ad-pop--todayClose { top: 95px; right: 50%; margin-right: calc(1276px / 2 * -1); z-index: 11; } }
@media (max-width: 1199px) { .ad-pop--todayClose { right: 10px; top: 10px; } }
.ad-pop--todayClose label { display: inline-block; vertical-align: top; margin-top: 3px; color: #000; font-size: 14px; white-space: nowrap; }
.ad-pop--todayClose label input { width: 16px; height: 16px; border-radius: 0; vertical-align: top; margin-top: 3px; }
.ad-pop--todayClose button { display: inline-block; vertical-align: top; color: #2e363a; margin-left: 0px; font-size: 18px; }
@media (max-width: 1199px) { .ad-pop--todayClose button { background-size: 16px; } }
@media (min-width: 1200px) { .ad-pop .item { height: 130px; position: relative; overflow: hidden; } }
.ad-pop .item a { display: block; margin: 0 auto; text-align: center; overflow: hidden; }
@media (min-width: 1200px) { .ad-pop .item a { height: 130px; position: relative; } }
.ad-pop .item a:focus { border: 1px dotted #000; }
.ad-pop .item a img { vertical-align: top; }
@media (max-width: 1199px) { .ad-pop .item img.pc { display: none; } }
.ad-pop .item img.mobild { display: none; }
@media (max-width: 1199px) { .ad-pop .item img.mobild { display: block; } }
@media (min-width: 1200px) { .ad-pop .item img { max-width: none; position: absolute; left: 50%; top: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); } }
@media (max-width: 1199px) { .ad-pop .item img { width: 100%; } }
@media (min-width: 750px) { .ad-pop .item, .ad-pop .slick-slide { text-align: center; } }
.ad-pop--nav .ad-pop-dot-pc { display: inline-block; }
@media (max-width: 1199px) { .ad-pop--nav .ad-pop-dot-pc { display: none; } }
#ad-pop-pc .ad-pop--nav .ad-pop-dot-pc .slick-dots li button:before { position: static; display: inline-block; vertical-align: top; }
#top-ad-m { display: none; }
@media (max-width: 1199px) { #top-ad-m { display: block; margin-bottom: 10px; } }
.mainvisual { position: relative; height: 400px; padding-top: 360px; text-align: center; }
.mainvisual .ctrl { position: relative; z-index: 100; display: inline-block; }
.mainvisual .ctrl > button { width: 22px; height: 22px; margin-right: 2px; border: none; vertical-align: middle; overflow: hidden; cursor: pointer; float: left; background: url(/static/ucms/img/main/visualCtrl.png) 4px center no-repeat; }
.mainvisual .ctrl > button.pre { background-position: 0 0; }
.mainvisual .ctrl > button.next { background-position: -24px 0; }
.mainvisual .ctrl > button.stop { background-position: right 0; }
.mainvisual .area ul { display: inline; }
.mainvisual .area ul li { display: inline-block; }
.mainvisual .area ul li a { position: relative; z-index: 340; }
.mainvisual .area ul li .num, .mainvisual .area ul li .num > * { -webkit-transition: width .25s; transition: width .25s; }
.mainvisual .area ul li .num .r, .mainvisual .area ul li .num { background: #48C9B0 no-repeat 0 0; font-size: 0; width: 15px; display: block; }
.mainvisual .area ul li .num { width: 22px; height: 22px; overflow: hidden; margin-right: 3px; border-radius: 30px; border: 3px solid #ffa900; background-color: transparent; }
.mainvisual .area ul li .num .r { display: block; overflow: hidden; background-position: right 0; width: 0; }
.mainvisual .area ul li .view { border: none; position: absolute; left: 0; right: 0; top: 0; height: 400px; width: 100%; display: none; margin: 0 auto; }
.mainvisual .area ul li .view .img img { width: 100%; }
.mainvisual .area ul li.on .num .r, .mainvisual .area ul li.on .num { background: #ffa900 no-repeat 0 0; }
.mainvisual .area ul li.on .num .r { background-position: right 0; width: 12px; width: 0; }
.mainvisual .area ul li.on .view { display: block; }
::-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; }
.info__news .service__list { height: 152px; border: 1px solid #ddd; border-radius: 15px; background: #fff url(/static/portal/img/main2022/info__news-bg.png) 0 0 no-repeat; position: relative; }
.info__news h2 { padding: 20px 0 0 27px; line-height: 1; color: #fff; font-size: 20px; text-indent: -0.5px; }
.info__news h2 em { font-size: 26px; font-weight: 800; }
.info__news .service__control-button { position: absolute; top: 14px; right: 30px; }
.info__news .service__control-button button { color: #000; text-align: left; border-radius: 30px; width: 25px; font-size: 28px; line-height: 1; }
.info__news .service__list--slide { margin-top: 23px; padding-left: 24px; }
.info__news .service__list--slide .items { float: left; margin-right: 15px; }
.info__news .service__list--slide .items span { display: block; }
.info__news .service__list--slide .items span a { display: block; font-size: 16px; font-weight: 700; text-align: left; line-height: 22px; margin-top: 8px; letter-spacing: -1px; }
.info__news .service__list--slide .items span a::after { content: ''; margin-left: 5px; width: 22px; height: 22px; display: inline-block; background: url(/static/portal/img/main2022/vr-arr.png) 0 0 no-repeat; vertical-align: middle; }
@media (max-width: 749px) { [role='tablist'] { 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-bottom: 0 !important; overflow: visible; border: 1px solid #ddd; background-color: #fff; } }
@media (max-width: 749px) { [role='tab'] { position: relative; z-index: 1; width: 25%; line-height: 50px; border-right: 1px solid #ddd; font-size: 14px; }
  [role='tab']:last-child { border-right: none; }
  [role='tab']:focus::before, [role='tab'][aria-selected='true']::before { position: absolute; z-index: 10; right: -10px; width: 25px; height: 25px; top: -10px; border: 2px solid #fff; border-radius: 50%; background: #e4477a; color: #fff; font-size: 14px; 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; line-height: 22px; content: '\f0a1'; }
  [role='tab'][aria-selected='true'] { border-radius: 10px; background: #e4477a; color: #fff; border-radius: 0; }
  [role='tab']:nth-child(2)[aria-selected='true'] { background: #14387e; }
  [role='tab']:nth-child(3)[aria-selected='true'] { background: #34b307; }
  [role='tab']:nth-child(4)[aria-selected='true'] { background: #ff7e00; }
  [role='tab']:nth-child(2)[aria-selected='true']::before { background: #14387e; }
  [role='tab']:nth-child(3)[aria-selected='true']::before { background: #34b307; }
  [role='tab']:nth-child(4)[aria-selected='true']::before { background: #ff7e00; } }
@media (max-width: 749px) { .news-section .latest { width: 100%; 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; }
  .news-section .latest > div { position: relative; width: 100%; margin-bottom: 30px; }
  .news-section .latest h1 { font-size: 24px; color: #000; font-weight: 600; }
  .news-section .latest button.latest--more { position: absolute; top: 0; right: 0; width: 25px; height: 25px; border-radius: 50%; background: #e4477a url(/static/portal/img/main/btn-more.png) center no-repeat; }
  .news-section .latest button.latest--more .pc-span { font-size: 0; }
  #latest2-tab button.latest--more { background-color: #14387e; }
  #latest3-tab button.latest--more { background-color: #34b307; }
  #latest4-tab button.latest--more { background-color: #ff7e00; }
  .news-section .latest ul { margin-top: 15px; display: block; }
  .news-section .latest ul:before, .news-section .latest ul:after { display: block; height: 0; clear: both; visibility: hidden; content: "."; }
  .news-section .latest ul li { position: relative; padding-left: 20px; }
  .news-section .latest ul li:before { content: ''; position: absolute; top: 9px; left: 0; width: 4px; height: 4px; background: #005aab; }
  .news-section .latest ul li + li { margin-top: 10px; }
  .news-section .latest ul li a { font-size: 16px; }
  .news-section .latest ul li a .category { display: none; }
  .news-section .latest ul li a i { display: none; }
  .news-section .latest ul li a:hover .title, .news-section .latest ul li a:active .title, .news-section .latest ul li a:focus .title { font-weight: bold; text-decoration: underline; }
  .news-section .latest ul li a .title { width: calc(100%  - 90px); color: #000; vertical-align: bottom; display: inline-block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .news-section .latest ul li a .date { font-size: 14px; font-family: "Verdana"; color: #666; }
  .news-section .latest h1 { font-size: 18px; }
  .news-section .latest button.latest--more { top: 10px; right: 10px; }
  .news-section .latest > div { margin-bottom: 0; }
  [role='tabpanel'] { position: relative; z-index: 2; padding: 0.5em 0.5em 0.7em; margin-top: 5px; }
  [role='tabpanel'].is-hidden { display: none; }
  [role='tabpanel']:focus { border-color: #f05305; -webkit-box-shadow: 0 0 0.2em #f05305; box-shadow: 0 0 0.2em #f05305; outline: 0; }
  [role='tabpanel']:focus::after { position: absolute; bottom: 0; right: -1px; left: -1px; border-bottom: 3px solid #f05305; border-radius: 0 0 0.2em 0.2em; content: ''; }
  [role='tabpanel'] p { margin: 0; }
  [role='tabpanel'] * + p { margin-top: 1em; } }
@media (min-width: 750px) { [role='tablist'] { text-align: center; margin-bottom: 7px; }
  [role='tablist'] button { display: inline-block; width: 145px; height: 45px; margin: 0 10px; color: #000; font-size: 20px; font-weight: 700; text-align: center; }
  [role='tablist'] button[aria-selected='true'] { border-radius: 23px; border: 1px solid #e4477a; background-color: #fff; color: #e4477a; }
  [role='tablist'] button:nth-child(2)[aria-selected='true'] { border-color: #14387e; color: #14387e; }
  [role='tablist'] button:nth-child(3)[aria-selected='true'] { border-color: #34b307; color: #34b307; }
  [role='tablist'] button:nth-child(4)[aria-selected='true'] { border-color: #ff7e00; color: #ff7e00; }
  [role='tabpanel'] { display: none; position: relative; }
  [role='tabpanel'].active { display: block; }
  [role='tabpanel'] h1 { display: none; }
  [role='tabpanel'] 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: justify; -ms-flex-pack: justify; justify-content: space-between; }
  [role='tabpanel'] li { width: 25%; width: calc((100% - 83px) / 4); margin-top: 10px; } }
@media (min-width: 750px) and (min-width: 750px) and (max-width: 1023px) { [role='tabpanel'] li { width: calc((100% - 20px) / 2); } }
@media (min-width: 750px) { [role='tabpanel'] a { display: block; height: 171px; padding: 19px 29px; border-radius: 15px; border: 1px solid #ddd; background-color: #fff; }
  [role='tabpanel'] a .category { display: inline-block; height: 26px; padding: 0 14px; border-radius: 13px; border: 1px solid #e4477a; background-color: #fff; color: #e4477a; font-size: 14px; font-weight: 700; line-height: 24px; }
  [role='tabpanel'] a .title { margin-top: 10px; display: block; color: #000; font-size: 18px; font-weight: 400; text-align: left; line-height: 30px; height: 60px; overflow: hidden; }
  [role='tabpanel'] a .date { margin-top: 10px; display: block; color: #666; font-size: 14px; font-weight: 400; text-align: left; }
  #latest2-tab a .category { border-color: #14387e; color: #14387e; }
  #latest3-tab a .category { border-color: #34b307; color: #34b307; }
  #latest4-tab a .category { border-color: #ff7e00; color: #ff7e00; }
  .news-section .latest button.latest--more { width: 97px; height: 36px; border-radius: 18px; background-color: #888888; color: #fff; font-size: 16px; padding-left: 15px; text-align: left; position: absolute; right: 0; top: -40px; }
  .news-section .latest button:focus{outline-offset: 1px;outline: 1px dashed #000;}
  .news-section .latest button.latest--more::after { content: "\f105"; font-family: 'Line Awesome Free'; font-weight: 900; padding-left: 5px; } }
.onFixed { padding-top: 62px; }
.header { margin-bottom: 0; }
@media (max-width: 1199px) { .header { position: relative; }
  .header .header-top { height: 130px; padding: 0 10px; } }
.navi-scroll { position: fixed; top: 50%; right: 40px; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 1000; width: 150px; }
@media (max-width: 1700px) { .navi-scroll { right: 0; } }
@media (max-width: 1600px) { .navi-scroll { display: none; } }
.section-nav { position: relative; }
.section-nav::after { content: ''; position: absolute; top: 20px; right: 15px; width: 1px; height: 134px; background-color: #aeaeae; z-index: -1; }
.section-nav > a { position: relative; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; height: 40px; float: right; clear: both; margin-bottom: 10px; }
.section-nav > a::after { content: ''; display: inline-block; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background-color: #939393; border-radius: 50%; right: 4px; width: 24px; height: 24px; -webkit-box-shadow: 0 0 0 3px #fff; box-shadow: 0 0 0 3px #fff; }
.section-nav > a span { display: inline-block; width: 130px; height: 40px; line-height: 40px; padding-left: 18px; padding-right: 24px; margin-right: 12px; border-radius: 20px; color: #fff; font-size: 12px; font-weight: 400; text-align: left; background-color: #939393; }
/* 색상과 관계없이 확인가능해야 한다 수정내용 부분 */
.section-nav > a:hover span, .section-nav > a:focus span, .section-nav > a:active span, .section-nav > a.active span { background-color: #e4477a; text-decoration:underline; }
.section-nav > a:hover::after, .section-nav > a:focus::after, .section-nav > a:active::after, .section-nav > a.active::after { background-color: #e4477a;}
.scrolldown { position: relative; width: 40px; height: 80px; margin: auto; }
.scrolldown::before { content: ''; position: absolute; left: 8px; top: 7px; width: 20px; height: 30px; border-radius: 10px; border: 2px solid #e4477a; }
.scrolldown::after { content: ''; position: absolute; left: 17px; top: 18px; width: 4px; height: 4px; border-radius: 2px; display: block; background-color: #e4477a; -webkit-animation: scrdDownAni 1s 2s infinite alternate ease-in; animation: scrdDownAni 1s 2s infinite alternate ease-in; }
.scrolldown i { position: absolute; left: 13px; top: 49px; }
.scrolldown i.up { top: -5px; }
.scrolldown i.up span:nth-child(2) { -webkit-animation: arrow-movement-up 2s 0.5s ease-in-out infinite; animation: arrow-movement-up 2s 0.5s ease-in-out infinite; }
.scrolldown i.up span:nth-child(3) { -webkit-animation: arrow-movement-up 2s 1s ease-in-out infinite; animation: arrow-movement-up 2s 1s ease-in-out infinite; }
.scrolldown i.up span::before { -webkit-transform: rotate(-45deg) translateX(-23%) scaleY(-1); transform: rotate(-45deg) translateX(-23%) scaleY(-1); }
.scrolldown i.up span::after { -webkit-transform: rotate(45deg) translateX(23%) scaleY(-1); transform: rotate(45deg) translateX(23%) scaleY(-1); }
.scrolldown span { display: block; position: relative; }
.scrolldown span::before, .scrolldown span::after { content: ''; display: block; width: 10px; height: 1px; position: absolute; top: 0; left: 0; background-color: #e4477a; }
.scrolldown span::before { -webkit-transform: rotate(45deg) translateX(-23%); transform: rotate(45deg) translateX(-23%); -webkit-transform-origin: top left; transform-origin: top left; }
.scrolldown span::after { -webkit-transform: rotate(-45deg) translateX(23%); transform: rotate(-45deg) translateX(23%); -webkit-transform-origin: top right; transform-origin: top right; }
.scrolldown span:nth-child(2) { -webkit-animation: arrow-movement 2s 0.5s ease-in-out infinite; animation: arrow-movement 2s 0.5s ease-in-out infinite; }
.scrolldown span:nth-child(3) { -webkit-animation: arrow-movement 2s 1s ease-in-out infinite; animation: arrow-movement 2s 1s ease-in-out infinite; }
@media (min-width: 750px) { .inner { 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: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } }
.container { margin: 0 auto; padding: 0; max-width: calc(100% - 40px);}
@media (min-width: 1300px) { .container { max-width: 1280px; margin: 0 auto; } }
@media (max-width: 1199px) { .container { max-width: 930px; } }
main .container { margin: 0 auto;}
@media (min-width: 1300px) { main .container { max-width: 1280px; margin: 0 auto; } }
@media (max-width: 1199px) { main .container { max-width: 930px; overflow: hidden; } }
hgroup { margin-bottom: 30px; }
hgroup h2 { font-size: 40px; font-weight: 400; line-height: 1.1; text-align: left; text-transform: uppercase; color: #005baa; letter-spacing: -1px; font-family: "Gmarket Sans", "맑은고딕", "malgun gothic, sans-serif"; }
hgroup h2 span { position: relative; color: #000; }
hgroup h2 span::after { position: absolute; right: -10px; top: -10px; width: 10px; height: 10px; border-radius: 50%; background-color: #ed1b2f; content: ''; }
hgroup p { display: none; }
@media (min-width: 1200px) { hgroup { margin-bottom: 42px; }
  hgroup p { border-left: 1px solid #888; margin-left: 39px; padding-left: 29px; font-size: 18px; color: #888; line-height: 1; } }
@media (min-width: 750px) { hgroup { width: 100%; clear: both; }
  hgroup h2 { display: inline-block; vertical-align: middle; }
  hgroup p { display: inline-block; } }
@media (max-width: 749px) { hgroup { margin-bottom: 20px; }
  hgroup h2 { font-size: 24px; } }
.hgroup { position: relative; display: inline-block; }
.hgroup h4 { position: relative; font-size: 24px; font-weight: 400; line-height: 1; color: #005aab; padding-bottom: 20px; }
.hgroup h4::after { content: ''; position: absolute; z-index: 10; width: 80px; height: 2px; background-color: #00bce4; bottom: 7px; left: -40px; }
.hgroup h4 em { display: block; margin-top: 5px; font-weight: 700; }
.hgroup p { display: none; }
@media (min-width: 1200px) { .hgroup p { display: block; } }
@-webkit-keyframes arrow-movement { 0% { opacity: 1;
    top: 0; }
  100% { opacity: 0;
    top: 20px; } }
@keyframes arrow-movement { 0% { opacity: 1;
    top: 0; }
  100% { opacity: 0;
    top: 20px; } }
@-webkit-keyframes arrow-movement-up { 0% { opacity: 1;
    top: -5px; }
  100% { opacity: 0;
    top: -25px; } }
@keyframes arrow-movement-up { 0% { opacity: 1;
    top: -5px; }
  100% { opacity: 0;
    top: -25px; } }
@-webkit-keyframes scrdDownAni { from { height: 4px; }
  to { height: 8px; } }
@keyframes scrdDownAni { from { height: 4px; }
  to { height: 8px; } }
.vr__control-button { display: inline-block; }
.vr__control-button button { width: 25px; height: 25px; line-height: 1; border-radius: 50%; font-size: 18px; }
.vr__control-button .prev { border: 1px solid #ddd; color: #000; }
.vr__control-button .next { border: 1px solid #ddd; color: #000; }
.vr__control-button .play { background-color: #005aab; color: #fff; }
.vr__control-button .stop { background-color: #888; color: #fff; }
.visual-section { position: relative; padding: 30px 20px 20px; background-size: cover; }
.visual-section #visualSlide.slick-slider { border-radius: 15px; overflow: hidden; position:relative;z-index:2;}
.visual-section .visualslide { border-radius: 15px; float: left; width: calc(100% - 409px - 20px); position: relative;}
@media (min-width: 750px) and (max-width: 1199px) { .visual-section .visualslide { width: 100%; } }
@media (max-width: 749px) { .visual-section .visualslide { width: 100%; float: none; border-radius: 0; margin-bottom: 42px; } }
.visual-section .visualslide__ctrl { height: 42px; padding: 0 15px; background-color: rgba(255, 255, 255, 0.75); position: absolute; z-index: 10; bottom: 8px; right: 10px; line-height: 42px; border-radius: 40px; color: #000; }
@media (min-width: 750px) { .visual-section .visualslide__ctrl { right: 15px; bottom: 15px; } }
@media (max-width: 749px) { .visual-section .visualslide__ctrl { right: 50%; right: 0; bottom: -42px; width: 100%; text-align: center; } }
.visual-section .visualslide__ctrl button { color: inherit; width: 25px; height: 25px; margin: 0 2px; line-height: 1; text-align: center; border-radius: 50%; }
.visual-section .visualslide__ctrl .visualslide__play { border: none; }
.visual-section .visualslide__ctrl .visualslide__stop { border: none; }
.visual-section .visualslide__ctrl .number { font-weight: 300; }
.visual-section .visualslide__ctrl .currentCount { font-weight: 700; }
.visual-section .visualslide .left-link{float:left;height:100%;width:55px;}
.visual-section .visualslide .left-link .link-tit{
  position: absolute;
  top: 0;
  left: 0;
  width: 70px;
  height: calc(52%);
  z-index: 3;
  background: #fff;
  border-radius: 13px;
}
.visual-section .visualslide .left-link .link-tit.active{
  position: absolute;
  top: 0;
  left: 0;
  width: 70px;
  height: calc(52%);
  z-index:4;
}
.visual-section .visualslide .left-link .link-tittwo{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 70px;
  height: calc(50%);
  z-index: 3;
  background: #fff;
  border-radius: 13px;
}
  .visual-section .visualslide .left-link .link-tittwo.active{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 70px;
    height: calc(50%);
    z-index:4;
  }
/* @media (max-width: 1000px) {
  .visual-section .visualslide .left-link .link-tit{
    float: left;
    width: 70px;
    height:190px;
    margin-right:-15px;
  }
  .visual-section .visualslide .left-link .link-tit.active{
    position:relative;
    float: left;
    width: 70px;
    height:190px;
    margin-right:-15px;
    z-index:1;
  }
  .visual-section .visualslide .left-link .link-tittwo{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 70px;
    height: calc(50%);
  }
  .visual-section .visualslide .left-link .link-tittwo.active{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 70px;
    height: calc(50%);
  }
} */
.visual-section .visualslide .left-link .link-tit.active a{
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 15px;
  background:#e4477a;
  color: #fff;
  font-weight: 600;
  text-align: center;
  box-sizing: border-box;
  writing-mode: vertical-lr;
  font-size:18px;
  border-radius: 15px;
}
.visual-section .visualslide .left-link .link-tit a{
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 15px;
  /* background:#e4477a; */
  color: #000;
  font-weight: 600;
  text-align: center;
  box-sizing: border-box;
  writing-mode: vertical-lr;
  font-size:18px;
  border-radius: 15px;
  border:1px solid #dddddd;
}
.visual-section .visualslide .left-link .link-tittwo.active a{
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 15px;
  background:#e4477a;
  color: #fff;
  font-weight: 600;
  text-align: center;
  box-sizing: border-box;
  writing-mode: vertical-lr;
  font-size:18px;
  border-radius: 15px;
}
.visual-section .visualslide .left-link .link-tittwo a{
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 15px;
  background:#fff;
  color: #000;
  font-weight: 600;
  text-align: center;
  box-sizing: border-box;
  writing-mode: vertical-lr;
  font-size:18px;
  border-radius: 15px;
  border:1px solid #dddddd;
}
.visual-section .visualslide .left-link .link-tit a::before{
  content: '';
  background:url(/static/portal/img/main2022/belloff.png)no-repeat;
  display:inline-block;
  width:20px;
  height:23px;
  margin-bottom:10px;
}
.visual-section .visualslide .left-link .link-tit.active a::before{
  content: '';
  background:url(/static/portal/img/main2022/bellon.png)no-repeat;
  display:inline-block;
  width:20px;
  height:23px;
  margin-bottom:10px;
}
.visual-section .visualslide .left-link .link-tittwo a::before{
  content: '';
  background:url(/static/portal/img/main2022/handoff.png)no-repeat;
  display:inline-block;
  width:25px;
  height:24px;
  margin-bottom:10px;
}
.visual-section .visualslide .left-link .link-tittwo.active a::before{
  content: '';
  background:url(/static/portal/img/main2022/handon.png)no-repeat;
  display:inline-block;
  width:25px;
  height:24px;
  margin-bottom:10px;
}
.visualslide .visualslide__ctrl.slide-ctrl .visualslide__more{
  content: '';
  display:inline-block;
  background:url(/static/portal/img/main2022/icon-plus3.png)no-repeat;
  width:20px;
  height:20px;
  vertical-align:middle;
}
@media (max-width: 749px) {
  .visual-section .visualslide .left-link{
    float:none;
    display:flex;
    width:100%;
  }
  .visual-section .visualslide .left-link .link-tit{
    position:relative;
    width: 50%;
    height: 50px;
    margin-right:0px;
    z-index:1;
  }
  .visual-section .visualslide .left-link .link-tit.active{
    position:relative;
    width: 50%;
    height: 50px;
    margin-right:0px;
    z-index:2;
  }
  .visual-section .visualslide .left-link .link-tit.active a{
    display: block;
    width: 100%;
    height: 100%;
    padding-left: 5px;
    background:#e4477a;
    color: #fff;
    font-weight: 600;
    text-align: center;
    box-sizing: border-box;
    writing-mode: inherit;
    font-size:18px;
    border-radius: 15px;
    padding-top:10px;
  }
  .visual-section .visualslide .left-link .link-tit a{
    display: block;
    width: 100%;
    height: 100%;
    padding-left: 15px;
    /* background:#e4477a; */
    color: #000;
    font-weight: 600;
    text-align: center;
    box-sizing: border-box;
    writing-mode: inherit;
    font-size:18px;
    border-radius: 15px;
    border:1px solid #dddddd;
    padding-top:10px;
  }
  .visual-section .visualslide .left-link .link-tittwo{
    position:relative;
    width: 50%;
    height: 50px;
    margin-right:0px;
    z-index:1;
  }
  .visual-section .visualslide .left-link .link-tittwo.active{
    position:relative;
    width: 50%;
    height: 50px;
    margin-right:0px;
    z-index:1;
  }
  .visual-section .visualslide .left-link .link-tittwo a{
    display: block;
    width: 100%;
    height: 100%;
    padding-left: 15px;
    /* background:#e4477a; */
    color: #000;
    font-weight: 600;
    text-align: center;
    box-sizing: border-box;
    writing-mode: inherit;
    font-size:18px;
    border-radius: 15px;
    border:1px solid #dddddd;
    padding-top:10px;
  }
  .visual-section .visualslide .left-link .link-tittwo.active a{
    display: block;
    width: 100%;
    height: 100%;
    padding-left: 5px;
    background:#e4477a;
    color: #fff;
    font-weight: 600;
    text-align: center;
    box-sizing: border-box;
    writing-mode: inherit;
    font-size:18px;
    border-radius: 15px;
    padding-top:10px;
  }
  .visual-section .visualslide .left-link .link-tit a::before{
    content: '';
    background:url(/static/portal/img/main2022/belloff.png)no-repeat;
    display:inline-block;
    width:20px;
    height:23px;
    vertical-align:middle;
  }
  .visual-section .visualslide .left-link .link-tit.active a::before{
    content: '';
    background:url(/static/portal/img/main2022/bellon.png)no-repeat;
    display:inline-block;
    width:20px;
    height:23px;
    margin-bottom:10px;
  }
  .visual-section .visualslide .left-link .link-tittwo a::before{
    content: '';
    background:url(/static/portal/img/main2022/handoff.png)no-repeat;
    display:inline-block;
    width:25px;
    height:24px;
    margin-bottom:0px;
  }
  .visual-section .visualslide .left-link .link-tittwo.active a::before{
    content: '';
    background:url(/static/portal/img/main2022/handon.png)no-repeat;
    display:inline-block;
    width:25px;
    height:24px;
    margin-bottom:0px;
  }
}
.visual-section .visualslide .visualslide-area.two{display:none;}
.visual-section .visualslide .visualslide-area.two .active{display:block;}
.visual-section .visualslide .visualslide-area .items { display: block; border-radius: 15px; border: 1px solid rgba(0, 0, 0, 0.15); /*	 box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.15); */ position: relative; overflow: hidden; }
.visual-section .visualslide .visualslide-area .items::before { display: block; height: 0; padding-top: 47.630332%; content: ''; }
.visual-section .visualslide .visualslide-area .items img { position: absolute; left: 50%; top: 50%; width: 100%; height:100%; vertical-align: top; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); }
.visual-section .visualslide .visualslide-area .items:focus img{outline:1px dashed #000;outline-offset: -2px;}
.visual-section .visualslide .visualslide-area .items:hover img, .visual-section .visualslide .visualslide-area .items:focus img, .visual-section .visualslide .visualslide-area .items:active img { -webkit-transform: translate(-50%, -50%) scale(1.1); transform: translate(-50%, -50%) scale(1.1); }
.visual-section .visualslide .visualslide-area .items:hover img, .visual-section .visualslide .visualslide-area .items:active img, .visual-section .visualslide .visualslide-area .items:focus img { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); }
@media (min-width: 1200px) { .visual-section .visualslide .visualslide-area .items { height: 402px; } }
.visual-section .spot-menu { width: 100%; margin-bottom: 30px; }
.visual-section .spot-menu .status { background: #004889 url(/static/portal/img/main/status-bg.png) 75% 83px no-repeat; background-size: 215px; border-radius: 15px; margin-bottom: 20px; }
.visual-section .spot-menu .status a { display: block; text-align: center; padding: 30px 0 116px; border-radius: 15px; -webkit-box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.15); }
.visual-section .spot-menu .status a > span { display: block; color: #fff; font-size: 24px; font-family: "Gmarket Sans", "맑은고딕", "malgun gothic, sans-serif"; line-height: 1.4; }
.visual-section .spot-menu .status a > span em { color: #9fcf67; font-weight: 700; }
.visual-section .spot-menu .status a span.banner-p { display: none; }
@media (max-width: 1199px) { .visual-section .spot-menu .status { background-position: 90% 20px; }
  .visual-section .spot-menu .status a { padding: 50px 50% 50px 40px; text-align: left; }
  .visual-section .spot-menu .status a > span { display: inline-block; text-align: center; } }
@media (max-width: 749px) { .visual-section .spot-menu .status { display: none; } }
@media (min-width: 1200px) { .visual-section { padding: 40px 0 50px; }
  .visual-section .inner { 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; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .visual-section .visualslide { padding: 0; margin-right: 20px; }
  .visual-section .visualslide .visualslide__ctrl .number { display: inline-block; } }
@media (max-width: 1199px) and (min-width: 750px) { .visual-section .spot-menu { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .visual-section .spot-menu .status { width: calc(100% / 5 * 3); } }
@media (max-width: 749px) { .visual-section { padding: 15px; }
  .visual-section .container { overflow: visible; }
  .visual-section .spot-menu { margin-bottom: 15px; } }
.sectionMain-right { float: right; width: 408px; }
@media (min-width: 750px) and (max-width: 1199px) { .sectionMain-right { margin-top: 30px; float: none; width: 100%; overflow: hidden; } }
@media (max-width: 749px) { .sectionMain-right { float: none; width: 100%; } }
.visual-section .visual-service { position: relative; padding: 0 60px; margin-bottom: 20px; }
@media (min-width: 750px) and (max-width: 1199px) { .visual-section .visual-service { margin-top: 30px; } }
.visual-section .visual-service .visual-service-items { display: block; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; text-align: center; margin: 0 -8px; height: 160px; }
@media (min-width: 1200px) { .visual-section .visual-service .visual-service-items .slick-list { padding-top: 30px; } }
.visual-section .visual-service .visual-service-items .items { position: relative; min-width: 82px; min-height: 120px; margin: 0 8px; }
.visual-section .visual-service .visual-service-items .items.service01 a::before { background-image: url(/static/portal/img/main/ico_11.svg); }
.visual-section .visual-service .visual-service-items .items.service02 a::before { background-image: url(/static/portal/img/main/ico_12.svg); }
.visual-section .visual-service .visual-service-items .items.service03 a::before { background-image: url(/static/portal/img/main/ico_03.svg); }
.visual-section .visual-service .visual-service-items .items.service04 a::before { background-image: url(/static/portal/img/main/ico_04.svg); }
.visual-section .visual-service .visual-service-items .items.service05 a::before { background-image: url(/static/portal/img/main/ico_06.svg); }
.visual-section .visual-service .visual-service-items .items.service06 a::before { background-image: url(/static/portal/img/main/ico_07.svg); }
.visual-section .visual-service .visual-service-items .items.service07 a::before { background-image: url(/static/portal/img/main/ico_05.png); }
.visual-section .visual-service .visual-service-items .items.service08 a::before { background-image: url(/static/portal/img/main/ico_08.svg); }
.visual-section .visual-service .visual-service-items .items.service09 a::before { background-image: url(/static/portal/img/main/ico_09.svg); }
.visual-section .visual-service .visual-service-items .items.service10 a::before { background-image: url(/static/portal/img/main/ico_10.svg); }
.visual-section .visual-service .visual-service-items .items.service11 a::before { background-image: url(/static/portal/img/main/ico_01.svg); }
.visual-section .visual-service .visual-service-items .items.service12 a::before { background-image: url(/static/portal/img/main/ico_02.svg); }
.visual-section .visual-service .visual-service-items .items.service13 a::before { background-image: url(/static/portal/img/main/ico_13.svg); }
.visual-section .visual-service .visual-service-items .items.service14 a::before { background-image: url(/static/portal/img/main/ico_14.svg); }
.visual-section .visual-service .visual-service-items .items.service15 a::before { background-image: url(/static/portal/img/main/ico_15.svg); }
.visual-section .visual-service .visual-service-items .items.service16 a::before { background-image: url(/static/portal/img/main/ico_16.svg); }
.visual-section .visual-service .visual-service-items .items.service17 a::before { background-image: url(/static/portal/img/main/pass.png); }
.visual-section .visual-service .visual-service-items .items.service18 a::before { background-image: url(/static/portal/img/main/job.png); }
.visual-section .visual-service .visual-service-items a { background: #fff; border-radius: 15px; -webkit-transition: all 0.25s linear; transition: all 0.25s linear; -webkit-box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.15); display: block; width: 100%; height: 100%; position: absolute; }
.visual-section .visual-service .visual-service-items a::before { content: ''; display: block; margin: 0 auto; width: 62px; height: 48px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-49%, -42px); transform: translate(-49%, -42px); background-repeat: no-repeat; background-position: center; }
.visual-section .visual-service .visual-service-items .items.service17 a::before { content: ''; display: block; margin: 0 auto; width: 62px; height: 58px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-49%, -42px); transform: translate(-49%, -42px); background-repeat: no-repeat; background-position: center; }
.visual-section .visual-service .visual-service-items a:hover::after, .visual-section .visual-service .visual-service-items a:active::after, .visual-section .visual-service .visual-service-items a:focus::after { content: ''; position: absolute; left: 0; top: 0; content: ''; border-radius: 15px; border: 2px solid #005aab; width: 100%; height: 100%; }
.visual-section .visual-service .visual-service-items a span { 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: 100%; height: 30px; position: absolute; bottom: 10px; left: 0; font-size: 14px; font-weight: 500; line-height: 16px; line-height: 1.4; word-break: keep-all; font-family: "Noto Sans KR", sans-serif; font-weight: 400; }
.visual-section .visual-service button { display: block !important; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); color: #939393; font-size: 26px; line-height: 1; width: 34px; height: 34px; border-radius: 50%; border: 1px solid #939393; }
.visual-section .visual-service button:focus{outline-offset: -2px;outline: 1px dashed #000;}
.visual-section .visual-service button.service__button__prev { left: 0; }
.visual-section .visual-service button.service__button__next { right: 0; }
@media (max-width: 749px) { .visual-section .visual-service { padding: 0 30px; }
  .visual-section .visual-service .visual-service-items a span { font-size: 14px; }
  .visual-section .visual-service button { width: 20px; height: 20px; font-size: 16px; color: #939393; } }
@media (max-width: 1199px) { .visual-section .visual-service .visual-service-items { overflow: hidden; height: 96px; margin: 0 -8px 0 -9px; }
  .visual-section .visual-service .visual-service-items .items { min-width: 86px; min-height: 86px; margin-left: 3px; margin-right: 3px; margin-top: 5px; }
  .visual-section .visual-service .visual-service-items .items a { height: 86px; }
  .visual-section .visual-service .visual-service-items .items a::before { -webkit-transform: translate(-49%, -42px) scale(0.5); transform: translate(-49%, -42px) scale(0.5); }
  .visual-section .visual-service .visual-service-items .items.service17 a::before { -webkit-transform: translate(-49%, -42px) scale(0.5); transform: translate(-49%, -42px) scale(0.5); height: 52px; }
}
@media (min-width: 750px) and (max-width: 1199px) { .mayor-set { float: left; width: 408px; } }
@media (max-width: 749px) { .mayor-set { width: 100%; background: url(/static/portal/img/main2022/mayor-bg.png) 0 0 no-repeat; background-size: 100% 100%; border: 1px solid #dddddd; border-radius: 13px; } }
.mayor-set .mayor__info{display:flex;/* align-items:center; */justify-content: space-between;}
.mayor-set .mayor {height: 200px;padding: 30px 20px; border: 1px solid #dddddd;border-radius: 12px;background: url(/static/portal/img/main2022/mayor-bg.png) 0 0 no-repeat;/*background: url(/static/portal/img/main2022/mayor-pic.png) 0 0 no-repeat;*/}
@media (max-width: 749px) { .mayor-set .mayor { /*background: url(/static/portal/img/main2022/mayor-pic-m@2x.png) 0 0 no-repeat;*/ background-size: contain; background-position: 0 bottom; padding-left: 10px; border-width: 0; padding-top: 22px; height: 200px; max-width: 300px; margin: 0 auto; } }
.mayor-set .mayor__info .txt { width: 199px; height: 102px; background: url(/static/portal/img/main2022/mayor-txt.png) 0 0 no-repeat; margin-top:20px;}
@media (max-width: 749px) { .mayor-set .mayor__info .txt {background-image: url(/static/portal/img/main2022/mayor-txt.png);background-size: 100%; width: 130px; height: 200px;margin-top:35px;} }
.mayor-set .mayor__info .mayor--go { margin-top: 13px; display: inline-block; padding: 10px 12px 10px 10px; color: #e41e2b; font-size: 16px; font-weight: 400; text-align: center; border-radius: 30px; border: 1px solid #e41e2b; line-height: 1; background-color: #fff; }
@media (max-width: 749px) { .mayor-set .mayor__info a { margin-top: 10px; margin-bottom: 4px; margin-left: 20px; padding: 6px 10px; font-size: 13px; } }
.mayor-set .mayor .mayor--button { margin-top: 12px; padding-left: 11px; }
@media (max-width: 749px) { .mayor-set .mayor .mayor--button { margin-top: 8px; padding-left: 0px; } }
.mayor-set .mayor .mayor--button li + li { margin-top: 9px; }
@media (max-width: 749px) { .mayor-set .mayor .mayor--button li + li { margin-top: 4px; } }
.mayor-set .mayor .mayor--button li a { display: inline-block; line-height: 1; padding: 5px 0 5px 0; border-bottom: 1px solid #000; font-size: 16px; }
@media (max-width: 749px) { .mayor-set .mayor .mayor--button li a { font-size: 12px; padding: 3px 0; } }
.vr__list { margin-top: 30px; height: 170px; border: 1px solid #ddd; border-radius: 15px; background: url(/static/portal/img/main2022/vr-box-bg.png) 0 0 no-repeat; position: relative; }
@media (min-width: 750px) and (max-width: 1199px) { .vr__list { float: right; width: calc(100% - 438px); margin-top: 0; height: 280px; background-image: url(/static/portal/img/main2022/vr-box-bg-md.png); } }
@media (max-width: 749px) { .vr__list { margin-top: 15px; margin-bottom: 15px; } }
.vr__list h2 { padding: 10px 0 0 28px; line-height: 1; color: #fff; font-size: 17px; }
@media (min-width: 750px) and (max-width: 1199px) { .vr__list h2 { height: 92px; padding-top: 25px; } }
.vr__list h2 em { font-size: 26px; font-weight: 800; }
.vr__list .vr__control-button { position: absolute; top: 10px; right: 30px; }
@media (min-width: 750px) and (max-width: 1199px) { .vr__list .vr__control-button { display: none; } }
.vr__list .vr__control-button button { color: #000; text-align: left; border-radius: 30px; width: 25px; font-size: 27px; line-height: 1; }
.vr__list .vr__list--slide { margin-top: 18px; padding-left: 30px; padding-right: 30px; }
@media (max-width: 749px) { .vr__list .vr__list--slide { padding-left: 15px; padding-right: 15px; } }
.vr__list .vr__list--slide .items { 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: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; flex-wrap:wrap; margin-top:20px;}
@media (min-width: 750px) and (max-width: 1199px) { .vr__list .vr__list--slide .items { display: block; } }
@media (min-width: 750px) and (max-width: 1199px) { .vr__list .vr__list--slide .items span { display: block; margin-top: 10px; } }
.vr__list .vr__list--slide .items span a { font-size: 16px; font-weight: 700; text-align: left; line-height: 35px;  }
@media (max-width: 749px) { .vr__list .vr__list--slide .items span a { font-size: 14px; } }
.vr__list .vr__list--slide .items span a::after { content: ''; margin-left: 10px; width: 22px; height: 22px; display: inline-block; background: url(/static/portal/img/main2022/vr-arr.png) 0 0 no-repeat; vertical-align: middle; }
@media (max-width: 749px) { .vr__list .vr__list--slide .items span a::after { margin-top: -3px; } }
.news-section { padding: 40px 20px 20px; background: url(/static/portal/img/main2022/news-bg.png) 0 0 no-repeat; background-size: cover; }
@media (min-width: 1200px) { .news-section { padding-top: 100px; padding-bottom: 178px; } }
.news-section .container { overflow: visible; }
@media (min-width: 750px) { .news-section .inner { 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; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-line-pack: stretch; align-content: stretch; } }
.news-section .info__news { width: 100%; margin-bottom: 30px; }
@media (min-width: 750px) { .news-section .info__news { width: 366px; } }
.news-section .info__news .yongsan-news { margin-top: 28px; }
.news-section .info__news .yongsan-news > a { display: block; height: 100px; border-radius: 15px; background-color: #005aab; -webkit-box-shadow: inset 0px -3px 13px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 0px -3px 13px 0px rgba(0, 0, 0, 0.2); position: relative; padding: 16px 0 15px 190px; line-height: 1.4; overflow: hidden; color:#fff;}
.news-section .info__news .yongsan-news > a::before, .news-section .info__news .yongsan-news > a::after { content: ''; position: absolute; }
.news-section .info__news .yongsan-news > a::before { left: 29px; bottom: 0; width: 130px; height: 89px; background: url(/static/portal/img/main/newsletter.jpg) 0 0 no-repeat; background-size: cover; }
.news-section .info__news .yongsan-news > a::after { right: 20px; bottom: 28px; width: 40px; height: 11px; background: url(/static/portal/img/main/ico-new-link.png) no-repeat; }
.news-section .info__news .yongsan-news > a span { color: #fff; font-size: 24px; }
.news-section .info__news .yongsan-news > a span em { font-weight: bold; }
.news-section .info__news .yongsan-news > a span span { display: block; font-size: 16px; }
@media (max-width: 749px) { .news-section .info__news .yongsan-news > a { padding: 11px 0 10px 127px; }
  .news-section .info__news .yongsan-news > a::before { bottom: -20px; left: 15px; width: 98px; height: 89px; } }
@media (max-width: 749px) { .news-section hgroup { display: none; }
  .news-section .info__news { margin-bottom: 15px; } }
.popupzone-set { width: 100%; margin-bottom: 30px; }
@media (min-width: 750px) { .popupzone-set { width: calc(100% - 366px); padding-right: 40px; } }
.popupzone-set .popupzone { position: relative; }
.popupzone-set .popupzone h1 { height: 50px; font-size: 24px; color: #000; font-weight: 600; }
@media (max-width: 749px) { .popupzone-set .popupzone h1 { font-family: "Gmarket Sans", "맑은고딕", "malgun gothic, sans-serif"; } }
.popupzone-set .popupzone .popupzone__control { position: absolute; right: 20px; top: 0; }
.popupzone-set .popupzone .control-button button { display: inline-block; width: 30px; height: 30px; border-radius: 30px; }
.popupzone-set .popupzone .control-button button:focus{outline-offset: -2px;outline: 1px dashed #000;}
.popupzone-set .popupzone .control-button button.prev, .popupzone-set .popupzone .control-button button.next { border: 1px solid #ddd; }
.popupzone-set .popupzone .control-button .popupzone--play { border: none; background-color: #888; color: #fff; }
.popupzone-set .popupzone .control-button .popupzone--stop { border: none; background-color: #888888; color: #fff; }
.popupzone-set .popupzone .control-button .popupzone--watch-all {
  display:inline-block;
  background:url(/static/portal/img/main2022/icon-plus.png)no-repeat;
  width:30px;
  height:30px;
  vertical-align:top;
}
.popupzone-set .popupzone .popupzone__slide { overflow: hidden; height: 230px; }
/* 알림판 a 태그 포커스링 수정 */
.popupzone-set .popupzone .popupzone__slide a:focus{outline-offset:-4px;}
@media (max-width: 749px) { .popupzone-set .popupzone .popupzone__slide { height: auto; clear: both; } }
.popupzone-set .popupzone .number { font-weight: 300; color: #45576c; font-size: 16px; }
.popupzone-set .popupzone .currentCount { font-weight: 500; }
.popupzone-set .popupzone .items .img { width: 278px; height: 230px; margin: auto; border-radius: 15px; overflow: hidden; }
@media (min-width: 1200px) and (max-width: 1299px) { .popupzone-set .popupzone .items .img { width: calc(100% - 10px); } }
@media (min-width: 750px) and (max-width: 1199px) { .popupzone-set .popupzone .items .img { width: 100%; border-radius: 0; }
  .popupzone-set .popupzone .items .img img { border-radius: 15px; } }
@media (min-width: 992px) { .popupzone-set .popupzone .items .img { margin-right: 20px; } }
@-webkit-keyframes zoom-center { 0% { opacity: 0.8; }
  50% { opacity: 1; } }
@keyframes zoom-center { 0% { opacity: 0.8; }
  50% { opacity: 1; } }
 .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:flex; 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; }
.top-nav-right {margin-right: 64px;}
@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 {}
.banner-f .text img{
  display:none;
}
.banner-f .text .moblie-banner{
  width:100%;
  display:block;
}
}
@media (min-width: 1200px) { .ani-traffic .sc_ani1 a { -webkit-animation: aniUp 2s ease 1, aniDown 3s linear 1; animation: aniUp 2s ease 1, aniDown 3s linear 1; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; }
  .ani-traffic .sc_ani1 a span { display: block; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani1 a::before { background-position: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani1 a:hover::before { background-position: 50% 10%; }
  .ani-traffic .sc_ani1 a:hover span { -webkit-transform: translateY(-80px); transform: translateY(-80px); color: #fff; }
  .ani-traffic .sc_ani2 a { -webkit-animation: aniUp 2s ease 1, aniDown 3s linear 1; animation: aniUp 2s ease 1, aniDown 3s linear 1; -webkit-animation-delay: 0.6s; animation-delay: 0.6s; }
  .ani-traffic .sc_ani2 a span { display: block; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani2 a::before { background-position: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani2 a:hover::before { background-position: 50% 10%; }
  .ani-traffic .sc_ani2 a:hover span { -webkit-transform: translateY(-80px); transform: translateY(-80px); color: #fff; }
  .ani-traffic .sc_ani3 a { -webkit-animation: aniUp 2s ease 1, aniDown 3s linear 1; animation: aniUp 2s ease 1, aniDown 3s linear 1; -webkit-animation-delay: 0.9s; animation-delay: 0.9s; }
  .ani-traffic .sc_ani3 a span { display: block; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani3 a::before { background-position: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani3 a:hover::before { background-position: 50% 10%; }
  .ani-traffic .sc_ani3 a:hover span { -webkit-transform: translateY(-80px); transform: translateY(-80px); color: #fff; }
  .ani-traffic .sc_ani4 a { -webkit-animation: aniUp 2s ease 1, aniDown 3s linear 1; animation: aniUp 2s ease 1, aniDown 3s linear 1; -webkit-animation-delay: 1.2s; animation-delay: 1.2s; }
  .ani-traffic .sc_ani4 a span { display: block; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani4 a::before { background-position: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani4 a:hover::before { background-position: 50% 10%; }
  .ani-traffic .sc_ani4 a:hover span { -webkit-transform: translateY(-80px); transform: translateY(-80px); color: #fff; }
  .ani-traffic .sc_ani5 a { -webkit-animation: aniUp 2s ease 1, aniDown 3s linear 1; animation: aniUp 2s ease 1, aniDown 3s linear 1; -webkit-animation-delay: 1.5s; animation-delay: 1.5s; }
  .ani-traffic .sc_ani5 a span { display: block; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani5 a::before { background-position: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani5 a:hover::before { background-position: 50% 10%; }
  .ani-traffic .sc_ani5 a:hover span { -webkit-transform: translateY(-80px); transform: translateY(-80px); color: #fff; }
  .ani-traffic .sc_ani6 a { -webkit-animation: aniUp 2s ease 1, aniDown 3s linear 1; animation: aniUp 2s ease 1, aniDown 3s linear 1; -webkit-animation-delay: 1.8s; animation-delay: 1.8s; }
  .ani-traffic .sc_ani6 a span { display: block; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani6 a::before { background-position: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani6 a:hover::before { background-position: 50% 10%; }
  .ani-traffic .sc_ani6 a:hover span { -webkit-transform: translateY(-80px); transform: translateY(-80px); color: #fff; }
  .ani-traffic .sc_ani7 a { -webkit-animation: aniUp 2s ease 1, aniDown 3s linear 1; animation: aniUp 2s ease 1, aniDown 3s linear 1; -webkit-animation-delay: 2.1s; animation-delay: 2.1s; }
  .ani-traffic .sc_ani7 a span { display: block; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani7 a::before { background-position: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s; }
  .ani-traffic .sc_ani7 a:hover::before { background-position: 50% 10%; }
  .ani-traffic .sc_ani7 a:hover span { -webkit-transform: translateY(-80px); transform: translateY(-80px); color: #fff; }
  @-webkit-keyframes aniUp { 10% { top: 0; }
    50% { top: -80px; }
    100% { top: 0; } }
  @keyframes aniUp { 10% { top: 0; }
    50% { top: -80px; }
    100% { top: 0; } }
  @-webkit-keyframes aniDown { 0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 1; } }
  @keyframes aniDown { 0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 1; } } }
/* .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 > div { position: absolute; top: 150px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 1800; font-family: "Gmarket Sans", "맑은고딕", "malgun gothic, sans-serif"; 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); background: #f5f9ff url(/static/portal/img/main/info-pop-bg.png) 0 0 no-repeat; background-size: 100% 100%; text-align: center; width: 848px; height: auto; padding: 10px 10px 25px; color: #005aab; }
.info-pop > div h1 { font-size: 42px; font-weight: 300; line-height: 1.333; margin: 20px 0; color: #0c9ebd; }
.info-pop > div h1 strong { color: #005aab; }
.info-pop > div span.img { display: block; margin-top: -200px; }
.info-pop > div strong.highlight { position: relative; }
.info-pop > div strong.highlight::before { content: ''; position: absolute; top: 50%; -webkit-transform: translateY(-68%); transform: translateY(-68%); left: 0; z-index: -1; width: 100%; height: 21px; background-color: rgba(12, 158, 189, 0.18); }
.info-pop > div p { font-size: 24px; line-height: 1.462; color: #004889; margin-top: 5px; }
.info-pop > div .close-checkbox { position: relative; width: 100%; padding-top: 30px; font-family: "Noto Sans KR", "맑은고딕", "malgun gothic", sans-serif; }
.info-pop > div .close-checkbox .b-skyblue { display: inline-block; width: 120px; height: 40px; border-radius: 5px; background-color: #0C9EBD; color: #fff; line-height: 40px; }
.info-pop > div .close-checkbox span { position: absolute; right: 20px; bottom: 0; }
.info-pop > div .close-checkbox span label { color: #888888; font-size: 14px; }
@media (max-width: 749px) { .info-pop > div { width: 90%; padding: 20px; }
  .info-pop > div h1 { font-size: 20px; margin: 20px 0; }
  .info-pop > div p { font-size: 16px; }
  .info-pop > div span.img { margin-top: -120px; }
  .info-pop > div .close-checkbox { padding-bottom: 30px; } }
@media (max-width: 359px) { .info-pop > div { top: 20px; padding: 5px; max-height: 90vh; overflow: auto; }
  .info-pop > div p { font-size: 11px; } } */
.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%; transform: translateX(-50%); z-index: 1800; border-radius: 10px; 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%; transform: translateX(-50%); z-index: 1800; font-family:'GmarketSansMedium'; border-radius: 10px; 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, .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, .5);}
.info-pop--table table tbody td{background-color: #fff;font-size: 14px;padding: 16px 2px;border-right: 1px solid rgba(0, 90, 171, .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; }
/* 이태원 사고 관련 팝업 */
/*popup*/
.popup_layer {position:fixed;top:0;left:0;z-index: 10000; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4);}
/*팝업 박스*/
.popup_box{position: relative;top:50%;left:50%;overflow: auto;width: 100%; max-width:480px;transform:translate(-50%, -50%);z-index:1002;box-sizing:border-box;background:#fff;box-shadow: 2px 5px 10px 0px rgba(0,0,0,0.35);-webkit-box-shadow: 2px 5px 10px 0px rgba(0,0,0,0.35);-moz-box-shadow: 2px 5px 10px 0px rgba(0,0,0,0.35);border-radius: 15px;}
/*컨텐츠 영역*/
.popup_box .popup_cont {padding:0 0 8px 0;}
.popup_box .popup_cont img{width:100%;}
/*버튼영역*/
.popup_box .popup_btn {position:absolute;bottom:10px;left:50%;transform: translateX(-50%);}
.popup_box .popup_btn a {display: inline-block; background-color: #005aab; color: #fff; line-height: 20px;border-radius: 5px; font-size: 14px;padding: 10px 15px;margin-left: 10px;}
.popup_box .popup_btn a.close_day {background:#5d5d5d;}
.popup_box .popup_btn a.close_day:before, .popup_box .popup_btn a.close_day:after{display:none;}
/*오버레이 뒷배경*/
.popup_overlay{position:fixed;top:0px;right:0;left:0;bottom:0;z-index:1001;;background:rgba(0,0,0,0.5);}
@media (max-width: 749px) {
  .info-pop--content { max-width: calc(100% - 20px);width: 320px; }
}
@media (max-width: 359px) {
  .info-pop--content { top: 20px; }
}
/* 배너 모달 */
.container.modal{
  width:100%;
  z-index:10000000000;
}
.modal-wrap{
  background-color:rgba(0,0,0,.3);
  justify-content: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;
  box-shadow: 5px 10px 10px 1px rgba(0,0,0,.3);
  margin: 0 auto;
  margin-top: calc(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;
    box-shadow: 5px 10px 10px 1px rgba(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%;
}