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


/**/
body {
    font-size:18px;
    color:#222;
    font-family: "Noto Sans KR";
    box-sizing:border-box;
    overflow:hidden;
    word-break:keep-all;
}
.mircenter {
    width:100%;
    max-width:1600px;
    padding:0 20px;
    margin:0 auto;
}
.mirSebCenter {
    width:100%;
    max-width:1440px;
    padding:0 20px;
    margin:0 auto;
}
.subpage_title {
    font-size:1.66rem;
    font-weight:600;
    line-height:140%;
    color:#333;
    font-family:'Paperlogy';
    text-align:center;
    margin-bottom:80px;
}

/* 헤더 header */
#header {
    padding:0 80px;
    background-color:#fff;
    position:fixed;
    z-index: 99;
    left:0;
    top:0;
    width:100%;
    box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.05);
    transition:all .3s;
}
#header #hd_wrapper {
    display:flex;
    align-items:stretch;
    gap:80px;
    height: 125px;
    z-index:99;
    transition:all .3s;
}
#header #hd_wrapper .hd_wrap {
    display:flex;
    align-items:center;
    gap:80px;
    flex:1;
}
#header #logo {
    align-self:center;
}
#header #global {
    flex:1;
    height:100%;
}
#header #global .depth1 {
    display:flex;
    align-items:stretch;
    justify-content:space-between;
    height:100%;
}
#header #global .depth1 .dl1 {
    flex:1;
    text-align:center;
    position: relative;
    height:100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
#header #global .depth1 .dl1 .da1 {
    font-size:1.33rem;
    font-weight:500;
    height:100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
#header #global .depth2 {
    position:absolute;
    left:50%;
    top:123px;
    transform:translateX(-50%);
    z-index:101;
    width:185px;
    background-color:#fff;
    border-radius:30px;
    display:flex;
    flex-direction:column;
    border:1px solid #ddd;

    /* 초기 상태 */
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    padding: 0;
    transition: max-height 0.5s ease-out, opacity 0.3s ease-out, padding 0.3s ease-out;
}
#header #global .depth2::before {
    content:'';
    width:0;
    height:3px;
    background-color:#FF6568;
    position:absolute;
    left:50%;
    top:0;
    transform:translateX(-50%);
}
#header #global .depth2 .dl2 .da2 {
    display: block;
    padding:15px 0;
    font-size:1.11rem;
    font-weight:400;
    background-color:#fff;
}
#header #global .depth2 .dl2 .da2:hover {
    background-color:#FFF3EE;
    color:#FF6568;
    font-weight:700;
}
#header #global .depth1 .dl1:hover .da1 {
    color:#FF6568;
    font-weight:700;
}
#header #global .depth1 .dl1:hover .depth2{
    max-height: 500px; /* 아주 큰 값 설정 (실제 높이보다 커야 함) */
    opacity: 1;
    padding:20px 0;
}
#header #global .depth1 .dl1:hover .depth2::before {
    width:110px;
    transition:all .3s;
}
#header #header_btns {
    display:flex;
    align-items:stretch;
    align-self: center;
    gap:20px ;
}
#header #header_btns a,
#header #header_btns button {
    border:1px solid #ddd;
    border-radius:10px;
    width:75px;
    height:75px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    background-color:#fff;
}
#header #header_btns a p,
#header #header_btns button p {
    font-size:0.77rem;
    font-weight:500;
    letter-spacing:-0.42px;
    text-align:center;
}
#header #header_btns a:hover,
#header #header_btns button:hover {
    border-width:3px;
}


/* 섹션에 따른 header style .special_header */
#header.special_header {
    padding:0 175px;
    transition:all .3s;
}
#header.special_header #hd_wrapper {
    height:82px;
    transition:all .3s;
}
#header.special_header #global .depth1 .dl1 .da1 {
    font-size:1.22rem;
}
#header.special_header #global .depth2 {
    top:82px;
    min-width:180px;
}
#header.special_header #header_btns a,
#header.special_header #header_btns button {
    width:65px;
    height:65px;
}
#header.special_header #header_btns a p,
#header.special_header #header_btns button p {
    display:none;
}



/* 전체메뉴 allmenu */
#allmenu {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 0;
    opacity: 0;
    visibility: hidden;
    transition: height 0.5s ease, opacity 0.3s ease;
    overflow: hidden;
    z-index: 9999;
    background-image: url(../img/layout/allmenu_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
  }
  
  #allmenu.active {
    height: 100%;
    opacity: 1;
    visibility: visible;
  }
