@media (max-width: 1640px) {
  .article-01 .tab-btn {
    right: 3rem;
  }
  .article-01 .tab_content .tabs {
    right: 12rem;
  }
}

@media (max-width: 1280px) {
  .event-info .select-lnk {
    right: 1.5rem;
  }
  .reservation-quick .popup .close {
    top: -3rem;
    right: 0;
    transform: none;
  }
}

@media (max-width: 1080px) {
  .reservation-quick > .popup {
    width: 90%;
  }
  .layerpopup.reservation-quick .group {
    width: 100%;
  }
}

@media (max-width: 1060px) {
  .article-04 .half {
    width: 100%;
    float: none;
  }
  .article-04 .half:first-child {
    margin-right: 0;
    padding-bottom: 2rem;
  }
  .meeting-info > li {
    width: 49.2%;
    min-height: 16rem;
  }
  .meeting-info > li:first-child {
    margin-right: 1.5%;
  }
  .meeting-info > li .search-box span {
    width: calc(100% - 2rem);
  }
  .notice-list li .thumb {
    height: 6rem;
    padding-top: 10%;
  }
}

@media (max-width: 1000px) {
  .header-bg > .layout > .inner::after {
    width: 20rem;
    bottom: -4.5rem;
  }
}

@media (max-width: 970px) {
  .article-01 .cover .title {
    padding-bottom: 0.75rem;
  }
  .article-01 .cover .title span ul li {
    font-size: 0.65rem;
    padding: 0.2rem 0.45rem;
  }
  .article-01 .cover .title span ul li:first-child {
    margin-left: 0;
  }
}

@media (max-width: 940px) {
  .article-01 .cover .title span {
    float: none;
    display: block;
  }
  .article-01 .cover .title span ul li {
    font-size: 0.75rem;
    padding: 0.1rem 0.45rem;
  }
}

