@charset "utf-8";

#index .main_title {
    font-size:2rem;
    font-weight:400;
    text-align:center;
}
#index .main_title span {
    font-weight:800;
}

#section01 {
    background: rgb(85,170,232);
    background: linear-gradient(64deg, rgba(85,170,232,0.2) 0%, rgba(52,93,216,0.2) 100%);
    padding-top:80px;
    padding-bottom:90px;
}
#section01 .sec01 {
    display:flex;
    align-items:center;
    gap:50px;
}
#direct {
    flex:1;
    display:flex;
    flex-direction:column;
    gap:25px;
}
#direct .search {
    display:flex;
    flex-direction:column;
    gap:25px;
}
#direct .search h2 {
    font-size:2rem;
    font-weight:700;
    text-shadow:0px 4px 4px rgba(0, 0, 0, 0.05);
}
#direct .search fieldset {
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #5071DE;
    overflow: hidden;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
}
#direct .search fieldset input {
    padding: 5px 30px;
    flex: 1;
    padding-block: unset;
    background-color: #fff;
    height: 80px;
    border: 2px solid #5071DE;
    border-radius: 10px 0 0 10px;
    width:100%;
}
#direct .search fieldset button {
    width: 80px;
    background-color: #5071DE;
    border: unset;
    padding: 25px 0;
    display: block;
}
#direct .quick {
    display:flex;
    flex-direction:column;
    gap:20px;
}
#direct .quick .quick_wrap {
    display:flex;
    align-items:center;
    gap:20px;
}
#direct .quick .quick_wrap .quick_box {
    flex:1 0 0;
    align-self: stretch;
    border:1px solid #ccc;
    border-radius:10px;
    background-color:#fff;
    display:flex;
    flex-direction: column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:15px;
    padding:25px 0;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
}
#direct .quick .quick_wrap .quick_box p {
    font-size:1.11rem;
    font-weight:400;
}
#direct .quick .quick_wrap .quick_box:hover {
    border-color:#5071DE;
    background-color:#FAFEFF;
    transition:all .3s;
}
#visual {
    width:830px;
}
#visual .visual_bnn {
    position: relative;
    border-radius:50px;
    overflow:hidden;
    box-shadow: 0px 10px 25px 0px #C5DBFF;
}
#visual .splide__track {

}
#visual .splide__track .splide__slide .txt img {
    width:100%;
}
#visual .pop_arrow_wrap {
    position:absolute;
    right:0;
    bottom:0;
    border-radius: 50px 0px 50px 50px;
    background: rgba(255, 255, 255, 0.70);
    padding:10px 30px;
}
#visual .pop_arrow_wrap .splide__arrows {
    display:flex;
    align-items:center;
    gap:15px;
}
#visual .pop_arrow_wrap .splide__arrows .slideCounter {
    background-color:#3E3F59;
    font-size:1rem;
    font-weight:700;
    color:#fff;
    padding:5px 20px;
    border-radius:30px;
}
#visual .pop_arrow_wrap .splide__arrows .control_btn_wrap {
    display:flex;
    align-items:center;
    gap:15px;
}
#visual .pop_arrow_wrap .splide__arrows .splide__arrow {
    display: flex;
    opacity:1;
    padding: 0;
    position: unset;
    transform:unset;
    width: 30px;
    height:30px;
    background-color:#fff;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.10);
    background-repeat:no-repeat;
    background-position:center center;
}
#visual .pop_arrow_wrap .splide__arrows .splide__arrow--prev {
    background-image:url(../img/main/bnn_prev.png);
}
#visual .pop_arrow_wrap .splide__arrows .splide__arrow--next {
    background-image:url(../img/main/bnn_next.png);
}
#visual .pop_arrow_wrap .splide__arrows .splide__toggle {
    opacity:1;
    padding: 0;
    position: unset;
    transform:unset;
    width: 30px;
    height:30px;
    background-color:#fff;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.10);
    border:none;
    border-radius:50%;
}