#allmenu .allmenu_wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    position: relative;
}
#allmenu .allmenu_wrapper .allmenu_title {
    display:none;
}
#allmenu .allmenu_wrapper .search {
    display:none;
}
#allmenu .allmenu_wrapper .allmenu_depth1 {
    display:flex;
    align-items:stretch;
    align-items:flex-start;
    justify-content:center;
    gap:50px;
    min-height: 650px;
}
#allmenu .allmenu_wrapper .allmenu_depth1 .dl1 {
    width:225px;
    text-align:center;
    padding-top:20px;
}
#allmenu .allmenu_wrapper .allmenu_depth1 .dl1 .da1 {
    font-family: 'Paperlogy';
    font-size:1.33rem;
    font-weight:600;
    letter-spacing:-0.72px;
    color:#FF6568;
    text-align:center;
    padding:20px 0;
    border-bottom:2px solid #FF6568;
    display: block;
}
#allmenu .allmenu_wrapper .allmenu_depth1 .depth2 {
    padding-top:30px;
}

#allmenu .allmenu_wrapper .allmenu_depth1 .depth2_wrap > ul {
    display:flex;
    flex-direction:column;
    gap:20px;
} 
#allmenu .allmenu_wrapper .allmenu_depth1 .depth2_wrap > ul .dl2 {
    display:flex;
    flex-direction:column;
    gap:10px;
}
#allmenu .allmenu_wrapper .allmenu_depth1 .depth2_wrap > ul .da2 {
    font-size:1rem;
    font-weight:700;
    letter-spacing:-0.54px;
}
#allmenu .allmenu_wrapper .allmenu_depth1 .depth2_wrap > ul .da2:hover {
    color:#FF6568;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
}
#allmenu .allmenu_wrapper .allmenu_depth1 .depth2_wrap .dl2_tab .dl2_taba {
    display:block;
    font-size:1rem;
    font-weight:400;
    letter-spacing:-0.54px;
    line-height:166%;
}
#allmenu .allmenu_wrapper .allmenu_depth1 .depth2_wrap .dl2_tab .dl2_taba:hover {
    color:#FF6568;
}
#allmenu .allmenu_wrapper .allmenu_close {
    width:75px;
    height:75px;
    position:absolute;
    right: 80px;
    top:50px;
    background:transparent;
    flex-direction:column;
    gap:2.5px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#allmenu .allmenu_wrapper .allmenu_close span {
    font-size:0.77rem;;
    font-weight:500;
    letter-spacing:-0.42px;
    text-align:center;
}
#allmenu .allmenu_user {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
}
#allmenu .allmenu_user a {
    border:2px solid #FF6568;
    border-radius:5px;
    padding:10px;
    color:#FF6568;
    font-size:0.88rem;
    font-weight:700;
    text-align:center;
    width:fit-content;
    display: block;
}


/* 풋터 하단 footer tail */
#footer {
    border-top:1px solid #ddd;
}
#footer .footer_wrapper .mircenter {
    display:flex;
    flex-direction:column;
}
#footer .footer_wrapper .family_site {
    display:flex;
    align-items:center;
    gap:30px;
}
#footer .footer_wrapper .family_site .family_slide {
    flex:1;
    width:calc(50% - 15px);
    padding-top:15px;
    padding-bottom:15px;
}
#footer .footer_wrapper .footer_top {
    display:flex;
    align-items:center;
    justify-content: space-between;
    padding-top:20px;
    padding-bottom:20px;
}
#footer .footer_wrapper .footer_top .footer_logo a {
    display:block;
}
#footer .footer_wrapper .footer_top .footer_btns {
    display:flex;
    align-items:center;
    gap:10px;
}
#footer .footer_wrapper .footer_top .footer_btns a {
    font-size:0.77rem;
    font-weight:400;
    color:#555;
    letter-spacing:-0.42px;
    border:1px solid #ddd;
    border-radius:5px;
    padding:8px 10px;
    display:block;
    width:fit-content;
}
footer .footer_wrapper .footer_bot {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-top:20px;
    margin-bottom:20px;
    border-top:1px solid #ddd;
} 
footer .footer_wrapper .footer_bot .footer_copyrights {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap:3px;
}
footer .footer_wrapper .footer_bot .footer_copyrights p {
    font-size:0.77rem;
    font-weight:400;
    line-height:157%;
    color:#666;
}
footer .footer_wrapper .footer_bot .footer_copyrights ul {
    display:flex;
    align-items:center;
    gap:10px;
}
footer .footer_wrapper .footer_bot .footer_copyrights ul li {
    font-size:0.77rem;
    font-weight:400;
    line-height:157%;
    color:#666;
}
footer .footer_wrapper .footer_bot .admin {
    font-size:0.77rem;
    font-weight:400;
    color:#555;
    letter-spacing:-0.42px;
    border:1px solid #ddd;
    border-radius:5px;
    padding:8px 10px;
    display:block;
    width:fit-content;
}


