@charset "UTF-8";

html, body {height:auto;overflow:visible}
body {height:auto;overflow-x:hidden;overflow-y:visible}

/* 메인 공통 */
.sec {padding:70px 0 80px 0}
.sec .subject {font-size:24px;font-weight:700;color:var(--colorGray90);line-height:1.5}
.sec .board_new {width:24px;height:24px;text-indent:-9999px;border-radius:0;overflow:hidden}
.sec .board_new::after {text-indent:0;font-weight:700;font-size:14px}
.sec .tab_box {display:flex;gap:8px}
.sec .tab_box .btn_tab {display:inline-flex;align-items:center;justify-content:center;min-width:80px;min-height:41px;text-align:center;font-size:1.1em;font-weight:500;background-color:rgba(0,0,0,0.1);border-radius:6px}
.sec .tab_box .btn_tab .text::after {display:block;width:0;height:1px;content:'';background-color:var(--colorGray90);transition:width 0.2s}
.sec .tab_box .btn_tab.current {color:#fff;background-color:var(--colorGray80)}
.sec .tab_box .btn_tab.current .text::after {display:none}
.sec .tab_box .btn_tab:focus {outline-offset:2px}
.sec .tab_box .btn_tab:focus .text::after, 
.sec .tab_box .btn_tab:hover .text::after {width:100%}
.sec .board_result {text-align:center}
.sec .board_result .icon_box {width:auto;height:auto;margin-bottom:16px;background-color:transparent;border-radius:0}
.sec .board_result .icon_box .icon {width:auto;height:auto}
.sec .board_result .text {color:var(--colorGray60)}
.main_tit {font-size:40px;font-weight:700;color:var(--colorGray90);line-height:1.4}
.main_tit2 {margin-bottom:8px;font-size:32px;font-weight:700;color:var(--colorGray90);line-height:1.4}
.main_cont_tit {font-size:24px;font-weight:700;color:var(--colorGray90);line-height:1.4}
.tit_box {margin-bottom:25px}
.tit_box.flex {justify-content:space-between;align-items:center}
.btn_more {display:inline-flex;align-items:center;justify-content:center;width:41px;height:41px;font-size:1.2em;color:#fff;background-color:var(--colorGray80);border-radius:6px;position:absolute;right:0;top:7px}
.btn_more.white {color:var(--colorGray90);background-color:#fff}
.btn_more .icon {transition:transform 0.4s}
.btn_more:hover .icon, 
.btn_more:focus .icon {transform:rotate(180deg)}
.tit_slt {display:inline-block;position:relative}
.tit_slt .select_txt {display:inline-block;padding:10px 32px 10px 0;color:var(--colorMain);font-size:2rem;line-height:1;border-bottom:1px solid #000;position:relative}
.tit_slt .select_txt::after {font-family:'xeicon';content:'\e936';color:var(--colorGray90);font-size:20px;position:absolute;right:0;top:50%;transform:translateY(-50%)}
.tit_slt .select {display:block;min-width:100%;height:52px;padding:0 0 0 5px;font-size:1rem;background-color:transparent;background-image:none;border:0;outline-offset:-3px;position:absolute;left:0;top:5px;opacity:0}
.tit_slt:focus-within .select_txt {outline:2px solid #333;border-radius:3px}


/* 메인 비주얼 */
.main_visual {display:flex;align-items:center;justify-content:center;height:720px;text-align:center;position:relative;overflow:hidden}
.main_visual .container {z-index:10}
.main_visual .typo {}
.main_visual .mv_tit {font-size:60px;font-weight:700;line-height:1.3;animation:smoothFadeIn 1.2s ease-out both;animation-delay:1.7s}
.main_visual .mv_tit .s_txt {display:block;margin-bottom:8px;font-size:32px;color:var(--colorSub)}
.main_visual .mv_txt {margin-top:16px;font-size:1.15em;animation:smoothFadeIn 1.2s ease-out both;animation-delay:2s}
.main_visual .mv_quick {display:flex;justify-content:center;margin-top:100px}
.main_visual .mv_quick .quick {display:inline-block;padding:0 60px;border-right:1px dashed var(--colorGray30)}
.main_visual .mv_quick .quick:last-child {border-right:0}
.main_visual .mv_quick .btn {display:block}
.main_visual .mv_quick .btn .icon {display:flex;align-items:center;justify-content:center;width:80px;height:80px;margin:0 auto 16px auto;background-color:#9D815E;border-radius:100%}
.main_visual .mv_quick .btn .text {font-size:1.15em;font-weight:700;text-shadow:1px 1px #fff, 1px -1px #fff, -1px -1px #fff, -1px 1px #fff}
.main_visual .mv_quick .btn:hover, 
.main_visual .mv_quick .btn:focus {color:var(--colorSub);transform:translateY(-10px)}
.main_visual .mv_quick .btn:hover .icon, 
.main_visual .mv_quick .btn:focus .icon {animation:hoverSpin 0.6s ease-in-out forwards}
.main_visual .mv_bg {}
.main_visual .mv_bg .bg {position:absolute}
.main_visual .mv_bg .bg1 {width:100%;left:0;bottom:0;z-index:0;animation:slideUpFade 1.5s ease-out both;animation-delay:0s}
.main_visual .mv_bg .bg1 img {width:100%}
.main_visual .mv_bg .bg2 {left:0;bottom:0;z-index:1;animation:slideUpFade 1.5s ease-out both;animation-delay:0.8s}
.main_visual .mv_bg .bg3 {right:60px;bottom:-125px;z-index:1;animation:slideUpFade 1.5s ease-out both;animation-delay:0.8s}
.main_visual .mv_bg .bg4 {left:50%;top:5px;transform:translateX(-50%);z-index:2;animation:slideDownFadeBg4 1.5s ease-out both;animation-delay:1s}

@keyframes hoverSpin{
	0% {transform:rotateY(0)}
	100% {transform:rotateY(180deg)}
}

@keyframes slideUpFade {
	0% {opacity:0;transform:translateY(100px)}
	100% { opacity:1;transform: translateY(0)}
}

@keyframes slideDownFadeBg4 {
	0% {opacity:0;transform:translate(-50%, -100px)} 
	100% {opacity:1;transform:translate(-50%, 0)}
}

@keyframes smoothFadeIn {
	0% {opacity:0;transform:translateY(25px)}
	100% {opacity:1;transform:translateY(0)}
}

@keyframes smoothFadeIn {
	0% {opacity:0;transform:translateY(25px)}
	100% {opacity:1;transform:translateY(0)}
}



/* 연합회 최신소식 */
.sec_news {background-color:#EAE1D5;background-image:url(/images/home/kor/user/main/bg_pattern.png);background-position:center;background-repeat:no-repeat}
.sec_news .container {display:flex;column-gap:80px}
.sec_latest_news {flex:1;position:relative}
.sec_latest_news .tit_box {margin-right:49px;padding-bottom:10px}
.sec_latest_news .main_tit {}
.sec_latest_news .tab_box {}
.sec_latest_news .tab_box .btn_tab {}
.sec_latest_news .tab_box .btn_tab.current {}
.sec_latest_news .news_list {border-top:1px solid #000}
.sec_latest_news .news_list .list_inner {}
.sec_latest_news .news_list .bundle {border-bottom:1px solid var(--colorBorderGray)}
.sec_latest_news .news_list .link {display:block;padding:30px 0}
.sec_latest_news .news_list .link .subject {}
.sec_latest_news .news_list .link .date {display:inline-block;margin-top:8px;vertical-align:middle}
.sec_latest_news .news_list .link .board_new {margin-left:4px;vertical-align:middle;transform:translateY(2px)}
.sec_latest_news .news_list .link:hover,
.sec_latest_news .news_list .link:focus {padding-left:32px;padding-right:32px;background-color:#fff;border:1px solid #000;border-radius:8px;box-shadow:5px 5px 10px rgba(0, 0, 0, 0.2)}

.sec_latest_news .btn_more {}

/* 문화원 행사소식 */
.sec_event_news {flex:1;text-align:center;position:relative}
.sec_event_news::before {display:block;width:100%;height:305px;content:'';background:linear-gradient(180deg, #fff 0%, #EAE1D5 100%);border-radius:12px 12px 0 0;position:absolute;left:50%;top:calc(50% + 49px);transform:translate(-50%, -50%);z-index:0}
.sec_event_news .tit_box {padding-bottom:10px;position:relative;z-index:1}
.sec_event_news .main_tit {}
.sec_event_news .main_tit select {}
.sec_event_news .main_tit .select_txt {}
.sec_event_news .slide_wrap {width:461px;height:auto;margin:0 auto;position:relative;z-index:1}
.sec_event_news .slide_wrap .slide_inner {border-radius:12px;overflow:hidden}
.sec_event_news .slide_wrap .slide_box {}
.sec_event_news .slide_wrap .link {}
.sec_event_news .slide_wrap .link .img_box {border-radius:0}
.sec_event_news .slide_wrap .link .img_box .img {}
.sec_event_news .slide_btn {justify-content:center;margin-top:32px}
.sec_event_news .slide_btn .btn {}
.sec_event_news .slide_btn .btn.prev, 
.sec_event_news .slide_btn .btn.next {background-color:transparent;position:absolute;top:calc(50% + 24px);transform:translateY(-50%);z-index:2}
.sec_event_news .slide_btn .btn.prev {left:30px}
.sec_event_news .slide_btn .btn.next {right:30px}
.sec_event_news .slide_btn .btn.prev::after, 
.sec_event_news .slide_btn .btn.next::after {font-size:48px;font-weight:normal}
.sec_event_news .slide_btn .ctrl {}
.sec_event_news .slide_btn .paging {}


/* 교육·탐방 프로그램 */
.sec_program {background-color:#fff;background-image:url(/images/home/kor/user/main/bg_clude_left.png), url(/images/home/kor/user/main/bg_clude_right.png);background-position:left top 62px, right bottom -12px;background-repeat:no-repeat}
.sec_program .container {}
.sec_program .tit_box {}
.sec_program .main_tit {}
.sec_program .tab_box {gap:5px;margin-bottom:24px}
.sec_program .tab_box .btn_tab {flex:1;min-width:inherit}
.sec_program .tab_box .btn_tab.current {}
.sec_program .cont_list {display:flex;column-gap:24px;margin-bottom:10px;position:relative}
.sec_program .cont_list:last-child {margin-bottom:10px}
.sec_program .cont_list .typo {width:212px;margin:10px 0;padding:32px;border-radius:8px;background-repeat:no-repeat;background-position:right bottom;overflow:hidden}
.sec_program .cont_list.list1 {}
.sec_program .cont_list.list1 .typo {background-color:#564229;background-image:url(/images/home/kor/user/main/bg_program_tit01.png)}
.sec_program .cont_list.list2 {}
.sec_program .cont_list.list2 .typo {background-color:var(--colorGray80);background-image:url(/images/home/kor/user/main/bg_program_tit02.png)}
.sec_program .main_cont_tit {color:#fff}
.sec_program .slide_wrap {width:calc(100% - 236px)}
.sec_program .slide_wrap .slick-track {padding:10px 0}
.sec_program .slide_wrap .slide_inner {width:calc(100% + 16px);position:relative;left:50%;transform:translateX(-50%)}
.sec_program .slide_wrap .slide_box {height:241px;margin:0 8px}
.sec_program .slide_wrap .link {display:block;padding:24px 32px;background-color:#fff;border:1px solid var(--colorBorderGray);border-radius:8px;position:relative}
.sec_program .slide_wrap .link:hover, 
.sec_program .slide_wrap .link:focus {border-color:var(--colorGray90);box-shadow:5px 5px 10px rgba(0, 0, 0, 0.2)}
.sec_program .slide_wrap .link .tag {position:absolute;right:32px;top:24px}
.sec_program .slide_wrap .link .txt_box {margin-top:14px;padding-top:14px;border-top:1px solid var(--colorBorderGray)}
.sec_program .slide_wrap .link .subject {display:grid;grid-template-columns:auto max-content;align-items:center}
.sec_program .slide_wrap .link .subject .els2 {vertical-align:middle}
.sec_program .slide_wrap .link .board_new {}
.sec_program .slide_wrap .link .dl_group {margin-top:12px}
.sec_program .slide_wrap .link .dl_group .dl {display:grid;grid-template-columns:max-content auto;width:100%;font-size:1.05em}
.sec_program .slide_wrap .link .dl_group .dt {color:var(--colorGray60)}
.sec_program .slide_wrap .link .dl_group .dd {}
.sec_program .slide_wrap .link .status_bar {display:flex;align-items:center;column-gap:6px;width:100%}
.sec_program .slide_wrap .link .status_bar .total {display:inline-block;width:44px;white-space:nowrap;vertical-align:middle}
.sec_program .slide_wrap .link .status_bar .bar {display:inline-block;width:calc(100% - 50px);height:8px;background-color:var(--colorGray10);border-radius:8px;position:relative;overflow:hidden}
.sec_program .slide_wrap .link .status_bar .active {display:inline-block;height:100%;background-color:var(--colorGray80);border-radius:0 8px 8px 0;position:absolute;left:0;top:0}
.sec_program .board_result {height:100%;padding-top:80px;background-color:#fff}
.sec_program .board_result .icon_box {}
.sec_program .board_result .icon_box .icon {}
.sec_program .board_result .text {}
.sec_program .slide_btn {color:#fff;position:absolute;left:28px;top:90px;z-index:2}
.sec_program .slide_btn .btn {color:#fff;background-color:transparent !important}
.sec_program .slide_btn .btn:focus, 
.sec_program .slide_btn .btn:focus {outline-offset:0}
.sec_program .slide_btn .btn.prev:hover::after,
.sec_program .slide_btn .btn.prev:focus::after,
.sec_program .slide_btn .btn.next:hover::after, 
.sec_program .slide_btn .btn.next:focus::after {color:#EAE1D5}
.sec_program .slide_btn .ctrl {}
.sec_program .slide_btn .paging {}
.sec_program .btn_more {}


/* 문화원 시설대관 */
.sec_rental {background-image:url(/images/home/kor/user/main/bg_paper.jpg);background-repeat:no-repeat;background-position:left top;background-size:cover}
.sec_rental .container {}
.sec_rental .main_tit {text-align:center}
.sec_rental .main_tit select {}
.sec_rental .main_tit .select_txt {}
.sec_rental .slide_wrap {position:relative}
.sec_rental .slide_wrap .slide_obj {position:relative}
.sec_rental .slide_wrap .slick-list {padding-top:32px !important;padding-bottom:40px !important}
.sec_rental .slide_wrap .slide_inner {} 
.sec_rental .slide_wrap .slide_box {display:grid;grid-template-columns:1fr 1fr;max-width:1162px;margin:0 61.5px;background-color:#fff;border-radius:8px;box-shadow:0 0 30px rgba(0, 0, 0, 0.3);overflow:hidden}
.sec_rental .slide_wrap .img_box {height:418px;padding-bottom:0;border-radius:0}
.sec_rental .slide_wrap .img_box .img {}
.sec_rental .slide_wrap .img_box img {width:100%;max-width:inherit;height:100%}
.sec_rental .slide_wrap .typo {padding:52px 60px}
.sec_rental .slide_wrap .typo .text.els {-webkit-line-clamp:2;height:59px;font-size:1.15em}
.sec_rental .slide_wrap .main_tit2 {height:45px}
.sec_rental .slide_wrap .keyword {margin-top:24px}
.sec_rental .slide_wrap .keyword .key {color:var(--colorMain);font-size:1.05em}
.sec_rental .slide_wrap .btn_list {margin-top:32px}
.sec_rental .slide_wrap .btn_list .btn_custom {}
.sec_rental .slide_wrap .slide_count {margin-top:40px;color:var(--colorGray30)}
.sec_rental .slide_wrap .slide_count .now {font-weight:700;color:var(--colorGray90)}
.sec_rental .slide_btn {}
.sec_rental .slide_btn .btn {}
.sec_rental .slide_btn .btn.prev, 
.sec_rental .slide_btn .btn.next {width:40px;height:40px;background-color:#fff;border-radius:100%;box-shadow:0 0 30px rgba(0, 0, 0, 0.2);position:absolute;top:50%}
.sec_rental .slide_btn .btn.prev {transform:translateX(-50%);left:calc((100% - 1400px) / 2 + 60px)}
.sec_rental .slide_btn .btn.next {transform:translateX(50%);right:calc((100% - 1400px) / 2 + 60px)}
.sec_rental .slide_btn .btn.prev:focus,
.sec_rental .slide_btn .btn.next:focus {outline-offset:3px}
.sec_rental .slide_btn .btn.stop, 
.sec_rental .slide_btn .btn.play {background-color:var(--colorGray10)}
.sec_rental .board_result {max-width:1162px;margin:40px auto;padding-top:155px;padding-bottom:155px;background-color:rgba(0,0,0,0.01);border-radius:8px;box-shadow:inset 0 0 40px rgba(0,0,0,0.1)}
.sec_rental .board_result .text {font-size:1.15em}
.sec_rental .btn_custom.outline {background-color:transparent}


/* 충남문화원 티비 */
.sec_comm {}
.sec_comm .container {display:flex;flex-wrap:wrap;gap:54px 24px}
.sec_comm .img_box {display:flex;align-items:center;justify-content:center;width:100%;height:0;margin-bottom:18px;border-radius:8px;position:relative;overflow:hidden;transition:0.3s}
.sec_comm .img_box .img {display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:var(--colorBgGray);position:absolute;left:0;top:0}
.sec_comm .link:hover .img_box {box-shadow:0 0 20px rgba(0,0,0,0.2);transform:translateY(-10px)}
.sec_comm .link:focus .img_box {outline-offset:3px;box-shadow:0 0 20px rgba(0,0,0,0.2);transform:translateY(-10px)}
.sec_tv {width:calc(50% - 12px);position:relative}
.sec_tv .tit_box {}
.sec_tv .main_tit {}
.sec_tv .tv_cont {}
.sec_tv .tv_cont .img_box {padding-bottom:56.25%}
.sec_tv .tv_cont .img_box .img {}
.sec_tv .tv_cont .subject {}
.sec_tv .btn_more {}

/* SNS소식 */
.sec_sns {width:calc(50% - 12px)}
.sec_sns .tit_box {}
.sec_sns .main_tit {}
.sec_sns .tab_box {}
.sec_sns .tab_box .alt {width:1px;height:1px;text-indent:-9999px;overflow:hidden;position:absolute}
.sec_sns .tab_box .btn_tab {width:41px;height:41px;min-width:inherit !important;background-color:#fff;border:1px solid var(--colorBorderGray)}
.sec_sns .tab_box .btn_tab .icon {width:100%;height:100%;background-color:var(--colorGray60);-mask-position:center;-mask-repeat:no-repeat;-mask-size:auto;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:auto;transition:0.2s}
.sec_sns .tab_box .btn_tab:not(.current):hover {border-color:var(--colorGray60)}
.sec_sns .tab_box .btn_tab:not(.current):focus {}
.sec_sns .tab_box .btn_tab:not(.current):hover .icon, 
.sec_sns .tab_box .btn_tab:not(.current):focus .icon {background-color:var(--colorGray90)}
.sec_sns .tab_box .btn_tab.current .icon {background-color:#fff !important}
.sec_sns .tab_box .btn_tab.facebook {}
.sec_sns .tab_box .btn_tab.facebook .icon {-mask-image:url(/images/home/kor/user/common/ic_facebook.svg);-webkit-mask-image:url(/images/home/kor/user/common/ic_facebook.svg)}
.sec_sns .tab_box .btn_tab.insta {}
.sec_sns .tab_box .btn_tab.insta .icon {-mask-image:url(/images/home/kor/user/common/ic_insta.svg);-webkit-mask-image:url(/images/home/kor/user/common/ic_insta.svg)}
.sec_sns .tab_box .btn_tab.blog {}
.sec_sns .tab_box .btn_tab.blog .icon {-mask-image:url(/images/home/kor/user/common/ic_naverblog.svg);-webkit-mask-image:url(/images/home/kor/user/common/ic_naverblog.svg)}
.sec_sns .tab_box .btn_tab.current {}
.sec_sns .tab_box .btn_tab.facebook.current {background-color:#1877F2;border-color:#1877F2}
.sec_sns .tab_box .btn_tab.insta.current {background:linear-gradient(45deg, #ff960b, #ff1564, #eb08a0, #b31ddc);border-color:#ff1564}
.sec_sns .tab_box .btn_tab.blog.current {background-color:#34b608;border-color:#34b608}
.sec_sns .sns_cont {display:grid;grid-template-columns:1fr 1fr;column-gap:24px}
.sec_sns .sns_cont .bundle {}
.sec_sns .sns_cont .img_box {padding-bottom:116.265%}
.sec_sns .sns_cont .img_box .img {}
.sec_sns .sns_cont .img_box img {max-width:inherit;height:100%}
.sec_sns .sns_cont .subject {}

/* 하단 메뉴들 */
.sec_quick {display:flex;align-items:center;width:100%;border:1px solid var(--colorBorderGray);border-radius:8px}
.sec_quick .col {flex:1;height:100%;position:relative}
.sec_quick .col::after {width:1px;height:calc(100% - 84px);content:'';background-color:var(--colorBorderGray);position:absolute;right:0;top:50%;transform:translateY(-50%)}
.sec_quick .col:last-child::after {display:none}
.sec_quick .col.f2 {flex:2}
.sec_quick .link {display:block;height:100%;padding:42px 40px}
.sec_quick .link.icon {}
.sec_quick .link .main_tit2 {}
.sec_quick .link .main_cont_tit {margin-bottom:10px;position:relative}
.sec_quick .link.icon .main_cont_tit::after {display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;font-family:'xeicon';content:'\e93e';color:var(--colorGray60);font-size:12px;background-color:var(--colorGray10);text-indent:2px;border-radius:100%;position:absolute;right:0;top:0;transition:0.2s}
.sec_quick .link:focus {outline-offset:-3px}
.sec_quick .link:hover .main_cont_tit, 
.sec_quick .link:focus .main_cont_tit {color:var(--colorMain)}
.sec_quick .link:hover .main_cont_tit::after,
.sec_quick .link:focus .main_cont_tit::after {color:#fff;background-color:var(--colorMain);transform:translateX(10px)}
.sec_quick .link .text {}
.sec_quick .link .typo {}
.sec_quick .link .typo .text {}
.sec_quick .link .btn_list {width:194px;position:absolute;right:40px;top:50%;transform:translateY(-50%)}
.sec_quick .link .btn_list .btn {display:flex;align-items:center;justify-content:space-between;width:100%;height:49px;margin-bottom:8px;font-size:1.15em;font-weight:700;border-bottom:1px solid var(--colorBorderGray)}
.sec_quick .link .btn_list .btn:last-child {margin-bottom:0}
.sec_quick .link .btn_list .btn:hover {color:var(--colorMain);border-color:var(--colorMain)}
.sec_quick .link .btn_list .btn:focus {color:var(--colorMain);border-color:var(--colorMain);outline-offset:3px;outline-color:var(--colorMain)}


/* 충청남도 지방문화원 */
.sec_region {text-align:center;background-color:#F0F2F9}
.sec_region .container {}
.sec_region .main_tit {margin-bottom:12px}
.sec_region .slide_wrap {margin-top:40px}
.sec_region .slide_wrap .slide_obj {}
.sec_region .slide_wrap .slide_inner {display:flex;flex-wrap:wrap;gap:16px}
.sec_region .slide_wrap .slide_box {width:calc(100% / 4 - 12px)}
.sec_region .slide_wrap .link {display:flex;align-items:center;justify-content:center;width:100%;height:68px;text-align:left;background-color:#fff;border:1px solid #fff;border-radius:8px}
.sec_region .slide_wrap .link:hover {border-color:var(--colorGray90);box-shadow:5px 5px 10px rgba(0, 0, 0, 0.2)}
.sec_region .slide_wrap .link:focus {outline-offset:2px;box-shadow:5px 5px 10px rgba(0, 0, 0, 0.2)}
.sec_region .slide_wrap .link .logo_img {}
.sec_region .slide_btn {display:none;justify-content:center;margin-top:24px}
.sec_region .slide_btn .btn {background-color:var(--colorGray10)}
.sec_region .slide_btn .btn.prev::after {content:'\e93c';font-weight:normal}
.sec_region .slide_btn .btn.next::after {content:'\e93f';font-weight:normal}
.sec_region .slide_btn .ctrl {}
.sec_region .slide_btn .paging {}