@charset "utf-8";
@import url("fonts/fonts.css");

* {margin:0; padding:0;box-sizing: border-box;}
body {font:16px/1.5 "Pretendard", "Malgun Gothic", "dotum", "돋움", "gulim", "굴림", "sans-serif"; color:#333; letter-spacing:-0.05em;background: #e4f0fe;overflow-x: hidden;}

body, div, dl, dt, dd, th, td, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, p, blockquote, button, input, textarea {margin:0; padding:0;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display:block; margin:0; padding:0;}
hr, table caption {display:none;}
legend, .hd-element {position:absolute; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}
table {width:100%; border-collapse:collapse; border-spacing:0;}
img, fieldset, button, input {border:0; vertical-align:middle;}
ul, ol, li {list-style:none;}
em, address {font-style:normal;}
label, button {cursor:pointer;}
a{text-decoration:none; color:#333;}
button {vertical-align:top; background:transparent;}
button::-moz-focus-inner {padding:0; border:0;}
img {max-width:100%;}
html, body {-webkit-overflow-scrolling: touch !important;}
.hide {text-indent:-9999em;}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;}


#header, #footer {position:relative; z-index:100; min-width:1050px;}

#header {height: 50px;position: relative;background: #e36b00 url(../images/bg/bg_top_2026.jpg) no-repeat 50% 100%;}

#header::before,
#header::after{content: ""; position: absolute;inset: 0;z-index: -1}
#header::before{
  background: linear-gradient(
    90deg,
    #00a98f 0%,
    #1ec9aa 35%,
    #4fd3b9 50%,
    #1ec9aa 65%,
    #00a98f 100%
  );
  animation: fadeOut 1.2s ease-in forwards;
}
#header::after{
    background: linear-gradient(
        90deg,
        #e36a00 0%,
        #ff9a1f 35%,
        #ffc266 50%,
        #ff9a1f 65%,
        #e36a00 100%
    );
    opacity: 0;
    animation: fadeIn 2s ease-out forwards;
}

@keyframes fadeOut {
    from { opacity: 1; }
    to   { opacity: 0; }

}
@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}



/* #header.done {background: #00b493} */
#header .top-ani {height: 50px;}
#header .top-ani .event-animation1 {position: absolute;top: 0;left: 50%;transform: translateX(-50%);width: auto;max-width: 2000px;}

#header .holder {position:absolute; top: 0;left: 50%;margin:0 auto; width: 1050px;height: 50px;display: flex;align-items: center;justify-content: space-between;transform: translateX(-50%);}
#header .holder.done {opacity: 1;}
#header .holder ul {display: flex;align-items: center;gap: 10px;}
#header .holder ul.snssite {gap: 20px}

@keyframes gradient {
    0% {
        background-position: 100% 50%;
    }


    100% {
        background-position: 0% 50%;
    }
}
@keyframes bgChange {
    0% {
        background-color: rgba(248, 73, 108, 1)
    }
    100% {
        background-color: rgba(0, 180, 147, 1)
    }
}
@keyframes showup {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

#visual {
    min-width: 980px;
    height: 570px;
    background: url(../images/img/img_visual_2026.jpg) center top no-repeat;
    background-size: auto 100%;
}