#section02 {
    margin:130px 0;
}
#section02 .sec02 {
    margin-top:50px;
    display:flex;
    align-items:flex-end;
    gap:20px;
}
#section02 .part_title {
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:20px;
}
#section02 .part_title h3 {
    font-size:1.11rem;
    font-weight:700;
}
#section02 .part_title .part_more {
    font-size:0.88rem;
    font-weight:700;
    color:#fff;
    background-color:#3E3F59;
    border-radius:20px;
    padding:5px 10px;
    display:block;
    border:2px solid #3e3f59;
    transition:all .2s;
}
#section02 .part_title .part_more:hover {
    background-color:#fff;
    color:#3e3f59;
    transition:all .2s;
}
#section02 .sec02_cont {}
#section02 .sec02_cont .story_gallery {
    display:flex;
    align-items:center;
    gap:20px;
}
#section02 .sec02_cont .story_gallery .gallery_box {
    flex:1;
}
#section02 .sec02_cont .story_gallery .gallery_box .inner {
    border-radius: 10px 10px 20px 20px;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
    overflow:hidden;
    display:block;
    transition:all .3s;
}
#section02 .sec02_cont .story_gallery .gallery_box .inner img {
    transition:all .3s;
}
#section02 .sec02_cont .story_gallery .gallery_box .inner:hover {
    box-shadow:0px 4px 10px 0px rgb(51 126 189 / 46%);
    transition:all .3s;
}
#section02 .sec02_cont .story_gallery .gallery_box .inner:hover img {
    transform: scale(1.08);
    transition:all .3s;
}
#section02 .sec02_cont .story_gallery .gallery_box .inncontent {
    padding:25px 20px;
    position: relative;
    z-index: 1;
    background-color:#fff;
}
#section02 .sec02_cont .story_gallery .gallery_box .inncontent .tit {
    font-size:0.88rem;
    font-weight:700;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    min-height:38px;
}
#store {
    flex:1;
}
#photo {
    flex:1;
}


#section03 {
    background-color:#F7F7F7;
    padding:70px 0 80px;
}
#section03 .sec03 {
    margin-top:50px;
    display:flex;
    align-items:flex-start;
    gap:40px;
}
#section03 .sec03_wrap {
    flex:1;
    display:flex;
    align-items:flex-start;
    gap:20px;
}
#notice {
    width:800px;
    background-color:#fff;
    border-radius:10px 0 0 10px;
    border-top:5px solid #5fabe7;
    overflow:hidden;
}
#notice .titleline {
    display:flex;
    align-items: stretch;
}
#notice .titleline .title_tab {
    padding:40px 20px;
    background-color:#5fabe7;
    border-radius:0 10px 30px 0;
    background-repeat:no-repeat;
    background-position:left bottom;
    background-image:url(../img/main/notice_icon.png);
    display:flex;
    flex-direction:column;
    gap:10px;
}
#notice .titleline .title_tab .title_tabs {
    font-size:1.11rem;
    font-weight:700;
    color:#fff;
    display:block;
    padding:10px 15px;
    position: relative;
    z-index:2;
    width:140px;
    cursor: pointer;
}
#notice .titleline .title_tab .title_tabs::after {
    content:'';
    background-image:url(../img/main/tab_arrow.png);
    background-repeat:no-repeat;
    background-position:right center;
    background-color:#fff;
    border-radius:10px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
    width:155px;
    height:100%;
    position:absolute;
    left:-15px;
    top:0;
    z-index:-1;
    opacity:0;
}
#notice .titleline .title_tab .title_tabs.mtlt_sel {
    color:#333;
    left:15px;
}
#notice .titleline .title_tab .title_tabs.mtlt_sel::after {
    opacity:1;
    left:0;
    transition:all .2s;
}
#notice .titleline .mtl_contentBox {
    width: calc(100% - 180px);
    min-height:400px;
}
#notice .titleline .notice_board {
    padding-left:10px;
}
#notice .titleline .notice_board .nb_list .nbl_first {
    padding:30px 0;
    border-bottom:1px solid #ddd;
}
#notice .titleline .notice_board .nb_list .board_link {
    display:block;
    padding:0 20px;
} 
#notice .titleline .notice_board .nb_list .board_link:hover .nblf_subject,
#notice .titleline .notice_board .nb_list .board_link:hover .nb_subject {
    text-decoration:underline;
}
#notice .titleline .notice_board .nb_list .nblf_box {
    display:flex;
    align-items:center;    
    gap:15px;
}
#notice .titleline .notice_board .nb_list .nblf_box .nblf_date {
    border-radius:10px;
    background-color:#3E3F59;
    width:92px;
    text-align:center;
    padding:13px 0;
}
#notice .titleline .notice_board .nb_list .nblf_box .nblf_date span {
    font-size:2.33rem;
    color:#fff;
    font-weight:600;
}
#notice .titleline .notice_board .nb_list .nblf_box .nblf_date p {
    font-size:14px;
    font-weight:600;
    color:#fff;
}
#notice .titleline .notice_board .nb_list .nblf_box .nblf_contxt {
    width:calc(100% - 110px);
}
#notice .titleline .notice_board .nblf_subject {
    font-size:1.11rem;
    font-weight:700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#notice .titleline .notice_board .nb_content {
    margin-top:10px;
    font-size:0.88rem;
    color:#444;
    font-weight:400;
    line-height:1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
