@import url(../font/fonts.css);
/* CSS Document */
* {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} 
body {min-width:280px;font:12px/1.5 'SCoreDream', '맑은고딕', 'Malgun Gothic', 'dotum', '돋움', 'gulim', '굴림', 'sans-serif';letter-spacing:-.05em;color:#222;} 
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, main {display:block;margin:0;padding:0;} 
hr, table caption {display:none;} 
legend, .hd-element {position:absolute;visibility:hidden;overflow:hidden;width:0;height:0;font-size:0;line-height:0;} 
table {width:100%;table-layout:fixed;border-spacing:0;border-collapse:collapse;} 
img, fieldset, button, input {max-width:100%;vertical-align:middle;border:0;} 
ul, ol, li {list-style:none;} 
em, address {font-style:normal;} 
label, button {cursor:pointer;} 
a {text-decoration:none;color:inherit;} 
button {vertical-align:top;background:transparent;} 
button::-moz-focus-inner {padding:0;border:0;} 
h1, h2, h3, h4, h5, h6 {font-size:1em;font-weight:normal;} 
input, select, button {font:12px/1.5 'SCoreDream', '맑은고딕', 'Malgun Gothic', 'dotum', '돋움', 'gulim', '굴림', 'sans-serif';color:#222;} 
/*스크린 리더 only*/
.sr-only {position:absolute;overflow:hidden;clip:rect(0, 0, 0, 0);width:1px;height:1px;margin:-1px;padding:0;border:0;} 
/* 바로가기 */
#accessibility {position:absolute;z-index:99999;top:0;left:5%;width:90%;} 
#accessibility a {position:absolute;top:0;left:0;display:block;overflow:hidden;width:100%;height:0;color:#000;background:#fff;} 
#accessibility a:focus, #accessibility a:active {height:50px;} 
#accessibility a span {display:block;height:50px;line-height:50px;text-align:center;border:1px solid #000;} 
.btn-top {position:fixed;z-index:10;bottom:-60px;left:50%;display:block;width:76px;height:75px;margin-left:533px;font-size:0;transition:1s;opacity:0;background:url(../images/2026/btn-top.png) center no-repeat;background-size:contain;} 
.btn-top.show {bottom:60px;opacity:1;} 
/*************** header *****************/
header#header {position:relative;z-index:2;box-sizing:border-box;width:100%;height:64px;background-color:#8a5e69;} 
header#header .top-area {display:flex;align-content:center;align-items:center;justify-content:space-between;width:1000px;height:100%;margin:0 auto;} 
header#header .logo {float:left;width:181px;} 
header#header .logo a {display:inline-block;} 
header#header .logo a:first-child {display:block;float:left;margin:0 5px 0 3px;} 
header#header .top-area > ul {display:inline-flex;height:100%;gap:5px;}
header#header .top-area > ul li {width:280px;font-size:20px;color:#fff;background:#7b4d58;box-shadow:inset 0 -5px #673944;}
header#header .top-area > ul li a {display:flex;align-items:center;justify-content:center;width:100%;height:100%;}
header#header .top-area > ul li.on {background:#e83662;box-shadow:inset 0 5px #c91542 ;}

/* 공통 공유하기 2026-01 */
header#header .story-share-wrap {float:right;margin-right:20px;} 
header#header .story-share-wrap .btn-ssw-share {font-family:'Nanum Gothic';} 
/* 공통 공유하기 2026-01 */
#wrap {min-width:1024px;}
#menu {min-width:1024px;background-color:#fef1f3 ;box-shadow:inset 0 -3px #f28492;} 
#menu ul {display:flex;padding-top:10px;} 
#menu.fixed {position:fixed;z-index:1;top:0;} 
#menu {width:100%;} 
#menu * {box-sizing:border-box;} 
#menu .tab {display:grid;text-align:center;grid-template-columns:1fr 1fr;} 
#menu li {flex:1 1;font-size:32px;} 
#menu li a {display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:100%;padding:22px 0;font-size:26px;font-weight:500;line-height:26px;color:#a14e64;border:1px solid #c28c9a;border-bottom:3px solid #f28492;border-radius:30px 30px 0 0;background:#e9bbc7;} 
#menu li span {display:flex;align-items:center;}
#menu li span:before {margin-right:14px;content:'';} 
#menu li:nth-child(1) span:before {width:43px;height:40px;background-image:url(../images/2026/ico-menu1-off.png);} 
#menu li:nth-child(2) span:before {width:30px;height:38px;background-image:url(../images/2026/ico-menu2-off.png);} 
#menu li:nth-child(1).on span:before {width:43px;height:40px;background-image:url(../images/2026/ico-menu1-on.png);} 
#menu li:nth-child(2).on span:before {width:30px;height:38px;background-image:url(../images/2026/ico-menu2-on.png);} 
#menu li.on {position:relative;z-index:1;} 
#menu li.on:after {position:absolute;top:100%;left:calc(50% - 12px);display:block;width:0;height:0;content:'';border-right-color:transparent !important;border-bottom-color:transparent !important;border-left-color:transparent !important;background:none;} 
#menu li.on a {font-size:26px;font-weight:600;color:#ff007e;border:3px solid #f28492;border-bottom-color:#fff ;background:#fff;} 
#menu li.on a span {position:relative;z-index:0;} 
.travel-tab ul {display:grid;gap:23px;grid-template-columns:repeat(3, 1fr);} 
.travel-tab a {display:flex;align-items:center;justify-content:center;height:70px;} 
/*************** footer *****************/
.footer {border-top:1px solid #cecece;} 
.footer .copyright {display:flex;align-items:center;justify-content:center;height:70px;font-size:14px;text-align:center;letter-spacing:normal;color:#666;} 
/*************** contents *****************/
#visual {position:relative;overflow:hidden;height:910px;background:linear-gradient(#cbe4ff, #fef1f2);} 
#visual .visualContent:before {position:absolute;z-index:-1;top:0;left:calc(50% - 1000px);width:100%;max-width:773px;content:'';background:url(../images/2026/bg-visual-bf.png) right top no-repeat;aspect-ratio:773 / 878;}
#visual .visualContent:after {position:absolute;z-index:-1;top:0;left:calc(50% + 176px);width:100%;max-width:824px;content:'';background:url(../images/2026/bg-visual-af.png) left top no-repeat;aspect-ratio:824 / 878;}
.visualContent {position:relative;z-index:0;width:100%;max-width:1000px;margin:0 auto;padding-top:63px;} 
.visualContent .title-wrap {display:flex;align-items:center;flex-direction:column;margin-bottom:23px;gap:28px;}
.visualContent .title-wrap p {display:flex;align-items:center;justify-content:center;width:100%;max-width:383px;font-size:30px;text-align:center;border:1px solid #222;border-radius:50vh;aspect-ratio:383 / 56;} 
.visualContent .text-wrap {display:flex;align-items:center;flex-direction:column;justify-content:flex-start;font-size:28px;line-height:1.28;text-align:center;} 
.visualContent .btn {display:flex;align-items:center;justify-content:center;margin-top:16px;padding:13px 17px;background:#ea2c00;} 
.visualContent .btn em {display:contents;color:#fffeb8;} 
.visualContent .btn span {display:inline-flex;align-items:center;font-size:24px;font-weight:bold;color:#fff;} 
.visualContent .btn span:before {width:47px;height:40px;margin-right:15px;line-height:inherit;content:'';color:inherit;background:url(../images/2026/ico-visual-btn-bf.png);} 
.visualContent .btn span:after {width:21px;height:18px;margin-left:18px;line-height:inherit;content:'';color:inherit;background:url(../images/2026/ico-visual-btn-af.png);} 
.visualContent .img-family {width:100%;max-width:424px;content:'';background:url(../images/2026/ico-family.png) no-repeat;aspect-ratio:424 / 325;}


.inner-wrap {width:100%;max-width:1000px;margin:0 auto;} 
.contents {box-sizing:border-box;min-height:100vh;padding:100px 0 120px;} 
.contents .cont-tit {display:flex;align-items:center;flex-direction:column;} 
.contents .cont-tit h3 {display:flex;align-items:center;flex-direction:column;margin-bottom:24px;gap:17px;} 
.contents .cont-tit h3:before {width:20px;height:8px;content:'';border-radius:50vh;background:#ff007e;} 
.contents .cont-tit p {font-size:26px;line-height:1.385;color:#333;text-align: center;}
.cont-timeline .year {position:relative;display:flex;align-items:center;justify-content:center;width:300px;margin:0 auto;border:2px solid #000;border-radius:50vh;aspect-ratio:3 / 1;}
.cont-timeline .year:before, .cont-timeline .year:after {position:absolute;top:calc(50% - 7.5px);left:36px;width:15px;content:'';border-radius:100%;background-color:#000;aspect-ratio:1 / 1;;}
.cont-timeline .year:after {right:36px;left:unset;}
.cont-timeline .year span {display:inline-flex;align-items:center;justify-content:center;width:100%;max-width:290px;font-size:40px;font-weight:bold;text-align:center;border:1px solid #000;border-radius:50vh;aspect-ratio:29 / 9;}

#cont01 {background:linear-gradient(#fff1f3 calc(100% - 1px), #fff calc(100% - 1px));}
.cont-timeline {margin-top:75px;}
.month-wrap {display:flex;margin-top:66px;padding:0 35px;gap:70px;}
.month {width:100%;}
.month dt {position:relative;}
.month dt:before {position:absolute;top:-16px;left:37px;width:12px;height:16px;content:'';border-radius:6px 6px 0 0;}
.month dt:after {position:absolute;top:-16px;right:37px;width:12px;height:16px;content:'';border-radius:6px 6px 0 0;}
.month dd {padding:40px 0 0 68px;line-height:1;background-repeat:repeat-y;background-position-x:32px;background-position-y:-1px;}
.month .calendar {text-align:center;border:10px solid;border-radius:20px;}
.month .calendar .txt-eng {padding:2px 0;font-size:24px;letter-spacing:0;color:#222;}
.month .calendar .txt-kor {padding:3px 0;font-size:36px;font-weight:bold;border-radius:0 0 10px 10px;background-color:#fff;}
.month li {position:relative;color:#333;}
.month ul {display:flex;flex-direction:column;width:330px;gap:100px;}
.month .date {font-size:28px;font-weight:bold;line-height:1;}
.month p {font-size:20px;line-height:1;text-align:center;}
.month li:before {position:absolute;left:-48px;width:38px;height:auto;content:'';aspect-ratio:38 / 28;}
.month li .img {margin:13px 0 20px;}
.march .calendar {border-color:#f29d23;background-color:#f29d23;}
.march dt:before, .march dt:after {background:#f29d23;}
.april dt:before, .april dt:after {background:#ff8830;}
.march .calendar .txt-kor {color:#bb5000;}
.april .calendar {border-color:#ff8830;background-color:#ff8830;}
.april .calendar .txt-kor {color:#f54500;}
.march dd {background-image:url(../images/2026/line-march.png);}
.april dd {background-image:url(../images/2026/line-april.png);}
.march li:before {background-image:url(../images/2026/ico-date-march.png);}
.april li:before {background-image:url(../images/2026/ico-date-april.png);}

.travelcontlist {padding-top:73px;}
.travelcontlist .travel-tab {margin-bottom:60px;} 
.travelcontlist .travel-tab li {font-size:30px;font-weight:400;color:#fff;border:5px solid #ff4663;border-radius:25px;background:#ff4663;} 
.travelcontlist .travel-tab li.on {position:relative;font-weight:600;color:#ff4663;background-color:#fff;} 
.travelcontlist .travel-tab li.on:before {position:absolute;width:35px;height:100%;content:'';background:url(../images/2026/bg-cont-tab.png) center no-repeat;} 
.travelcontlist .travel-tab li.on:after {position:absolute;right:0;bottom:0;width:35px;height:100%;content:'';transform:rotateY(180deg);background:url(../images/2026/bg-cont-tab.png) center no-repeat;} 
.travelcontlist .card {position:relative;display:flex;padding:50px 40px;background:linear-gradient(transparent 45px,  #f8f8f8 45px, #f8f8f8 calc(100% - 45px),transparent calc(100% - 45px) );gap:30px;;} 
.travelcontlist .card::before {position:absolute;top:0;left:0;width:100%;height:50px;content:'';background:url(../images/2026/bg-card.png) no-repeat;aspect-ratio:1000 / 50;}
.travelcontlist .card::after {position:absolute;bottom:0;left:0;width:100%;height:50px;content:'';transform:rotateX(180deg);background:url(../images/2026/bg-card.png) no-repeat;background-size:contain;aspect-ratio:1000 / 50;;}
.travelcontlist .map-thumb {flex-shrink:0;width:400px;aspect-ratio:400 / 250;} 
.travelcontlist .travel-cont {display:flex;flex-direction:column;width:100%;} 
.travelcontlist .travel-header {display:flex;align-items:center;flex-direction:row-reverse;justify-content:space-between;margin-top:-8px;margin-bottom:8px;font-size:30px;color:#333;} 
.travelcontlist .travel-header .travel-category {display:inline-flex;align-items:center;height:30px;padding:0 15px;font-size:18px ;font-weight:500;color:#fff;border-radius:50vh;} 
.travelcontlist .travel-header .category01 {background-color:#138fc2;} 
.travelcontlist .travel-header .category02 {background-color:#e54393;} 
.travelcontlist .travel-header .category03 {background-color:#b240c0;} 
.travelcontlist .travel-header .category04 {background-color:#ed5316;} 
.travelcontlist .travel-footer {display:flex;flex-direction:column;flex-grow:1;justify-content:space-between;margin-top:13px;} 
.travelcontlist .travel-desc {font-size:16px;line-height:1.375;word-break:auto-phrase;color:#666;} 
.travelcontlist .travel-address {display:flex;flex-direction:column;gap:10px;}
.travelcontlist .travel-address .address-code:not(:empty) {display:inline-flex;padding:3px 12px;font-size:16px;color:#333;border-radius:50vh;background:#e5e5e5;} 
.travelcontlist .travel-address .address-code:before {width:15px;height:21px;margin-right:5px;line-height:inherit;content:'';color:inherit;background:url(../images/2026/ico-map.png);} 
.travelcontlist .travel-actions {display:flex;gap:9px;}
.travelcontlist .travel-actions .btn {padding:9px 20px 9px 30px;font-size:18px;line-height:1;color:#333;border:1px solid #333;background-color:#fff;} 
.travelcontlist .travel-actions .btn span {display:inline-flex;align-items:center;font-size:16px;font-weight:500;line-height:inherit;} 
.travelcontlist .travel-actions .btn span:after {width:12px;height:12px;margin-left:8px;line-height:inherit;content:'';color:inherit;background:url(../images/2026/ico-link.png);} 

/* 마스크 레이어 */
.poplayer {position:fixed;z-index:9999;top:0;left:0;display:none;overflow:hidden;width:100%;height:100%;background:url(http://www2.seoul.go.kr/event/e_150324_springroad/images/bg/bg-mask.png) 0 0 repeat;} 
.mask {position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, .5);} 
.poplayer .holder {position:relative;z-index:2;margin:0 auto;padding:50px 0;} 
.poplayer .contentbox {position:relative;background:#fff;-webkit-box-shadow:0 0 10px 0 rgba(0, 0, 0, .17);-moz-box-shadow:0 0 10px 0 rgba(0, 0, 0, .17);box-shadow:0 0 10px 0 rgba(0, 0, 0, .17);} 
.poplayer .header {position:relative;box-sizing:border-box;min-height:52px;padding:13px 330px 14px 21px;border:0 solid #aaa;border-radius:2px;background:#ff2c60;} 
.poplayer .header #poptitle {font-size:22px;font-weight:bold;letter-spacing:-1px;word-break:break-all;color:#fff;} 
.poplayer .header .pop-closed {position:absolute;z-index:10;top:0;right:0;display:flex;align-items:center;justify-content:center;width:60px;background-color:#ed0f46;aspect-ratio:1 / 1;} 
.poplayer .content {position:relative;margin-top:3px;padding:10px;} 
.poplayer .buttons {position:absolute;top:0;right:0;height:100%;} 
.poplayer .buttons li {float:left;height:100%;border-left:1px solid #e5e5e5;} 
.poplayer .buttons a {position:relative;display:block;height:100%;} 
.poplayer .buttons a img {position:relative;top:50%;margin-top:-28px;} 
.poplayer .buttons li.del {padding:0 9px;border-left:none;} 
.poplayer .buttons li.del a {width:81px;} 
.poplayer .buttons li.del a span {position:relative;top:50%;display:inline-block;width:81px;height:36px;margin-top:-18px;font-size:15px;line-height:35px;cursor:pointer;text-align:center;letter-spacing:-1px;color:#fff;border:1px solid #e1384a;border-radius:4px;background:#e94455;} 
.poplayer .imgbuttons .btn_prev, .poplayer .imgbuttons .btn_next {position:absolute;top:50%;margin-top:-34px;} 
.poplayer .imgbuttons .btn_prev {left:34px;} 
.poplayer .imgbuttons .btn_next {right:34px;}

/* viewport Height<760 */
.__h760 .travelcontlist {padding-top:35px;}
.__h760 .travelcontlist .travel-tab {margin-bottom:30px;}
.__h760 .travelcontlist .travel-tab a {height:50px;}