@media (max-width: 1640px) {
  .click-section .time02 ul {
    width: 100%;
  }
  .reservation-select.type02 .click-section .time02 ul {
    width: 100%;
  }
  .click-section .time {
    padding-left: 16rem;
    padding-right: 9.5rem;
  }
  .click-section .time02 ul li label {
    padding: 0.25rem 0;
  }
  .click-section .time02 ul li label input[type="checkbox"] {
    display: block;
    margin: auto;
  }
}

@media (max-width: 1460px) {
  #detail-contents .form-box ul > li > div > strong {
    width: 8rem;
    padding-left: 1rem;
  }
  #detail-contents .form-box ul > li > div > span {
    padding-left: 8.5rem;
  }
}

@media (max-width: 1280px) {
  .info_table ul li:nth-child(2) span,
  .info_table ul li:nth-child(4) span {
    padding-left: 20%;
  }
  .info_table ul li img {
    max-width: 8rem;
  }
}

@media (max-width: 1130px) {
  #detail-contents .form-box ul li .half:first-child {
    border-bottom: 1px solid #ccc;
  }
  #detail-contents .form-box ul > li > div > strong {
    height: 100%;
  }
  #detail-contents .form-box ul > li > div > span {
    padding-right: 1rem;
  }
}

@media (max-width: 1080px) {
  .page-title .left-bg01 {
    width: 70%;
  }
  .page-title .right {
    overflow: hidden;
    padding-left: 55%;
  }
  .page-title .right .title strong {
    width: 100%;
    height: 4rem;
  }
  .page-title .right .title strong:after {
    position: relative;
    display: inline-block;
    top: -2.5rem;
    right: 0;
    background-size: 70%;
    vertical-align: top;
    transition: all 0.3s;
  }
  .how-to-use {
    padding: 2rem 0;
  }
  .how-to-use ul {
    margin-bottom: 2rem;
  }
  .how-to-use ul li {
    height: 5rem;
  }
  .how-to-use ul li div {
    width: 5rem;
    height: 5rem;
    padding: 1.8rem 0;
  }
  .how-to-use ul li div img {
    width: 40%;
  }
  .how-to-use ul li:after {
    right: -10%;
  }
  .grey-bg .half .wrap,
  .grey-bg .half:last-of-type .wrap {
    padding: 0 2rem;
  }
  .calender td strong.today:before {
    top: 1.6rem;
    left: 50%;
    transform: translateX(-50%);
  }
  .layerpopup.room .popup {
    width: 90%;
  }
  .layerpopup.room .group {
    width: 100%;
  }
  .how-to-use .caption {
    padding-top: 3rem;
  }
}

@media (max-width: 1024px) {
  .how-to-use:before,
  .grey-bg:before {
    left: -1rem;
    right: -1rem;
    width: auto;
    margin: 0;
    background-position: 80% 0;
  }
  .compliance .half p br {
    display: none;
  }
  .form-box ul li input[type="text"],
  .form-box ul li div input[type="password"] {
    width: 100%;
  }
  #r_charge_nm {
  	width: calc(100% - 7rem);
  }
  .form-box ul li div select {
    width: 5rem;
  }
  .form-box ul li .full.purpose input[type="text"] {
    width: 18rem;
  }
  .form-box ul li .half.number input[type="text"] {
    width: 28%;
  }
  .form-box ul li .half.email input:first-of-type {
    margin-bottom: 0.25rem;
  }
  .program-wrap .event-proceeding > ul {
    margin: 0 -0.5rem;
  }
  .program-wrap .event-proceeding > ul > li {
    width: 33.333%;
    padding: 0 0.5rem;
  }
  /* 회의실 소개 */
  .about-room .thumb {
    width: calc(100% + 1rem);
    max-width: initial;
    margin-left: -0.5rem;
  }
  .about-room .thumb > li {
    width: calc(50% - 1rem);
    margin: 0 0.5rem;
  }
  .about-room .thumb .desc {
    padding: 1rem 0 0 1rem;
  }
  .about-room .thumb .desc .icon {
    display: none;
  }
  .about-room .thumb .desc .bul4.type1 li {
    float: none;
    width: 100% !important;
  }
  .about-room .state .search {
    padding: 1.25rem 1.25rem 0;
  }
  .about-room .state .search .form {
    float: none;
    width: 100%;
    height: 3.6rem;
    margin-top: 1rem;
    padding: 1rem 0;
    border-left: 0 none;
    border-top: 1px solid #b1b1b1;
  }
  .about-room .state .group.active {
    padding: 2rem;
  }
  .about-room .state .group .table-wrap {
    overflow: hidden;
  }
  .about-room .state .group .table-wrap table {
    table-layout: fixed;
  }
  .about-room .state .group .table-wrap colgroup {
    display: none;
  }
  .about-room .state .group .table-wrap th {
    display: block;
    width: 100%;
    padding: 0.5rem;
  }
  .about-room .state .group .table-wrap td {
    display: block;
    width: 100%;
    padding: 0.5rem;
    white-space: normal;
  }
}

