@charset "utf-8";

:root {
    --primaryColor: #4989bc;
    --react-good: #ff484f;
    --react-nogood: #217aee;
}

:root[color-theme='light'] { /* 스위치 버튼 */
    --lightVisible: none;
    --darkVisible: inline-block;
    /* background */
    --inputBg: #fff;
    --inputBgGray: #f6f6f6;
    --bodyBg: #f6f6f6;
    --contBg: #fff;
    --gnbBg: rgba(0,0,0,0.1);
    --menuBg: #4158d1;
    --joinBg: #f7f7f7;
    --prHover: #f7f7f7;
    --pointBg: #edf3fc;
    --bovHover: #f7f7f7;
    --boNoticeBg: #fff6fa;
    --ftCopyBg: #f1e7e5;
    --evenTdBg: #fbfbfb;
    --copyHvBg: #f4f4f4;
    --newBg: #f7f7f7;
    --priThBg: #f7f7f9;
    --pgBg: #eee;
    --autoBg: #eee;
    --pgHvBg: #fafafa;
    --scrapBg: #f8ebea;
    --boListBg: #ccd1d9;
    --btnPrvBg: #eeeeee;
    --noImgBg: #eaeaea;
    --gnbShadowBg: #37370566;
    --autoPopBg: #e8e8e8;
    --autoHvBg: #dbdbdb;
    /* 폰트색상 */
    --fontColor: #000;
    --gnbFontColor: #080808;
    --prFontColor: #465168;
    --btnColor: #000;
    --bovColor: #666;
    --tdColor: #666;
    --bovTitColor: #555;
    --iconColor: #4b5259;
    --ptStatusColor: #737373;
    --moreOptColor: #6b757c;
    --ftColor: #525252;
    --boListColor: #6f534e;
    --moreColor: #c4bab8;
    /* border */
    --border: 1px solid #e5ecee;
    --topBtnBorder: 2px solid #00000032;
    --inputBorder: 1px solid #d0d3db;
    --gnbBorder: 1px solid #e0e2e5;
    --olBorder: 1px solid #d5d9dd;
    --scrabBorder: 1px solid #e5ecee;
    --moreUlBorder: 1px solid #b8bfc4;
    --moreLiBorder: 1px solid #f1f1f1;
    --afterBorder: transparent transparent #fff transparent;
    --beforeBorder: transparent transparent #e5ecee transparent;
    --priTableBorder: 1px solid #d8dbdf;
    --qaBorder: 1px solid #ffded8;
    --fileBorder: 2px solid #00000010;
    --shareBorder: 1px solid #d5d5d5;
    --autoLiBorder: 1px solid #ffffff;
    --autoUlBorder: 1px solid #e8e8e8;
}

:root[color-theme='dark'] { /* 스위치 버튼 */
    --lightVisible: inline-block;
    --darkVisible: none;
    /* background */
    --inputBg: #323235;
    --bodyBg: #151616;
    --contBg: #252525;
    --gnbBg: rgba(0,0,0,0.4);
    --menuBg: #323235;
    --joinBg: #151616;
    --prHover: #151616;
    --pointBg: #1f1d1d;
    --bovHover: #1f1d1d;
    --boNoticeBg: #1b1716;
    --ftCopyBg: #2b2727;
    --evenTdBg: #1f1d1d;
    --copyHvBg: #1f1d1d;
    --newBg: #1f1d1d;
    --priThBg: #242424;
    --pgBg: #323235;
    --autoBg: #3a3a3a;
    --pgHvBg: #1f1d1d;
    --scrapBg: #493937;
    --boListBg: #38393b;
    --btnPrvBg: #363636;
    --noImgBg: #1f1d1d;
    --gnbShadowBg: #00000080;
    --autoPopBg: #ffffff40;
    --autoHvBg: #525252;
    /* 폰트색상 */
    --fontColor: #fff;
    --gnbFontColor: #a0a0a0;
    --prFontColor: #a0a0a0;
    --btnColor: #4158d1;
    --bovColor: #b9b9b9;
    --tdColor: #a0a0a0;
    --bovTitColor: #bababa;
    --iconColor: #fff;
    --ptAllColor: #8d8c8c;
    --ptStatusColor: #2c2c2c;
    --moreOptColor: #a0a0a0;
    --ftColor: #999999;
    --boListColor: #a08a85;
    --moreColor: #646464;
    /* border */
    --border: 1px solid #383838;
    --topBtnBorder: 2px solid #ffffff50;
    --inputBorder: none;
    --gnbBorder: 1px solid #383838;
    --olBorder: 1px solid #383838;
    --scrabBorder: 1px solid #616161;
    --moreUlBorder: 1px solid #646464;
    --moreLiBorder: 1px solid #383838;
    --afterBorder: transparent transparent #212020 transparent;
    --beforeBorder: transparent transparent #383838 transparent;
    --priTableBorder: 1px solid #414141;
    --qaBorder: 1px solid #504544;
    --fileBorder: 2px solid #ffffff24;
    --shareBorder: 1px solid #4d4d4d;
    --autoLiBorder: 1px solid #252525;
    --autoUlBorder: 1px solid #ffffff40;
    /* filter */
    --invert: invert(92%);
    --moreInvert: invert(86%);
}


@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 100,200,300,400,500,700,800,900;
    font-style: normal;
}