/* sns quick */
#sns_quick {
    position: fixed;
    top: 50%;
    right:43px;
    transform: translateY(-50%);
    z-index: 98;
}
#sns_quick ul {
    display:flex;
    flex-direction:column;
    gap:12px;
}
#sns_quick ul li a {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:60px;
    height:60px;
    border-radius:50%;
    background-color:#fff;
    border:2px solid #DDD;
}
#sns_quick ul .sns_insta a {
    border-color:#BE87E9;
}
#sns_quick ul .sns_youtube a {
    border-color:#FC6B67;
}
#sns_quick ul .sns_blog a {
    border-color:#93DE71;
}
#sns_quick ul .sns_kakao a {
    border-color:#F9D555;
}
#sns_quick ul .go_top a {
    border-color:#DDD;
}
#sns_quick ul .sns_insta a:hover {
    background-color:#BE87E9;
}
#sns_quick ul .sns_youtube a:hover {
    background-color:#FC6B67;
}
#sns_quick ul .sns_blog a:hover {
    background-color:#93DE71;
}
#sns_quick ul .sns_kakao a:hover {
    background-color:#F9D555;
}

#sns_quick ul .sns_insta a:hover path {
    fill:#fff;
}
#sns_quick ul .sns_youtube a:hover path {
    fill:#fff;
}
#sns_quick ul .sns_blog a:hover path {
    fill:#fff;
}
#sns_quick ul .sns_kakao a:hover path {
    fill:#fff;
}





/* 서브 타이틀 title */
#title {
    margin-bottom:115px;
}
#title .title_center {
    width:100%;
    max-width:1840px;
    padding:0 20px;
    margin:0 auto;
}
#title .title {
    border-radius:0 0 80px 80px;
    height:250px;
    position: relative;
}
#title .title::before {
    content:'';
    width:100%;
    height:100%;
    background-position:left bottom;
    background-repeat:no-repeat;
    border-radius: 0 0 80px 80px;
    position:absolute;
    left:0;
    bottom:0;
}
#title .title::after {
    content:'';
    width:100%;
    height:100%;
    background-position:right bottom;
    background-repeat:no-repeat;
    border-radius: 0 0 80px 80px;
    position:absolute;
    right:0;
    bottom:0;
}
#title .title .point_left {
    position:absolute;
    background-repeat:no-repeat;
}
#title .title .point_right {
    position:absolute;
    background-repeat:no-repeat;
}
#title .title .point_people {
    position:absolute;
    background-repeat:no-repeat;
}
#title .title .desc {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:15px;
    height:100%;
    position: relative;
    z-index: 2;
}
#title .title .desc h2 {
    font-size:2.33rem;
    font-weight:500;
    color:#333;
    line-height:104%;
    font-family:'Paperlogy';
    text-align:center;
    position: relative;
    top:-20px;
}
#title .title .desc .loc {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    border-radius:999px;
    padding:5px 10px;
    width:fit-content;
    position: relative;
    top:-20px;
}
#title .title .desc .loc li {
    font-size:0.88rem;
    font-weight:580;
    line-height:150%;
    letter-spacing:-0.48px;
    color:#fff;
}
#title .title .desc .loc li svg {
    vertical-align: middle;
}


#title .title .navi {}
#title .title .navi .navi_center {
    width:100%;
    max-width:1580px;
    padding:0 20px;
    margin:0 auto;
    height:68px;

    position: absolute;
    left:50%;
    bottom:-34px;
    transform:translateX(-50%);
    z-index: 10;
}
#title .title .navi .navi_center .subnavWrap {
    display:flex;
    align-items:stretch;
    justify-content:space-between;
    height:100%;
    background-color:#fff;
    border-radius:999px;
    box-shadow: 0px 0px 20px 0px rgba(255, 167, 168, 0.30);
}
#title .title .navi .navi_center .subnavWrap .nv1 {
    display:none;
}
#title .title .navi .navi_center .subnavWrap .nv2 {
    display:none;
}
#title .title .navi .navi_center .subnavWrap .nv3 {
    height:100%;
}
#title .title .navi .navi_center .subnavWrap .nv3 .naviBtn {
    display:none;
}
#title .title .navi .navi_center .subnavWrap .nv3 .navimenu {
    display:flex;
    align-items:stretch;
    height:100%;
}
#title .title .navi .navi_center .subnavWrap .nv3 .navimenu li {}
#title .title .navi .navi_center .subnavWrap .nv3 .navimenu li a {
    font-size:1.11rem;
    font-weight:400;
    line-height:140%;
    color:#333;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:0 40px;
    border-radius:999px;
    border:1px solid transparent;
    position: relative;
}
#title .title .navi .navi_center .subnavWrap .nv3 .navimenu li a::before {
    content:'';
    width:1px;
    height:20px;
    background-color:#666;
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
}
#title .title .navi .navi_center .subnavWrap .nv3 .navimenu li:first-child a::before {
    display:none;
}
#title .title .navi .navi_center .subnavWrap .nv3 .navimenu li.active a {
    border:1px solid #FF6568;
    color:#FF6568;
    font-weight:700;
}
#title .title .navi .navi_center .subnavWrap .nv3 .navimenu li.active a::before {
    display:none;
}
#title .title .navi .navi_center .subnavWrap .nv3 .navimenu li.active + li a::before {
    display:none;
}
#title .title .navi .navi_center .subnavWrap .option_btns {
    display:flex;
    align-items:stretch;
}
#title .title .navi .navi_center .subnavWrap .option_btns a {
    display:flex;
    align-items:center;
    justify-content:center;
    width:75px;
}
#title .title .navi .navi_center .subnavWrap .option_btns .print {
    border-radius:99px 0 0 99px;
    background-color:#F88E61;
}
#title .title .navi .navi_center .subnavWrap .option_btns .share {
    border-radius:0 99px 99px 0;
    background-color:#FF6568;
}