@media (max-width: 1030px) {
  .reservation-select.type02 .click-section {
    padding: 2rem;
  }
  .reservation-select.type02 .click-section .title {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    transform: none;
  }
  .reservation-select.type02 .click-section .time02 .caption {
    display: block;
    position: relative;
  }
  .reservation-select.type02 .state {
    right: 0;
  }
  .reservation-select.type02 .click-section .time02 {
    padding: 1rem 0;
  }
  .reservation-select.type02 .click-section .state {
    position: relative;
    width: 100%;
    top: inherit;
    right: inherit;
    transform: none;
  }
  .reservation-select.type02 .click-section .state span {
    display: block;
    text-align: center;
  }
  .reservation-select.type02 .click-section .title .more-info {
    display: block;
    margin: auto;
  }
  .reservation-select.type02 .click-section .time02 {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    transform: none;
  }
}

@media (max-width: 1000px) {
  .form-box ul > li > div > span > .depth02 > strong {
    position: relative;
    top: inherit;
    transform: none;
    width: 100%;
    border-right: 0;
  }
  .form-box ul > li > div > span > .depth02 > strong > span {
    position: relative;
    display: block;
    top: inherit;
    left: inherit;
    transform: none;
    text-align: center;
    border-bottom: 1px solid #ccc;
    padding: 0.5rem 0;
  }
  .form-box ul > li > div > span > .depth02 > .inner {
    padding-left: 1rem;
  }
  .click-section .title {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    transform: none;
  }
  .click-section .time02 {
    padding: 1rem 0;
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    transform: none;
  }
  .reservation-select .click-section .time02 {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    transform: none;
  }
  .click-section .state {
    position: relative;
    width: 100%;
    top: inherit;
    right: inherit;
    transform: none;
  }
  .click-section .state span {
    display: block;
    text-align: center;
  }
  .click-section .title .more-info {
    display: block;
    margin: auto;
  }
  .reservation-select .click {
    padding-bottom: 1rem;
  }
  .admin-wrap .click-section .time02 {
    padding: 0 1rem;
  }
}

@media (max-width: 992px) {
  .tab_content .tabs {
    width: 100%;
  }
  .admin-reser-calender .calender-item ul li {
    width: 100%;
  }
}

@media (max-width: 980px) {
  .page-title .right .title strong:after {
    position: absolute;
    top: -4rem;
    left: -1rem;
    background-size: 50%;
    transition: all 0.3s;
  }
  .page-title .right .title span {
    padding-left: 2.2rem;
  }
}

@media (max-width: 915px) {
  .form-box .full.number.phone .input-wrap:first-child {
    float: none;
    width: 100%;
  }
  .admin-wrap .click-section:first-child {
    margin-top: 0;
  }
  .admin-wrap .click-section {
    margin-bottom: 1rem;
  }
}

@media (max-width: 900px) {
  #sub-visual > .layout {
    padding: 3.2rem 0;
  }
  .mlinkTab-btn {
    display: block;
  }
  .linkTab {
    padding: 1rem 0;
  }
  .linkTab > ul > li {
    float: none;
    width: 100% !important;
    margin-bottom: 0 !important;
  }
  #sub-visual .location.linkTab {
    position: absolute;
    background: rgba(0, 0, 0, 0.8);
    z-index: 1;
  }
  #sub-visual .location.linkTab.flow-bottom {
    position: relative;
    z-index: 1;
  }
  #sub-visual .location.linkTab ul {
    display: none;
  }
  #sub-visual .location ul li a {
    padding: 0;
  }
  #sub-visual .location.flow-bottom ul li {
    padding: 0 !important;
  }
  #sub-visual .location.flow-bottom ul li a {
    padding: 0.25rem 1rem;
  }
  /* #sub-visual .location.tab-col-8 ul li {
    display: block;
    width: 100%;
  } */

  #sub-visual .location.tab-col-8 ul li {
    padding: 0.5rem 1rem;
    width: 100%;
    display: block;
  }
  #sub-visual .location.tab-col-8 ul li:first-child {
    margin-top: 0.5rem;
  }
  .mCont_scroll {
    position: relative;
    background: url(/html/moim/images/icon/mCont_scroll_ico_arr.png) no-repeat right 0;
    background-size: 68px 40px;
  }
  .mCont_scroll:before {
    display: block;
    content: "";
    width: 20px;
    height: 37px;
    position: absolute;
    top: 0;
    right: 23px;
    animation: leftright 0.7s linear 1s infinite alternate;
    background: url(/html/moim/images/icon/mCont_scroll_ico.png) no-repeat center center;
    background-size: 20px;
  }
  @keyframes leftright {
    0% {
      transform: translateX(-3px);
    }
    100% {
      transform: translateX(3px);
    }
  }
}