@font-face {
    font-family: 'ghanachoco';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@1.0/ghanachoco.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

a{text-decoration: none;}

.sto{
    margin: auto auto auto 0;
}

.thee{
    margin: -8px 10px 0 auto;
    padding: 0;
    font-family: 'Pretendard-Regular';
    list-style: none;
    text-decoration: none;
    font-size: 30px;
}

.wid{
    text-align: center !important;
    bottom: 0px;
}

.butto {
    display: inline-block !important; /* 버튼처럼 보이게 하기 위해 inline-block으로 설정 */
    padding: 5px 18px; /* 버튼의 패딩 */
    background-color: #F8F8F8; /* 버튼 배경색 */
    color: white; /* 글자색 */
    text-decoration: none; /* 밑줄 제거 */
    border-radius: 5px; /* 모서리 둥글게 */
    transition: background-color 0.3s; /* 배경색 변화에 애니메이션 추가 */
    text-align: center; /* 수평 중앙 정렬 */
    height: 40px; /* 버튼 높이 설정 */
    line-height: 37px; /* 텍스트 수직 중앙 정렬 */
    border: 2px solid #DADADA;
    width: 10vw;
    margin: 0 auto;
    font-weight: 500;
}

.butto:hover {
    background-color: #ffffff; /* hover 시 배경색 변화 */
}

.active {
    background-color: rgb(82, 92, 233); /* 원하는 배경색 */
}

.submenu{
    margin-top: 8px;
    margin-left: 10px;
}

tr.titl{
    height: 80px;
}

tr.titl > td > img:first-child{
    width: 14%;
    height: 14%;
    margin-left: 25px;
}

#dropdown-menu > tbody > .titl > td:first-child{display: flex; justify-content: space-between; align-items: center;}

#dropdown-menu > tbody > .titl > td:first-child > img:nth-child(2){width: 148px;}

.submenu {
    display: block; /* 서브메뉴를 블록으로 설정 */
}

.link {
    margin-right: 10px; /* 링크 간의 간격 조정 */
    text-decoration: none; /* 링크의 밑줄 제거 */
    color: #888888 !important; /* 링크 색상 설정 (필요에 따라 변경) */
    font-size: 1.2em !important;
}

.link:hover {
    text-decoration: underline !important; /* 마우스 오버 시 밑줄 추가 */
}

.menu {
    position: relative; /* 메뉴의 위치를 상대적으로 설정 */
}

#dropdown-menu {
    width: 22vw;
    position: fixed;
    top: 0;
    right: calc(-0.56vw - 5px);
    height: 100vh;
    background: #fff;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2);
    transition: right 0.3sease -in-out;
    z-index: 1002;
    overflow-y: auto;
    overflow-x: hidden;
}

#dropdown-menu table {
    width: 100%; /* 테이블의 너비를 100%로 설정 */
    border-collapse: collapse; /* 테이블 경계선 겹침 방지 */
}

#dropdown-menu td {
    background-color: #fff;
    padding: 10px;
    border-bottom: 1px solid #ccccccc4; /* 각 항목의 아래쪽 경계선 */
    width: 19vw;
}

#dropdown-menu td a {
    display: flex;
    text-decoration: none;
    color: black;
    height: 35px;
    flex-wrap: nowrap;
    margin-left: 30px;
    font-size: 1.3em;
    height: 45px;
    line-height: 45px;
}

#dropdown-menu td:hover {
    background-color: #f0f0f0; /* 마우스 오버 시 배경색 변경 */
}

/* 기본 세팅 */
@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 100,200,300,400,500,700,800,900;
    font-style: normal;
}

*{ margin: 0 auto; padding: 0; font-family: 'Pretendard-Regular'; list-style: none; text-decoration: none;}

html, body { overflow: auto; overflow-x: hidden; overflow-y: auto; width: 100%; }

