@charset "utf-8";
/*
	- 반응형 미디어쿼리 css
	- 원본코드 이외에 "미디어쿼리 구현 css"는 사용자 본인이 케어 하셔야 합니다.
	  (*원본코드 이슈 만 관리자 푸시가능)

	- 간단설명
	  @media all and (min-width:1025px){ } => 1025px 이상만 적용됨
	  @media all and (max-width:1024px){ } => 1024px 이하만 적용됨
	  @media all and (max-width:480px){ } => 480px 이하만 적용됨

    - 미디어쿼리 기술에 경우 개인이 정보습득후 직접 추가구현 하셔야 합니다.
    - 원본이외에 추가 작업은 자유이나 문제시 직접케어 / 작업의뢰 하셔도 됩니다. 
*/

@media all and (min-width: 1025px) {
  .contents_area .skinDiv.subMo {
    display: none;
  } /* 베스트스킨 서브만 적용 */
  .contents_area .skinDiv.subMo_361px {
    display: none;
  } /* 베스트스킨 서브만 적용 */
  .contents_area .skinDiv.subPc {
    display: block;
  } /* 베스트스킨 서브만 적용 */
}

@media all and (max-width: 1024px) {
  .story_logo img {
    height: 60px;
  }

  /* 레이아웃 */
  #top_proban_wrap00,
  .story_newConnect,
  .story_login,
  .story_pm_topban,
  .topmenu1_wrap00,
  .story_side_contents_L,
  .story_side_contents_R,
  .openmenu_wrap00,
  .gnb1_area_top1type_bg1,
  .gnb1_area_top1type_bg2,
  .gnb1_area_top2type_bg1,
  .gnb1_area_top3type_bg1,
  .story_set,
  .story_favorite_start,
  .gnb1_area_top_bg1,
  .gnb1_area_menu_shadow,
  .main_ban3case .mainban_pointbg,
  .story_tooltip.search {
    display: none !important;
  }

  .story_search .submit {
    display: block;
  }

  .gnb1_area_wrap0 {
    height: 80px;
    width: 100% !important;
    background: #c23e30;
  }

  .story_menu_MobileBtn {
    display: block;
  }

  .story_logo {
    left: 18px !important;
    top: 8px !important;
    width: auto !important;
    text-align: left;
  }

  .story_allcon_wrap0,
  .story_contents_box {
    width: 100% !important;
    padding: 0px !important;
  }

  .main_ban3case ul.mainban_tab {
    top: 40px;
    left: 50% !important;
    margin-left: -90px;
    background-color: #eee;
    border-radius: 25px;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
  }
  .main_ban3case ul.mainban_tab li {
    float: left;
    margin-bottom: 0;
  }
  .main_ban3case ul.mainban_tab li > i {
    width: 60px;
  }
  .owl-carousel {
    margin-top: 105px;
  }

  .footer_Util_wrap0 {
    width: 100% !important;
    padding: 30px 20px;
  }
  .story_utilMenu,
  .story_snsLink {
    position: relative;
    top: auto;
    right: auto;
    clear: left;
    padding-top: 20px;
  }
  .story_utilMenu ul li:first-child {
    padding-left: 0;
  }
  .story_snsLink ul li:first-child {
    padding-left: 0;
  }

  .main_ban3case ul.mainban_panel {
    margin: 0 5px;
  }

  .mainban_area_wrap {
    border-radius: 0;
    margin-top: 20px !important;
  }
  .mainban .slides img,
  .loading_mb img {
    width: 100% !important;
    height: auto !important;
  }

  .contents_area {
    padding: 0 15px !important;
  }

  .story_dark {
    position: fixed;
    right: 10px;
    bottom: 11px;
    background-color: rgba(0, 0, 0, 0.3);
  }

  .story_movetop {
    top: auto;
    bottom: 100px;
  }
  .story_movetop .story_mt {
    background-color: rgba(0, 0, 0, 0.3);
  }

  .hd_pops {
    top: 110px !important;
    left: 0 !important;
    margin: 20px;
  }
  .hd_pops_con {
    width: 100% !important;
    height: auto !important;
  }

  .gnb1_area_top_bg2 {
    background-color: transparent !important;
  }

  .story_search .inputText {
    background-color: #fff;
  }
  .story_search .submit {
    background-color: #ccc;
    border-radius: 0 25px 25px 0;
    -moz-border-radius: 0 25px 25px 0;
    -webkit-border-radius: 0 25px 25px 0;
  }

  /* 스킨 */
  .contents_area .skinDiv {
    clear: both;
    width: 100% !important;
    padding: 0 !important;
  }
  .contents_area .skinDiv.subMo {
    display: block;
  } /* 베스트스킨 서브만 적용 */
  .contents_area .skinDiv.subMo_361px {
    display: none;
  } /* 베스트스킨 서브만 적용 */
  .contents_area .skinDiv.subPc {
    display: none;
  } /* 베스트스킨 서브만 적용 */
  #bo_gall .gall_img,
  #bo_gall .gall_img a {
    width: 100% !important;
    height: auto !important;
  }
  #bo_gall .gall_img img,
  #bo_gall .gall_img video {
    width: 100% !important;
    height: auto !important;
  }

  .story_gall_item img {
    width: 100% !important;
    height: auto !important;
    vertical-align: top;
  }
}