#title #st0 {
    background-color:#E8F6FF;
}
#title #st0::before {
    background-image:url(../img/layout/st0_bg_le.png);
    z-index: 1;
}
#title #st0::after {
    background-image:url(../img/layout/st0_bg_ri.png);
}
#title #st0  .navi .navi_center .subnavWrap {
    box-shadow: 0px 0px 20px 0px rgba(69, 167, 229, 0.15);
}
#title #st0 .navi .navi_center .subnavWrap .nv3 .navimenu li.active a {
    border:1px solid #45A7E5;
    color:#45A7E5;
}
#title #st0 .navi .navi_center .subnavWrap .option_btns .print {
    background-color:#92CD73;
}
#title #st0 .navi .navi_center .subnavWrap .option_btns .share {
    background-color:#45A7E5;
}
#title #st0 .point_left {
    left:197px;
    top:0px;
    background-image:url(../img/layout/st0_point_le.png);
    width:129px;;
    height:154px;
    animation: st0_point_left 5s ease-in-out infinite;
}
#title #st0 .point_right {
    right: 215px;
    top: -20px;
    background-image:url(../img/layout/st0_point_ri.png);
    width:182px;
    height:165px;
    animation: st0_point_right 5s ease-in-out infinite;
    z-index: 1;
}
#title #st0 .point_people {
    right:322px;
    bottom:0px;
    background-image:url(../img/layout/st0_people.png);
    width:326px;
    height:215px;
    z-index:1;
    animation: st0_point_people 5s linear infinite;
}
#title #st0 .loc {
    background-color:#45A7E5;
}
#title #st0  .navi .navi_center .subnavWrap .nv3 .naviBtn svg path {
    fill:#45A7E5;
}



#title #st1 {
    background-color:#E2FAEF;
}
#title #st1::before {
    background-image:url(../img/layout/st1_bg_le.png);
    z-index: 1;
}
#title #st1::after {
    background-image:url(../img/layout/st1_bg_ri.png);
}
#title #st1  .navi .navi_center .subnavWrap {
    box-shadow: 0px 0px 20px 0px rgba(99, 175, 140, 0.15);
}
#title #st1 .navi .navi_center .subnavWrap .nv3 .navimenu li.active a {
    border:1px solid #63AF8C;
    color:#63AF8C;
}
#title #st1 .navi .navi_center .subnavWrap .option_btns .print {
    background-color:#816255;
}
#title #st1 .navi .navi_center .subnavWrap .option_btns .share {
    background-color:#63AF8C;
}
#title #st1 .point_left {
    left:118px;
    top:35px;
    background-image:url(../img/layout/st1_point_le.png);
    width:163px;;
    height:89px;
    animation: st1_point_left 5s infinite linear;
}
#title #st1 .point_right {
    right:148px;
    top:36px;
    background-image:url(../img/layout/st1_point_ri.png);
    width:157px;
    height:117px;
    animation: st1_point_right 5s infinite linear;
}
#title #st1 .point_people {
    right:295px;
    bottom:0px;
    background-image:url(../img/layout/st1_people.png);
    width:395px;
    height:213px;
    z-index:1;
    animation: st1_point_people 5s linear infinite;
}
#title #st1 .loc {
    background-color:#63AF8C;
}
#title #st1  .navi .navi_center .subnavWrap .nv3 .naviBtn svg path {
    fill:#63AF8C;
}