@media (max-width: 875px) {
  .compliance .half.img {
    width: 40%;
  }
  .compliance .half.txt {
    width: 60%;
    position: relative;
    top: inherit;
    transform: none;
  }

	#sub-visual p {
	  font-size: 1rem;
	}

}

@media (max-width: 800px) {
  .grey-bg.confirm-con .img {
    position: relative;
    max-width: 20rem;
    width: 100%;
    top: inherit;
    transform: none;
    padding-bottom: 1rem;
    margin: auto;
  }
  .grey-bg.confirm-con .txt {
    position: relative;
    top: inherit;
    transform: none;
    padding-left: 0;
  }
  .grey-bg.confirm-con {
    height: auto;
    padding: 2rem 0;
  }
  .grey-bg.confirm-con .txt strong {
    line-height: 1.5rem;
  }
}

@media (max-width: 768px) {
  #detail-contents .popup.long-contents {
    width: 80%;
  }
  div.tstyle_list > div.dbody > ul {
    padding-right: 5rem;
  }
  .popup div.tstyle_list > div.dhead {
    display: block;
  }
  .popup div.tstyle_list > div.dbody > ul > li {
    display: table-cell;
    width: 10%;
  }
  .popup div.tstyle_list > div.dbody > ul > li:first-child {
    float: none;
  }
  .board-wrap div.tstyle_list > div > ul > li.state {
    width: 4rem;
    margin: 0;
  }
  .admin-wrap .board-wrap div.tstyle_list > div > ul > li.state {
    width: auto;
  }
  /* 회의실 소개 */
  .about-room .box5 .item .logo strong {
    font-size: 1.5rem;
  }
  .about-room .thumb {
    width: 600px;
    max-width: 100%;
    margin: 1rem auto 0;
  }
  .about-room .thumb > li {
    float: none;
    width: 100%;
    margin: 0;
  }
  .about-room .thumb > li + li {
    margin-top: 1rem !important;
  }
  .about-room .state .group .table-wrap .btn-m {
    padding-right: 3rem;
  }
  .about-room .state .group .map {
    float: none;
    height: auto;
    margin: 0 auto;
  }
  .about-room .state .group .item {
    float: none;
    width: 100%;
    min-height: 0;
    margin-top: 1rem;
    padding-top: 0;
  }
  .table-wrap.datatable.price th,
  .table-wrap.datatable.price td {
    clear: none;
    float: none;
    width: auto;
  }
  .table-wrap.datatable.price tbody th,
  .table-wrap.datatable.price tbody th + td {
    text-align: center;
  }
  .table-wrap.datatable.price td {
    padding: 0.5rem 0.8rem;
  }
  .grey-bg .half .wrap,
  .grey-bg .half:last-of-type .wrap {
    padding: 0 1rem;
  }
  .calender td:hover > .popup-info {
  	width: auto;
  }
}

