/* popup */

/* 230421 - 팝업 FIXED 없앰 */
.popup_type {
  /* position: fixed; */
  left: 0;
  top: 0;
  z-index: 9998;
}
.popup_style {
  position: absolute;
  z-index: 99999;
  border: 1px solid #000;
  background-color: #fff;
  display: none;
  overflow: hidden;
}

/* 1107 팝업추가 */
.popup_style img {
  width: 100%;
  height: calc(auto - 30px);
  object-fit: contain;
}

.pop_pc {
  display: block;
}
.pop_mobile {
  display: none;
}

h2 {
  font-size: 30px;
  font-weight: 500;
  text-align: center;
  line-height: 56px;
  background: url(../images/title_underline.png) no-repeat center bottom;
}

/* main_visual */
#home .m_txt {
  font-family: 'NanumSquare', sans-serif;
  font-weight: 800;
  font-size: 46px;
  line-height: 61px;
  color: #ffffff;
  text-shadow: 5px 5px 7px rgba(0, 0, 0, 0.6);
  position: absolute;
  left: 10%;
  top: 40%;
}
#home .m_txt2 {
  font-family: 'NanumSquare', sans-serif;
  font-weight: 400;
  font-size: 21px;
  line-height: 32px;
  color: #ffffff;
  text-shadow: 5px 5px 7px rgba(0, 0, 0, 0.6);
  display: block;
  padding-left: 7px;
}
.white,
.white-hover:hover {
  color: white !important;
}

/*
#main_visual {}
#main_visual .slide  li {background-repeat: no-repeat; background-position: center top; }
#main_visual .s1 {background-image: url(../images/main_slide1.jpg); position:relative; height:650px; }
#main_visual .s2 {background-image: url(../images/main_slide2.jpg); position:relative; height:650px; }
#main_visual .s3 {background-image: url(../images/main_slide3.jpg); position:relative; height:650px; }
#main_visual .m_txt {font-family: 'NanumSquare', sans-serif;  font-weight: 800; font-size: 46px; line-height: 61px; color:#ffffff; text-shadow: 5px 5px 7px rgba(0, 0, 0, 0.6); position: absolute; left: 10%; top:40%;}
#main_visual .m_txt2 {font-family: 'NanumSquare', sans-serif;  font-weight: 400; font-size: 21px; line-height: 32px; color:#ffffff; text-shadow: 5px 5px 7px rgba(0, 0, 0, 0.6); display: block; padding-left:7px;}
#main_visual .s2 .m_txt {top:45%; font-size:39px;}
#main_visual .s3 .m_txt {margin-left:0; text-align: right; top:60%; left: auto; right: 10%;}

.bx-wrapper {border: none; margin-bottom: 0;}
.bx-wrapper .bx-pager {text-align: center; padding-top: 20px; position: absolute; bottom: 30px; width: 100%; z-index: 500;}
.bx-pager-item {display: inline-block; vertical-align: bottom; }
.bx-wrapper .bx-pager.bx-default-pager a {background-color: rgb(255,255,255,0.3); text-indent: -9999px; display: block; width: 46px; height: 3px; margin: 0 5px; outline: 0;}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus { background-color: rgb(255,255,255,0.7);}
.bx-wrapper .bx-prev {width: 32px; height: 32px; margin-top: -16px; left: 50px; background: url(../images/pre.png) no-repeat 0 0px;}
.bx-wrapper .bx-next {width: 32px; height: 32px; margin-top: -16px; right: 50px; background: url(../images/next.png) no-repeat 0px 0px;}
*/

/* board */
#board {
  height: 250px;
  padding-top: 63px;
  font-size: 0;
}
.icon {
  width: 767px;
  font-size: 0;
  font-family: 'NanumSquare', sans-serif;
  text-align: center;
  display: inline-block;
  vertical-align: top;
}
.icon li {
  display: inline-block;
  font-size: 19px;
  line-height: 27px;
  width: 25%;
  color: #4d4d4d;
}
.icon li span {
  display: block;
  width: 100%;
  height: 87px;
  background-repeat: no-repeat;
  background-position: center top;
  transition: transform 0.5s;
}
.icon li:hover span {
  transform: scale(1.1);
}
/*
.icon li:hover {
    animation: ani_icon 0.3s forwards; 
    -ms-animation: ani_icon 0.3s forwards; 
    -webkit-animation: ani_icon 0.3s forwards; 
    -moz-animation: ani_icon 0.3s forwards; 
    -ms-animation: ani_icon 0.3s forwards; 
    -o-animation: ani_icon 0.3s forwards; 
}
*/
.icon li a {
  display: block;
}
.icon li:nth-child(1) span {
  background-image: url(../images/main_icon1.png);
}
.icon li:nth-child(2) span {
  background-image: url(../images/main_icon2.png);
}
.icon li:nth-child(3) span {
  background-image: url(../images/main_icon3.png);
}
.icon li:nth-child(4) span {
  background-image: url(../images/main_icon4.png);
}
.icon li:nth-child(4) a {
  color: #ff6100;
}
/*

@keyframes ani_icon{
    0% {background-size: 71px auto;}
    100% {background-size: 76px auto;}
}
*/