@media all and (max-width: 1024px) and (min-width: 769px) {
  /* 레이아웃 */
  .story_search {
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    margin-left: -75px;
    top: 15px;
  }
  .story_search .inputText {
    width: 430px;
  }
}

@media all and (max-width: 920px) {
  /* 스킨 */
  .owl-carousel .owl-item {
    width: 140px !important;
  }
}

@media all and (min-width: 769px) {
  /* 레이아웃 */
  .story_search .submit {
    left: 386px;
  }
}

@media all and (max-width: 768px) {
  .story_search {
    display: none;
    left: 0;
    bottom: 20px;
    width: 100%;
    padding: 0 15px;
  }
  .story_search .inputText {
    position: relative;
    width: 100%;
  }
  .story_search .submit {
    position: absolute;
    right: 15px;
    width: 44px;
  }
  .story_search .fa-search {
    left: 30px;
  }
}

@media all and (min-width: 481px) {
  /* 레이아웃 */

  /* 스킨 */
  #bo_list .td_subject .td_subject_mq480 {
    display: none;
  }
  .contents_area .gxSkin_new .td_subject_mq480 {
    display: none;
  }
}

@media all and (max-width: 480px) {
  /* 레이아웃 */
  html,
  body,
  iframe,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  a,
  img,
  dl,
  dt,
  dd,
  fieldset,
  form,
  input,
  label,
  table,
  caption,
  tbody,
  tfoot,
  thead,
  tr,
  th,
  td,
  embed,
  hgroup,
  ul,
  ol,
  li,
  textarea,
  select,
  button {
    font-size: 15px;
  }

  .story_copytxt p {
    font-size: 13px;
  }
  .story_utilMenu {
    display: none;
  }

  /* 스킨 */
  .owl-item.active:nth-child(n + 2) {
    margin-left: 25px;
  }
  .owl-item.active:nth-child(n + 3) {
    margin-left: 50px;
  }
  .owl-item.active:nth-child(n + 4) {
    margin-left: 70px;
  }
  .owl-item.active:nth-child(n + 5) {
    margin-left: 95px;
  }
  .owl-item.active:nth-child(n + 6) {
    margin-left: 120px;
  }
  .owl-item.active:nth-child(n + 7) {
    margin-left: 140px;
  }
  .owl-item.active:nth-child(n + 8) {
    margin-left: 165px;
  }
  .owl-item.active:nth-child(n + 9) {
    margin-left: 190px;
  }
  .owl-item.active:nth-child(n + 10) {
    margin-left: 210px;
  }
  .owl-item.active:nth-child(n + 11) {
    margin-left: 230px;
  }
  .latest_story_gall .item > h3 > a {
    font-size: 13px;
  }

  .story_wgPopularT2 a:not(.popu_more) {
    font-size: 15px;
  }

  .story_wgPopularT2 ul.wgP_contents .wgPdate,
  .story_common_listTable td.date {
    display: none;
  }

  .story_common_gallULa li {
    /* width:47%; */
    width: 29.7%;
  }
  .story_common_gallULa li:nth-of-type(4),
  .story_common_gallULa li:nth-of-type(7),
  .story_common_gallULa li:nth-of-type(10) {
    margin-left: 0;
  }
  .story_common_gallULa li:nth-child(7) {
    /* display:none; */
  } /* 480이하 갤러리스킨 6개 고정 */
  .story_common_gallULa li .thumb,
  .story_common_gallULa li .thumb img {
    width: 100% !important;
    height: auto !important;
  }
  /* .story_common_gallULa li .thumb.noimg{height:0 !important; padding-top:calc(220/151*100%);}  calc(이미지높이 ÷ 이미지가로 × 100 %) */
  /*.story_common_gallULa li .thumb, .story_common_gallULa li .thumb img{width:100% !important; height:auto !important;} 갤러리 1~3 공통 _ old */

  .story_common_webzULa li .titconArea,
  .story_common_webzULa li.type2 .titconArea,
  .story_common_webzULa li.type3 .titconArea {
    width: 100% !important;
  }
  .story_common_webzULa.type2 li:nth-of-type(3) {
    clear: both;
  }
  .story_common_webzULa.type3 li {
    margin-left: 0;
  }
  .story_common_webzULa li .titconArea .title {
    line-height: 20px;
    margin-bottom: 5px;
  }
  .story_common_webzULa li.type2 .titconArea .title {
    line-height: 32px;
    margin-bottom: 0;
  }
  .story_common_webzULa li .thumbArea .thumb,
  .story_common_webzULa li .thumbArea .thumb img {
    width: 110px !important;
    height: auto !important;
  } /* 웹진 1 */
  .story_common_webzULa li:nth-child(5) {
    display: none;
  } /* 480이하 웹진스킨 4개 고정 */
  .story_common_webzULa li.type2 {
    width: 47%;
  }
  .story_common_webzULa li.type3 {
    width: 100%;
  }
  .story_common_webzULa li.type2:nth-of-type(3),
  .story_common_webzULa li.type2:nth-of-type(6),
  .story_common_webzULa li.type2:nth-of-type(8),
  .story_common_webzULa li.type2:nth-of-type(10) {
    margin-left: 0;
  }
  .story_common_webzULa li.type2 .thumbArea .thumb,
  .story_common_webzULa li.type2 .thumbArea .thumb img {
    width: 100% !important;
    height: auto !important;
  } /* 웹진 2 */
  .story_common_webzULa li.type3 .thumbArea .thumb,
  .story_common_webzULa li.type3 .thumbArea .thumb img {
    width: 100% !important;
    height: auto !important;
  } /* 웹진 3 */

  .tbl_head01 thead,
  #bo_list .td_num2,
  #bo_list .td_name,
  #bo_list .td_num,
  #bo_list .td_datetime {
    display: none;
  }
  #bo_list .td_subject {
    line-height: 24px;
  }
  #bo_list .td_subject .td_subject_mq480 {
    display: block;
    margin-top: 5px;
  }
  #bo_list .td_subject .td_subject_mq480 span {
    margin-right: 5px;
  }
  #bo_list .td_subject .td_subject_mq480 span i {
    vertical-align: middle;
  }
  #bo_list .bo_tit a {
    font-size: 15px;
    font-weight: normal;
  }
  #bo_list .bo_notice .bo_tit a {
    font-weight: 700;
  }
  #bo_v_share .btn {
    width: auto;
  }

  #bo_gall .gall_box {
    margin-bottom: 25px !important;
  }
  #bo_gall .gall_li:nth-child(even) {
    clear: both;
  }
  .gall_row .col-gn-2,
  .gall_row .col-gn-3,
  .gall_row .col-gn-4,
  .gall_row .col-gn-5,
  .gall_row .col-gn-6,
  .gall_row .col-gn-7,
  .gall_row .col-gn-8,
  .gall_row .col-gn-9,
  .gall_row .col-gn-10 {
    width: 50% !important;
  }

  #new_sch select,
  #new_sch .frm_input {
    margin-bottom: 10px;
  }
  .contents_area .gxSkin_new .td_group,
  .contents_area .gxSkin_new .td_board,
  .contents_area .gxSkin_new .td_name,
  .contents_area .gxSkin_new .td_date {
    display: none;
  }
  .contents_area .gxSkin_new td {
    line-height: 24px;
  }
  .contents_area .gxSkin_new .td_subject_mq480 {
    display: block;
    margin-top: 8px;
  }
  .contents_area .gxSkin_new .td_subject_mq480 span {
    margin-right: 5px;
  }
  .contents_area .gxSkin_new .td_subject_mq480 > span:nth-of-type(1) a {
    padding: 3px 4px;
    background-color: #edfbde;
    color: #8cc152;
    font-weight: normal;
    border-radius: 5px;
  }

  #fregister p {
    height: auto;
    line-height: 28px;
    padding: 10px;
  }
  #fregister p:before {
    display: none;
  }

  #sch_res_detail select {
    width: 50%;
    float: left;
  }
  #sch_res_detail .frm_input {
    width: 100%;
  }
  #sch_res_detail select,
  #sch_res_detail .frm_input {
    margin-bottom: 10px;
  }
  #sch_res_ov ul {
    float: left;
    margin: 20px 0;
  }
}