#visual .holder {width: 100%;max-width: 710px;margin: 0 auto;display: flex;justify-content: center;flex-direction: column;align-items: center;}
#visual .holder .visual-ani {padding: 30px 0 10px}
.visual-title {margin: 35px 0 10px;transition: .3s opacity ease-in-out}
.visual-title h3 {margin-top: 15px}
.visual-txt {display: flex;justify-content: center;align-items: center;gap: 0px;width: 100%;}
.visual-txt dt, 
.visual-txt dd {color: #e3f0ff;font-weight: 300;font-size: 18px;padding: 10px;}
.visual-txt dt {display: flex;justify-content: flex-end;width: 190px;flex-shrink: 0;font-size: 18px;border-right: 1px dashed rgba(255,255,255, .2);font-weight: 600;}
.visual-txt dd {width: calc(100% - 190px)}
.visual-txt1 {border-top: 1px dashed #fff;border-bottom: 1px dashed rgba(255,255,255, .2)}
.visual-txt2 {border-bottom: 1px dashed #fff;}

#visual.show-up .visual-title {animation: showup .3s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation-delay: .2s}
#visual.show-up .visual-txt1 {animation: showup .3s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation-delay: .5s}
#visual.show-up .visual-txt2 {animation: showup .3s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation-delay: .8s}

.info {display: flex;justify-content: center;align-items: center;background: url(../images/bg/bg-memorial.png) no-repeat 0 0;width: 100%;max-width: 545px;height: 92px;}
.info p {color: #fff;font-size: 16px;font-weight: 300;text-align: center;}
.info p span {display: block;text-align: center;}

#menu {
    position: absolute;
    z-index: 9;
    right: 0;
    left: 0;
    min-width: 1050px;
    height: 108px;
    background: transparent;
}

#menu div {width: 100%;max-width: 1050px;height: 108px;margin: 0 auto;padding-top: 0}
#menu.fixed div {position: relative;background: transparent;margin-top: 0}
#menu.fixed div:before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 15px;background: #fff;z-index: -1;}
#menu div ul {display: flex;position: relative}
#menu li.menu1,
#menu li.menu2,
#menu li.menu3{
   width: 350px;
}

#menu li a {display: flex;align-items: center;justify-content: center;width: 100%;height: 108px;background: url(../images/img/img_menu_2026.png) no-repeat 0 0}
#menu li.menu1 a {background-position: 0 0}
#menu li.menu2 a {background-position: -350px 0}
#menu li.menu3 a {background-position: -700px 0}
#menu li.menu1 a.on {background-position: 0 -108px}
#menu li.menu2 a.on {background-position: -350px -108px}
#menu li.menu3 a.on {background-position: -700px -108px}


/* common content */
.txt-blue {color: #2a3971;}
.txt-pink {color: #db1b90;}
.list-mb20 li:not(:last-child) {margin-bottom: 20px;}
.p-type-dash, .list-type-dash li {position: relative;margin-bottom: 3px;padding-left: 10px;}
.p-type-dash:before, .list-type-dash li:before {content: '-';position: absolute;top: 0px;left: 0;}
.p-type-dot, .list-type-dot li {position: relative;padding-left: 10px;}
.p-type-dot:before, .list-type-dot li:before {content: '·';position: absolute;top: 0px;left: 0;}
.btnset {display: flex;gap: 15px;margin-top: 20px;}
.btnset .button {display: flex;align-items: center;height: 50px;padding: 10px 20px;font-size: 20px;background: #36457c;color: #fff;border-radius: 10px;}
.btnset .button1 {gap: 5px;background: #f46038;padding: 15px 40px;}
.btnset .button3 {background: #223a92;}
.btnset .button4 {background: #f46038;}

.step-wrap {display: flex;align-items: flex-start;justify-content: space-between;gap: 50px;margin: 20px 0;}
.step-wrap .text {flex-shrink: 0;}
.step-wrap .img {max-width: 546px;}
.step-wrap-bus {gap: 10px}
.step-wrap-bus .img {max-width: 700px}
.step-wrap-bus .text {width: 260px}

#container {width: 100%;max-width: 1050px;margin: 0 auto;padding: 100px 60px 60px;z-index: 1;background: #fff url(../images/bg/bg_content_2026.jpg) no-repeat 50% 100%;border-bottom-left-radius: 50px;border-bottom-right-radius: 50px;}
.content_2025 {font-size: 18px;font-weight: 400}
.content_2025 h3 {display: flex;align-items: center;margin: 35px 0 20px;color: #f46038;font-size: 32px;font-weight: 700;}
.content_2025 .area1 h3 {margin-top: 50px;}
.content_2025 h3:before {content: '';width: 32px;height: 30px;margin-right: 10px;background: url(../images/ico/ico-bell-2026.png) no-repeat 0 0;}
.content_2025 h4 {display: flex;align-items: center;margin: 20px 0 10px;color: #2984ff;font-weight: 700;font-size: 22px;}
.content_2025 h4:before {content: '';width: 3px;height: 3px;margin-right: 5px;background: #2984ff;border-radius: 50%;flex-shrink: 0;}
.content_2025 h4.no-dot:before {display: none}
.content_2025 .txt1 {display: flex;gap: 5px;margin: 0 0 3px 10px;}
.content_2025 .txt1.column {flex-direction: column;}
.content_2025 .txt1 dt {font-weight: 700;min-width: 60px;flex-shrink: 0;}
.content_2025 .txt1 dt.light {font-weight: 400}
.content_2025 .txt1.font2 dt {min-width: 30px;}
.content_2025 .txt1 dd {font-weight: 400}
.content_2025 .img {text-align: center;}
.content_2025 .area>ul,
.content_2025 .area>p {margin-left: 10px}

.content_2025_info {padding: 80px 0 240px}
.content_2025_info .info-title {font-size: 32px;font-weight: 700;}
.content_2025_info .info-title strong {font-size: 36px;color: #f46038}
.content_2025_info .info-text {font-size: 24px;font-weight: 500}



/* 안전대책 */
table {margin: 10px 0;width: 100%}
table thead tr th {padding: 10px 5px;background: #e4e4e4;border-top: 2px solid #d5d5d5;border-bottom: 3px solid #d5d5d5;border-left: 1px solid #eeeeee;color: #494949;font-weight: 700;text-align: center;}
table thead tr th:first-child {border-left: 0}
table tbody tr td {padding: 10px 5px;color: #494949;text-align: center;border-bottom: 1px solid #eeeeee;border-left: 1px solid #eeeeee}
table tbody tr td:first-child {border-left: 0;}
.table-txt {margin: 5px 0;padding-left: 10px;text-indent: -10px;}

table.small th,
table.small td {padding: 1px 5px;font-size: 13px;}

.content_2025 .area3 {margin: 45px -60px;min-height: 750px;padding: 60px 60px 430px;background: url(../images/bg/bg_traffic_2026.jpg) no-repeat 50% calc(100% + 2px);}
.content_2025 .area3>p {margin-left: 0px}

/* 타종인사 */
ol.list li {display: flex;gap: 10px;justify-content: flex-start;}
ol.list li .num {flex-shrink: 0;display: inline-flex;align-items: center;justify-content: center;width: 30px;height: 30px;background: #1c5a44;color: #fff;font-size: 600;border-radius: 50%;}
ol.list li .list-wrap strong {font-size: 20px;}
ol.list li .list-wrap p {margin: 5px 0 0;font-size: 19px;font-weight: 700;}
ol.list li .list-wrap ul {margin: 5px 0 20px;}
ol.list li .list-wrap ul li {font-size: 18px;color: #666;font-weight: 400;}

ol.list li .num.color1 {background: #1c5a44}
ol.list li .num.color2 {background: #cf1e71}
ol.list li .num.color3 {background: #e7880c}
ol.list li .num.color4 {background: #b534d1}
ol.list li .num.color5 {background: #74a80f}
ol.list li .num.color6 {background: #1693c1}
ol.list li .num.color7 {background: #bd5847}

ol.list li .list-wrap strong.color1 {color: #1c5a44}
ol.list li .list-wrap strong.color2 {color: #cf1e71}
ol.list li .list-wrap strong.color3 {color: #e7880c}
ol.list li .list-wrap strong.color4 {color: #b534d1}
ol.list li .list-wrap strong.color5 {color: #74a80f}
ol.list li .list-wrap strong.color6 {color: #1693c1}
ol.list li .list-wrap strong.color7 {color: #bd5847}

#footer .copyright {width: 100%;max-width: 1050px;margin: 20px auto;text-align: center;letter-spacing: -0.01em}

.gotop {display: none;position: fixed;bottom: 80px;left: 50%;margin-left: 560px;width: 56px;z-index: 100}

/* 한파쉼터 */
.content_2025 h3+div {border: 3px solid #bcc3fa;border-radius:20px;padding: 0 30px 30px;}
.list-flex {display: flex;flex-wrap: wrap;justify-content: flex-start;gap: 5px 25px;font-weight: bold;max-width: 750px;}
.list-flex .txt-normal{font-weight:normal}

/*

.content_2025 .area h3 {
	position: static;
	margin-left: 0;
	font-size: 32px;
}
#content_block1 {
    padding: 0;
}
#content_block1 .area h3,
#content_block4 .area h3 {
    position: initial;
    top: 0;
    left: 0;
    margin-left: 0;
}
#content_block1 .area1 h4.color3,
#content_block1 .area1 h4.color2,
#content_block4 .area1 h4.color3,
#content_block4 .area1 h4.color2{
    color: #14375d;
    border-bottom: 0;
    padding-top: 20px;
    font-size: 25px;
    margin-bottom: 5px;
}
#content_block1 .area1 h4.color3 img,
#content_block1 .area1 h4.color2 img,
#content_block1 .area2 .color2 img {
    margin-top: -7px;
    margin-right: 5px;
}
#content_block1 .area1 dl dt{font-weight: normal;}
#content_block1 .area1 dl.txt1 dd strong{color:#891313}
#content_block1 .area1 p.img {
    margin: 35px 0 15px;
}
#content_block1 .area1 dl.font-small {
    margin-left: 100px;
    margin-top: 11px;
}
#content_block1 .area1 dl.txt1 dt,
#content_block1 .area1 dl.txt2 dt,
#content_block1 .area1 dl.txt1 dd {
    line-height: 1.8;
}
#content_block1 .area1 dl.txt1.lineheight dt,
#content_block1 .area1 dl.txt2 dt,
#content_block1 .area1 dl.txt1.lineheight dd {
    line-height: 1.5;
}

#content_block1 .area2 {
    margin: 20px 43px 0 45px;
}
#content_block1 .area2 .color2,
#content_block4 .area2 .color2 {
    color: #14375d;
    border-bottom: 0;
    display: inline-block;
    padding: 20px 10px 5px 0px;
    font-size: 26px;
    line-height: 1.3;
    letter-spacing: -0.075em;
}
#content_block4 .area2 .color2_2 {
    letter-spacing: -0.15em;
}
#content_block1 .area2 p,
#content_block4 .area2 p {
    font-size: 22px;
    color: #3a3a3a;
    line-height: 1.8;
    margin-top: 5px;
}
#content_block1 .area2 p strong,
#content_block4 .area2 p strong{
    color: #891313;
}
#content_block1 .area2 p.sub-txt,
#content_block4 .area2 p.sub-txt {
    padding-left: 100px;
    margin-top: -4px;
}
#content_block4 .area2 p.sub-txt2 {
    position: relative;
    padding-left: 121px;
}
#content_block4 .area2 p.sub-txt2 span {
    position: absolute;
    transform: translate(-25px, -2px);
}
#content_block2 h4.color2 {
    color: #14375d;
    border-bottom: 0;
    display: inline-block;
    padding: 20px 10px 5px 0px;
    font-size: 26px;
    line-height: 1.3;
    letter-spacing: -0.075em;
}
#content_block2 h4.color2 img {
    margin-top: -7px;
    margin-right: 5px;
}
#content_block2 ul {
    padding-top: 20px;
    margin-left: 20px;
}
#content_block2 ul li {
    position: relative;
    padding: 0 0 20px 41px;
}
#content_block2 ul li:last-child{
    padding-bottom: 5px;
}
#content_block2 ul strong{
    font-size: 18px;
    display: block;
    margin-bottom: -3px;
    color: #891313;
}
#content_block2 ul li:nth-child(2n) strong{
    color: #14375d;
}
#content_block2 ul span.num {
    background: #891313;
    width: 30px;
    height: 30px;
    color: #fff;
    text-align: center;
    border-radius: 50px;
    left: 2px;
    position: absolute;
    top: -1px;
}
#content_block2 ul li:nth-child(2n) span.num{
    background: #14375d;
}
#content_block2 ul span.txt {
    display: inline-block;
    line-height: 1.5;
}

#content_block4 {
    padding: 0 0 62px 0;
}
#content_block4 .area3 {
    margin: 0;
    padding: 57px 0 0 30px;
    height: 510px;
    background: url(../images/bg/bg_block1_area3_2023_2.jpg) right bottom no-repeat;
}
#content_block4 .area3 p{
    font-weight: normal;
}
#content_block4 .area3 p.tit {
    font-size: 25px;
    letter-spacing: -1.8px;
    color: #333;
    margin-top: 40px;
    font-weight: bold;
}
#content_block4 .area3 p.tit strong {
    color: #14375d;
}
#content_block4 .area3 p.txt1 {
    color: #626262;
    font-size: 22px;
    margin-top: 15px;
    letter-spacing: -1.5px;
}
#content_block4 .area3 p.txt2 {
    font-size: 22px;
    color: #626262;
    margin-top: 9px;
    letter-spacing: -1.5px;
}
#content_block4 .area3 a.button.button1 {
    margin-top: 25px;
    background: #891313;
    font-size: 17px;
    font-weight: normal;
}
#content_block4 .area3 a.button.button1 img {
    position: relative;
    top: -3px;
    left: 8px;
}
#content_block4 .area2 {
    margin: 20px 43px 0 45px;
}
.table-box {
    margin-top: 20px;
}
#content_block4 .area2 p.table-txt {
    color: #7c7c7c;
    font-size: 18px;
    line-height: 2.5;
    margin-top: 0;
}
#content_block4 .area2 .color2 img{
    margin-top: -7px;
    margin-right: 5px;
}
#content_block4 table th {
    background: #f5f5f5;
    border: 1px solid #eeeeee;
    border-top: 2px solid #b2b2b2;
}
#content_block4 table td {
    border: 1px solid #eeeeee;
    text-align: center;
}
#content_block4 table th,
#content_block4 table td{
    padding: 5px 0;
}


#content_block2 {
    padding: 0;
}
#content_block2 .area {
    padding: 40px 0 51px 0;
}
#content_block2 .area h3 {
    position: inherit;
    margin-left: 0;
    left: 0;
    top: -30px;
}
#content_block2 ol{
    margin: 18px 17px 0 26px;
    font-size: 16px;
}
#content_block2 ol li{
    padding: 0 0 18px 41px;
}
#content_block2 ol span.num {
    background: #1c5a44;
    width: 30px;
    height: 30px;
    color: #fff;
    text-align: center;
    border-radius: 50px;
    left: 2px;
}
#content_block2 ol .sub-txt{
    display: block;
    color: #7c7c7c;
    letter-spacing: -0.1em;
}
#content_block2 ol span.num2 {
    background: #fa5d5d;
}
#content_block2 ol span.num3 {
    background: #6ec7d4;
}
#content_block2 ol span.num4 {
    background: #ff9447;
}
#content_block2 ol span.num5 {
    background: #998677;
}
#content_block2 ol span.num6 {
    background: #459276;
}
#content_block2 ol span.num7 {
    background: #fb7474;
}
#content_block2 ol span.num8 {
    background: #52bccc;
}
#content_block2 ol span.num9 {
    background: #ffa564;
}
#content_block2 ol span.num10 {
    background: #9b897a;
}
#content_block2 ol span.num11 {
    background: #469277;
}
#content_block2 ol strong.color1 {
    color: #1c5a44;
}
#content_block2 ol strong.color2 {
    color: #ce2c2c;
}
#content_block2 ol strong.color3 {
    color: #0a7484;
}
#content_block2 ol strong.color4 {
    color: #dc461f;
}
#content_block2 ol strong.color5 {
    color: #47250b;
}
#content_block2 ol strong.color6 {
    color: #1c5a44;
}
#content_block2 ol strong.color7 {
    color: #ce2c2c;
}
#content_block2 ol strong.color8 {
    color: #0a7484;
}
#content_block2 ol strong.color9 {
    color: #dc461f;
}
#content_block2 ol strong.color10 {
    color: #47250b;
}


#content_block3{
    padding: 0 26px;
}
#content_block3 .area2 {
    padding: 20px 0 0 26px;
    height: 430px;
    background: url(../images/bg/bg_block3_area2_2023.jpg) center center no-repeat;
}
#content_block3 h3 {
    margin-top: 40px;
}
#container .button.button3{
    background: #6d5441;
    font-weight: normal;
}
#container .button.button4 {
    background: #891313;
    width: 270px;
    font-weight: normal;
}
#content_block3 p {
    color: #626262;
    font-size: 24px;
    font-weight: normal;
}
#content_block3 p strong {
    font-size: 28px;
}
#content_block3 h3 span {
    display: initial;
    font-size: 34px;
    color: #891313;
}
#content_block3 .area2 p.btnset {
    margin-top: 33px;
}


.gotop {
    position: fixed;
    z-index: 1111;
    bottom: 90px;
    right: 11%;
    left: 50%;
    margin-left: 500px;
    width: 45px;
    display: none;
}
#footer {
    background: transparent;
    padding: 0;
    z-index: 0;
}
#footer .copyright {
    background: #fff;
    margin: 0 auto;
    padding-top: 50px;
    width: 1050px;
    height: 80px;
    color: #333;
}

*/

.btn-banner a {display:flex;align-items:center;width:460px;height:90px;margin:15px 0; padding-left:21px;font-size:26px;font-weight:bold;line-height:1;border-radius:10px;}
.btn-banner span {display:inline-flex;gap:5px;align-items: center;}
.btn-banner span:after {width:24px;height:24px;margin-left:4px;content:'';background:url(../images/img/ico-banner01.png) no-repeat 100% 100%;}
.btn-banner .banner02 span:after {width:24px;height:24px;margin-left:4px;content:'';background:url(../images/img/ico-banner02.png) no-repeat 100% 100%;}
.btn-banner .banner01 {color:#01549f;background:#cfe2fc url(../images/img/bg-banner01.png) no-repeat 100% 100%;}
.btn-banner .banner01 em {color:#0168f3;}
.btn-banner .banner02 {color:#006558;background:#dceeec url(../images/img/bg-banner02.png) no-repeat 100% center;}
.btn-banner .banner02 em {color:#009e81;}
.img-left {margin-top:20px;margin-left:10px}