@media (max-width: 920px) {
  .article-01 .state {
    bottom: -2.4rem;
    z-index: 1;
  }
  .article-01 .line ul li:nth-child(3) {
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .article-01 .cover .title span {
    float: right;
    display: inline-block;
  }
  .reservation-wrap .reservation li:after {
    height: 2rem;
  }
  .reservation-wrap .reservation li a span br {
    display: block;
  }
  .article-01 {
    padding: 4rem 0;
  }
  .article-01 .list > ul {
    margin: 0 -0.75rem;
  }
  .article-01 .list > ul > li {
    width: 50%;
    height: 25.5rem;
    padding: 0 0.75rem;
    margin-bottom: 3rem;
  }
  .event-box .event-list {
    margin-top: 0;
  }
  .event-proceeding > ul {
    margin: 0 -0.75rem;
  }
  .event-proceeding > ul > li {
    padding: 0 0.75rem;
  }
  .article-01 .tab_content .tabs {
    top: 2.5rem;
    right: 1rem;
  }
  .article-01 .tab-btn {
    right: 1.5rem;
  }
  .article-01 .list {
    padding-top: 1rem;
    margin-bottom: 2rem;
  }
  .article-03 {
    height: auto;
  }
  .reservation-wrap .slick-list {
    margin: 0 2rem;
  }
  .meeting-info > li a strong {
    padding: 0.75rem 0;
  }
  .event-proceeding .cover .title {
    margin-bottom: 1rem;
  }
  .article-04 .half:last-child .more-btn {
    top: 0.25rem;
    font-size: 1rem;
  }
  .article-01 .tab_content .tabs li {
    margin: 0 0.5rem;
  }
  .quick-wrap {
    position: fixed;
    width: 100%;
    height: 3rem;
    right: inherit;
    bottom: 0.5rem;
    top: inherit;
    transform: none;
    border-radius: 0;
  }
  .quick-wrap::before {
    content: none;
  }
  .quick-wrap i {
    display: inline-block;
    position: relative;
    top: inherit;
    left: inherit;
    transform: none;
    margin-right: 0.5rem;
    vertical-align: middle;
  }
  .quick-wrap span {
    display: inline-block;
    position: relative;
    width: auto;
    top: inherit;
    transform: none;
  }
  .quick-wrap button::after {
    position: relative;
    display: inline-block;
    bottom: inherit;
    left: inherit;
    transform: inherit;
    vertical-align: middle;
  }
  .reservation-wrap .reservation li:hover a::before {
    content: none !important;
    background: transparent !important;
  }
  .reservation-quick .popup .step > li > .title {
    padding: 0.3rem 2rem;
  }
  .article-03::after {
    content: none;
  }
}

@media (max-width: 700px) {
  .layerpopup.reservation-quick .group .item ul.step > li,
  .layerpopup.reservation-quick .group .item ul.step > li:last-child {
    width: 100%;
  }
  .tab-btn.quick ul,
  .layerpopup.reservation-quick .tab_content .tabs {
    padding: 1rem 0;
  }
  .tab-btn.quick ul li {
    float: left;
    width: 50%;
  }
  .reservation-quick .confirm-btn {
    bottom: -4rem;
  }
  .layerpopup.reservation-quick .group .item ul.step > li:first-child > div {
    height: 5rem;
  }
  .layerpopup.reservation-quick .group .item ul.step > li:nth-child(2) .tabs {
    height: 5rem;
  }
  .layerpopup.reservation-quick .group .item ul.step > li:last-child > div {
    height: 15rem;
    padding: 1rem 1.5rem;
  }
  .reservation-quick .confirm-btn {
    font-size: 1rem;
    padding: 0.25rem 1rem;
  }
  .reservation-quick .confirm-btn i img {
    width: 2.5rem;
  }
}

@media (max-width: 620px) {
  .header-bg > .layout > .inner {
    padding-top: 6rem;
    padding-bottom: 2.9rem;
  }
  .search-wrap {
    display: block;
    width: 100%;
    max-width: 20rem;
    padding-left: 0;
  }
  .event-proceeding > ul > li {
    float: none;
    width: 100%;
    margin-bottom: 1.5rem;
  }
  .event-proceeding ul li .img img {
    bottom: inherit;
    top: 50%;
    transform: translateY(-50%);
  }
}

@media (max-width: 530px) {
  .article-01 .cover .title span {
    float: none;
    display: block;
  }
}

@media (max-width: 500px) {
  .reservation-wrap .reservation {
    margin-left: 6rem;
  }
  .reservation-wrap .slick-prev {
    left: -1.2rem;
  }
  .reservation-wrap .reservation li a span {
    padding: 0 0.5rem;
    padding-top: 2.3rem;
  }
  .meeting-info > li {
    min-height: 17.5rem;
  }
  .header-bg > .layout > .inner::after {
    width: 15rem;
  }
}

@media (max-width: 440px) {
  .header-bg > .layout > .inner::after {
    content: none;
  }
}

@media (max-width: 430px) {
  .header-bg > .layout > .inner {
    padding-bottom: 2.6rem;
  }
  .article-01 {
    padding-top: 2rem;
  }
  .article-01 .list ul li .img img {
    top: 50%;
    transform: translateY(-50%);
    bottom: inherit;
  }
  .article-01 .cover .title {
    padding-bottom: 0.25rem;
  }
  .article-01 .cover .title span {
    float: right;
    display: inline-block;
  }
  .meeting-info {
    display: block;
  }
  .meeting-info > li {
    display: block;
    float: none;
    width: 100%;
    min-height: auto;
  }
  .meeting-info > li:first-child {
    margin-bottom: 1rem;
  }
  .article-01 .list > ul > li {
    float: none;
    width: 100%;
    height: auto;
    margin-bottom: 4rem;
  }
  .reservation-wrap {
    padding: 0;
  }
  .reservation-wrap .title {
    position: relative;
    top: 0.5rem;
    transform: none;
    text-align: center;
  }
  .reservation-wrap .reservation {
    margin-left: 0;
  }
  .reservation-wrap .reservation li {
    font-size: 0.8rem;
    height: 5rem;
  }
  .reservation-wrap .reservation li:after {
    height: 1.5rem;
  }
  .reservation-wrap .reservation li a span {
    padding: 0 0.3rem;
    padding-top: 1.25rem;
  }
  .reservation-wrap:before {
    height: 7rem;
    top: 40%;
  }
  .reservation-wrap .title span {
    display: inline-block;
    padding-right: 0.5rem;
    padding-bottom: 0;
  }
  .reservation-wrap .slick-prev {
    left: 0;
  }
  .reservation-wrap .slick-next {
    right: 0;
  }
  .event-proceeding .cover .title {
    padding-bottom: 0.1rem;
    margin-bottom: 0.5rem;
  }
  .event-proceeding > ul > li:last-child {
    margin-bottom: 0;
  }
  .event-proceeding ul li .img {
    height: 6rem;
  }
  .event-proceeding .line ul li:last-child {
    margin-bottom: 0.5rem;
  }
  .reservation-wrap .slick-list {
    margin: 0 3rem;
  }
}

@media (max-width: 400px) {
  .notice-list li {
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
  }
  .notice-list li .thumb {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 45%;
    margin-bottom: 0.5rem;
  }
  .notice-list li .txt {
    height: 4.5rem;
    padding-left: 0;
  }
}

@media (max-width: 360px) {
  .reservation-wrap .reservation li {
    font-size: 0.8rem;
  }
}