@media all and (max-width: 420px) {
  /* 스킨 */
  .owl-item.active:nth-child(n + 2) {
    margin-left: 25px;
  }
  .owl-item.active:nth-child(n + 3) {
    margin-left: 50px;
  }
  .owl-item.active:nth-child(n + 4) {
    margin-left: 75px;
  }
  .owl-item.active:nth-child(n + 5) {
    margin-left: 98px;
  }
  .owl-item.active:nth-child(n + 6) {
    margin-left: 120px;
  }
  .owl-item.active:nth-child(n + 7) {
    margin-left: 145px;
  }
  .owl-item.active:nth-child(n + 8) {
    margin-left: 170px;
  }
  .owl-item.active:nth-child(n + 9) {
    margin-left: 195px;
  }
  .owl-item.active:nth-child(n + 10) {
    margin-left: 215px;
  }
  .owl-item.active:nth-child(n + 11) {
    margin-left: 240px;
  }

  .latest_story_search .owl-item.active:nth-child(n + 5),
  .latest_story_comm .owl-item.active:nth-child(n + 5) {
    margin-left: 102px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 6),
  .latest_story_comm .owl-item.active:nth-child(n + 6) {
    margin-left: 125px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 7),
  .latest_story_comm .owl-item.active:nth-child(n + 7) {
    margin-left: 148px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 8),
  .latest_story_comm .owl-item.active:nth-child(n + 8) {
    margin-left: 170px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 9),
  .latest_story_comm .owl-item.active:nth-child(n + 9) {
    margin-left: 194px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 10),
  .latest_story_comm .owl-item.active:nth-child(n + 10) {
    margin-left: 220px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 11),
  .latest_story_comm .owl-item.active:nth-child(n + 11) {
    margin-left: 242px;
  }
}