.notice {
  width: 513px;
  display: inline-block;
  vertical-align: top;
  padding: 0 90px 0 48px;
  font-family: '돋움', 'Dotum';
  position: relative;
}
.notice h3 {
  font-size: 14px;
  line-height: 42px;
  color: #333333;
}
.notice li {
  width: 100%;
  font-size: 12px;
  line-height: 24px;
  position: relative;
  padding-left: 8px;
  padding-right: 74px;
  background: url(../images/list_dot.png) no-repeat left center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.notice li span {
  position: absolute;
  right: 0;
  top: 0;
}
.notice a {
  color: #666666;
}
.btn_notice_more {
  position: absolute;
  top: 10px;
  right: 92px;
  font-size: 11px;
  color: #919090;
  background: url(../images/btn_more.png) no-repeat right center;
  padding-right: 21px;
  line-height: 17px;
}

/* program */
#program {
  margin-bottom: 105px;
}
#program .inner_wrap {
  max-width: 1300px;
}
#program .view_pc {
  display: inline;
}
#program .view_tablet {
  display: none;
}
#program .view_tablet2 {
  display: none;
}
#program .mobile_program_title {
  display: none;
}
#program h2 {
  margin-bottom: 52px;
}
#program ul {
  font-size: 0;
  text-align: center;
}
/* 1006 프로그램추가영역 width값 변경 */
#program li {
  display: inline-block;
  font-family: 'NanumSquare', sans-serif;
  width: 20%;
  /* width: 25%; */
  padding: 0 10px;
}

/* 1006 야구영역 섹션 추가 */
#program li.mobile-program-five {
  display: none;
}

#program li:hover img {
  transform: scale(1.1);
}
#program li img {
  width: 100%;
  transition: transform 0.5s;
}
#program li a {
  display: block;
  width: 100%;
  height: 100%;
  background-position: center center;
  overflow: hidden;
  position: relative;
}
#program li p {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  font-size: 24px;
  line-height: 66px;
  color: #fff;
  text-align: left;
  padding-left: 37px;
  background-color: rgba(0, 0, 0, 0.5);
}
/*
.p_name1 {background-image:url(../images/program_banner1.jpg)}
.p_name2 {background-image:url(../images/program_banner2.jpg)}
.p_name3 {background-image:url(../images/program_banner3.jpg)}
.p_name4 {background-image:url(../images/program_banner4.jpg)}
.p_name5 {background-image:url(../images/program_banner5.jpg)}
*/

/* main_bg1 */
#main_bg1 > div {
  /*height:653px;*/
  background: url(../images/main_bg1.jpg) no-repeat center fixed;
  background-size: auto 100%;
}
#main_bg1 > div > img {
  width: 100%;
}

/* facilities */
#facilities {
  margin: 39px 0 76px;
}
#facilities .inner_wrap {
  max-width: 1300px;
}
#facilities h2 {
  margin-bottom: 22px;
}
#facilities ul:after {
  clear: both;
  display: block;
  content: '';
}
#facilities li {
  width: 33.3%;
  float: left;
  padding: 0 10px;
}
#facilities li:hover .fac_img img {
  transform: scale(1.1);
}
.fac_img {
  background-color: #f2f2f2;
  padding-top: 10px;
  vertical-align: bottom;
  overflow: hidden;
}
.fac_img img {
  vertical-align: bottom;
  width: 100%;
  transition: all 0.5s;
}
.fac_info {
  background-color: #f2f2f2;
  padding: 9px 22px 28px;
  border-top: 3px solid #ffffff;
}
.fac_info .fac_name {
  font-size: 17px;
  font-weight: 700;
  line-height: 26px;
}
.fac_info .fac_addr {
  font-size: 15px;
  color: #808080;
  line-height: 25px;
}