#notice .titleline .notice_board .nbl_normal {
    border-bottom:1px solid #ddd;
}
#notice .titleline .notice_board .nbl_normal:last-child {
    border-bottom:none;
}
#notice .titleline .notice_board .nbln_box {
    display:flex;
    justify-content:space-between;
    padding:20px 0;
    position: relative;
    padding-left:20px;
}
#notice .titleline .notice_board .nbln_box::before {
    content:'';
    width:10px;
    height:10px;
    background-color:#5FABE7;
    border-radius:50%;
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
}
#notice .titleline .notice_board .nbln_box .nb_subject {
    flex:1;
    font-weight:700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;  /* 말줄임 적용 */
}
#ebook {
    flex:1;
}
#ebook .ebook_board {
    background-color:#D6EEFF;
    border-radius:20px;
    padding:20px;
}
#ebook .ebook_board .img {
    overflow: hidden;
    max-height: 320px;
    border-radius: 20px;
    width: fit-content;
    margin: 0 auto;
}
#ebook .ebook_board .img img {
    border-radius:20px;
    margin-top:-15px;
}
#ebook .ebook_board .box_title {
    background-color:#fff;
    border-radius:0 0 20px 20px;
    text-align:center;
    padding:15px 20px;
    width:fit-content;
    margin:0 auto;
}
#ebook .ebook_board .box_title p {
    font-size:0.88rem;
    font-weight:700;
    color:#777;
}
#ebook .ebook_board a:hover .box_title p {
    color:#268ADC;
}

#food {
    flex:1;
}
#food .ix_box {
    border-radius: 20px;
    background: #5071DE;
    padding:30px 20px 90px;
    background-image:url(../img/main/food.png);
    background-repeat:no-repeat;
    background-position:84% 92%;
}
#food .ix_box .ix_Tit {
    background-color:#fff;
    border-radius:50px;
    padding:10px 20px;
    width:fit-content;
}
#food .ix_box .ix_Tit h2 {
    font-size:1.11rem;
    font-weight:700;
}
#food .ix_box .mo_btn {
    display:none;
}
#food .ix_box .ix_content {
    border-radius: 10px;
    background: #3253BC;
    padding:10px;
    height:165px;
    overflow-y:scroll;
    color:#fff;
    font-size:1rem;
    font-weight:700;
    line-height:2;
    margin-top:20px;
}
#food .ix_box .ix_content::-webkit-scrollbar {
    width: 5px;
}
#food .ix_box .ix_content::-webkit-scrollbar-thumb {
    background-color: #BDBDBD;
}
#food .ix_box .ix_content::-webkit-scrollbar-track {
    background-color: #fff;
}
#food .ix_box .ix_more {
    margin-top:20px;
}
#food .ix_box .ix_more .more_btn {
    background-color:#333;
    border-radius:50px;;
    padding:10px 20px;
    color:#fff;
    display:block;
    font-weight:0.88;
    font-weight:800;
    width:fit-content;
    border:3px solid transparent;
}
#food .ix_box .ix_more .more_btn:hover {
    border-color:#333;
    background-color:#fff;
    color:#333;
    transition:all .3s;
}