/* 헤더 */
header{ z-index: 9999; position: fixed; width: 100vw; height: 100px; background-color: #fff; border-bottom: 1px solid #dadada;}
.wrap{ margin: 0 auto; width: 60vw; max-width: 1240px; height: 100px;  display: flex; justify-content: space-between; align-items: center; }

.logo{margin: 0;}
.logo img{ width: 53px; height: 53px; }

.life_logo img{ width: 338px; height: 37px; margin-right: 150px; }

.menu{ margin: 0; background: none; border: none; cursor: pointer; }
.menu > img{width: 190px; height: 33px; margin-right: 10px; }
.menu > a > img{ width: 40px; height: 40px; }

/* 공통 */

/* 팝업 */
.img_popup{position: absolute; top: 8%; left: 32%; border: 2px solid; width: 600px;  z-index: 9999;}



/* 이미지 슬라이드 */
.imageslide {display: flex;width:100%;justify-content: space-between;flex-direction: column;}
.imageslide img {display: block; width: 100vw !important; margin-top: 100px!important; width: 100%!important; height: auto!important; object-fit: cover !important; }
.imageslide_mo,.imageslide_ta { display: none; }
.imageslide_pc{flex: 1 0 0;}

/* 콘텐츠 배너 오른쪽 상자 */
/* .subBannerText {color:#fff; margin-left:100px; margin-top: 12vw; line-height: 40px !important;  font: normal normal 600 1.8em Pretendard; letter-spacing: -0.12px; line-height: 40px !important;} */
.subBannerText {color:#fff; margin-left:100px; margin-top: 16vw;  font: normal normal 600 2.3em Pretendard; letter-spacing: -0.12px; line-height:2;}
.subBannerText2 {color:#fff; font-size: 2vh !important; line-height: 40px !important; margin-left:100px;margin-top: 2vw;font: normal normal normal 0.9em Pretendard; letter-spacing: -0.06px; display: none;}

/* 달력 전체 */
.calendar{ position: relative; width: 100%;  display: flex; background-color: #FFF6F9;  padding: 50px 0px;}

/* 왼쪽 달력 - leftcalendar - lc */
.leftcalendar{ margin: 0; width: 92vw; background-color: #f1f1f1; border-radius: 10px; }
.lcwrap{margin: 28px;}
.lcdate{ margin-top: 40px; width: 10vw; height: 30px; display: flex; align-items: center;}
.lcdate p{  font-size: 25px; font-weight: 600;}
.lcdate img{ margin-top: 5px; width: 16px; height: 19px; cursor: pointer;}

.lcbuttom{ height: 32px;}
.lcbuttom .lcevent p{width: 108px; text-align: center; height: 32px; line-height: 32px; font-size: 18px; font-weight: 700; color: #222; background-color: #FFD900; float: right; border-radius: 5px; margin-right: 10px;}
.lcbuttom .lcculture p{width: 108px; text-align: center; height: 32px; line-height: 32px; background-color: #E43C00; float: right; border-radius: 5px; font-weight: 700; color: #fff; margin-right: 10px;}

.lcweek{ margin-top: 46px; display: flex; justify-content: space-between; }
.lcweek p{font-size: 22px; color: #222; font-weight: 600;}

.week{ margin-top: 20px; display: flex; }
.week .gray{ color: #999; font-weight: 700; }
.week .day{margin-bottom: 20px;}
.week .dayEvent{width:90%;height:0.5em;margin-top:5px;border-radius: 7px;z-index: 999;}
.week .dayEvent2{position: relative;right: 0px;width:100%;height:0.5em;margin-top:5px;z-index: 999;}
.week .dayEvent3{position: relative;right: 9px;width:120%;height:0.5em;margin-top:5px;z-index: 999;}


.week .dayEventleft{position: relative;left: 10px; width:100%;height:0.5em;margin-top:5px;border-top-left-radius: 7px;border-bottom-left-radius: 7px;z-index: 999;}
.week .dayEventright{position: relative;right: 6px; width:90%;height:0.5em;margin-top:5px;border-top-right-radius: 7px;border-bottom-right-radius: 7px;z-index: 999;}

.week ul{ position: relative; font-size: 25px; color: #222; font-weight: 700; text-align: center; border-radius: 5px; padding-top: 10px; width: 110px; height: 145px; background-color: #fff; cursor: pointer; }
.week p a.active{ display: block; background-color: #0070C3; width: 40px; height: 40px; line-height: 40px; border-radius: 30px; color: #fff; }

.weekculture, .weekevent{ position: absolute; left: 8%; width: 80px; height: 34px; line-height: 35px; text-align: left; padding-left: 8px; font-size: 18px; border-radius: 5px; }
.weekculture{ top: 38%;  background-color: #FFD900; color: #222; }
.weekevent{ top: 65%; background-color: #E43C00; color: #fff; }

/* 왼쪽 달력 이미지 */
.leftimg{ position: absolute; left: -15%; bottom: -1%; }
.leftimg img{ width: 223px; height: 223px; }

/* 오른쪽 달력 - rightcalendar - rc */
.rightcalendar{ display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0 auto; max-width: 1240px; width: 100%;  border-radius: 10px; }

.rightcalendar a{margin: 0px; color: #333333;}

.rcselect_wrap{  width: 400px; background-color: #999; } 
.rcselect{ display: none; cursor: pointer; margin-top: 28px; margin-right: 28px; justify-content: right; padding: 10px 10px; height: 50px; font-size: 20px; color: #222; font-weight: 800; background: none; border: none; border-radius: 5px; } /* display: grid; 빠짐 */
.rcselect:focus{ background-color: #fff; border: 1px solid #999; box-sizing: border-box; border-radius: 5px; border-radius: 10px; }

.rcculturtext{ margin: 0; overflow:hidden; text-overflow : ellipsis; white-space:nowrap; text-align: left; }

.rcculture, .rcevent{ cursor: pointer; display: flex;  justify-content: space-between; align-items: center; gap: 45px; margin-top: 20px; width: 345px; padding: 20px; height: 2.4em; background-color: #fff; border-radius: 5px; }
/* .culturetext, .eventtext{ margin-left: 0px; text-align: center; line-height: 30px; font-size: 18px; border-radius: 5px; width: 56px; height: 27px; } */

/* .culturetext{ font-weight: 800; background-color: #FFD900; } */
.eventtext{ font-weight: 600; color: #fff; background-color: #E43C00; }

.text01{ margin-top: 10px; font-size: 1em; color: #222; font-weight: 700; width : 170px ; overflow:hidden; text-overflow : ellipsis; white-space:nowrap; }
.text02{ margin-top: 10px; font-size: 0.9em; color: #666; font-weight: 700; }

.rcculturt_arrow img{ margin-right: -15px; width: 24px; height: 32px; }

/* 오른쪽 달력 이미지 */
.rightimg{ position: absolute; bottom: 0; right: -10%; }
.mailbox img{ width: 228px; height: 192px; }

.mailclick{ cursor: pointer; position: absolute; left: -5%; top: 13%; }
.mailclick img{ width: 98px; height: 99px; }

.mail{ position: absolute; bottom: 20%; left: -30%; }
.mail img{ width: 111px; height: 75px; }

/* 하단 컨텐츠 - uljunews */
.uljunews_{ width: 100%; }
.uljunews_red{ width: 100%; background-color: #F4DEE1; }
.uljunews_white{ width: 100%; background-color: #Fff; }
.uljunews_wrap{ max-width: 1240px; padding: 100px 0;padding-bottom: 3em;}



.uljunews_title{ position: relative; display: flex; justify-content: left; align-items: center; }
.uljunews_title .news{ margin: 0; font-size: 1.4375rem; font-weight: 600; }
.uljunews_title::before{ content: '';background-repeat: no-repeat; width: 27px; height: 27px; background-size: cover;  margin-right: 6px;margin-top: 0.6em;}

.puls{ margin: 0; display: flex; align-items: center;}
.puls p{ font-size: 20px; color: #666; font-weight: 600; cursor: pointer; }
.puls img{ margin-left: 10px; width: 30px; height: 30px; cursor: pointer;}

.uljunews_img{ display: flex; cursor: pointer; flex-wrap: wrap; justify-content: flex-start;column-gap:1em;}
.uljunews_img > a{margin: 0px;}

.uljunews_content {display: flex; flex-basis: 24%; justify-content: space-between;margin: 0px;flex-grow: 1;}
.uljunews_text img { margin-top: 40px; width: 100%; margin-bottom: 20px; border-radius: 10px;   }
.uljunews_text p{ color: #222; font-size: 18px; line-height: 30px; font-weight: 600; }

/* 콘텐츠 페이지 */
.uljunews{display: flex; flex-direction: column;}
.uljunews_contents{width:1150px; display: flex; flex-direction: column;}



/* 정리 */

.Content_Text_Title {margin-top:100px;margin-bottom: 2em;  width: 100%; line-height: 36px;text-align: left;font-weight: bold;font-size: 1.875em;color:#333333}
.Content_Text_Title_Desc {margin:0px; margin-bottom: 60px ;font:normal normal 500 1.25em Pretendard;text-align: left; color: #333333; line-height:1.5em}

.Content_Text_Box {width:100%;display: flex;flex-direction: column;border-radius: 10px;padding:0;margin-bottom: 40px;}
.Content_Text_SubTitle {display: flex; align-items: center; font:normal normal 800 1.3em Pretendard;text-align: left;color:#333333;margin: 0px 0px 1.92307em 0px; }
.Content_Text_SubText {margin:0px;margin-bottom: 20px; font:normal normal 400 1.2em Pretendard;text-align: left; color: #333333;line-height:1.5em; word-break: keep-all;}

.Content_Text_Icon_Title {display: flex; align-items: center; font:normal normal 800 1.3em Pretendard;text-align: left;color:#333333;padding: 0px;margin: 0px 0px 0.96153em 0px;}
.Content_Text_Icon_Title::before{ display: inline-block; content: ''; background-repeat: no-repeat; width: 19px; height: 21px; background-size: cover;  margin-right: 6px;}

.Content_Text_Icon_Title1 {display: flex; align-items: center; font:normal normal 800 1.6em Pretendard;text-align: left;color:#333333;padding: 0px;margin: 0px 0px 0.96153em 0px;}


/* 테이블 정리 성순 2025.6.5  6월호 적용*/
.Content_Table_Gap, .Content_Table_Gap2{display: flex;justify-content: flex-start;margin:0;max-width: 100%;}
.Content_Table_GapData{display: flex;flex-grow: 0;flex-shrink: 1; align-items: flex-start;text-align: left;font-size:20px;line-height:28px;letter-spacing: -0.06px;color: #333333;margin: 0 0 10px 0;}
.Content_Table_GapData > span{margin: 0;}
.Content_Table_GapData > img{max-width: 100%;}
/* 끝 */


.Content_Text_Main_Text{margin:0px;margin-bottom: 28px; font: normal normal normal 20px/28px Pretendard;letter-spacing: -0.06px;color: #333333;}

.Content_Table_NoTitle{display: flex;justify-content: flex-start;width:100%;margin:0; align-items: flex-start;}
.Content_Table_Data{display: flex;align-items: center;text-align: left;font: normal normal normal 20px/28px Pretendard;letter-spacing: -0.06px;color: #333333;margin: 0 0 10px 0;flex-grow: 1;}

.Content_Table_NoTitle3{display: flex;justify-content: flex-start;width:100%;margin:0; align-items: center;}

.Culture_Table{width:100%;max-width: 1240px;padding: 6.25em 3.75em;margin: 6.25em 0;border-radius: 10px;}

.Culture_List{display:flex;}
.Culture_List > li {margin: 0;margin-right: 6.25em;}
.Culture_List > li > div {width:100%}
.Culture_List > li > div > img {width:100%;}

.Culture_List_Box {flex:1 0 55%}
.Culture_List_Text{display:flex;flex-direction: column;width:100%;font-size:1.0417vw;line-height:1.4583vw; font-family: Pretendard;letter-spacing: -0.06px;color: #333333;justify-content: space-between;height:100%}
.Culture_List_Text > li {margin: 0;margin-left:1.25em;}
.cultrue_link {width:100%;margin-top: 2vw;}
.cultrue_link > p {display: inline-block; background-color: #fff; border-radius: 10px;padding: 0.8em;width:100%;font-size: 1.0417vw;}


.big_big {font-size:1.7em;text-align:left;margin:0;line-height: 2em;font-weight: bold;}

.con_text02 {margin:0px;font:normal normal 400 1.2em Pretendard;text-align: left; color: #333333; }
.con_text03 {font:normal normal 400 1em Pretendard;text-align: center;margin: 0.6em 0; font-weight: 600; }
.con_text04 {font:normal normal 800 1.3em Pretendard;text-align: center;margin: 0.6em 0; font-weight: 600; }
.con_text05 {font:normal normal 400 1.2em Pretendard;text-align: center;margin: 0.6em 0; font-weight: 600; }
.con_text06 {display: flex; align-items: center; font:normal normal 800 1.3em Pretendard;text-align: left;color:#333333;padding: 0.5em 0px;border-radius: 1.5em;margin: 0px 0px 1.5em 0px;}
.con_text06::before{ display: inline-block; content: ''; background-repeat: no-repeat; width: 19px; height: 21px; background-size: cover;  margin-right: 6px;}





.con_img01 {display: block; width:100%;margin-top:100px}
.con_img01 > img{ width:100%}
.con_chracter {display: flex;flex-direction: row;margin: 60px;width:100%;align-items: center;justify-content: center;align-self: center;}
.con_chracter_left { text-align: center; margin: 0 auto; flex-basis: 65%; background-color:#F1F1F1;height:14em;border-radius: 6em;margin:0px;display: flex;flex-direction: column;justify-content:center;padding-top: 2em;padding-bottom: 2em;}
.con_chracter_middle {flex-basis: 7%;margin:0px;}
.con_chracter_middle img{position: relative;right: 1em;}

.con_chracter_right {flex-basis: 26%;margin:0px;}
.con_chracter img {width:100%}

.con_table {display: flex;justify-content: space-between;background-color: #DADADA;}
.con_table2 {display: flex;justify-content: space-between;background-color: #DADADA;width:100%;margin: 0px;align-self: center;align-items: center;}           
.con_none_table{display: flex;justify-content: space-between;width:70%}
.con_none_table2{display: flex;justify-content: flex-start;width:70%;margin: 0;}

.con_table_title {display:flex;align-items: center; height: 2.5em; color:#333;font-size:1.2em;text-align: center;justify-content: center;padding: 0px -0.2em;}
.con_table_item {display: flex;align-items: center; background-color: #ffffff;height: 4em; color:#222;font-size:1.2em;flex-wrap: wrap;justify-content: center;margin: 1px;padding: 0px -0.2em;}
.con_table_item3 {display: flex;align-items: center;height: 4em; color:#222;font-size:1em;justify-content: flex-start;margin: 1px;}
.con_table_item4 {display: flex;align-items: center;background-color: #ffffff;height: 4em; color:#222;font-size:0.9em;justify-content: center;margin: 1px;align-self: center;flex-wrap: wrap;text-align: center;}
.con_table_item5 {display: flex;align-items: center; height: 4em; color:#333;font-size:1em;justify-content: center;margin: 1px;align-self: center;}
.con_table_img {display:flex; width:25%; flex-direction: column; margin:0;}
.con_table_img img{width:95%;}
.con_table_img > div{font-size:1.3em}
.t_basic {width:730px;background-color: #FFF6F9;border-top-right-radius: 10px;border-top-left-radius: 10px;}
.t_basic2 {background-color: #FFF6F9;border-top-right-radius: 10px;border-top-left-radius: 10px;}

.i_basic {width:730px; text-align: center; }

.con_bar {width:100%;margin-top: 6em;}

/* 푸터 영역 */

/* 하단 이미지 */
/* .bottomimage{ position: relative; z-index: 0; padding-top: 50px; } */

.bottomimage{ position: relative; display: flex; justify-content: space-between;  width: 100%; margin-top: 100px; padding: 14px 0px; column-gap:calc(100% - 81%); border-top: 2px solid #dadada; border-bottom: 2px solid #dadada;}
.bottomimage::before{content: "온라인 '행복울주'는 매월 발행됩니다";position: absolute;top: -50%; right: 16.8vw; color: #333333;}

.bottomimage > img:first-child{width: 40px; }
.bottomimage > img:nth-child(2){width: 13em; object-fit: contain;}

.bottom_grass{ display: block; line-height: 0; }
.bottom_grass_mo{ display: none; }

.bottom_grass img{ width: 100%;  margin: 0; padding: 0;}

#bottom_music{position: absolute; top: -5%; right: 7%; cursor: pointer;}
#bottom_music img{width: 100px; height: 100px; }

/* 푸터 */
.footer{ position: relative; width: 100%; }
.footer_wrap{ display: flex; justify-content: space-between; align-items: center; max-width: 1240px; padding: 3em 0px; }

.sns{ margin: 0; }
.sns img{ width: 50px; height: 50px; margin-right: 5px; }

.copy{ margin: 0; }
.copy p{ font-size: 16px; color: #666666; font-weight: 700; }

/* 스크롤 이벤트 버튼
   #linkButton,#scrollToTopBtn { z-index: 9999; position: fixed; background: none; right: 30px; border: none; font-size: 18px; cursor: pointer; }
   #linkButton{ position: absolute; margin-bottom: 25px; }
   #scrollToTopBtn img, #linkButton img { width: 60px; height: 60px; }

   #snsLinks { position: fixed; margin-bottom: 30px; right: 23px; background-color: #fff; border: 1px solid #dadada;
    border-radius: 60px; padding: 10px 10px 60px 10px; display: none; z-index: 999; transform: translateY(20px); opacity: 0; transition: transform 0.3s ease-out, opacity 0.3s ease-out; }

  #snsLinks img{
    width: 50px;
    height: 50px;
  }
  
  #snsLinks a {
    display: block;
    color: white;
    text-decoration: none;
    margin-bottom: 5px;
    font-size: 14px;
  }
  
  #snsLinks a:hover {
    color: #ddd;
  } */

/* 링크 버튼 */
.cover {max-width: 1240px;}
.cover_02{margin: 5em 0 0 0;height: 27px;text-align: left;font: normal normal 600 23px/27px Pretendard;letter-spacing: -0.06px;color: #333333;}
.cover_03{margin: 0;height: 24px;text-align: left;font: normal normal 600 20px/24px Pretendard;letter-spacing: NaNpx;color: #666666;opacity: 1;word-break: normal;}

.collect_title{margin: 0 0 0 0.11765em;height: 20px;text-align: left;font: normal normal bold 23px/27px Pretendard;letter-spacing: -0.07px;}
.collect_title_barbox{flex-grow: 1;}
.collect_title_bar{width:100%-1em;margin-left:1em;}

.collect_title_text{text-align: left;font: normal normal 600 18px/30px Pretendard;letter-spacing: -0.05px;color: #333333;margin-bottom: 3.125em;}
.collect_title_text

.collect_title_text > .arrow_r{text-align: left; font: normal normal medium 14px/16px Pretendard; letter-spacing: 0px; color: #666666;margin-top: 0.5em;}
.collect_title_text > .arrow_r:after {content: " " url(/static/img/public/arrow_r.svg);margin-left: 0.5em;position: relative;top:0.2em}
.Content_Table_Data > span {margin: 0px;}
.Content_Table_Data > span > a{margin: 0px;}

.Content_Text_S{font-size: 18px;}

.dis_mo{display: none}
/* 사연 말풍선 */

.content_april_title{width: 80%}
.content_april_title > span{border-radius:8px; width:14vw; padding:1vw;display: flex; justify-content: center;}

.post_box{position: relative; display: flex;width:73%;margin: 1vw auto; padding: 2.81vw 4.27vw 2.81vw 2.08vw;border-radius: 20px;}
.post_name{flex:0 0 20%;margin: 0;display: flex;align-self: center;}
.post_name > p {border-radius: 50%;height:7vw;width:7vw;text-align: center;line-height: 7vw;font-size: 1.35vw;font-weight: 600;}
.post_story{flex:1 0 80%;margin: 0; font-size: 1.04vw; line-height: 2;display: flex; justify-content: center;gap:1vw}
.post_story > p {flex-basis: 30%;}
.post_story > p > img {width:100%;border-radius: 1vw;}
.post_tooltip-top::after {content: '';position: absolute;top: -3.85vw; left: 3.125vw;width: 0;height: 0;border: 2.083vw solid transparent;}
.post_tooltip-right::after {content: '';position: absolute;right: -3.875vw;width: 0;height: 0;border: 2.083vw solid transparent;}
.post_tooltip-left::after {content: '';position: absolute;left: -3.875vw;width: 0;height: 0;border: 2.083vw solid transparent;}
@media (max-width: 768px) {
    .big_big {font-size:1.4em;text-align:left;margin:0;line-height: 2em;font-weight: bold;}
    .Content_Text_Icon_Title1 {display: flex;  align-items: center; font:normal normal 800 1.1em Pretendard;text-align: left;color:#333333;padding: 0px;margin: 0px 0px 0.96153em 0px;}
      /* 헤더 영역 */
      .wrap{ width: 92vw; margin: 0 auto; padding: 0; }
  
      .life_logo img{ width: 35vw; height: 3vh; margin-left: 70px;}

      .logo img{ width: 23vw; height: 4.6vh; margin-left: 70px; }
      .menu img{ width: 5vw; height: 4vh; }  

      /* 이미지 슬라이드 */
      .imageslide_pc,.imageslide_ta{ display: none; }

      .imageslide_ta{ display: block; }

      /* 캘린더 영역 */
      .calendar{ margin: 0; display: flex; flex-direction: column; align-items: center; gap: 40px; padding: 50px 0px;}

      /* 왼쪽 캘린더 영역  - leftcalendar */
      .lcdate{ margin-top: 10px; width: 30vw; }

      .leftimg{ display: none; }
      
      .week{ gap: 10px; }
      .week p{ padding: 6px 0; border-radius: 6px; height: 10vh; font-size: 3vw; }
      .week p a.active{ width: 4vw; height: 4vw; line-height: 32px; border-radius: 40px; }  

      /* .weekculture, .weekevent{ padding-left: 6px; width: 8.5vw; height: 2.8vh; line-height: 3vh; font-size: 2vw; }
      .weekculture{ margin-top: 0px; }
      .weekevent{ margin-top: 3px; } */

      
    /* 오른쪽 캘린더 영역 - rightcalendar */
    .rightcalendar{ width: 92vw; }

    .rcculture, .rcevent{ gap: 53vw; width: 80vw; height: 10vh;}
    /* .culturetext, .eventtext{ width: 7vw; font-size: 2.5vw; height: 3vh; line-height: 3.2vh; } */

    .text01{ font-size: 3vw; }
    .text02{ font-size: 2.5vw; }
    
    .rcevent{ margin-bottom: 200px; }
    .rcselect{ margin-top: 16px; width: 17vw; height: 5vh; font-size: 3vw; }

    .mailbox img{ margin-bottom: -300px; margin-right: 80px; width: 30vw; height: auto; }
    .mailclick img{ width: 10vw; height: auto; margin-top: 165px; margin-left: 27px; }
    .mail img{ width: 10vw; height: auto; margin-left: 75px; margin-bottom: -255px; }

    /* 컨텐츠 영역 */

    .uljunews{ margin-top: 690px; }
    .uljunews_wrap{ width: 90%; padding: 80px 0; }
    .uljunews_img img{ width: 80vw; height: auto; }

    /* 푸터 영역 */
    .bottom_grass img{ width: 100%; height: auto; margin: 0; padding: 0;}
    .bottomimage::before{content: "모바일 '행복울주'는 매월 발행됩니다";position: absolute;top: -50%; right: 6.8vw;color: #333333; }

    .bottom_grass_pc{ display: none; }
    .bottom_grass_mo{ display: block; }

    .bottom_music{ top: 10%; right: 10%; }

    /* 푸터 영역 */

    .sns{ margin-left: 20px; }
    .copy{ margin-right: 20px; }
    
    .uljunews_content01, .uljunews_content02, .uljunews_content03 { flex: 0 0 100%; }
}

/* 모달 */
.overlay {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #11111170; z-index: 10; transition: opacity 0.3s ease; }

.overlay.open { display: block; opacity: 1; border-radius: 8px;}
.event-modal {display: block; position:fixed;top:8vw;left:8vw; background: white;  z-index: 20;object-fit: cover;z-index: 999;border: solid 1px;box-shadow: 3px 3px 7px 1px grey;}
.event-modal > img {width:100%}
.event-modal > .button-box{background-color: black;color:#eeeeee;text-align: center;padding: 0.5vw;}
@media (max-width: 480px) {
    .event-modal {width:100%; display: block; position:fixed;top:30vw;left:0vw; background: white; z-index: 20;z-index: 999;border: solid 0px;box-shadow: 3px 3px 7px 1px grey;}
    .event-modal > img {width:100%}
    


    .img_popup{position: absolute; top: 30px; left: 30px; border: 2px solid; width: 300px; z-index: 9999;}
    .uljunews_title::before{ content: '';background-repeat: no-repeat; width: 19px; height: 21px; background-size: cover;  margin-right: 6px;}

    /* 새로 정의하는 CSS */
    .cover_02{margin: 2.5em 0 0 1.2em;height: 24px;text-align: left;font: normal normal 600 20px/24px Pretendard;letter-spacing: -0.06px;color: #333333;}
    .cover_03{margin: 0 1.5em;height: 16px;text-align: left;font: normal normal 600 16px Pretendard;letter-spacing: NaNpx;color: #666666;opacity: 1;word-break: normal;}

    .collect_title{margin: 0 0 0 0.11765em;height: 20px;text-align: left;font: normal normal bold 17px/20px Pretendard;letter-spacing: -0.05px;}
    .collect_title_barbox{flex-grow: 1;}
    .collect_title_bar{width:100%-1em;margin-left:1em;}

    .collect_title_text{text-align: left;font: normal normal 600 16px/22px Pretendard;letter-spacing: -0.05px;color: #333333;margin-bottom: 3.125em;}
    .collect_title_text > p{display: block; line-height: normal;}

    .collect_title_text > .arrow_r{text-align: left; font: normal normal medium 14px/16px Pretendard; letter-spacing: 0px; color: #666666;margin-top: 0.5em;}
    .collect_title_text > .arrow_r:after {content: " " url(/static/img/public/arrow_r.svg);margin-left: 0.5em;position: relative;top:0.2em}


    /* 헤더 영역 */
    .wrap{ width: 90vw; margin: 0 auto; padding: 0; }
    .logo img{ width: 13vw; height: 8vh; margin-left: 1em; object-fit: contain;}
    .menu{display: flex; align-items: center; }
      .menu > img:first-child{width: 38vw; object-fit: contain;}
      .menu > a > .menu img{ width: 5vw; height: 3.5vh; }  

    .life_logo img{ display: none; }

    
    /* 이미지 슬라이드 영역 */
    .imageslide_pc,.imageslide_ta{ display: none;}
    .imageslide_mo{ display: block; }

    /* 캘린더 영역 */
    .calendar{ display: flex; flex-direction: column; align-items: center; gap: 0px;margin: 0; }

    /* 왼쪽 캘린더 영역  - leftcalendar */
    .calendar{gap: 40px; margin: 30px 0;}
    .lcdate{ margin-top: 0; width: 40vw; }
    .lcdate p{ font-size: 18px; }

    .lcwrap{ margin: 28px 12px; }

    .lcweek{ margin-top: 30px; }
    .lcweek p{ font-size: 5vw; }

    .leftimg{ display: none; }
    .leftcalendar{height: 39.8%;}

    .week{ margin-top: 16px; gap: 6px; }
    .week ul{font-size: 13px; height: 81px;}
    .week .dayEvent{height: 0.3;}
    .week .day{margin-bottom: 8px}
    .week p{ padding: 6px 0; border-radius: 6px; height: 7.5vh; font-size: 3.8vw; }
    .week p a.active{ width: 5.8vw; height: 5.8vw; line-height: 22px; border-radius: 40px; }

    .weekculture, .weekevent{ padding-left: 4px; width: 8vw; height: 2vh; line-height: 2.3vh; font-size: 3.2vw; }
    .weekculture{ margin-top: 2px; }
    .weekevent{margin-top: 3px; }

    /* 오른쪽 캘린더 영역 - rightcalendar */
    .rightcalendar{ width: 92vw; padding-bottom: 0px; margin: 0px; }


    .rcculture, .rcevent{ display: flex; gap: 45px; width: 80vw; height: 6vh; margin-top: 0.5em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .rcculturtext{  flex: 0 0 75vw; width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis ; margin: 0; }
    /* .culturetext, .eventtext{ width: 12vw; font-size: 3.5vw; height: 2.8vh; line-height: 3vh; } */

    .text01{ font-size: 16px; width: 200px; height: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis ; }
    .text02{ font-size: 3.8vw; }

    .rcselect{ margin-top: 16px; width: 27vw; height: 6vh; font-size: 4.5vw; }

    .mailbox img{ margin-bottom: -30px; margin-right: 50px; width: 40vw; height: auto; }
    .mailclick img{ width: 20vw; height: auto; margin-top:-5px; margin-left: -5px; }
    .mail img{ width: 20vw; height: auto; margin-left: 15px; margin-bottom: -25px; }

    .rightimg{ bottom: -2.5%; right: -12%; }
    /* 서브컨텐츠 */
    .con_title { margin-top: 50px;width: 300px;border-radius: 19px;line-height: 37px;text-align: left;font-weight: bold;font-size: 1.5em;}
    .con_text01 {margin-top: 60px;text-align: left;font-size: 16px !important;font-family: 'Pretendard-Regular';font-weight: 500;color: #333333;line-height: 1.4; width: 57%;}
    .con_textArea {width: 100%;display: flex;flex-direction: column;border-radius: 10px;padding-bottom: 2em;margin-top: 2em;margin-bottom:0px;padding-top: 0px;}
    .con_textArea > p:first-child{width:72%; font-size: 1.1em;letter-spacing: 1px;}
    .con_text02 {margin-top: 0px;font: normal normal 400 1em Pretendard;text-align: left;line-height: 30px;letter-spacing: 0.8px;color: #333333;font-family: 'Pretendard-Regular';width: 95%;}
    .con_text06 {font: normal normal 700 1em Pretendard;text-align: left;background-color: rgba(173, 216, 230, 0.0);color: #333333;padding: 2em 0px;border-radius: 2em;margin-bottom: 0px;width: 85%;}
    .con_img01 {display: block; width: 100%;margin-top: 35px;margin-bottom: 0px; }
    .con_img01 > img {width: 100%;background-size: cover;border-radius: 8px;}
    .uljunews_contents div:nth-child(6) > :first-child {color: #333333;width: 100%;}
    .con_table_img {display:flex; width:25%; flex-direction: column; margin:0;}
    .con_table_img > div{ font-size:1.3em}
    
    /* 컨텐츠 영역 */
    .uljunews { margin-top: 60px }
    .uljunews_wrap{ width: 90%; padding: 0; padding-top: 40px; padding-bottom: 20px;}
    .uljunews_img {justify-content: center;flex-direction: column;}    
    .uljunews_img div{ margin-right: 0px; }

    .uljunews_title .news { font-size: 5.5vw;}
    .uljunews_text p{font-size: 16px;}
    .uljunews_text img { margin-top: 1.875em; margin-bottom: 0.75em;}

    .puls p { font-size: 4.5vw; }
    .puls img{ width: 6vw; height: 2.5vh; }

    .uljunews_img img{ width: 90vw; margin-right: 0px; }

    .con_text03{ margin: 0 auto; width: 160px; overflow-wrap: break-word; }
    
    /* 음표 이미지 */
    #bottom_music{right: -1%; top: 45%;}
    
    /* 푸터 */

    /* 하단 이미지 */
    .bottom_grass img{ width: 100%; margin: 0; padding: 0;}

    .bottom_grass_pc{ display: none; }
    .bottom_grass_mo{ display: block; margin-top: 200px; }

    .bottom_music{ top: -30%; right: 2%; }

    /* 푸터 영역 */
    .footer{position: relative; bottom: 0px; z-index: 999;}
    .footer_wrap{flex-direction: column; padding: 60px 0px;}
    .bottomimage > img:nth-child(2){width: 10em;object-fit: contain; }
    
    .sns{ margin-left: 0px; display: flex; width: 72vw; }
    .sns img{ width:13vw;  }
    .copy p{ margin: 35px 10px 13px; text-align: center; width: 75vw; font-size: 3.5vw; }
    .copy-mo{display: block; margin-top: 20px; }
    /* +이미지 */
    .puls img{width: 5vw;}

    /* 사이드 햄버거 */
    tr.titl{height: 65px;}
    tr.titl > td > img {margin-left: 5%; width: 85%;}
    #dropdown-menu{width: 80vw; right: calc(-10vw - -25px) !important; }
    #dropdown-menu td{width: 72vw;}
    #dropdown-menu td a{margin-left: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis ;}
    .submenu{font-size: 0.875em; margin-left: 0px;}
    /* 지난호 보러가기 */
    .butto{padding:16px 18px; width: 47vw;}

    .mo_collect{display: none;}

    .imageslide {flex-direction: column;margin-bottom:1.4375em;}

    p.subBannerText{font-size:1.5em;}

    p.subBannerText2{font-size:1.2em !important;line-height:1.5em !important;margin-top:0em !important;padding:15px 0px;}


/* 정리 */
    .con_none_table2{display: flex;justify-content: flex-start;width:70%;gap: 0.1em; margin: 0;}
    .Content_Text_Title {margin-top:40px;margin-bottom: 2em;  width: 100%; line-height: 36px;text-align: left;font: normal normal bold 24px/32px Pretendard;letter-spacing: -0.07px;color: #333333;}
    .Content_Text_Title_Desc {margin:0px; margin-bottom: 60px ;font: normal normal normal 16px/28px Pretendard;letter-spacing: -0.05px;color: #333333; }

    .Content_Text_Title_MO {margin-top:0px;margin-bottom: 0em;  width: 100%; line-height: 36px;text-align: left;font: normal normal bold 24px/32px Pretendard;letter-spacing: -0.07px;color: #333333;}
    .Content_Text_Title_Desc_MO {margin:0px ;font: normal normal normal 16px/28px Pretendard;letter-spacing: -0.05px;color: #333333; }

    
    .Content_Text_Box {width:100%;display: flex;flex-direction: column;border-radius: 10px;padding:0;margin-bottom: 2em;}
    .Content_Text_SubTitle {display: flex; align-items: center; font: normal normal bold 16px/28px Pretendard;letter-spacing: -0.05px;color: #333333;margin: 0px 0px 1.92307em 0px; }
    .Content_Text_SubText {margin:0px;margin-bottom: 20px; font: normal normal normal 16px/28px Pretendard;letter-spacing: -0.05px;color: #333333;}
    
    .Content_Text_Icon_Title {display: flex; align-items: center; font: normal normal bold 1em/1.25em Pretendard;letter-spacing: -0.05px;color: #333333;padding: 0px;margin: 0px 0px 2.8846em 0px;}
    .Content_Text_Icon_Title::before{ display: inline-block; content: '';background-repeat: no-repeat; width: 5.5vw; height: 5.5vw; background-size: cover;  margin-right: 6px;}
    
    .Content_Text_Main_Text{margin:0px;margin-bottom: 28px; font: normal normal normal 16px/22px Pretendard; letter-spacing: -0.05px;color: #333333;}
    .Content_Text_Main_Text > a {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
    
    .Content_Table_NoTitle{display: flex;justify-content: flex-start;width:100%;margin:0;}
    .Content_Table_Data{display: flex;align-items: center;text-align: left;font-size:1em;letter-spacing: -0.04px;color: #333333;margin-bottom:0;flex-wrap: wrap; margin-left: 0px; word-break: keep-all; line-height:1.5;}
    
    /* 테이블 정리 성순 2025.6.5  6월호 적용*/
    .Content_Table_Gap, .Content_Table_Gap2{display: flex;justify-content: flex-start;margin:0;}
    .Content_Table_GapData{display: flex;flex-grow: 0;flex-shrink: 1; align-items: flex-start;text-align: left;font-size:0.9em;line-height:1.2em;letter-spacing: -0.15px;color: #333333;margin: 0 0 10px 2px;flex-wrap: wrap;word-break: keep-all;}
    .Content_Table_GapData > span{margin: 0;}
    /* 끝 */

    /* 테이블 정리 성순 2025.7.10  10월호 적용*/
    .Content_Table_Gap2 > .Content_Table_GapData{display: flex;align-items: flex-start;text-align: left;font-size:1em;letter-spacing: -0.04px;;color: #333333;margin-bottom: 0px;flex-wrap: wrap; margin-left: 0px; word-break: keep-all; line-height:1.5;}

    /* 끝 */
    
    
    
    .Culture_Table{width:85%;padding: 1.25em 1.75em;margin: 1.25em 0;border-radius: 10px;}

    .Culture_List{display:flex;}
    .Culture_List > li {margin: 0;margin-right: 0.25em;}
    .Culture_List > li > div {width:100%}
    .Culture_List > li > div > img {width:100%;}

    .Culture_List_Box {flex:1 0 55%}
    .Culture_List_Text{display:flex;flex-direction: column;width:100%;font: normal normal normal 0.7em/1.2em Pretendard;letter-spacing: -0.06px;color: #333333;justify-content: space-between;height:100%}
    .Culture_List_Text > li {margin: 0;margin-left:1.25em; }
    .cultrue_link > p {display: inline-block; background-color: #fff; border-radius: 10px;padding: 0.8em;font-size: 0.8em;}
    
    .Content_Text_S{font-size: 14px;}

    .tempBox {height:2em;}
    .mo {display:none !important}
    /* 사연 */
    /* 이달의 사연 타이틀 */
    .content_april_title{width: 80%}
    .content_april_title > span{width:34vw; padding: 3vw;font-size:3.75vw}
    /* 말풍선 */
    .post_box{position: relative; display: flex;flex-direction: column; width:73%;margin: 5vw auto; padding: 5.81vw 6.27vw 0.1vw 7.08vw;border-radius: 20px;}
    .post_name{flex:0 0 20%;margin: 0;display: flex;align-self: flex-start;}
    .post_name > p {border-radius: 50%;height:17vw;width:17vw;text-align: center;line-height: 17vw;font-size: 3.35vw;font-weight: 600;margin-bottom: 2.1vw;}
    .post_story{flex:1 0 80%;margin: 0; font-size: 3.33vw; line-height: 2;display: flex; justify-content: center;flex-direction: column;}

    .post_tooltip-right{flex-direction: column-reverse;}
    .post_tooltip-right >.post_name{align-self: flex-end;}

    .post_tooltip-top::after {content: '';position: absolute;top: -5.8vw; left: 5.125vw;width: 0;height: 0;border: 3.083vw solid transparent;}
    .post_tooltip-right::after {content: '';position: absolute;top: 45%; right: -5.875vw;width: 0;height: 0;border: 3.083vw solid transparent;}
    .post_tooltip-left::after {content: '';position: absolute; top: 45%; left: -5.875vw;width: 0;height: 0;border: 3.083vw solid transparent;}

    /* .con_text06 {background-color: #dc5746;color: #FFFFFF;width: 80%;} */
}