@charset "utf-8"; 
/*
    FSI MAIN STYLE
    WRITER : Lee Jeonghee
	Last Modify Date : 2024. 08. 19.
*/

@media only screen and (max-width:480px) { 
    html { font-size:12px; }
}

/* popup */
#popupWrap { display:none; justify-content:center; align-items:center; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, .5); z-index:100; }
#popupWrap.on { display:flex; }
.layerPopInner { width:100%; padding:0 1.875em; box-sizing:border-box; }
.layerPopInner .layerPopSlideWrap { position:relative; max-width:1000px; margin:0 auto; }
.layerPopInner .layerPopSlideWrap.one { max-width:500px; }
.layerPopInner .layerPopupSwiper { margin:0 -1px; }
.layerPopInner .layerPopupSwiper a { display:block; }
.layerPopInner .layerPopupSwiper .img { overflow:hidden; display:block; position:relative; width:100%; padding-top:140%; margin:0 auto; }
.layerPopInner .layerPopupSwiper .img img { position:absolute; left:50%; top:50%; max-width:none; width:100%; height:100%; transform:translate(-50%, -50%); }
.layerPopInner .popupBtm { margin-top:1px; }
.layerPopInner .popupBtm .layerPopControl { display:flex; align-items:center; justify-content:space-between; background:#fff; }
.layerPopInner .popupBtm .layerPopControl p { padding-left:1.625em; }
.layerPopInner .popupBtm .layerPopControl p button { font-size:.9375em; line-height:1.4666em; letter-spacing:-.025em; }
.layerPopInner .popupBtm .layerPopControl ul { display:flex; align-items:center; }
.layerPopInner .popupBtm .layerPopControl ul li { border-left:1px solid #dadada; }
.layerPopInner .popupBtm .layerPopControl ul li button { position:relative; width:3.875em; height:3.375em; background:no-repeat center; background-size:.9375em; text-indent:-9999px; }
.layerPopInner .popupBtm .layerPopControl ul li button.swiper-button-disabled { opacity:.5; }
.layerPopInner .popupBtm .layerPopControl ul li .prev { background-image:url(../images/main/btn_layer_prev.png);}
.layerPopInner .popupBtm .layerPopControl ul li .next { background-image:url(../images/main/btn_layer_next.png);}
.layerPopInner .popupBtm .layerPopControl ul li .popupClose { background-image:url(../images/main/btn_layer_close.png);}
@media only screen and (max-width:960px) {
	.layerPopInner .layerPopSlideWrap { max-width:400px; }
	.layerPopInner .layerPopupSwiper { margin:0; }
	.layerPopInner .popupBtm .layerPopControl { padding:0 .5em 0 1em; }
	.layerPopInner .popupBtm .layerPopControl p { padding-left:0; }
	.layerPopInner .popupBtm .layerPopControl p button { font-size:1em; }
	.layerPopInner .popupBtm .layerPopControl ul li { border-left:none; }
	.layerPopInner .popupBtm .layerPopControl ul li button { width:1.8571em; height:3em; background-size:.8571em; }
	.layerPopInner .popupBtm .layerPopControl ul li .prev { background-image:url(../images/main/btn_layer_prev_mo.png); }
	.layerPopInner .popupBtm .layerPopControl ul li .next { background-image:url(../images/main/btn_layer_next_mo.png); }
	.layerPopInner .popupBtm .layerPopControl ul li .popupClose { background-image:url(../images/main/btn_layer_close_mo.png); }
}

/* visual */
.visual { position:relative; padding:13.25em 3% 6.25em; }
.visual>.bg { position:absolute; top:0; left:0; width:100%; height:100%; z-index:-1; }
.visual>.bg::before { content:''; position:absolute; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,.3); }
.visual>.bg picture { width:100%; height:100%; }
.visual>.bg img { height:100%; min-width:100%; max-width:none; object-position:center; }
.visual .inner { display:flex; justify-content:space-between; align-items:center; max-width:1320px; margin:0 auto; }
.visual .visualTxt { font-size:2.625em; font-weight:400; color:#fff; }
.visual .conArea { position:relative; width:31.625em; }
.visual .conArea.nonePoster { padding-top:250px; }
.visual .poster { overflow:hidden; border-top-left-radius:1.375em; }
.visual .poster a { display:block; }
.visual .poster a:focus { border:2px dashed #f00; }
.visual .result { overflow:hidden; margin-top:.3125em; border-bottom-right-radius:1.375em; }
.visual .nonePoster .result { border-top-left-radius:1.375em; }
.visual .result .col1 { background:#3e95ff; border-radius:2em 2em 0 0; }
.visual .result .col2 { background:#dc7800; }
.visual .result .title { display:flex; justify-content:space-between; padding:2.1875em 2.5em; background:#fff; box-sizing:border-box; }
.visual .result .title h3 { font-size:1.5em; letter-spacing:-.05em; }
.visual .result .title .info ul { display:flex; justify-content:space-between; }
.visual .result .title .info ul li i { display:inline-block; position:relative; width:.625em; height:.625em; margin-right:.3125em; border-radius:50%; }
.visual .result .title .info ul li i.col2::after { content:''; position:absolute; left:0; top:50%; width:100%; height:2px; margin-top:-1px; background:#fff; transform:rotate(45deg); }
.visual .result .title .info ul li span { display:inline-block; font-size:.875em; letter-spacing:-.025em; color:#7e7e7e; }
.visual .result .title .info .date { font-size:.875em; letter-spacing:.025em; color:#7e7e7e; }
.visual .result .content { display:flex; align-items:center; justify-content:space-between; padding:0 2em 2.625em 2.625em; background:#fff; }
.visual .result .content .chart { width:13.75em; height:7.25em; }
.visual .result .content .data dl { text-align:right; }
.visual .result .content .data dl dt { font-size:1.063em; font-weight:500; color:#004b9f; letter-spacing:-.05em; }
.visual .result .content .data dl dd { display:flex; align-items:center; justify-content:flex-end; }
.visual .result .content .data dl dd em { font-size:2.75em; font-weight:900; color:#044bbf; letter-spacing:-.02em; }
.visual .result .content .data dl dd span { font-size:2.375em; font-weight:900; color:#627ac7; }
.visual .result .content .data p { margin-top:1.1428em; font-size:.875em; letter-spacing:-.05em; color:#7f7f7f; }
.visual .result .btns { display:flex; }
.visual .result .btns li { flex:1; }
.visual .result .btns li a { display:block; padding:1.625em 0; text-align:center; }
.visual .result .btns li .btn1 { background:#0061ce; }
.visual .result .btns li .btn2 { background:#004b9f; }
.visual .result .btns li a span { display:inline-block; position:relative; padding-right:1em; font-size:1.125em; font-weight:500; letter-spacing:-.025em; color:#fff; }
.visual .result .btns li a:focus { border:2px dashed #fff; box-sizing:border-box;}
.visual .result .btns li a span::after { content:''; position:absolute; right:.125rem; top:50%; width:.4375rem; height:.4375rem; margin-top:-.1875rem; border-top:2px solid rgba(255, 255, 255, .6); border-right:2px solid rgba(255, 255, 255, .6); transform:rotate(45deg); }
.visual .prediction { overflow:hidden; padding:2.1875em 2.5em; border-top-left-radius:1.375em; background:#fff; }
.visual .prediction .title { display:flex; justify-content:space-between; margin-bottom:2em; }
.visual .prediction .title h3 { font-size:1.5em; letter-spacing:-.05em; }
.visual .prediction .title .dayType { display:flex; }
.visual .prediction .title .dayType li { margin-left:.875em; }
.visual .prediction .title .dayType li span { padding:.125em 0; color:#7f7f7f; border-bottom:1px solid transparent; }
.visual .prediction .title .dayType li button.active span { color:#0061ce; font-weight:700; border-color:#0061ce; }
.visual .prediction .content { display:flex; align-items:center; justify-content:space-between; }
.visual .prediction .content .chart { position:relative; width:13.75em; height:6.625em; background:no-repeat; background-size:contain; }
.visual .prediction .content.step1 .chart { background-image:url(../images/main/img_pre_chart1.png); }
.visual .prediction .content.step2 .chart { background-image:url(../images/main/img_pre_chart2.png); }
.visual .prediction .content.step3 .chart { background-image:url(../images/main/img_pre_chart3.png); }
.visual .prediction .content.step4 .chart { background-image:url(../images/main/img_pre_chart4.png); }
.visual .prediction .content .chart span { position:absolute; bottom:0; left:0; width:100%; font-size:1.375em; font-weight:700; color:#1a385d; letter-spacing:-.025em; line-height:1.9; text-align:center; }
.visual .prediction .content .data { width:11.875em; text-align:right; }
.visual .prediction .content .data .txt { font-size:1.5625em; letter-spacing:-.025em; }
.visual .prediction .content.step1 .data .txt strong { color:#227cfe; }
.visual .prediction .content.step2 .data .txt strong { color:#009b6d; }
.visual .prediction .content.step3 .data .txt strong { color:#e27600; }
.visual .prediction .content.step4 .data .txt strong { color:#de3e57; }
.visual .prediction .content .data .btns { margin-top:.875em; }
.visual .prediction .content .data .btns a span { padding-right:2.25em; color:#7f7f7f; letter-spacing:-.025em; background:url(../images/main/icon_pre_arrow.png) no-repeat right center; background-size:1.625em auto; }
@media screen and (max-width:960px) { 
	.visual { position:relative; padding:14em 8.3333% 0; background:none; }
	.visual>.bg { height:29.5833em; }
	.visual .inner { display:block; }
	.visual h3 { font-size:1.8333em; line-height:1.2; }
	.visual .conArea { width:100%; margin-top:3em; }
    .visual .conArea.nonePoster { padding-top:0; }
	.visual .poster img { width:100%; }
	.visual .result { margin-top:.3333em; border:1px solid #aeb0af; box-sizing:border-box; }
	.visual .result .title { padding:1.3333em 2em; }
	.visual .result .title h4 { font-size:1.1666em; }
	.visual .result .title .info ul li i { width:.5em; height:.5em; margin-right:.1666em; }
	.visual .result .title .info ul li span { font-size:.75em; }
	.visual .result .title .info .date { font-size:.75em; }
	.visual .result .content { padding:0 2em 2em; }
	.visual .result .content .chart { width:53.2786%; height:5.8333em; }
	.visual .result .content .data dl dt { font-size:.8333em; }
	.visual .result .content .data dl dd { margin-top:.3333em; }
	.visual .result .content .data dl dd em { font-size:2.1666em; }
	.visual .result .content .data dl dd span { font-size:1.9166em; }
	.visual .result .content .data p { font-size:.75em; }
	.visual .result .btns li a { padding:1.1666em 0; }
	.visual .result .btns li a span { padding-right:.8333em; font-size:1em; letter-spacing:-.05em; }
	.visual .result .btns li a span::after { right:0; width:.3333rem; height:.3333rem; margin-top:-.1666rem; border-width:1px; }
	.visual .prediction { padding:1.3333em 2em; border:1px solid #aeb0af; box-sizing:border-box; }
	.visual .prediction .title h4 { font-size:1.1666em; }
	.visual .prediction .title .dayType li { margin-left:.6666em; }
	.visual .prediction .title .dayType li span { font-size:.8333em; }
	.visual .prediction .content .chart { width:10.5em; height:5.3333em; }
	.visual .prediction .content.step1 .chart { background-image:url(../images/main/img_pre_chart1_mo.png); }
	.visual .prediction .content.step2 .chart { background-image:url(../images/main/img_pre_chart2_mo.png); }
	.visual .prediction .content.step3 .chart { background-image:url(../images/main/img_pre_chart3_mo.png); }
	.visual .prediction .content.step4 .chart { background-image:url(../images/main/img_pre_chart4_mo.png); }
	.visual .prediction .content .chart span { font-size:1.0833em; }
	.visual .prediction .content .data { width:9.6666em; }
	.visual .prediction .content .data .txt { font-size:1.25em; }
	.visual .prediction .content .data .btns a span { padding-right:1.8333rem; font-size:.8333em; background-image:url(../images/main/icon_pre_arrow_mo.png); background-size:1.6em auto; }
}

/* notice */
.notice { padding:10em 3% 6.875em; background:#f9f9f9; }
.notice .inner { display:flex; flex-wrap:wrap; justify-content:space-between; max-width:1220px; margin:0 auto; }
.notice .conArea { position:relative; width:54.918%; margin-top:4.375em; }
.notice .conArea.serviceLine { width:100%; }
.notice .conArea:nth-child(2n) { width:38.1967%; }
.notice .conArea:nth-child(-n+2) { margin-top:0; }
.notice .conArea .title { display:flex; justify-content:space-between; align-items:center; margin-bottom:1.75em; }
.notice .conArea .title h3 { font-size:1.875em; font-weight:900; }
.notice .conArea .title h3 span { color:#027e45; }
.notice .conArea .title .btnMore a { display:block; position:relative; width:1.75em; height:1.75em; text-indent:-9999px; }
.notice .conArea .title .btnMore a::before,
.notice .conArea .title .btnMore a::after { content:''; position:absolute; top:50%; left:0; width:1.6875em; height:1px; background:#888; }
.notice .conArea .title .btnMore a::after { transform:rotate(90deg); }
/* popup */
.notice .conArea.popup { padding-bottom:1.6875em; }
.notice .popupSwiper { border-radius:1.375em 0; }
.notice .popupSwiper .swiper-slide a { overflow:hidden; display:block; height:19.375em; }
.notice .popupSwiper .swiper-slide img { width:100%; height:100%; object-fit:cover; }
.notice .popupSwiper .swiper-slide a:focus img { border:2px dashed; box-sizing:border-box; }
.notice .popupControl { position:absolute; bottom:0; left:50%; padding:.875em 1em; background:#fff; border:1px solid #e5ecee; border-radius:2em; box-shadow:0px 12px 21px rgba(0, 0, 0, .02); transform:translateX(-50%); z-index:2; }
.notice .popupControl button { display:inline-block; position:relative; width:1.5em; height:1.5em; text-indent:-9999px; }
.notice .popupControl button::after { content:''; position:absolute; right:50%; top:50%; width:.4375em; height:.4375em; margin-top:-.25em; margin-right:-.375em; border-top:2px solid #767676; border-left:2px solid #767676; transform:rotate(-45deg); }
.notice .popupControl .next::after { margin-right:-.1875em; transform:rotate(135deg); }
.notice .popupControl .pagination { display:inline-block; vertical-align:middle; width:auto; margin:0 .5rem; font-size:.9375em; color:#757575; }
.notice .popupControl .pagination .now { font-weight:700; color:#070707; }
.notice .popupControl .dots { display:none; }
/* board */
.notice .board { border-top:1px solid #7fac90; }
.notice .board li { border-bottom:1px solid #e2e2e2; }
.notice .board li a { overflow:hidden; display:block; position:relative; padding:1.125em 4.25em 1.125em 0; }
.notice .board li a::after { content:''; display:block; position:absolute; top:50%; right:0; width:1.5em; height:1.125em; background:url(../images/main/icon_board_arrow.svg) no-repeat center; background-size:contain; transform:translateY(-50%); }
.notice .board li i { float:left; font-style:normal; font-size:.75em; font-weight:500; color:#465489; letter-spacing:-.025em; line-height:1; text-align:center; }
.notice .board li i b { display:block; font-size:2.3125rem; font-weight:900; }
.notice .board li span { overflow:hidden; display:block; margin-left:4.875rem; height:2.6em; font-size:1.125em; letter-spacing:-.025em; word-break:keep-all; }
/* card */
.notice .gallery { overflow:hidden; justify-content:space-between; padding-bottom:3.6875em; }
.notice .gallery .galleryControl { position:absolute; bottom:0; left:50%; padding:.875em 1em; background:#fff; border:1px solid #e5ecee; border-radius:2em; box-shadow:0px 12px 21px rgba(0, 0, 0, .02); transform:translateX(-50%); z-index:2; }
.notice .gallery .galleryControl button { display:inline-block; position:relative; width:1.5em; height:1.5em; text-indent:-9999px; }
.notice .gallery .galleryControl button::after { content:''; position:absolute; right:50%; top:50%; width:.4375em; height:.4375em; margin-top:-.25em; margin-right:-.375em; border-top:2px solid #767676; border-left:2px solid #767676; transform:rotate(-45deg); }
.notice .gallery .galleryControl .next::after { margin-right:-.1875em; transform:rotate(135deg); }
.notice .gallery .galleryControl .pagination { display:inline-block; vertical-align:middle; width:auto; margin:0 .5rem; font-size:.9375em; color:#757575; }
.notice .gallery .galleryControl .pagination .now { font-weight:700; color:#070707; }
.notice .gallery .galleryControl .dots { display:none; }
.notice .gallery .item { width:32.2388%; }
.notice .gallery.wideLine .item { width:50%; }
.notice .gallery .item a { display:block; }
.notice .gallery .item a:focus { border:2px dashed #f00; }
.notice .gallery .item .img { overflow:hidden; display:block; position:relative; width:100%; height:12.25em; border-radius:.375em .375em 0 0; }
.notice .gallery .item .img img { width:100%; height:100%; object-fit:cover; }
.notice .gallery .item .txt { display:block; padding:1.375em; background:#fff; border:1px solid #e5ecee; border-top:none; border-radius:0 0 .375em .375em; box-sizing:border-box; }
.notice .gallery .item .txt strong { overflow:hidden; display:block; font-weight:400; letter-spacing:-.025em; text-overflow:ellipsis; white-space:nowrap; }
.notice .gallery .item .txt i { display:block; margin-top:.5em; font-style:normal; font-size:.875em; color:#818080; }
/* service */
.notice .serviceLine { display:flex; justify-content:space-between; align-items:center; gap:3em; }
.notice .serviceLine .title { flex:0 0 auto; width:9em; margin-bottom:0; }
.notice .service { flex:1; display:flex; flex-wrap:wrap; justify-content:space-between; }
.notice .service li a { display:flex; flex-direction:column; justify-content:center; align-items:center; width:8.625em; height:8.625em; background:#fff; border:1px solid #e5ecee; border-radius:50%; box-shadow:0px 12px 21px rgba(0, 0, 0, .02); }
.notice .service li i { display:inline-block; width:3.5em; height:3em; margin-bottom:.3125em; background:no-repeat center; background-size:contain; }
.notice .service li .icon1 { background-image:url(../images/main/icon_service1.png); }
.notice .service li .icon2 { background-image:url(../images/main/icon_service2.png); }
.notice .service li .icon3 { background-image:url(../images/main/icon_service3.png); }
.notice .service li .icon4 { background-image:url(../images/main/icon_service4.png); }
.notice .service li .icon5 { background-image:url(../images/main/icon_service5.png); }
.notice .service li .icon6 { background-image:url(../images/main/icon_service6.png); }
.notice .service li span { color:#39498c; letter-spacing:-.01em; text-align:center; }
@media screen and (max-width:1200px) { 
	.notice .conArea { width:50%; }
	.notice .conArea:nth-child(2n) { width:42%; }
}
@media screen and (max-width:1080px) { 
	.notice .service li a { width:7.5em; height:7.5em; }
}
@media screen and (max-width:960px) { 
	.notice { padding:4em 8.3333%; background:#fff; }
	.notice .conArea { width:100%; margin-top:3em; }
	.notice .conArea:nth-child(2n) { width:100%; }
	.notice .conArea:nth-child(1) { order:2; margin-top:1.6666em; }
	.notice .conArea:nth-child(2) { order:1; }
	.notice .conArea:nth-child(3) { order:3; }
	.notice .conArea:nth-child(4) { order:4; }
	.notice .conArea:nth-child(5) { order:5; }
	.notice .conArea .title { margin-bottom:.8333em; }
	.notice .conArea .title h3 { font-size:1.5em; }
	.notice .conArea .title .btnMore a { width:1.5em; height:1.5em; }
	.notice .conArea .title .btnMore a::before,
	.notice .conArea .title .btnMore a::after { width:1.4166em; }
	/* popup */
	.notice .conArea.popup { padding-bottom:0; }
	.notice .popupSwiper .swiper-slide a { height:auto; }
	.notice .popupControl { position:static; margin-top:1em; padding:0; background:none; border:none; box-shadow:none; transform:none; }
	.notice .popupControl button { display:none; }
	.notice .popupControl .pagination { display:none; }
	.notice .popupControl .dots { display:block; text-align:center; }
	.notice .popupControl .dots .swiper-pagination-bullet { margin:0 .25em; background:#cbd9dc; opacity:1; }
	.notice .popupControl .dots .swiper-pagination-bullet-active { background:#4495aa; opacity:1; border-radius:0; }
	/* board */
	.notice .board { padding-top:1.3333em; border-color:#bbd3c3; }
	.notice .board li { border:none; }
	.notice .board li a { padding:.5833em 0; }
	.notice .board li a::after { display:none; }
	.notice .board li i { font-size:.6666em; }
	.notice .board li i b { font-size:2.0833rem; }
	.notice .board li span { margin-left:4.3333rem; font-size:1.0833em; }
	/* card */
	.notice .gallery { margin-top:1.5em; padding-bottom:0; }
	.notice .gallery .item { width:48.3443%; }
	.notice .gallery .item .img { height:11em; }
	.notice .gallery .item .txt { padding:1em .8333em; }
	.notice .gallery .item .txt strong { font-size:.9166em; font-weight:700; }
	.notice .gallery .item .txt i { margin-top:.2em; font-size:.8333em; }
	.notice .gallery .galleryControl { right:2em; top:0; padding:.325em; background:none; border:none; box-shadow:none; transform:none; }
    .notice .gallery.wideLine .galleryControl { right:0; }
	.notice .gallery .galleryControl button { display:none; }
	.notice .gallery .galleryControl .pagination { display:none; }
	.notice .gallery .galleryControl .dots { display:block; text-align:right; }
	.notice .gallery .galleryControl .dots .swiper-pagination-bullet { margin:0 .25em; background:#cbd9dc; opacity:1; }
	.notice .gallery .galleryControl .dots .swiper-pagination-bullet-active { background:#4495aa; opacity:1; border-radius:0; }
	/* service */
    .notice .serviceLine { flex-direction:column; gap:0; }
    .notice .serviceLine .title { width:100%; }
	.notice .service li { flex:0 0 30%; justify-content:space-between; margin-top:1.5em; }
	.notice .service li a { width:7.666em; height:7.666em; margin:0 auto; background:#f4f7fc; border-color:#d9e3e5; }
	.notice .service li i { width:3.25em; height:2.5em; margin-bottom:.25em; }
	.notice .service li .icon1 { background-image:url(../images/main/icon_service1_mo.png); }
	.notice .service li .icon2 { background-image:url(../images/main/icon_service2_mo.png); }
	.notice .service li .icon3 { background-image:url(../images/main/icon_service3_mo.png); }
	.notice .service li .icon4 { background-image:url(../images/main/icon_service4_mo.png); }
	.notice .service li .icon5 { background-image:url(../images/main/icon_service5_mo.png); }
	.notice .service li .icon6 { background-image:url(../images/main/icon_service6_mo.png); }
	.notice .service li span { font-size:.9166em; font-weight:500; letter-spacing:-.05em; line-height:1.2; }
}

/* map */
.foodMap { position:relative; }
.foodMap #map { height:41.875em; }
.foodMap .overlay { position:relative; }
.foodMap .overlay .marker { width:.875em; height:.875em; background:#2662a2; border-radius:50%; }
.foodMap .overlay .infoArea { position:absolute; top:-3.5em; left:0; padding-left:3.375em; }
.foodMap .overlay .infoArea .box { position:relative; width:14.5em; padding:2.125em 1.75em; background:#fff; border:1px solid #cacdd5; border-radius:1.5em; box-shadow:0px 28px 29px rgba(0, 0, 0, .15); box-sizing:border-box; }
.foodMap .overlay .infoArea .box::before { content:''; position:absolute; top:3.125em; left:-2.5em; width:2.625em; height:1.5em; background:url(../images/main/icon_map_info.png) no-repeat; background-size:contain; }
.foodMap .overlay .infoArea .tit { font-size:1.25em; font-weight:700; letter-spacing:-.025em; }
.foodMap .overlay .infoArea .tit b { color:#ea4403; }
.foodMap .overlay .infoArea .list { margin-top:.875em; }
.foodMap .overlay .infoArea .list li { margin-top:.25em; }
.foodMap .overlay .infoArea .list li a { display:block; padding-right:1.5em; }
.foodMap .overlay .infoArea .list li span { display:block; letter-spacing:-.025em; line-height:1.375em; white-space:pre-wrap; }
.foodMap .overlay .infoArea .list li a span { overflow:hidden; position:relative; text-overflow:ellipsis; white-space:nowrap; }
.foodMap .overlay .infoArea .list li a span::after { content:''; position:absolute; bottom:0; left:0; width:0; height:1px; background:#8cc0f3; transition:.15s; }
.foodMap .overlay .infoArea .list li a:focus,
.foodMap .overlay .infoArea .list li a:hover { color:#005cc3; background:url(../images/main/icon_map_link.png) no-repeat right center; background-size:1.375em; }
.foodMap .overlay .infoArea .list li a:focus span::after,
.foodMap .overlay .infoArea .list li a:hover span::after { width:100%; }
.foodMap .overlay .infoArea .list li.pcNone { display:none; }
.foodMap .overlay .infoArea .list li.btnMore a { font-weight:400; color:#002ce8; }
.foodMap .overlay .infoArea .list li.btnMore a:focus,
.foodMap .overlay .infoArea .list li.btnMore a:hover { font-weight:700; background:none; }
.foodMap .overlay .infoArea .list li.btnMore a span { padding-top:1.6666em; }
.foodMap .overlay .infoArea .list li.btnMore a span::before { content:'…'; position:absolute; top:.3333em; left:0; color:#000; line-height:1; transform:rotate(90deg); }
.foodMap .overlay .infoArea .list li.btnMore a span::after { display:none; }
.foodMap .inner { position:absolute; top:3.5em; left:0; width:100%; height:0; padding:0 3%; box-sizing:border-box; z-index:2; }
.foodMap .option { position:relative; max-width:1220px; margin:0 auto; }
.foodMap .option .box { display:flex; position:absolute; top:0; left:0; width:31.25em; height:34.875em; }
.foodMap .option .title { flex-grow:1; padding:1.25em 1.875em 2.5em; background:#206cc2; border-radius:1.5em 0 0 1.5em; }
.foodMap .option .title h3 { height:15.625em; background:url(../images/main/option_title2.png) no-repeat; background-size:contain; text-indent:-9999px; }
.foodMap .option .title .category { margin-top:1.125em; padding:0 1.75em; }
.foodMap .option .title .category li { overflow:hidden; position:relative; margin-top:.625em; }
.foodMap .option .title .category li input { overflow:hidden; position:absolute; left:0; top:0; width:1px; height:1px; margin-left:-9999px; }
.foodMap .option .title .category li label { display:block; position:relative; padding-left:1.875rem; font-size:1.25em; font-weight:500; letter-spacing:-.025em; color:#badaff; cursor:pointer; }
.foodMap .option .title .category li input:focus ~ label { border:2px dashed; }
.foodMap .option .title .category li label::before { content:''; display:block; position:absolute; top:.125rem; left:0; width:1.375rem; height:1.375rem; border:2px solid #badaff; border-radius:50%; box-sizing:border-box; transition:all .15s; }
.foodMap .option .title .category li label::after { content:''; display:block; position:absolute; top:.4375rem; left:.375rem; width:.5625rem; height:.3125rem; border:2px solid #206cc2; border-top:0; border-right:0; transform:rotate(-45deg); transition:.15s; }
.foodMap .option .title .category li input:checked + label { color:#fff; }
.foodMap .option .title .category li input:checked + label::before { background:#fff; border-color:#fff; }
.foodMap .option .title .txt { margin-top:2.25rem; padding:0 1.75rem; font-size:.875em; font-weight:300; color:#badaff; letter-spacing:-.03em; line-height:1.4; word-break:keep-all; }
.foodMap .option .title .txt b { display:block; margin-bottom:.125rem; font-weight:500; color:#fff; }
.foodMap .option .list { overflow-y:auto; flex-shrink:0; width:32%; max-height:100%; background:#004b9f; border-radius:0 1.5em 1.5em 0; direction:rtl; }
.foodMap .option .list::-webkit-scrollbar { width:6px; height:6px; }
.foodMap .option .list::-webkit-scrollbar-thumb { background:#78b7ff; }
.foodMap .option .list::-webkit-scrollbar-track { background:transparent; } 
.foodMap .option .list::-webkit-scrollbar-corner { background:transparent; }
.foodMap .option .regionSel { direction:ltr; }
.foodMap .option .regionSel .viewCode { display:none; }
.foodMap .option .regionSel .selectList { padding:.875em 0; box-sizing:border-box; }
.foodMap .option .regionSel .selectList ul { padding:0 .25em; }
.foodMap .option .regionSel .selectList li { overflow:hidden; position:relative; }
.foodMap .option .regionSel .selectList input { overflow:hidden; position:absolute; width:1px; height:100%; margin-left:-10em; }
.foodMap .option .regionSel .selectList button,
.foodMap .option .regionSel .selectList label { display:flex; justify-content:space-between; width:100%; padding:.5em 1.625em .5em 1.25em; border-radius:.375em; transition:.15s; }
.foodMap .option .regionSel .selectList label { box-sizing:border-box; cursor:pointer }
.foodMap .option .regionSel .selectList button span,
.foodMap .option .regionSel .selectList label span { letter-spacing:-.025em; color:#fff; }
.foodMap .option .regionSel .selectList button i,
.foodMap .option .regionSel .selectList label i { font-style:normal; color:#87aad2; }
.foodMap .option .regionSel .selectList .active button,
.foodMap .option .regionSel .selectList input:checked ~ label { background:#fff; }
.foodMap .option .regionSel .selectList input:focus ~ label { border:2px dashed #f00; }
.foodMap .option .regionSel .selectList .active button span,
.foodMap .option .regionSel .selectList input:checked ~ label span { font-weight:700; color:#12539c; }
.foodMap .option .regionSel .selectList .active button i,
.foodMap .option .regionSel .selectList input:checked ~ label i { color:#12539c; }
@media screen and (max-width:960px) { 
	.foodMap #map { height:25.3333em; }
	.foodMap .overlay .marker { width:.5em; height:.5em; }
	.foodMap .overlay .infoArea { top:-2.3333em; padding-left:2em; }
	.foodMap .overlay .infoArea .box { width:9.75em; padding:1.3333em; border-radius:1em; box-shadow:0px 14px 15px rgba(0, 0, 0, .15); }
	.foodMap .overlay .infoArea .box::before { top:2em; left:-1.25em; width:1.3333em; height:.8333em; background-image:url(../images/main/icon_map_info_mo.png); }
	.foodMap .overlay .infoArea .tit { font-size:1em; }
	.foodMap .overlay .infoArea .list { margin-top:1em; }
	.foodMap .overlay .infoArea .list li a { padding-right:0; }
	.foodMap .overlay .infoArea .list li a:focus,
	.foodMap .overlay .infoArea .list li a:hover { font-weight:700; background:none; }
	.foodMap .overlay .infoArea .list li.moNone { display:none; }
	.foodMap .inner { top:0; padding:0; }
	.foodMap .option .box { flex-direction:column; width:15em; height:25.3333em; }
	.foodMap .option .title { padding:2em 1.4285em 1.4285em; border-radius:0; }
	.foodMap .option .title h3 { height:10.5em; background-image:url(../images/main/option_title2_mo.png); }
	.foodMap .option .title .category { margin-top:1.5em; padding:0; }
	.foodMap .option .title .category li { margin-top:.5em; }
	.foodMap .option .title .category li label { padding-left:2rem; font-size:1.1666em; }
	.foodMap .option .title .category li label::before { top:.0833rem; width:1.3333rem; height:1.3333rem; border-width:1px; }
	.foodMap .option .title .category li label::after { top:.4166rem; left:.3333rem; width:.5833rem; height:.3333rem; border-width:1px; }
	.foodMap .option .title .txt { display:none; }
	.foodMap .option .list { overflow:hidden; width:100%; height:4.3333em; max-height:none; border-radius:0; }
	.foodMap .option .regionSel .viewCode { display:block; }
	.foodMap .option .regionSel .viewCode button { display:block; position:relative; width:100%; padding:1.25rem 3.3333rem 1.25rem 2.5rem; font-size:1.25em; color:#fff; text-align:left; }
	.foodMap .option .regionSel .viewCode button::after { content:''; position:absolute; right:1.5rem; top:50%; width:.5rem; height:.5rem; margin-top:-.4166rem; border-bottom:1px solid #fff; border-right:1px solid #fff; transform:rotate(45deg); transition:.15s; }
	.foodMap .option .regionSel .viewCode button.on::after { margin-top:0; transform:rotate(-135deg); }
	.foodMap .option .regionSel .viewCode button span { margin-right:1rem; }
	.foodMap .option .regionSel .viewCode button i { font-style:normal; }
	.foodMap .option .regionSel .viewCode button i::after { content:'곳'; }
	.foodMap .option .regionSel .selectList { display:none; overflow-y:auto; position:absolute; top:100%; left:0; width:100%; padding:1em 0; max-height:17em; background:#004b9f; z-index:1; }
	.foodMap .option .regionSel .selectList ul { padding:0 1.25em; }
}

/* statistics */
.statistics { padding:4.375em 3%; background:url(../images/main/bg_statistics.jpg) no-repeat center; background-size:cover; }
.statistics .inner { max-width:1220px; margin:0 auto; padding:0 2.8125em; box-sizing:border-box; }
.statistics h3 { font-size:2.625em; color:#fff; text-align:center; }
.statistics .tabArea { margin:1.75em 0 2.625em; }
.statistics .tabBtn { display:flex; justify-content:center; }
.statistics .tabBtn li { margin:0 1.5625em; }
.statistics .tabBtn li span { display:block; padding:.125rem 0; font-size:1.25em; color:#fff; letter-spacing:-.01em; border-bottom:1px solid transparent; transition:border .15s; }
.statistics .tabBtn li .active span { font-weight:500; border-color:#fff; }
.statistics .yearTxt { margin:-2em 1em 1em 1em; text-align:right; color:#fff; font-size:1.25em; font-weight:bold; }
.statistics .stateSwiper .swiper-wrapper { justify-content:space-between; }
.statistics .stateSwiper .swiper-slide { width:19.292%; min-height:16.5625em; padding:1.875em 0; background:linear-gradient(0deg, rgba(88,190,176,1) 0%, rgba(174,227,218,1) 100%); border:1px solid rgba(255, 255, 255, .75); border-radius:1.375em; box-sizing:border-box; }
.statistics .stateSwiper.score .swiper-slide { padding-bottom:1.375em; }
.statistics .stateSwiper .swiper-slide .name { margin-top:1em; font-size:1.125em; letter-spacing:-.04em; color:#2e2e2e; text-align:center; word-break:keep-all; }
.statistics .stateSwiper .swiper-slide .percent,
.statistics .stateSwiper .swiper-slide .score { margin-top:.1875rem; font-size:1.625em; font-weight:700; color:#123326; letter-spacing:-.025em; text-align:center; }
.statistics .stateSwiper .swiper-slide .txt { letter-spacing:-.04em; color:#2e2e2e; text-align:center; }
.statistics .stateSwiper .stateControl { display:none; }
.statistics .circleChart { position:relative; width:7em; height:7em; margin:0 auto; }
.statistics .circleChart .chartBox { width:100%; height:100%; padding:.3125em; background:#fff; border-radius:50%; box-sizing:border-box; }
.statistics .circleChart .chartBase { position:absolute; left:0; top:0; right:0; bottom:0; border:.625em solid; border-radius:50%; box-sizing:border-box; }
.statistics .circleChart .chartBox svg { overflow:visible; position:relative; width:100%; height:100%; transform:rotateY(180deg) rotate(-90deg); }
.statistics .circleChart .progress { fill:transparent; stroke-width:.625em; }
.statistics .circleChart.active .progress { transition:.5s; }
.statistics .circleChart.col1 .chartBase { border-color:#d9f8fc; }
.statistics .circleChart.col2 .chartBase { border-color:#deedff; }
.statistics .circleChart.col3 .chartBase { border-color:#e9fad2; }
.statistics .circleChart.col4 .chartBase { border-color:#f9f7c9; }
.statistics .circleChart.col5 .chartBase { border-color:#fceae0; }
.statistics .icon { position:absolute; top:50%; left:50%; width:3.5em; height:3.5em; background:no-repeat center; background-size:contain; transform:translate(-50%, -50%); }
.statistics .icon1 { background-image:url(../images/main/icon_state1.png); }/* 전곡류 */
.statistics .icon2 { background-image:url(../images/main/icon_state2.png); }/* 과일 */
.statistics .icon3 { background-image:url(../images/main/icon_state3.png); }/* 생채소류 */
.statistics .icon4 { background-image:url(../images/main/icon_state4.png); }/* 채소반찬류 */
.statistics .icon5 { background-image:url(../images/main/icon_state5_202504.png); }/* 가당음료 */
.statistics .icon6 { background-image:url(../images/main/icon_state6.png); }/* 양적.질적충분 */
.statistics .icon7 { background-image:url(../images/main/icon_state7.png); }/* 양적충분, 질적 부족 */
.statistics .icon8 { background-image:url(../images/main/icon_state8.png); }/* 양적.질적부족 */
.statistics .icon9 { background-image:url(../images/main/icon_state9.png); }/* 1인가구 식품보장 */
.statistics .icon10 { background-image:url(../images/main/icon_state10.png); }/* 저소득층 식품보장 */
.statistics .icon11 { background-image:url(../images/main/icon_state11_202504.png); }/* 먹거리식생활만족도 */
.statistics .icon12 { background-image:url(../images/main/icon_state12_202504.png); }/* 먹거리식생활중요도 */
.statistics .icon13 { background-image:url(../images/main/icon_state13_202504.png); }/* 식품안전 인식도 */
.statistics .icon14 { background-image:url(../images/main/icon_state14_202504.png); }/* 식생활역량 */
.statistics .icon15 { background-image:url(../images/main/icon_state15_202504.png); }/* 식품위생실천 */
.statistics .icon16 { background-image:url(../images/main/icon_state16.png); }/* 충분성 */
.statistics .icon17 { background-image:url(../images/main/icon_state17.png); }/* 접근성 */
.statistics .icon18 { background-image:url(../images/main/icon_state18.png); }/* 이용 편의성 */
.statistics .icon19 { background-image:url(../images/main/icon_state19.png); }/* 가격 적절성 */
.statistics .icon20 { background-image:url(../images/main/icon_state20.png); }/* 신선도와 질 */
@media screen and (max-width:960px) { 
	.statistics { padding:3.3333em 8.3333% 4.1666em; background:none; }
	.statistics .inner { padding:0; }
	.statistics h3 { font-size:1.5em; font-weight:900; color:#000; text-align:left; }
	.statistics h3 span { color:#027e45; }
	.statistics .tabArea { overflow-x:auto; overflow-y:hidden; white-space:nowrap; margin:2em 0; }
	.statistics .tabBtn { display:block; }
	.statistics .tabBtn li { display:inline-block; margin:0 0 0 .6666em; }
	.statistics .tabBtn li:first-child { margin-left:0; }
	.statistics .tabBtn li span { padding:.25rem 0; color:#000; }
	.statistics .tabBtn li .active span { border-color:#000; }
    .statistics .yearTxt { margin-top:-1em; color:#000; }
	.statistics .stateSwiper { padding:0 1px; }
	.statistics .stateSwiper .swiper-slide { min-height:auto; padding:1.1666em 0; background:#a5dbd2; border-color:#7cb5ac; border-radius:.8333em; }
	.statistics .stateSwiper.score .swiper-slide { padding-bottom:1.1666em; }
	.statistics .stateSwiper .swiper-slide .name { margin-top:.6666rem; padding:0 .4166rem; font-size:.9166em; letter-spacing:-.06em; }
	.statistics .stateSwiper .swiper-slide .percent,
	.statistics .stateSwiper .swiper-slide .score { margin-top:0; font-size:1.3333em; }
	.statistics .stateSwiper .swiper-slide .txt { font-size:.8333em; }
	.statistics .stateSwiper .stateControl { display:block; margin-top:1em; }
	.statistics .stateSwiper .stateControl .dots { text-align:center; }
	.statistics .stateSwiper .stateControl .dots .swiper-pagination-bullet { margin:0 .25em; background:#cbd9dc; opacity:1; }
	.statistics .stateSwiper .stateControl .dots .swiper-pagination-bullet-active { background:#4495aa; opacity:1; }
	.statistics .circleChart { width:4.6666em; height:4.6666em; }
	.statistics .circleChart .chartBox { padding:.25em; }
	.statistics .circleChart .chartBase { border-width:.5em; }
	.statistics .circleChart .progress { stroke-width:.5em; }
	.statistics .icon { width:2.3333em; height:2.3333em; }
}
@media screen and (max-width:540px) { 
	.statistics .stateSwiper .swiper-slide { min-height:12em; }
	.statistics .stateSwiper.score .swiper-slide .name { padding:0; }
}

/* banner */
.banner { padding:3.375em 3% 2.875em; }
.banner .inner { max-width:1220px; margin:0 auto; }
.banner .bannerArea { position:relative; margin-bottom:2.875em; padding:0 6.25em; }
.banner .bannerSwiper .swiper-slide { height:auto; }
.banner .bannerSwiper .swiper-slide a { display:flex; justify-content:center; align-items:center; text-align:center; height:100%; }
.banner .bannerSwiper .swiper-slide a:focus img { border:2px dashed; box-sizing:border-box; }
.banner .bannerControl { position:absolute; top:0; left:0; width:100%; }
.banner .bannerControl button { position:absolute; top:0; left:3.125em; width:2.125em; height:2.25em; background:url(../images/main/btn_banner_prev.svg) no-repeat center; background-size:contain; text-indent:-9999px; }
.banner .bannerControl .next { left:auto; right:3.125em; background-image:url(../images/main/btn_banner_next.svg); }
.banner .bannerControl .swiper-button-disabled { opacity:0; }
#seoul-common-banner a { overflow:hidden; display:block; width:100%; height:5.625em; }
#seoul-common-banner img { width:100%; height:100%; object-fit:cover; }
@media screen and (max-width:960px) { 
	.banner { display:none; }
}