#title #st2 {
    background-color:#E4F3DB;
}
#title #st2::before {
    background-image:url(../img/layout/st2_bg_le.png);
    z-index: 1;
}
#title #st2::after {
    background-image:url(../img/layout/st2_bg_ri.png);
}
#title #st2  .navi .navi_center .subnavWrap {
    box-shadow: 0px 0px 20px 0px rgba(124, 179, 91, 0.15);
}
#title #st2 .navi .navi_center .subnavWrap .nv3 .navimenu li.active a {
    border:1px solid #7CB35B;
    color:#7CB35B;
}
#title #st2 .navi .navi_center .subnavWrap .option_btns .print {
    background-color:#FFB855;
}
#title #st2 .navi .navi_center .subnavWrap .option_btns .share {
    background-color:#7CB35B;
}
#title #st2 .point_left {
    left:140px;
    top:25px;
    background-image:url(../img/layout/st2_point_le.png);
    width:278px;;
    height:130px;
    animation: st2_point_left 4s infinite linear;
}
#title #st2 .point_right {
    right:23px;
    top:18px;
    background-image:url(../img/layout/st2_point_ri.png);
    width:278px;
    height:130px;
    animation: st2_point_right 4s infinite linear;
}
#title #st2 .point_people {
    right:349px;
    bottom:0px;
    background-image:url(../img/layout/st2_people.png);
    width:293px;
    height:213px;
    z-index:1;
    animation: st2_point_people 5s linear infinite;
}
#title #st2 .loc {
    background-color:#7CB35B;
}
#title #st2  .navi .navi_center .subnavWrap .nv3 .naviBtn svg path {
    fill:#7CB35B;
}



#title #st3 {
    background-color:#FFF6D9;
}
#title #st3::before {
    background-image:url(../img/layout/st3_bg_le.png);
    z-index: 1;
}
#title #st3::after {
    background-image:url(../img/layout/st3_bg_ri.png);
}
#title #st3  .navi .navi_center .subnavWrap {
    box-shadow: 0px 0px 20px 0px rgba(255, 177, 69, 0.15);
}
#title #st3 .navi .navi_center .subnavWrap .nv3 .navimenu li.active a {
    border:1px solid #FFA01D;
    color:#FFA01D;
}
#title #st3 .navi .navi_center .subnavWrap .option_btns .print {
    background-color:#9A654E;
}
#title #st3 .navi .navi_center .subnavWrap .option_btns .share {
    background-color:#FFB145;
}
#title #st3 .point_left {
    left:80px;
    top:0;
    background-image:url(../img/layout/st3_point_le.png);
    width:307px;;
    height:127px;
    animation: st3_point_left 5s infinite linear;
}
#title #st3 .point_right {
    right: 165px;
    top: 15px;
    background-image:url(../img/layout/st3_point_ri.png);
    width:170px;
    height:106px;
    animation: st3_point_right 5s infinite linear;
}
#title #st3 .point_people {
    right:349px;
    bottom:0px;
    background-image:url(../img/layout/st3_people.png);
    width:293px;
    height:213px;
    z-index:1;
    animation: st3_point_people 5s linear infinite;
}
#title #st3 .loc {
    background-color:#FFB145;
}
#title #st3  .navi .navi_center .subnavWrap .nv3 .naviBtn svg path {
    fill:#FFB145;
}


#title #st4 {
    background-color:#F3F1FF;
}
#title #st4::before {
    background-image:url(../img/layout/st4_bg_le.png);
}
#title #st4::after {
    background-image:url(../img/layout/st4_bg_ri.png);
}
#title #st4  .navi .navi_center .subnavWrap {
    box-shadow: 0px 0px 20px 0px rgba(133, 118, 226, 0.15);
}
#title #st4 .navi .navi_center .subnavWrap .nv3 .navimenu li.active a {
    border:1px solid #8576E2;
    color:#8576E2;
}
#title #st4 .navi .navi_center .subnavWrap .option_btns .print {
    background-color:#81B863;
}
#title #st4 .navi .navi_center .subnavWrap .option_btns .share {
    background-color:#8576E2;
}
#title #st4 .point_left {
    left: 100px;
    top: 30px;
    background-image:url(../img/layout/st4_point_le.png);
    width:188px;;
    height:115px;
    animation: st4_point_left 5s infinite linear;
    z-index: 1;
}
#title #st4 .point_right {
    right: 160px;
    top: 20px;
    background-image:url(../img/layout/st4_point_ri.png);
    width:161px;
    height:172px;
    animation: st4_point_right 5s infinite linear;
    z-index: 1;
}
#title #st4 .point_people {
    right:295px;
    bottom:10px;
    background-image:url(../img/layout/st4_people.png);
    width:338px;
    height:192px;
    z-index:1;
    animation: st4_point_people 5s linear infinite;
}
#title #st4 .loc {
    background-color:#8576E2;
}
#title #st4  .navi .navi_center .subnavWrap .nv3 .naviBtn svg path {
    fill:#8576E2;
}



