@import url("reset.css");
@import url("jquery-ui.css");
@import url("slick.css");
@import url("swiper.css");

:root{
--width:1240px;
--point-color-1:#FF7E00;
--point-color-2:#1174ce;
--point-color-3:#f0ad6b;
--back-color-1:#faedde;
--padding:0 20px;
--headerH : 80px;
--topBannerH: 60px;
}
@media screen and (max-width: 768px) {
:root{
    --padding:0 3%;
    --headerH: 60px;
    --topBannerH: 88px;

}
}

/* top_banner */
.top_banner{position:relative; background-color:var(--point-color-1); text-align: center;}
.top_banner_inner{position:relative; margin:0 auto; max-width:var(--width); padding:var(--padding); box-sizing:border-box;}
.top_banner .top_banner_close{position:absolute; right:20px; top:50%; width:14px; height:14px; background:url(../img/banner_close.svg) no-repeat right center; transform:translateY(-50%);}
.top_banner .dont_today{position:absolute; right:44px; top:50%; font-size:0.75rem; color:#fff; transform: translateY(-50%);}

/* header */
.header{position:fixed; left:0; top:0; z-index:10; width:100%; background-color:#fff;} 
.header_inner{margin:0 auto; max-width:var(--width); padding:var(--padding); height:var(--headerH); display:flex; flex-wrap:wrap; align-items: center; box-sizing:border-box;}
.header .logo > a {display: block; width: 170px; height: 40px; background: url(../img/logo.png)left no-repeat; margin-bottom: 6px;}

.gnb_wrap{margin-left:70px;}
.gnb_wrap .mb_area{display:none;}
.gnb{display:flex; align-items: center;}
.gnb>li{position:relative; padding:0 30px; }
.gnb>li>a{padding:30px 0; display:block; font-size:1.0625rem; transition: all 0.3s ease-out; }
.gnb>li:hover>a{color:var(--point-color-1);}
.gnb>li .s_gnb{position:absolute; left:50%; top:66px; padding:20px; width:140px; background:var(--point-color-1); border-radius:10px; box-sizing:border-box;  transform:translateX(-50%); text-align:center; visibility: hidden; opacity:0; transition: all 0.3s ease-out;}
.gnb>li .s_gnb li{margin-bottom:10px;}
.gnb>li .s_gnb li:last-child{margin-bottom:0;}
.gnb>li .s_gnb li a{color:#fff; font-size:0.9375rem; }
.header .util{margin-left:auto; }
.header .util ul{display:flex; align-items: center;}
.header .util ul li{position:relative; padding:0 10px 0 13px; }
.header .util ul li:before{position:absolute; left:0; top:50%; width:3px; height:3px; background-color:var(--point-color-1); border-radius:50%; display:block;content:"";}
.header .util ul li:first-child:before{display:none;}
.header .util ul li:first-child{padding-left:0;}
.header .util ul li a{line-height:18px; font-size:0.8125rem; color:#666; display:block;}
.header .util ul li.icon_login a{padding-left:28px; background:url(../img/icon_login.svg) no-repeat 0 center;}
.gnb_open{display:none;}

@media screen and (min-width: 1025px) {
  .gnb>li:hover .s_gnb{z-index:100; visibility: visible; opacity:1;}
}
@media screen and (max-width: 1024px) {
  .gnb_open{position:relative; margin-left:auto;  width:30px; height:30px; background:url(../img/icon_menu.svg) no-repeat center center; background-size:100%; display:block; }
  .gnb_wrap{position:fixed; left:0; top:0; z-index:101; margin-left:0; width:100%; height:100%; background-color:#fff; display:block;  opacity:0; visibility: hidden; transition: all 0.3s ease-out;}
  .gnb_wrap.active{opacity:1; visibility: visible;}
  .gnb_wrap .mb_area{padding:20px 0; display:block;}
  .gnb_wrap .mb_area .logo{padding:0 3%;}
  .gnb_wrap .mb_area ul{margin-top:20px; background-color:var(--point-color-1); display:flex;}
  .gnb_wrap .mb_area ul li{position:relative; padding:10px; flex-grow:1; text-align:center;}
  .gnb_wrap .mb_area ul li:before{position:absolute; left:0; top:50%; width:1px;height:12px; background-color:#fff; display:block; content:""; transform:translateY(-50%); opacity:0.5;}
  .gnb_wrap .mb_area ul li:First-child:before{display:none;}
  .gnb_wrap .mb_area ul li a{color:#fff;}
  .gnb{display:block;}
  .gnb>li{padding:0;}
  .gnb>li>a{position:relative; padding:10px 3%;}
  .gnb>li>a.sgnb_open:before{position:absolute; right:20px;  top:50%; width:15px; height:10px; background: url(../img/arrow.svg) no-repeat right 3% center; display:block; content:""; transform:translateY(-50%); transition: all 0.3s ease-out; }
  .gnb>li>a.sgnb_open.on:before{transform:translateY(-50%) rotate(-180deg);}
  .gnb>li .s_gnb{position:relative; left:auto; top:auto; width:100%; visibility: visible; opacity:1; transform:translateX(0); text-align:left; border-radius:0; display:none; transition: none;}
  .gnb_close{position:absolute; right:3%; top:20px; width:30px; height:30px; background:url(../img/close.svg) no-repeat center center;}
  .header .util{display:none;}
  .top_banner_rolling .list{height:60px; overflow:hidden;}
  .top_banner_rolling .list img{position:relative; height:60px; max-width:none; margin:0 auto;}
}

/* main */
.main_container{background-color:#F8F8F8;}
.container{padding-top:calc(var(--headerH) + var(--topBannerH)); position:relative; z-index:1;}
.main_cont{padding:25px 20px; margin:0 auto; max-width:var(--width);  box-sizing:border-box;}
.main_inner{position:relative; max-width:calc(100% - 370px); }
.main_visual{background:url(../img/main_visual.png) no-repeat center center; background-size:cover; height:450px; display:flex; align-items: center; justify-content: center;}
.main_vs_txt{position:relative; margin:0 auto; padding:var(--padding); max-width:var(--width); width:100%; box-sizing:border-box;}
.main_vs_txt .txt_1{font-size:2.625rem; color:var(--point-color-1); font-family: 'MBC1961GulimM';}
.main_vs_txt .txt_2{font-size:1.5625rem;color:var(--point-color-1);}
.main_vs_txt .txt_2 strong{font-weight:600;}
.main_title{margin-bottom:20px;font-size:1.375rem; font-weight:600;}
.main_event_wrap,
.main_rolling_wrap{overflow: hidden;}
.main_rolling_list{padding-right:180px; }
.main_rolling_list .slick-list{overflow:inherit;}
.main_event_prev,
.main_rolling .main_rolling_prev{position:absolute; left:-23px; top:50%; z-index:5; width:46px; height:46px; border-radius:50%; background-color:#fff; box-shadow:0 3px 7px rgba(0,0,0,0.1);  text-indent: -9999px; transform:translateY(-50%); opacity:1;}
.main_event_prev:before,
.main_rolling .main_rolling_prev:before{position:absolute; left:50%; top:50%; width:10px;height:15px; background:url(../img/main_rolling_next.svg) no-repeat center center; display:block; content:""; transform:translate(-50%,-50%) rotate(180deg);}
.main_event_next,
.main_rolling .main_rolling_next{position:absolute; right:-23px; top:50%; z-index:5; width:46px; height:46px; border-radius:50%; background-color:#fff; box-shadow:0 3px 7px rgba(0,0,0,0.1); text-indent: -9999px; transform:translateY(-50%);}
.main_event_next:before,
.main_rolling .main_rolling_next:before{position:absolute; left:50%; top:50%; width:10px;height:15px; background:url(../img/main_rolling_next.svg) no-repeat center center; display:block; content:""; transform: translate(-50%, -50%);}
.main_rolling .slick-slide>div{padding-right:23px;}
.main_rolling .slick-slide>div .empty_li{padding-top:100px; background:url(../img/noList.png) no-repeat center 0; background-size:80px; text-align:center; font-weight:500; font-size:1.25rem;}
.main_rolling .list .txt_area{padding-top:15px; font-size:0.9375rem; font-weight:500; color:#222; transition: all 0.3s ease-out;}
.main_rolling .list .txt_area a{font-weight:inherit; font-size:inherit; color:inherit; transition: all 0.3s ease-out;}
.main_rolling .list .txt_area .new_icon{width:16px; height:16px; line-height:16px; display:inline-block; background-color:var(--point-color-1); font-size:12px; color:#fff; text-align:center;}
.main_rolling .list .img_area{position:relative; border-radius:10px; overflow:hidden;}
.main_rolling .list .img_area a{position:relative; padding-bottom:100%; display:block; border-radius:10px; overflow:hidden;}
.main_rolling .list .img_area a:after{position:absolute; left:0; top:0; z-index:4; width:100%; height:100%; border:2px solid var(--point-color-1); display:block ;content:"";box-sizing:border-box; border-radius:10px; opacity:0;  transition: all 0.3s ease-out;}
.main_rolling .list:hover .img_area a:after{opacity:1;}
.main_rolling .list .img_area a img{position:absolute; left:0; top:0; z-index:1; width:100%; height:100%;  object-fit: cover;}
.main_rolling .list .img_area .icon_like{position:absolute; right:10px; top:10px; width:18px; height:18px; z-index:5; background:url(../img/icon_like.svg) no-repeat center center;}
.main_rolling .list .img_area .icon_like.on{background:url(../img/icon_like_on.svg) no-repeat center center;}
.main_rolling .list:hover .img_area a:before{opacity:1;}
.main_rolling .list:hover .txt_area a{color:var(--point-color-1);}
.main_notice_list ul{display:flex; flex-wrap:wrap;}
.main_notice_list ul li{margin-bottom:12px; width:49.2%; box-sizing:border-box;}
.main_notice_list ul li:nth-child(2n){margin-left:auto; }
.main_notice_list ul li a{padding: 28px 20px; display:flex; box-sizing:border-box; height:105px; transition: all 0.3s ease-out; border-radius: 10px; background-color:#fff; overflow:hidden; box-shadow: 1px 3px 6px rgba(0, 0, 0, 0.1);}
.main_notice_list ul li a>div{width:100%;}
.main_notice_list ul li .new_icon{margin-left:5px; display:inline-block; width:16px; height:16px; line-height:16px; text-align:center; background-color:var(--point-color-1); color:#fff; font-size:12px; color:#fff;}
.main_notice_list ul li a:hover{background-color:var(--point-color-1);}
.main_notice_list ul li .title{margin-bottom:10px; color:#222; transition: all 0.3s ease-out;}
.main_notice_list ul li .date{margin-top:5px; font-size:0.875rem; color:#999; transition: all 0.3s ease-out;}
.main_notice_list ul li:hover .date,
.main_notice_list ul li:hover .title{color:#fff;}

@keyframes quick_icon {
  0%   {transform: rotate( 0deg );}
  50% {transform: rotate( -10deg );}
  100% {transform: rotate( 0deg );}
}

.quick{position:fixed; right:3%;  z-index:9; text-align:right; bottom:10%;}
.quick .balloon{width:204px; height:94px; padding-bottom:20px; text-align:center; background:url(../img/balloon.svg) no-repeat center center; display:flex; align-items: center; justify-content: center; box-sizing:border-box;}
.quick .balloon>div{display:inline-block; text-align:left; font-size:0.9375rem;}
.quick .balloon strong{color:var(--point-color-1); font-weight:500;}
.quick .icon{position:relative; display:inline-block;}
.quick .icon img{position:relative; z-index:2;}
.quick .icon .arm{position:absolute; left:-30px; top:10px; z-index:1; animation: quick_icon 1.5s infinite linear; transform-origin:right;}

.fixed_map{position:fixed; left:50%; top:13%; z-index:80; margin-left:450px; transform: translate(-50%, 0);}
.fixed_map .inner{margin-top:35px;padding-right:20px;}
.fixed_map .box{position:relative; padding:30px 0; width:350px; height:410px; background-color:#fff; border-radius:10px; box-shadow:1px 3px 10px rgba(0,0,0,0.1); display:flex; align-items: center; justify-content: center; overflow:hidden;}
.fixed_map .box .map{position:relative; }
.fixed_map .box .map:before{position:absolute; right:-2%; bottom:3%; width:70px; height:60px; border-radius:5px; border:2px solid #ddd; display:block;content:"";}
.fixed_map .box .map_link_list li{position:absolute;}
.fixed_map .box .map_link_list li a{position:relative; padding-top:26px; font-size:13px; color:#F0AD6B; font-weight:500; min-width:70px; height:50px; display:block; text-align:center;}
.fixed_map .box .map_link_list li a .num{position:absolute; left:50%; top:0; width:24px; height:25px; background:url(../img/map_num.svg) no-repeat center center;  display:block; transform: translateX(-50%); color:#fff;}
.fixed_map .box .map_link_list li#bo_cate_on2>a .number{background:url(img/map_num_W.svg) no-repeat center center; color:var(--point-color-1);}
.fixed_map .box .map_link_list li#bo_cate_on2>a{color:#fff;}

.fixed_map .box .map_link_list li:nth-child(1){left:12%; top:19%;}
.fixed_map .box .map_link_list li:nth-child(2){right:37%; top:12%;}
.fixed_map .box .map_link_list li:nth-child(3){left:25%; top:32%;}
.fixed_map .box .map_link_list li:nth-child(4){left:8%; top:37%;}
.fixed_map .box .map_link_list li:nth-child(5){left:14%; top:54%;}
.fixed_map .box .map_link_list li:nth-child(6){right:26%; top:42%;}
.fixed_map .box .map_link_list li:nth-child(7){left:9%; top:71%;}
.fixed_map .box .map_link_list li:nth-child(8){right:36%; top:65%;}
.fixed_map .box .map_link_list li:nth-child(9){right:-2%; bottom:5%;}
.fixed_map .box .map_link_list .map_link_list{position:relative; width:100%; height:100%;}
.map_link_box h1{position:absolute; left:0; top:0; width:100%; text-align:right; font-size:1.25rem; font-weight:700;}
.map_link_box{width:100%; height:100%;}
.map_link_box .slick-track,
.map_link_box .slick-list{height:100%; overflow:inherit;}

.map_link_wrap{position:absolute; left:0; top:0; bottom:0; width:100%; height:100%;}
.map_link_wrap .slick-dots{display:flex; align-items:center; justify-content:center;}
.map_link_wrap .slick-dots li{margin:0 2px;}
.map_link_wrap .slick-dots li button{width:10px; height:10px; border-radius:50%; background-color:var(--point-color-1); display:block; text-indent:-9999px; opacity:0.5;}
.map_link_wrap .slick-dots li.slick-active button{opacity:1;}

@media screen and (max-width: 1280px) {
.fixed_map{left:auto; right:0; margin:0; transform:translate(0, 0)}
.main_rolling_list{padding-right:0;}
}
@media screen and (max-width: 960px) {
.fixed_map{position:relative; top:0; margin:40px auto; }
.fixed_map .inner{padding-right:0;}
.fixed_map .box{margin:0 auto; }
.main_inner{max-width:100%;}
.top_banner_inner{padding-bottom:5px;}
.top_banner .dont_today{position:relative; right:auto; top:auto; padding-right:40px; transform:translateY(0);text-align:right;}
.top_banner .top_banner_close{top:auto; bottom:3px; }
.quick{display:none;}
}
@media screen and (max-width: 650px) {
.top_banner_rolling .list img{left:50%; transform: translateX(-50%);}
.main_notice_list ul li a{padding:15px;}
}
@media screen and (max-width: 400px) {
.main_rolling_list{padding-right:60px;}
}

/* footer */
.footer{padding:40px 0; border-top:1px solid #ddd;}
.footer_inner{margin:0 auto; max-width:var(--width); padding:var(--padding); box-sizing:border-box; display:flex; }
.footer .left_area{width:32%; }
.footer .info_cont{position:relative; width:42%; padding:0 60px; }
.footer .right_area {width: 26%;}
.footer .left_area .title{margin-bottom:10px; font-size:1.125rem; font-weight:600; color:#666;}
.footer .left_area .cs_center li{position:relative; margin-bottom:4px; padding-left:10px; font-size:0.875rem; color:#444;}
.footer .left_area .cs_center li:before{position:absolute; left:0; top:8px; width:3px; height:3px; background-color:#666; display:block; content:""; border-radius:50%;}
.footer .left_area .cs_center li strong{font-weight:700; color:var(--point-color-1);}
.footer .left_area p{margin:5px 0 25px; font-size:0.8125rem; color:#888888;}
.footer .left_area p strong{font-weight:700; color:var(--point-color-1)}
.footer .left_area .menu_list ul{display:flex; flex-wrap:wrap;}
.footer .left_area .menu_list ul li{margin-right:8px;}
.footer .left_area .menu_list ul li a{padding:5px 12px; display:block; border-radius:5px; border:1px solid #DBDBDB; font-size:0.75rem;}
.footer .info_cont ul li{margin-bottom:10px; display:Flex; font-size:0.875rem; color:#666; }
.footer .info_cont ul li strong{width:115px; display:block; font-weight:400; }
.footer .info_cont ul li span{width:calc(100% - 115px); display:block; }
.footer .right_area .sns{margin-bottom:40px; display:flex; justify-content: flex-end;}
.footer .right_area .sns li{margin-left:5px;}
.footer .right_area .family_list{position:relative; margin-left:auto; width:200px; }
.footer .right_area .family_site_list{position:absolute; left:0; bottom:41px; padding-bottom:8px;  width:100%; z-index:5; display:none;}
.footer .right_area .family_site_list ul{border:1px solid #ddd; border-radius:5px; background-color:#FFFFFD;}
.footer .right_area .family_site_list ul li a{padding:8px 8%; display:block;  transition: all 0.3s ease-out; font-size:0.875rem; color:#666;}
.footer .right_area .family_site_list ul li a:hover{background-color:#FFF9E6; color:var(--point-color-1);}
.footer .right_area .btn_family_open{padding:0 15px; width:100%; height:42px; line-height:40px; border-radius:5px; border:1px solid #ddd; box-sizing:border-box; text-align:left; font-size:0.8125rem; color:#888; background:url(../img/arrow.svg) no-repeat right 10px center #FAFAFA;}
.footer .copyright{margin-top:20px; font-size:0.75rem; color:#999; text-align:right;}
.footer .info_cont:before{position:absolute; left:0; top:0; width:1px; height:100%; background-color:#eee; display:block; content:"";}
.footer .info_cont:after{position:absolute; right:0; top:0; width:1px; height:100%; background-color:#eee; display:block; content:"";}
@media screen and (max-width: 1200px) {
.footer .info_cont{padding:0 30px;}
}
@media screen and (max-width: 1024px) {
.footer_inner{flex-wrap:wrap;}
.footer .left_area{width:50%; box-sizing:border-box;}
.footer .info_cont{width:50%; box-sizing: border-box;}
.footer .right_area{width:100%; text-align:center; padding-top:20px; }
.footer .right_area .sns{margin-bottom:10px; justify-content: center;}
.footer .right_area .family_list{margin:0 auto;}
.footer .copyright{text-align:center;}
.footer .info_cont{padding:0 0 0 15px; }
.footer .info_cont:after{display:none;}
}
@media screen and (max-width: 640px) {
.footer{padding:20px 0;}
.footer .left_area{width:100%; text-align:center; }
.footer .right_area{width:100%;}
.footer .left_area .cs_center{display:inline-block;}
.footer .left_area .cs_center li{text-align:left;}
.footer .left_area .menu_list ul{justify-content: center;}
.footer .info_cont:before{display:none;}
.footer .info_cont{padding:20px 0 0; text-align:center; width:100%;}
.footer .info_cont ul{display:inline-block; text-align:left;}
.main_event_prev,
.main_rolling .main_rolling_prev{left:-2%;}
.main_event_next,
.main_rolling .main_rolling_next{right:-2%;}
}

/* layout */
.sub_container{padding:60px 0 100px;min-height:calc(100% - (var(--headerH) + var(--topBannerH) + 235px));}
.sub_title{margin-bottom:60px;}
.sub_title h1{font-size:1.75rem; font-weight:700; text-align:center; line-height:1;}
.sub_cont{margin:0 auto; max-width:var(--width); padding:var(--padding); box-sizing:border-box;}
.top_control{display:flex; justify-content: flex-end; align-items: center;}
.top_control ul{display:flex; justify-content: flex-end; align-items: center;}
.top_control ul li{margin-left:8px;}
.top_control ul li a{width:36px; height:36px; border-radius:50%; border:1px solid #ddd; box-sizing:border-box; display:block; border-radius:50%;}
.top_control ul li .btn_file{background:url(../img/icon_file.svg) no-repeat center center #fff; background-size:20px;}
.top_control ul li .btn_print{background:url(../img/icon_print.svg) no-repeat center center #fff;}