@media (max-width: 767px) {
  #sub-visual > .layout {
    padding: 3.1rem 0;
  }
  .how-to-use:before {
    background-size: auto 100%;
    background-position: 45% 0;
  }
  #sub-visual span br,
  .how-to-use ul li span br {
    display: block;
  }
  .info_table ul li {
    padding: 0.8rem 0.5rem;
  }
  .info_table ul li a {
    pointer-events: inherit;
    cursor: pointer;
  }
  .info_table ul li.color {
    font-size: 1.4rem;
  }
  #sub h3 {
    padding-bottom: 1rem;
  }
  .info_table02 {
    padding-bottom: 2rem;
  }
  .info_table02 ul li.thead {
    width: 25%;
  }
  .charge .info_table02 ul li {
    padding: 1rem;
  }
  .charge .info_table02 ul li.thead {
    width: 40%;
  }
  .charge .info_table02 ul li {
    width: 60%;
  }
  .info_table02 ul li {
    width: 75%;
    padding: 0.75rem 0;
    padding-left: 1.5rem;
  }
  .compliance .half {
    padding-left: 2rem;
  }
  .how-to-use,
  .grey-bg {
    margin-bottom: 2rem;
  }
  .grey-bg .half .img {
    width: 5rem;
    height: 5rem;
    padding: 1.2rem 0;
  }
  .grey-bg .half .img img {
    width: 50%;
  }
  .tab-wrap {
    border: 0;
  }
  .tab-wrap .cont_wrap {
    padding: 0;
  }
  .tab-wrap .page-tab {
    padding-bottom: 0.75rem;
  }
  .tab-wrap .page-tab ul li {
    width: 25%;
  }
  .cp_map .map_box .map {
    height: 20rem;
  }
  .cp_map .map_box .map_information .map_cont .img {
    position: relative;
    left: auto;
    top: auto;
    margin-bottom: 1rem;
  }
  .cp_map .map_box .map_information .map_cont {
    padding-left: 0;
  }
  .calender-wrap {
    padding: 1.5rem 0;
  }
  .calender-wrap:before {
    height: 30.25rem;
  }
  .calender {
    padding: 1rem;
  }
  .reservation-select.type02 .click-section .time {
    padding-left: 12rem;
    padding-right: 9rem;
  }
  .confirm-step03 {
    padding: 2rem 0;
  }
  .confirm-complete {
    padding: 3rem 1rem;
    margin: 2rem auto;
  }
  .confirm-step03 .info_table02 {
    padding-bottom: 1.5rem;
  }
  .board-wrap div.tstyle_list > div > ul > li.state {
    margin: 0;
  }
  .admin-wrap .tab-btn ul li {
    width: 33.3%;
  }
  .admin-wrap .board_info .page_info {
    margin-top: 0.5rem;
  }
  .admin-wrap .board_info .Search_rss {
    padding: 1rem;
  }
  .login-wrap.grey-bg {
    margin-bottom: 0;
  }
  .page-title .right > p {
    font-size: 1rem;
  }
  .table-wrap.datatable thead th {
    font-size: 1.2rem;
  }
  #sub-visual span,
  .info_table02 ul li,
  .table-wrap.datatable.price td,
  .grey-bg .half ul li,
  .grey-bg .half .caption,
  .compliance .half ul li,
  .compliance .half p,
  .reservation-select .info > p,
  .reservation-select .click,
  .grey-bg.confirm-con .txt ul li,
  .reservation-select.type02 .click-section .time02 .caption,
  .click-section .title span,
  .blue-btn {
    font-size: 1rem;
  }
  .reservation-select .click {
    padding-bottom: 0.5rem;
  }
  .reservation-select .info > p > strong {
    font-size: 1.1rem;
    padding-bottom: 0.5rem;
  }
  .table-wrap.datatable.price > .table-price-desc > p {
    font-size: 0.9rem;
  }
  .click-section .title strong {
    font-size: 1.2rem;
  }
  .reservation-select.type02 .click-section .title .more-info {
    width: 8rem;
    font-size: 0.9rem;
    margin: 1rem auto 0;
  }
}

@media (max-width: 700px) {
  .info_table-wrap {
    overflow: auto;
    margin-bottom: 2rem;
  }
  .info_table {
    width: 700px;
    padding-bottom: 0;
  }
  .info_table ul li:nth-child(2) span,
  .info_table ul li:nth-child(4) span {
    padding-left: 10%;
  }
  .info_table ul li em.phone,
  .info_table ul li em.page {
    padding: 0 0.5rem;
    padding-left: 1.1rem;
  }
  .mobile-caption {
    display: block;
    text-align: right;
    font-size: 0.9rem;
  }
}

@media (max-width: 670px) {
  .compliance .wrap:last-child {
    margin-top: 2rem;
  }
  .overview-wrap .compliance {
    padding: 2rem 0 3.5rem;
  }
  .compliance .half,
  .compliance .half.img,
  .compliance .half.txt {
    float: none;
    width: 100%;
    right: inherit;
    text-align: left;
    padding-left: 0;
  }
  .compliance .half.txt.right {
    text-align: left;
    padding-right: 0;
  }
  .compliance .half.img {
    margin-bottom: 0.5rem;
  }
  .grey-bg.overview-wrap .half.right strong {
    text-align: left;
  }
  .overview-wrap .compliance .half.right ul li:before {
    content: "";
    position: absolute;
    width: 0.2rem;
    height: 0.2rem;
    background: #525252;
    top: 0.5rem;
    left: 0;
    border-radius: 50%;
    margin-right: 0;
  }
  .overview-wrap .compliance .wrap:last-child {
    margin-bottom: 0;
  }
  .grey-bg.overview-wrap {
    padding-bottom: 0;
  }
}

@media (max-width: 640px) {
  .form-box ul li .half {
    display: block;
    width: 100%;
  }
  .form-box .purpose .input-wrap .wrap {
    position: relative;
    top: inherit;
    margin-bottom: 0.5rem;
    display: block;
  }
  .form-box .purpose .input-wrap input[type="text"]:last-child {
    margin-left: 0;
    display: block;
  }
  .form-box .full.col-4 .input-wrap {
    width: 25%;
  }
  .form-box ul > li > div > strong {
    width: 9rem;
    height: 100%;
    padding-left: 1rem;
  }
  .form-box ul li .half:first-child {
    border-bottom: 1px solid #ccc;
  }
  .form-box ul > li > div > span {
    padding-right: 1rem;
    padding-left: 9.5rem;
  }
  .form-box ul li .full.row-2 > span {
    padding-right: 0;
  }
  .form-box ul li .full.purpose input[type="text"] {
    width: 100%;
    margin-left: 0;
  }
  .admin-reser-calender .calender-item ul li {
    padding: 1rem;
  }
}