/* main_bg2 */
#main_bg2 > div {
  /*height:653px;*/
  background: url(../images/main_bg2.jpg) no-repeat center fixed;
  background-size: auto 100%;
}
#main_bg2 > div > img {
  width: 100%;
}

/* logo_banner */
#logo_banner {
  font-size: 0;
  margin: 108px 0 38px;
  text-align: center;
}
#logo_banner li {
  display: inline-block;
  margin-right: 79px;
}
#logo_banner li:last-child {
  margin-right: 0;
}

/* slick slide button */
#logo_banner .slick-prev,
#logo_banner .slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  display: block;
  width: 20px;
  height: 100%;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: red;
  border: none;
  outline: none;
  background: transparent no-repeat center center / 10px 20px;
  opacity: 0;
  z-index: 999;
}
#logo_banner .slick-prev {
  left: 0;
  background-image: url(../images/pre.png);
}
#logo_banner .slick-next {
  right: 0;
  background-image: url(../images/next.png);
}
#logo_banner .slick-prev:hover,
#logo_banner .slick-next:hover {
  background-color: #000;
  opacity: 1;
  transition: opacity 0.5s;
}

@media screen and (max-width: 1280px) {
  #board {
    height: auto;
    padding: 60px 0;
  }
  #board .inner_wrap {
    text-align: center;
  }
  .icon {
    width: 100%;
  }
  .notice {
    width: 100%;
    margin-top: 30px;
    padding: 0 50px;
    text-align: left;
  }
  .btn_notice_more {
    right: 50px;
  }

  #logo_banner li {
    margin: 10px 20px !important;
  }
  #logo_banner .slick-prev,
  #logo_banner .slick-next {
    background-color: #000;
  }
}

@media screen and (max-width: 1100px) {
  #program {
    padding: 16px;
  }
  #program .view_pc {
    display: none;
  }
  #program .view_tablet {
    display: inline;
  }
  #program li {
    padding: 4px;
  }
  #program li p {
    bottom: 50%;
    transform: translateY(50%);
    font-family: 'NanumSquare', sans-serif !important;
    font-weight: 800;
    font-size: 22px;
    line-height: auto;
    color: #fff;
    text-align: center;
    padding-left: 0;
    background-color: transparent;
    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5);
  }
}

@media screen and (max-width: 767px) {
  .pop_pc {
    display: none;
  }
  .pop_mobile {
    display: block;
    width: 100%;
    top: 50%;
  }
  .pop_mobile > div {
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%);
  }

  #program h2 {
    display: none;
  }
  #program .view_tablet2 {
    display: inline;
  }
  #program .mobile_program_title {
    display: inline-block;
    vertical-align: top;
  }
  #program .mobile_program_title a {
    cursor: auto;
  }
  #program .mobile_program_title p {
    font-family: 'Noto Sans KR';
    font-weight: 900;
    color: #fff;
    font-size: 22px;
    text-shadow: none;
  }
  #program li {
    width: 33.3%;
  }
}

@media screen and (max-width: 720px) {
  /*
    #main_visual .slide li {background-size: cover;}
    #main_visual .s1 {height: 350px;}
    #main_visual .s2 {height: 350px;}
    #main_visual .s3 {height: 350px;}
*/
  #home .m_txt {
    font-size: 7vw !important;
    line-height: 9.5vw;
    top: 50% !important;
    transform: translateY(-50%);
  }
  #home .m_txt2 {
    font-size: 3.5vw;
    line-height: 4.5vw;
    margin-top: 5px;
  }

  /*.bx-wrapper .bx-prev, .bx-wrapper .bx-next {display: none;}*/
  .icon {
    max-width: 500px;
  }
  .icon li {
    width: 50%;
    margin-bottom: 20px;
  }
  #facilities li {
    width: 100%;
    padding: 0 20px 20px;
  }
    /* 신어 시민체육관 슬라이드 추가하면서 문제 생겨서 삭제함 241121 */
    /*
  #home_slider > ul > li:nth-child(1) {
    display: none;
  }
    */
}

@media screen and (max-width: 480px) {
  #program .mobile_program_title p {
    font-family: 'Noto Sans KR';
    font-weight: 900;
    color: #fff;
    font-size: 22px;
    text-shadow: none;
  }
  #program li {
    width: 50%;
  }
  /* 1006 야구섹션 투명 처리 */
  #program li.mobile-program-five {
    display: inline-block;
  }
}