#title #st5 {
    background-color:#FFE4D9;
}
#title #st5::before {
    background-image:url(../img/layout/st5_bg_le.png);
}
#title #st5::after {
    background-image:url(../img/layout/st5_bg_ri.png);
}
#title #st5  .navi .navi_center .subnavWrap {
    box-shadow: 0px 0px 20px 0px rgba(255, 167, 168, 0.30);
}
#title #st5 .navi .navi_center .subnavWrap .nv3 .navimenu li.active a {
    border:1px solid #FF6568;
    color:#FF6568;
}
#title #st5 .navi .navi_center .subnavWrap .option_btns .print {
    background-color:#F88E61;
}
#title #st5 .navi .navi_center .subnavWrap .option_btns .share {
    background-color:#FF6568;
}
#title #st5 .point_left {
    left:150px;
    top:59px;
    background-image:url(../img/layout/st5_point_le.png);
    width:56px;;
    height:75px;
    animation: st5_point_left 5s infinite linear;
}
#title #st5 .point_right {
    right:185px;
    top:20px;
    background-image:url(../img/layout/st5_point_ri.png);
    width:56px;
    height:82px;
    animation: st5_point_right 5s infinite linear;
}
#title #st5 .point_people {
    right:236px;
    bottom:0;
    background-image:url(../img/layout/st5_people.png);
    width:516px;
    height:230px;
    z-index:1;
    animation: st5_point_people 5s linear infinite;
}
#title #st5 .loc {
    background-color:#FF8B6E;
}
#title #st5  .navi .navi_center .subnavWrap .nv3 .naviBtn svg path {
    fill:#FF8B6E;
}