@media (max-width: 630px) {
  .program-wrap .event-proceeding > ul > li {
    float: left;
    width: 50%;
  }
}

@media (max-width: 620px) {
  .page-title {
    margin-bottom: 2rem;
  }
  .page-title .left-bg01 span {
    background-position: 13% 0;
  }
  .page-title .right {
    padding-top: 8rem;
    padding-left: 30%;
  }
  .page-title .right .title strong {
    height: auto;
  }
  .page-title .right .title strong:before {
    left: -5rem;
  }
  .admin-wrap .board_info .btn-wrap-left,
  .admin-wrap .board_info .btn-wrap-right {
    float: none;
    display: block;
    width: 100%;
    text-align: center;
  }
  .admin-wrap .board_info .page_info {
    float: none;
    display: inline-block;
  }
  .page-title {
    height: auto;
    padding: 2rem 0;
    margin: 0;
  }
  .page-title .left-bg01 {
    width: 100%;
    height: 10rem;
    position: relative;
    top: inherit;
    left: inherit;
    margin-bottom: 2rem;
    transform: none;
  }
  .page-title .left-bg01 span {
    background-position: center 50%;
  }
  .page-title .right {
    height: auto;
    padding: 0;
    overflow: inherit;
  }
  .page-title .right .title strong {
    font-size: 1.6rem;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
  }
  .page-title .right .title strong:after {
    top: -4rem;
    background-size: 40%;
  }
  .page-title .right .title strong:before {
    width: 100%;
    height: 2px;
    margin: auto;
    left: inherit;
    text-align: center;
  }
}

@media (max-width: 600px) {
  .click-section .title {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    padding: 1rem;
  }
  .click-section .time {
    padding: 1rem 0;
  }
  .click-section .state {
    position: relative;
    top: inherit;
    right: inherit;
    transform: none;
  }
  .click-section .state span > a {
    padding: 0.5rem 1rem;
  }
  .reservation-select {
    margin: 1rem 0;
  }
  .reservation-select .info > i {
    display: block;
    position: relative;
    margin: 0 auto 0.75rem;
  }
  .reservation-select .info > p {
    padding-left: 0;
  }
  .reservation-select.type02 .click-section {
    padding: 2rem 1rem;
  }
  .reservation-select.type02 .click-section .title {
    top: inherit;
    transform: none;
    left: inherit;
  }
  .reservation-select.type02 .click-section .time {
    padding: 1rem 0;
  }
  .reservation-select.type02 .state {
    right: inherit;
  }
  .reservation-select.type02 .click-section .time > span {
    width: 100%;
    text-align: center;
    margin-top: 1rem;
  }
  .terms .caption {
    position: relative;
    display: block;
    top: inherit;
    right: inherit;
    padding-bottom: 0.5rem;
  }
  .confirm-title {
    padding-bottom: 0;
  }
  .form-box ul > li > div > span > .depth02 > .inner > .input-wrap {
    width: 50%;
  }
  .form-box .txt .center > strong {
    font-size: 1.5rem;
  }
}

@media (max-width: 580px) {
  /* 회의실 소개 */
  .about-room .box5 .title {
    font-size: 1rem;
  }
  .about-room .box5 .title strong {
    font-size: 1.25rem;
  }
  .about-room .box5 .item {
    padding: 1rem;
  }
  .about-room .box5 .item .box {
    font-size: 0.9rem;
    word-break: normal;
  }
  .about-room .thumb .desc {
    width: calc(100% - 2rem);
    padding-right: 1rem;
  }
  .about-room .state .search {
    text-align: center;
  }
  .about-room .state .search::before {
    display: block;
    margin: 0 auto 0.5rem;
  }
  .about-room .state .search .form .title {
    display: none;
  }
  .about-room .state .search .form .list {
    width: 9rem;
    margin: 0 0.5rem;
  }
  .about-room .state .group .map {
    display: none;
  }
  .about-room .state .group.active {
    padding: 1rem;
  }
}