#section04 {
    padding:120px 0;
}
#gallery {
    width:100%;
    max-width:1600px;
    padding:0;
    margin:0 auto;
}
#gallery .splide {
    margin-top:20px;
}
#gallery .splide .splide__arrows {
    display:flex;
    align-items:center;
    justify-content: center;
    gap:15px;
}
#gallery .splide .splide__arrows button {
    width:50px;
    height:50px;
    border-radius:50%;
    position:unset;
    transform:unset;
    border:1px solid #ddd;
    background-color:#fff;
    opacity:1;
    display:block;
    background-repeat:no-repeat;
    background-position:center center;
    transition:all .2s;
}
#gallery .splide .splide__arrows .splide__arrow--prev {
    background-image:url(../img/main/slide_prev.png);
}
#gallery .splide .splide__arrows .splide__arrow--next {
    background-image:url(../img/main/slide_next.png);
}
#gallery .splide .splide__arrows .splide__arrow--prev:hover {
    background-position:25% center;
}
#gallery .splide .splide__arrows .splide__arrow--next:hover {
    background-position:75% center;
}
#gallery .splide .splide__track {
    margin-top:20px;
    padding-top:15px;
    padding-bottom:15px;
}
#gallery .splide .splide__track .inner {
    display:block;
    border-radius: 30px;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
    overflow:hidden;
    transition:all .3s;
}
#gallery .splide .splide__track .inner:hover {
    margin-top:-10px;
    transition:all .3s;
}
#gallery .splide .splide__track .inner img {
    width:100%;
}