/* -------------- 반응형 미디어쿼리 css ------------- */
@media (max-width: 1680px) {
    #header,
    #header.special_header {
        padding:0 40px;
    }
    #header #hd_wrapper .hd_wrap,
    #header.special_header #hd_wrapper .hd_wrap {
        gap:40px;
    }
    #header #hd_wrapper,
    #header.special_header #hd_wrapper {
        gap:40px;
    }

    #allmenu .allmenu_wrapper {
        padding-left:10px;
        padding-right:10px;
    }
    #allmenu .allmenu_wrapper .allmenu_close {
        right: 30px;
    }


    #sns_quick {
        right:10px;
    }
    #sns_quick ul li a {
        width:50px;
        height:50px;
    }
    #sns_quick ul li:not(.go_top) a svg {
        width:28px;
        height:28px;
    }
    #sns_quick ul .go_top  {
        font-size:14px;
    }




    #title #st0 .point_people,
    #title #st1 .point_people,
    #title #st2 .point_people,
    #title #st3 .point_people,
    #title #st4 .point_people,
    #title #st5 .point_people {
        right:200px;
    }
}
@media (max-width: 1440px) {
    body {
        font-size:17px;
    }
    .subpage_title {
        margin-bottom:65px;
    }


    #header, 
    #header.special_header {
        padding:0 20px;
    }
    #header #hd_wrapper {
        height:100px;
        gap:20px;
    }
    #header #hd_wrapper .hd_wrap {
        gap:20px;
    }
    #header #logo {
        width:200px;
    }
    #header #logo img {
        width:100%;
    }
    #header #header_btns {
        gap:10px;
    }
    #header #header_btns a, 
    #header #header_btns button {
        width:65px;
        height:65px;
        gap: 5px;
    }
    #header #header_btns a svg, 
    #header #header_btns button svg {
        width:20px;
        height:20px;
    }
    #header #global .depth1 .dl1 .da1 {
        font-size:1.11rem;
    }
    #header #global .depth2 {
        top:100px;
    }
    #header #global .depth2 .dl2 .da2 {
        font-size:1rem;
        padding:10px 0;
    }


    #allmenu .allmenu_wrapper .allmenu_depth1 {
        gap:30px;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .dl1 {
        width: auto;
        flex: 1;
    }



    #title {
        margin-bottom:85px;
    }
    #title .title .navi .navi_center {
        height:60px;
        bottom:-15px;
    }
    #title .title .navi .navi_center .subnavWrap .nv3 .navimenu li a {
        padding:0 25px;
        font-size:1rem;
    }
    #title .title .navi .navi_center .subnavWrap .option_btns a {
        width:60px;
    }


    #title #st0::before,
    #title #st0::after {
        background-size:auto 70%;
    }
    #title #st1::before,
    #title #st1::after {
        background-size:auto 70%;
    }
    #title #st2::before,
    #title #st2::after {
        background-size:auto 70%;
    }
    #title #st3::before,
    #title #st3::after {
        background-size:auto 80%;
    }
    #title #st4::before,
    #title #st4::after {
        background-size:auto 100%;
    }
    #title #st5::before,
    #title #st5::after {
        background-size:auto 50%;
    }


    #title #st0 .point_people,
    #title #st1 .point_people,
    #title #st2 .point_people,
    #title #st3 .point_people,
    #title #st4 .point_people,
    #title #st5 .point_people {
        display:none;
    }

}
@media (max-width: 1200px) {

    .mircenter {
        padding-left:10px;
        padding-right:10px;
    }
    .mirSebCenter {
        padding-left:10px;
        padding-right:10px;
    }
    .subpage_title {
        margin-bottom:45px;
    }

    #header #logo {
        width:180px;
    }
    #header #header_btns a, 
    #header #header_btns button,
    #header.special_header #header_btns a, 
    #header.special_header #header_btns button {
        width:55px;
        height:55px;
        gap: 3px;
    }

    #title {
        margin-bottom:65px;
    }
    #title .title_center {
        padding-left:10px;
        padding-right:10px;
    }

}
@media (max-width: 1024px) {
    body {
        overflow-y:scroll;
    }


    #header #hd_wrapper {
        height:80px;
    }
    #header #global {
        display:none;
    }
    #header #header_btns .logout,
    #header #header_btns .login,
    #header #header_btns .join,
    #header #header_btns .allsearch {
        display: none;
    }
    #header #header_btns .header_btn_allmenu p {
        display:none;
    } 


    #allmenu {
        overflow-y:scroll;
        background-image:none;
        background-color: #fff;
    }
    #allmenu .allmenu_wrapper {
        gap: 0;
        height: 100vh;
        justify-content: flex-start;
        padding-left:0;
        padding-right:0;
    }
    #allmenu .allmenu_wrapper .allmenu_title {
        font-size:1.11rem;
        font-weight:600;
        color:#fff;
        background-image:none;
        padding:30px;
        width:100%;
        background-color:#FF6568;
        display:flex;
        align-items:center;
        justify-content:flex-start;
        border-radius:0 0 20px 20px;
        height:auto;
    }

    #allmenu .allmenu_wrapper .search {
        display:block;
        padding:20px 20px 10px;;
        width:100%;
    }
    #allmenu .allmenu_wrapper .search fieldset {
        display:flex;
        align-items: stretch;
        border:2px solid #FF6568;
        border-radius:999px;
        width:100%;
    }
    #allmenu .allmenu_wrapper .search fieldset input {
        padding:15px;
        border-radius:999px;
        flex:1;
    }
    #allmenu .allmenu_wrapper .search fieldset button {
        background-color:#FF6568;
        width:50px;
        height:50px;
        border-radius:999px;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 {
        max-width:100%;
        width: 100%;
        flex-direction:column;
        gap:0;
        min-height:auto;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .dl1 {
        flex-direction:column;
        gap:0;
        padding: 0;
        width:100%;
        text-align:left;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .dl1 .da1 {
        width:100%;
        padding:30px;
        font-size:1.11rem;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='18' viewBox='0 0 10 18' fill='none'%3E%3Cpath d='M4.41064e-07 8.99997C4.55165e-07 8.67737 0.120048 8.35482 0.359638 8.10887L7.90281 0.369255C8.38264 -0.123085 9.16062 -0.123085 9.64027 0.369255C10.1199 0.861396 10.1199 1.65948 9.64027 2.15186L2.96565 8.99997L9.64003 15.8481C10.1197 16.3405 10.1197 17.1385 9.64003 17.6306C9.16039 18.1231 8.38241 18.1231 7.90257 17.6306L0.359404 9.89107C0.119776 9.645 4.26968e-07 9.32245 4.41064e-07 8.99997Z' fill='%23FF6568'/%3E%3C/svg%3E");
        background-repeat:no-repeat;
        background-position:right 30px center;
        text-align:left;
        border-bottom:none;
        color:#222;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .dl1.active .da1 {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='10' viewBox='0 0 18 10' fill='none'%3E%3Cpath d='M8.99997 10C8.67737 10 8.35482 9.87995 8.10887 9.64036L0.369255 2.09719C-0.123085 1.61736 -0.123085 0.839379 0.369255 0.359734C0.861396 -0.119911 1.65948 -0.119911 2.15186 0.359734L8.99997 7.03435L15.8481 0.359968C16.3405 -0.119677 17.1385 -0.119677 17.6306 0.359968C18.1231 0.839613 18.1231 1.61759 17.6306 2.09743L9.89107 9.6406C9.645 9.88022 9.32245 10 8.99997 10Z' fill='%23FF6568'/%3E%3C/svg%3E");
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .depth2 ul {
        flex-direction:column;
        gap:0;
        background-color:#FFF8EC;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .depth2 {
        width:100%;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
        padding-top:0;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .depth2 .dl2 {
        width:100%;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .depth2 .dl2:first-child {
        padding-top:10px;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .depth2 .dl2:last-child {
        padding-bottom:10px;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .depth2 .dl2 .da2 {
        display:block;
        padding:20px 40px;
        font-size:0.97rem;
    }
    #allmenu .allmenu_wrapper .allmenu_depth1 .depth2 .dl2 .dl2_tab {
        display:none;
    }

    #allmenu .allmenu_wrapper .allmenu_close {
        width:35px;
        height:35px;
        right:20px;
        top:25px;
    }
    #allmenu .allmenu_wrapper .allmenu_close svg path {
        fill:#fff;
    }
    #allmenu .allmenu_wrapper .allmenu_close span {
        display:none;
    }
    #allmenu .allmenu_user {
        margin-top:50px;
        margin-bottom:50px;
    }



    #footer .footer_wrapper .family_site {
        flex-direction:column;
        gap:20px;
    }
    #footer .footer_wrapper .family_site .family_slide {
        width:100%;
    }
    #footer .footer_wrapper .family_site .family_slide.hanultari {
        padding-bottom:0;
    }
    #footer .footer_wrapper .family_site .family_slide.related {
        padding-top:0;
    }
    #footer .footer_wrapper .footer_top {
        flex-direction:column;
        gap:20px;
        padding-bottom:15px;
    }
    footer .footer_wrapper .footer_bot {
        flex-wrap: wrap;
    }
    footer .footer_wrapper .footer_bot .footer_copyrights ul {
        gap:3px;
        flex-wrap: wrap;
    }

    #sns_quick {
        position:unset;
        transform:unset;
        margin-bottom:15px;
    }
    #sns_quick ul {
        flex-direction: row;
        justify-content: center
    }



    #title .title {
        height:200px;
    }
    #title .title .desc h2 {
        font-size: 2rem;
    }
    #title .title .desc .loc li {
        font-size:0.77rem;
    }
    #title .title .navi .navi_center .subnavWrap .naviBar {
        width:100%;
    }
    #title .title .navi .navi_center .subnavWrap .nv3 .naviBtn {
        text-align: left;
        padding: 0 40px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        font-size:1rem;
        height: 100%;
        background: transparent;
    }
    #title .title .navi .navi_center .subnavWrap .nv3 .navimenu {
        flex-direction: column;
        background-color: #fff;
        border-radius: 30px;
        height: auto;
        border: 1px solid #FF6568;
        padding: 10px;
    }
    #title .title .navi .navi_center .subnavWrap .nv3 .navimenu li a {
        padding:10px 30px;
        text-align:left;
        justify-content: flex-start;
    }
    #title .title .navi .navi_center .subnavWrap .nv3 .navimenu li a::before {
        display:none;
    }
    #title .title .navi .navi_center .subnavWrap .nv3 .navimenu li.active a {
        border:none;
    }
    #title .title .navi .navi_center .subnavWrap .option_btns {
        display:none;
    }

    #title #st0 .navi .navi_center .subnavWrap .nv3 .navimenu {
        border-color:#45A7E5;
    }
    #title #st1 .navi .navi_center .subnavWrap .nv3 .navimenu {
        border-color:#63AF8C;
    }
    #title #st2 .navi .navi_center .subnavWrap .nv3 .navimenu {
        border-color:#7CB35B;
    }
    #title #st3 .navi .navi_center .subnavWrap .nv3 .navimenu {
        border-color:#FFB145;
    }
    #title #st4 .navi .navi_center .subnavWrap .nv3 .navimenu {
        border-color:#8576E2;
    }
    #title #st5 .navi .navi_center .subnavWrap .nv3 .navimenu {
        border-color:#FF8B6E;
    }

}
@media (max-width: 991px) {}
@media (max-width: 768px) {
    body {
        font-size:16px;
    }


    #title .title::before,
    #title .title::after {
        display:none;
    }

    #title #st0 .point_left,
    #title #st0 .point_right,
    #title #st1 .point_left,
    #title #st1 .point_right,
    #title #st2 .point_left,
    #title #st2 .point_right,
    #title #st3 .point_left,
    #title #st3 .point_right,
    #title #st4 .point_left,
    #title #st4 .point_right,
    #title #st5 .point_left,
    #title #st5 .point_right {
        display:none;
    }
}
@media (max-width: 640px) {
    #header #hd_wrapper {
        height:60px;
        position: relative;
    }
    
    #header #logo {
        width:155px;
    }
    #header #header_btns a, 
    #header #header_btns button, 
    #header.special_header #header_btns a, 
    #header.special_header #header_btns button {
        width:45px;
        height:45px;
    }
    #header #header_btns button {
        position:absolute;
        right:0;
        top:50%;
        transform:translateY(-50%);
    }

    #footer .footer_wrapper .footer_top .footer_logo a {
        width:200px;
    }
    #footer .footer_wrapper .footer_top .footer_logo a img {
        width:100%;
    }
    #footer .footer_wrapper .footer_top .footer_btns a {
        font-size:12px;
        letter-spacing:-0.39px;
    }


    #title .title {
        border-radius:0 0 50px 50px ;
    }

}
@media (max-width: 480px) {}
@media (max-width: 320px) {}