@media (max-width: 530px) {
  .click-section .time02 ul li {
    float: left;
    display: block;
    width: 33.333%;
    border-bottom: 1px solid #c2c2c2;
  }
  .click-section .time02 ul li:nth-child(3n) {
    border-right: 0;
  }
  .click-section .time02 ul li:nth-last-child(-n + 3) {
    border-bottom: 0;
  }
  .click-section .time02 ul li label input[type="checkbox"] {
    display: inline-block;
    margin-right: 0.25rem;
  }
  .click-section .time02 ul li:first-child.on,
  .click-section .time02 ul li:first-child.off {
    border-radius: 1rem 0 0 0;
  }
  .click-section .time02 ul li:nth-child(3).on,
  .click-section .time02 ul li:nth-child(3).off {
    border-radius: 0 1rem 0 0;
  }
  .click-section .time02 ul li:nth-child(7).on,
  .click-section .time02 ul li:nth-child(7).off {
    border-radius: 0 0 0 1rem;
  }
  .click-section .time02 ul li:last-child.on,
  .click-section .time02 ul li:last-child.off {
    border-radius: 0 0 1rem 0;
  }
}

@media (max-width: 520px) {
  .form-box .full.col-4 .input-wrap {
    float: none;
    width: 100%;
    margin-bottom: 0.5rem;
  }
  .form-box .full.col-4 .input-wrap:last-child {
    margin-bottom: 0;
  }
  .form-box ul li div span b {
    display: block;
  }
}

@media (max-width: 510px) {
  .how-to-use ul {
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .how-to-use ul li {
    width: 50%;
    height: auto;
    margin-bottom: 1rem;
  }
  .how-to-use ul li:nth-of-type(2n):after {
    content: none;
  }
  .grey-bg {
    padding: 2rem 0;
  }
  .login-wrap.grey-bg {
    padding: 0;
    padding-top: 2rem;
  }
  .grey-bg .half {
    float: none;
    width: 100%;
  }
  .grey-bg .half:first-of-type {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
  }
  .grey-bg .half:first-of-type:after {
    top: inherit;
    bottom: 0;
    width: 100%;
    height: 1px;
  }
  .how-to-use .caption {
    padding-top: 0;
  }
  .layerpopup.room .group {
    width: 100%;
  }
  .layerpopup.room .item .img {
    position: relative;
    margin: 0 auto 1rem;
  }
  .layerpopup.room .item .img + .desc {
    padding-left: 0;
  }
  .layerpopup.room .item .bul4 li {
    line-height: inherit;
    margin-bottom: 0.25rem;
  }
  .layerpopup.room .item .bul4 strong + span {
    display: block;
  }
}

@media (max-width: 500px) {
  .admin-reser-calender .calender-wrap {
    float: none;
    width: 100%;
    padding: 1rem;
  }
  .admin-reser-calender .calender-item {
    float: none;
    width: 100%;
    padding: 0;
  }
  .admin-wrap .tab-btn ul li {
    width: 50%;
  }
  .admin-wrap .board-wrap div.tstyle_list > div > ul > li.state {
    position: relative;
    top: inherit;
    transform: none;
  }
}

@media (max-width: 480px) {
  .tab-wrap .page-tab {
    display: none;
  }
  .tab-wrap #tabmenu {
    display: block;
    margin-bottom: 1rem;
    height: 2.5rem !important;
    width: 100%;
  }
  .form-box ul > li > div > strong {
    width: 6.8rem;
    padding-left: 0.5rem;
  }
  .form-box ul > li > div > span {
    padding-left: 6.9rem;
  }
}

@media (max-width: 460px) {
  .login-wrap .form li .inner,
  .login-wrap .box6.form-list .inner {
    width: 100%;
  }
}

@media (max-width: 450px) {
  .form-box .full.number.phone .input-wrap label > span {
    display: block;
    padding-left: 0;
  }
}

@media (max-width: 420px) {
  #sub-depth > .layout {
    overflow-x: scroll;
  }
}

@media (max-width: 410px) {
  .confirm-complete i img {
    width: 7rem;
  }
  .confirm-complete strong {
    padding: 1rem 0;
  }
  .confirm-complete .info {
    margin: 1rem auto;
  }
  .reservation-select .click {
    text-align: center;
  }
  .reservation-select .state {
    position: relative;
    top: inherit;
    right: inherit;
    text-align: center;
    margin-bottom: 1rem;
  }
}

@media (max-width: 400px) {
  .form-box ul > li > div > span > .depth02 > .inner > .input-wrap {
    float: none;
    width: 100%;
  }
}

@media (max-width: 372px) {
  .form-box .full.number.phone input[type="text"] {
    width: 28%;
  }
  .form-box ul li div span i {
    margin: 0 0.1rem;
  }
}

@media (max-width: 360px) {
  .calender td strong {
    width: 2.2rem;
    height: 2.2rem;
    line-height: 2.2rem;
  }
}

@media (max-width: 330px) {
  .double-btn-wrap .blue-btn {
    display: block;
    margin-bottom: 0.5rem;
  }
}