/* 반응형 */
@media(max-width:1480px) {
    #section01 .sec01 {
        gap:30px;
    }
    #section02 .sec02_cont .story_gallery .gallery_box:nth-child(3) {
        display:none;
    }
    #section02 .sec02_cont .story_gallery .gallery_box img {
        width:100%;
    }

    #notice {
        max-width:800px;
        width:100%;
    }
  
    #section03 .sec03_wrap {
        align-items:stretch;
    }
    #ebook,
    #food {
        max-width:290px;
        min-width:270px;
    }
    #ebook .ebook_board {
        height:100%;
    }
    #ebook .ebook_board .img img {
        max-width:250px;
        width:100%;
    }
}
@media(max-width:1200px) {
    #section01  {
        padding-top:60px;
        padding-bottom:60px;
    }
    #section01 .sec01 {
        flex-direction:column-reverse;
    }

    #visual {
        width:100%;
        max-width:830px;
    }
    #direct {
        flex:none;
        width:100%;
        max-width:830px;
    }
    #direct .search h2 {
        display:none;
    }
    #section02 {
        margin:60px 0;
    }
    #section03 .sec03 {
        margin-top:40px;
        gap:20px;
    }
    #notice {
        max-width:50%;
        overflow: unset;
        background-color:unset;
        border-top:none;
    }

    #notice .titleline {
        flex-direction:column;
        gap:10px;
    }
    #notice .titleline .title_tab {
        flex-direction:row;
        border-radius:10px;
        padding:5px;
        background-image:unset;
    }
    #notice .titleline .title_tab .title_tabs {
        flex:1;
        text-align:center;
    }
    #notice .titleline .title_tab .title_tabs.mtlt_sel {
        left:0;
    }
    #notice .titleline .title_tab .title_tabs::after {
        width:100%;
        background-image:unset;
        left:0;
        top: 50%;
        transform: translateY(-50%);
    }

    #notice .titleline .mtl_contentBox {
        width:100%;
        min-height:unset;
        background-color:#fff;
        border-top:5px solid #5FABE7;
    }
    #notice .titleline .notice_board {
        padding: 0 10px;
    }
    #notice .titleline .notice_board .nb_list .nbl_first {
        padding:15px 0
    }
    #notice .titleline .notice_board .nb_list .nblf_box .nblf_date {
        width:70px;
    }
    #notice .titleline .notice_board .nb_list .nblf_box .nblf_date span {
        font-size:2rem;
    }
    #notice .titleline .notice_board .nb_list .nblf_box .nblf_date p {
        font-size:10px;
    }
    #notice .titleline .notice_board .nb_list .board_link {
        padding:0;
    }

    #notice .titleline .notice_board .nbl_normal:nth-child(4) {
        border-bottom:none;
    }

    #notice .titleline .notice_board .nbl_normal:nth-child(5) {
        display:none;
    }

    #food .ix_box {
        padding-bottom:45px;
        background-position: 90% 95%;
        background-size: 35% auto;
    }

    #section03 .sec03_wrap {
        width:100%;
        gap:10px;
    }
    #ebook, #food {
        width:50%;
        min-width:unset;
        max-width:unset;
    }
    #ebook .ebook_board {
        text-align: center;
    }
    #ebook .ebook_board .box_title {
        display:none;
    }
}
@media(max-width:1024px) {}
@media(max-width:991px) {
    #section03 .sec03 {
        flex-direction:column;
    }
    #notice {
        max-width:100%;
    }
    #ebook .ebook_board .box_title {
        display:block;
    }
    #food .ix_box {
        background-position: 84% 92%;
        padding-bottom:90px;
        background-size: auto;
    }
}
@media(max-width:768px) {
    #visual .visual_bnn {
        border-radius:20px;
    }
    #section02 .sec02 {
        flex-direction:column;
        align-items:center;
        gap:30px;
    }
    #section02 .sec02_cont .story_gallery .gallery_box .inncontent .tit {
        min-height:33px;
    }
    #store,
    #photo {
        width:100%;
        flex:none;
    }
    #notice .titleline .notice_board .nbl_normal:nth-child(3) {
        border-bottom:none;
    }
    #notice .titleline .notice_board .nbl_normal:nth-child(4) {
        display:none;
    }
    #gallery .splide .splide__arrows .splide__arrow--prev:hover {
        background-position:center center
    }
    #gallery .splide .splide__arrows .splide__arrow--next:hover {
        background-position:center center;
    }
 
}
@media(max-width:640px) {
    #index .main_title {
        font-size:1.5rem;
    }
    #section01 {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    #section01 .sec01 {
        gap:20px;
    }
    #direct {
        gap:15px;
    }
    #direct .search fieldset {
        height:57px;
    }
    #direct .search fieldset input {
        height:55px;
        padding:5px 15px;
    }
    #direct .search fieldset button {
        width:55px;
    }
    #direct .quick {
        gap:10px;
    }
    #direct .quick .quick_wrap {
        gap:10px;
    }
    #direct .quick .quick_wrap .quick_box {
        gap:10px;
        padding:15px 0;
    }
    #direct .quick .quick_wrap .quick_box img {
        width:35px;
    }
    #section02 {
        margin:50px 0;
    }
    #section02 .sec02 {
        margin-top:40px;
    }
    #section02 .part_title h3 {
        font-size:1.125rem;
    }
    #section02 .part_title {
        margin-bottom:15px;
    }
    #section02 .sec02_cont .story_gallery {
        gap:10px;
    }
    #section02 .sec02_cont .story_gallery .gallery_box .inncontent {
        padding:20px;
    }
    #section02 .sec02_cont .story_gallery .gallery_box .inncontent .tit {
        font-size:14px;
    }

    #section03 {
        padding:40px 0;
    }
    #section03 .sec03 {
        gap:30px;
    }
    #section03 .sec03_wrap {
        flex-direction:column;
    }
    #ebook .ebook_board .box_title p {
        font-size:1rem;
    }
    #ebook, #food {
        width:100%;
    }
    #food .ix_box {
        padding-bottom:30px;
        background-image:none;
    }
    #food .ix_box .ix_title_wrap {
        display:flex;
        align-items:center;
        justify-content:space-between;
    }
    #food .ix_box .ix_more {
        display:none;
    }
    #food .ix_box .mo_btn {
        display:block;
        margin-top:0;
    }
    #section04 {
        padding-top: 40px;
        padding-bottom: 40px;
    }
}
@media (max-width:480px) {
    #section01 {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    #direct .quick .quick_wrap .quick_box p {
        font-size:16px;
    }
}