@media all and (max-width: 413px) {
  /* 스킨 */
  .owl-item.active:nth-child(n + 2) {
    margin-left: 25px;
  }
  .owl-item.active:nth-child(n + 3) {
    margin-left: 50px;
  }
  .owl-item.active:nth-child(n + 4) {
    margin-left: 70px;
  }
  .owl-item.active:nth-child(n + 5) {
    margin-left: 95px;
  }
  .owl-item.active:nth-child(n + 6) {
    margin-left: 120px;
  }
  .owl-item.active:nth-child(n + 7) {
    margin-left: 140px;
  }
  .owl-item.active:nth-child(n + 8) {
    margin-left: 165px;
  }
  .owl-item.active:nth-child(n + 9) {
    margin-left: 190px;
  }
  .owl-item.active:nth-child(n + 10) {
    margin-left: 210px;
  }
  .owl-item.active:nth-child(n + 11) {
    margin-left: 230px;
  }
}

@media all and (max-width: 380px) {
  /* 스킨 */
  .owl-item.active:nth-child(n + 2) {
    margin-left: 5px;
  }
  .owl-item.active:nth-child(n + 3) {
    margin-left: 15px;
  }
  .owl-item.active:nth-child(n + 4) {
    margin-left: 20px;
  }
  .owl-item.active:nth-child(n + 5) {
    margin-left: 25px;
  }
  .owl-item.active:nth-child(n + 6) {
    margin-left: 30px;
  }
  .owl-item.active:nth-child(n + 7) {
    margin-left: 35px;
  }
  .owl-item.active:nth-child(n + 8) {
    margin-left: 40px;
  }
  .owl-item.active:nth-child(n + 9) {
    margin-left: 45px;
  }
  .owl-item.active:nth-child(n + 10) {
    margin-left: 50px;
  }
  .owl-item.active:nth-child(n + 11) {
    margin-left: 55px;
  }

  .latest_story_search .owl-item.active:nth-child(n + 5),
  .latest_story_comm .owl-item.active:nth-child(n + 5) {
    margin-left: 24px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 6),
  .latest_story_comm .owl-item.active:nth-child(n + 6) {
    margin-left: 30px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 7),
  .latest_story_comm .owl-item.active:nth-child(n + 7) {
    margin-left: 35px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 8),
  .latest_story_comm .owl-item.active:nth-child(n + 8) {
    margin-left: 40px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 10),
  .latest_story_comm .owl-item.active:nth-child(n + 10) {
    margin-left: 50px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 11),
  .latest_story_comm .owl-item.active:nth-child(n + 11) {
    margin-left: 55px;
  }

  .contents_area .skinDiv.subMo {
    display: none;
  } /* 베스트스킨 서브만 적용 */
  .contents_area .skinDiv.subMo_361px {
    display: block;
  } /* 베스트스킨 서브만 적용 */
}