/*추가 */
@media all and (max-width: 700px) {

.material-list > li {
	width: calc(50% - 20px);
	}	
}



@media all and (max-width: 520px) {

	.material-list {
		margin: 30px 0 0;
		}	
	.material-list > li {
		width: 100%;
		margin: 0 0 10px;
		}
	.material-list .img {
		height: 150px;
		}	
 }

@media all and (max-width: 700px) {
	.material-list > li {
		width: calc(50% - 20px);
		}	
}


/*--------------여기서부터추가-----------------------*/

	
	@media screen and (max-width:1100px) {
		#container {padding: 0 0;}
		#container > .inner {padding: 40px 15px;}
		h1 {font-size: 21px;}
		.input_form3 .w100 .tit {width: 30%;}
		.input_form3 .w100 .txt {width: 70%;}
		
		.btn_st1 span a { padding: 17px 30px; font-size: 16px;  line-height: 16px; display: block; width:80%; margin:0 auto; transition: .25s;}
		.blue_box p{ width:100%; display:inline-block;}
		
		.tb th, .tb td {  padding: 10px 5px;  border-bottom: 1px solid #ddd;  border-left: 1px solid #ddd;  border-right: 1px solid #ddd; font-size: 14px;  font-weight: bold; line-height:150%; }
		.btn_st2  a {background-color:#0d53a2; border:none; color:#fff;  font-size: 16px;  text-align: center;   font-family: "NanumSquare";  line-height: 50px; transition: .25s; width: 100%;
    position: relative; display: block; letter-spacing:-1px;}
	}


@media all and (max-width:1200px){
 .s_tit:after {width: 30px; height: 30px; background-size:25px auto; left: -30px;}
}
@media all and (max-width:1100px){
	.s_tit {padding-left: 30px;}
	.s_tit:after {left: 0;}
	.s_tab_wrap {margin: 0 15px 70px;}
	.s_tab a {font-size: 18px;}
	
	.presenter_wrap > ul > li {  width: 100%;}

}
	
	
@media all and (max-width:768px){
	#sv .visual {height: 250px;  background-position: 46% 50%; background-size:cover;}
	#sv .txt_wrap {  top: 55%;  left: 0; margin-left: 15px;}
	#sv .txt_wrap img { width:20%;}
	.s_tab a {font-size: 15px;}
	.s_tab.col-2 a {width: 100%;display: inline-block;line-height: 130%;height: auto;padding: 10px 0;}

		
	.sub_title {position: relative;width: 100%;margin: 0 auto;border-bottom: #e8e8e8 1px solid;margin-bottom: 30px;padding: 20px 0;overflow:hidden;}
	.sub_title h1 {display:inline-block;font-size: 24px;font-weight:600;}

	.con1 {padding:0 0 50px;}
	.overview {display: block;}
	.overview .lt {width: 100%;padding-left: 0;}
	.overview .rt {width: 100%;}
	.overview .rt h3{font-weight:500; color:#151515; word-break:keep-all; }

	.con2 .lt,
	.con2 .rt {float: left; width: 100%; vertical-align: middle;}
	.con2 .rt {float: left; padding-top:30px; padding-bottom:50px;}

	.tb th,
	.tb td {padding: 20px 10px;font-size: 14px;} 
	.tb tbody th {width: 100px; height:35px}
	
		#sub-visual h2 {
		  font-size: 1.6rem;
			padding-left: 1rem;
			padding-right: 1rem;

		}
	.tb1 { border-bottom: 3px solid #333; transform: skew(-0.00deg);}
	.tb1 th,
	.tb1 td {padding: 15px 10px; vertical-align: middle; border: 1px solid #d1d1d1; font-size:14px; font-weight: 500; line-height: 1.5; word-break:keep-all;}
	.tb1 th { background-color: #f3f8fd;}
	.tb1 tbody th {width: 170px; }
	.tb1 th.bdleft,
	.tb1 td.bdleft {border-left: 1px solid #d1d1d1;}


	
.presenter_wrap h2{font-size: 20px;font-weight:500;padding-bottom:20px;}
.presenter_wrap h2 span{color:#004168;}
.presenter_wrap > ul {clear: both;margin-bottom: 80px;overflow: hidden;}
.presenter_wrap > ul > li {width: 100%;float: left;margin-right: 2%;min-height: 100%;margin-bottom: 30px;border:1px solid #ddd;padding: 20px; height:100% !important;}
.presenter_wrap > ul > li:nth-child(2n){margin-right:0; float:right}
.presenter_wrap > ul > li div {word-break:keep-all;}
.presenter_wrap > ul > li div.img{float:left; width:100%;}
.presenter_wrap > ul > li div.txt{float:right; width:100%;}
.presenter_wrap > ul > li div.txt .name{font-size: 20px;font-weight: 800;padding: 15px 0;margin-bottom: 15px;position:relative;line-height: 1.2em;border-bottom: 2px solid #00a5aa;z-index:-1;}
/*.presenter_wrap > ul > li div.txt .name:before{content:''; position:absolute; width:400px; height:2px; background:#00a5a8; bottom:0; left:0;}*/
.presenter_wrap > ul > li div.txt .name span{font-weight:400; word-break: keep-all; color:#666; display:none;}
.presenter_wrap > ul > li div.txt .btn{font-weight:400; word-break: keep-all; color:#fff; background-color:#00a5aa; font-size:14px; padding:0 8px; line-height:220%; border-radius:3px; float:right; z-index:999; margin-top:10px; transition:.5s;}
.presenter_wrap > ul > li div.txt .tit {font-size: 17px; color:#00a5aa; margin-top:15px; /*display:none;*/}

.presenter_wrap > ul > li div.txt .spec{font-size: 14px;line-height: 150%;}
.presenter_wrap > ul > li div.txt .spec p {padding-bottom: 10px;word-break:keep-all;}
.presenter_wrap > ul > li div.txt .spec ul {margin-top:10px; display:none;}
.presenter_wrap > ul > li div.txt .spec li {font-size:13px; line-height:1.3; margin-bottom:5px;}


.presenter_wrap > ul > li div.spec1 li .b{ display:block;}

	
.w1000 { padding: 0 15px;}	
.form_group .form_select{float:left;width: 100%;margin-right: 10px;margin-bottom: 5px;}
.form_group .form_text{float:left;width: 100%;margin-right: 10px;margin-bottom: 5px;}
.btn_st1 {margin: 10px auto;}


.ft_info2 {  display: block; transform: skew(-0.03deg);}
.ft_info2 .lt,
.ft_info2 .rt {width: 100%;padding: 0 0}
.ft_info2 .lt {width: 100%;}
.ft_info2 .lt .info_inner{padding-left: 0; }
.ft_info2 .lt .info_cs {margin-top: 0;}
.ft_info2 .lt .info_cs:before {content:''; display: block; width: 100%; height: 10px; background: url('/img/common/bar_dot.jpg') 0 0 repeat-x;}
.ft_info2 .lt .info_cs .txt1 {padding: 20px; background-color: #560F7B; color: #fff;}
.ft_info2 .lt .info_cs .txt1 > span {margin-left: 10px; vertical-align: middle; display: inline-grid;}

.ft_info2 .lt .traffic-header { height: 40px;}
.ft_info2 .lt  .traffic-header .traffic-title { font-size:20px; font-weight:500; letter-spacing:-.56px; color:#222;}
.ft_info2 .lt .traffic-item { display: block;}
.ft_info2 .map_wrap .map_btn a {display: block;padding: 15px;line-height: 1.33;font-size: 14px;transition:.25s;}



/* form ::: selectbox */
.form_select{display:inline-block;position:relative;width:100%;vertical-align:middle;height:45px;background-color: #fff;border: 1px solid #dddddd;overflow:hidden;}
.form_select:before{content:'';  width: 32px;  height: 36px;  background-position: 0 -4px;  background-image: url(../images/common/icon_select_arr.gif);  background-repeat: no-repeat; vertical-align: top;  display: inline-block;  overflow: hidden;  line-height: 0;  color: transparent;  position: absolute;  right:1px;  top:1px;z-index: 1;}
.form_select select{background-color: transparent;width: 100%;  border: 0;  height: 45px;  line-height:45px;font-size: 12px;color:#000;position:relative; z-index:1; text-align:left;padding-left:10px;font-weight:100;}


}

@media all and (max-width:486px){
	.s_tit {padding-left: 25px;} 
	.s_tit:after {width: 25px; height: 25px; background-size:20px auto; top: 0;}
	.s_tab a {font-size: 16px; height: 50px; }
	.navigation {font-size: 10px;}
	.navigation .w1297 {padding: 0 5px;}
	.navigation img {width: 13px;}

	.tb th,
	.tb td {padding: 20px 10px;font-size: 13px;} 
	.tb tbody th {width: 80px;}
}

	
@media all and (max-width: 1280px){
	
	/* 기관 소개  */
	.Institution > ul > li{
		width: calc(50% - 3rem);
	}
}



@media all and (max-width: 768px) {

	
	/* 회원기관 소개  */
	.Institution-Wording{
		position:relative;
		padding: 6rem 5rem;
    	background-position-x: 90%;
	}
	.Institution-Wording:before{
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		display: block;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.5);
		z-index: -1;
	}
	.Institution-Wording .txt br{
		display: none;
	}
	.Institution > ul > li{
		width: calc(100% - 3rem);
	}
	
}