.sub_visual {

  overflow: hidden;

  position: relative;

  height: calc(100vh - 800px);

  color: #fff;

  min-height: 450px; /*서브페이지 상단이미지 높이조절*/

}



.title_warp {

  position: relative;

  z-index: 1;

  display: table;

  width: 100%;

  height: 100%;

}

.title_page {

  display: table-cell;

  vertical-align: middle;

  width: 100%;

  height: 100%;

}

.contents {

  position: relative;

  width: 100%;

  padding: 0;

  z-index: 2;

  margin-top: 150px; /*서브페이지 상단 타이틀 빈공간 높이조절*/

}

.sub_visual p {

  font-size: 20px;

  padding-top: 10px;

  line-height: 1.0;

  opacity: 1;

  text-align: left;

  word-break: keep-all;

  max-width: 600px;

}



/* sub - page title */



.page_info .m_location {

  max-width: 1400px;

  margin: 0 auto;

}

.page_info .tab_menu ul {

  max-width: 1400px;

  margin: 0 auto;

}

.page_info .tab_menu {

  margin: 25px 0 25px;

}



.location {

  padding: 0 20px 0 20px;

  font-size: 14px;

  color: #eee;

  font-weight: 300;

  letter-spacing: 0.5px;

}

.location i {

  color: #333;

}

.location span a {

  display: inline-block;

  vertical-align: middle;

  font-size: 14px;

  color: #999;

}

.location span:before {

  content: "";

  display: inline-block;

  width: 4px;

  height: 4px;

  margin: -2px 11px 0 8px;

  border-top: 1px solid #bbb;

  border-right: 1px solid #bbb;

  transform: rotate(45deg);

  vertical-align: middle;

}

.location span:last-child a {

  text-decoration: underline;

  color: #333;

}



.tab_menu ul {

  display: flex;

  flex-wrap: wrap;

  max-width: 1400px;

  margin: 0 auto;

}

.tab_menu ul .thrd.on {

  background: #297fea;

  color: #fff;

  border-radius: 50px;

}

.tab_menu ul li {

  padding: 0 20px;

}

.tab_menu ul li.on a {

  background: #297fea;

  color: #fff;

  border-radius: 50px;

  padding: 0;

}

.tab_menu ul li i {

  cursor: pointer;

  padding-left: 2px;

}

.tab_menu ul li.on {

  border-radius: 50px;

  background: #297fea;

  color: #fff;

}

.tab_menu ul li a {

  display: inline-block;

  height: 45px;

  line-height: 45px;

  text-align: center;

  background: #fff;

  font-size: 17px;

  font-weight: 400;

  color: #999;

  transition: 0.3s;

}



.tree_tab_menu {

  width: 100%;

  background-color: #eff1f6;

}

.tree_tab_menu ul {

  max-width: 1400px;

  margin: 0 auto;

  display: flex;

  flex-wrap: wrap;

  padding: 0 20px;

}

.tree_tab_menu ul li {

  padding: 30px 0px;

}

.tree_tab_menu ul li a {

  color: #908e92;

  font-size: 16px;

  padding: 0 20px;

}

.tree_tab_menu ul li.on a {

  color: #000;

}



.page_title {

  display: flex;

  flex-wrap: wrap;

  padding: 30px 20px 0 20px;

  max-width: 500px;

  align-items: center;

}

.page_title .title {

  font-size: 40px;

  font-weight: 700;

  color: #222;

  text-align: left;

  margin-top: 7px;

}

.page_title .left {

  margin-right: 20px;

}

.page_title .right {

  margin-left: 20px;

}

.page_title .page i {

  font-size: 32px;

  padding-top: 15px;

}

/* .page_title .left i {

  color: #8e8e8e;

} */



.head_edit h3 {

  font-size: 21px;

  margin-bottom: 20px;

}



@media (max-width: 1260px) {

  .contents {

    min-width: 320px;

    margin-top: 150px;

  }

/*    사이즈가 줄어들어도 서브메뉴 보이도록*/
  .page_info .tab_menu {

    /*display: none;*/

  }   

  .tree_tab_menu {

    display: none;

  }



  .m_location.on .location:before {

    position: absolute;

    left: 50%;

    bottom: 0;

    z-index: 0;

    content: "";

    display: block;

    width: 100vw;

    height: 50vh;

    background: #fff;

    transform: translateX(-50%);

  }

  .page_info .tab_menu.on {

    display: block;

    position: absolute;

    width: 100%;

    margin: 0;

    position: relative;

  }

  .page_info .tab_menu.on ul {

    width: 100%;

    background-color: #fff;

    display: flex;

    flex-wrap: wrap;

  }

  .page_info .tab_menu.on ul li {

    width: 50%;

    background-color: #fff;

    display: flex;

    border: 1px solid #ccc;

  }

  .page_info .tab_menu.on ul li a {

    border-radius: 0;

    width: 100%;

  }

  .sub_visual {

    margin: 100px auto;

  }

}

@media (max-width: 768px) {

  .contents {

    margin-top: 150px;

  }

  .page_info .m_location {

    display: flex;

    align-items: center;

    flex-direction: column;

  }

  .page_title .page_txt {

    margin-bottom: 10px;

  }

  .sub_visual {

    margin: 80px auto;

  }

  .page_title .title {

    font-size: 28px;

    text-align: center;

  }

}