@media all and (max-width: 365px) {
  /* 스킨 */
  .owl-item.active:nth-child(n + 2) {
    margin-left: 0;
  }
  .owl-item.active:nth-child(n + 6) {
    margin-left: -10px;
  }

  .latest_story_search .owl-item.active:nth-child(n + 5),
  .latest_story_comm .owl-item.active:nth-child(n + 5) {
    margin-left: -5px;
  }
  .latest_story_search .owl-item.active:nth-child(n + 6),
  .latest_story_comm .owl-item.active:nth-child(n + 6) {
    margin-left: -10px;
  }
}

@media all and (max-width: 398px) and (min-width: 361px) {
  .story_common_gallULa li {
    width: 29.2%;
  }
}

@media all and (max-width: 361px) {
  /* 스킨 */
  .story_common_gallULa li {
    margin-left: 16px;
  }
  .story_common_webzULa li.type2 {
    width: 46%;
  }
}

/*모바일메뉴 넓이*/
@media all and (max-width: 979px) {
  .story_mobileM_G {
    width: 40%;
  }
}
@media all and (max-width: 768px) {
  .story_mobileM_G {
    width: 50%;
  }
}
@media all and (max-width: 707px) {
  .story_mobileM_G {
    width: 60%;
  }
}
@media all and (max-width: 480px) {
  .story_mobileM_G {
    width: 70%;
  }
}

/*모바일메뉴_닫기 위치*/
@media all and (max-width: 979px) {
  .story_mobileM_G_close {
    right: 40%;
  }
}
@media all and (max-width: 768px) {
  .story_mobileM_G_close {
    right: 50%;
  }
}
@media all and (max-width: 707px) {
  .story_mobileM_G_close {
    right: 60%;
  }
}
@media all and (max-width: 480px) {
  .story_mobileM_G_close {
    right: 70%;
  }
}
