@charset "utf-8";

/*-------------------------------------------------
Author : WEB,Seo
Create date : 2025. 01. 17
Last update : 
-------------------------------------------------*/

/* ========== import ========== */
@import url('/resources/css/default/jquery-ui.css');
@import url('/resources/css/default/normalize.css');
@import url('/resources/css/assets/fonts.css');
@import url('/resources/css/assets/mixin.css');
@import url('/resources/css/assets/screen-ui.css');


/* ========== default setting ========== */
html {
    font: 400 10px/1.2 'paperlogy', sans-serif;
    overflow-x: hidden;
}

body {
    font-size: 1.6rem;
    font-family: 'paperlogy', sans-serif;
    /* letter-spacing: -0.02em; */
    word-break: keep-all;
    overflow-y: auto;
    overflow-x: hidden;
    color: #272727;
}

body::-webkit-scrollbar {
    width: 8px;
}

body::-webkit-scrollbar-thumb {
    width: 10px;
    background: rgba(0, 0, 0, 0.3);
    /* 스크롤바 색상 */
    border-radius: 10px;
    /* 스크롤바 둥근 테두리 */
}

.mo {
    display: none;
}

/* ========== //default setting ========== */



/* ========== popup ========== */
/* popup */
#popup {
    position: fixed;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 200;
}

#popup .one-time {
    margin-top: 1rem;
}

#popup .slick-initialized .slick-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 54rem;
    margin: 1rem;
}

#popup .slick-initialized .slick-slide a {
    display: flex;
    width: 100%;
    height: 100%;
}

#popup .slick-initialized .slick-slide a:hover {
    opacity: 1;
}

#popup .slick-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

#popup .slick-arrow {
    position: absolute;
    top: -5rem;
    right: 1rem;
    font-size: 0;
}

#popup .slick-prev {
    right: 7rem;
}

#popup .slick-next:after,
#popup .slick-prev:after {
    content: '';
    width: 4rem;
    height: 4rem;
    background: url('/resources/images/common/ico-right.svg') 1.5rem center / 1.3rem no-repeat;
    border: 2px solid #000;
    border-radius: 3rem;
    filter: invert(1);
    display: block;
}

#popup .slick-prev:after {
    background: url('/resources/images/common/ico-left.svg') 1.3rem center / 1.3rem no-repeat;
}

#popup .close-wrap {
    font-weight: 500;
    font-size: 1.25em;
    padding: 0 1rem;
}

#popup .close-wrap .btn-close {
    gap: 10px;
    color: #fff;
}

#popup .close-wrap .btn-close i {
    font-size: 1.5em;
}

#popup .close-wrap .btn-close:hover {
    opacity: 0.7;
}


/* ========== //popup ========== */



/* ========== header ========== */

#header {
    position: fixed;
    left: 0;
    top: 0;
    background: transparent;
    border-bottom: 1px solid #ffffffb9;
    z-index: 99;
    height: 8rem;
    transition: transform 0.4s ease;
}

.hn_logo img {
    width: 20rem;
    filter: invert(99%) sepia(91%) saturate(3%) hue-rotate(257deg) brightness(158%) contrast(100%);
}

.gnb {
    margin-right: 10rem;
}

.gnb a {
    color: var(--white-color);
}

.gnb_li {
    height: 8rem;
    position: relative;
}

.gnb_a {
    padding: 0 4rem;
    border: 3px solid transparent;
    font-size: 1.7rem;
    font-weight: 500;
}

.gnb_2ul {
    overflow: hidden;
    position: absolute;
    top: 8rem;
    height: 0;
    opacity: 0;
    transition: 0.4s ease;
    padding: 1rem 0 0;
}

.gnb_2li {
    height: 4rem;
    text-align: center;
}

.gnb_2li a {
    font-weight: 400;
}

.lnb {
    z-index: 21;
}

.lnb a {
    color: var(--white-color);
}

#header.scroll.open .lnb .basic a {
    color: var(--white-color);
}

.blue_bg {
    background: var(--main-color);
    border-radius: 5rem;
    width: 11.5rem;
    height: 4rem;
}

.gnb_bg {
    background: var(--main-color) url('/resources/images/common/gnb_bg.svg') left center / cover;
    height: 0;
    position: absolute;
    left: 0;
    top: 8rem;
    opacity: 0;
    transition: 0.4s ease;
    z-index: -1;
}

/* 스크롤 css */
#header.scroll,
#header.on {
    background: var(--white-color);
}

#header.scroll .gnb_a,
#header.scroll .lnb .basic a,
#header.on .gnb_a,
#header.on .lnb .basic a {
    color: #1a1a1a;
}

#header.scroll .ham_btn span,
#header.on .ham_btn span {
    background: var(--main-color);
}

#header.scroll .hn_logo img,
#header.on .hn_logo img {
    filter: unset;
}

#header.scroll .gnb_a:hover,
#header.on .gnb_a:hover {
    border-bottom: 3px solid var(--main-color);
    color: var(--main-color);
    opacity: 1;
}

#header.on .gnb_bg {
    height: 45rem;
    opacity: 1;
}

#header.on .gnb_2ul {
    height: 45rem;
    opacity: 1;
}

/* 햄버거메뉴 */
.ham_btn {
    width: 2.8rem;
    height: 2.8rem;
    position: relative;
    transition: transform 0.4s ease;
    cursor: pointer;
    z-index: 21;
}

.ham_btn:hover {
    transform: rotate(270deg);
}

.ham_btn span {
    width: 0.6rem;
    height: 0.6rem;
    background: var(--white-color);
    border-radius: 50%;
    transition: all 0.4s ease;
    position: relative;
    z-index: 1;
}

.ham_btn span.change {
    position: absolute;
    top: 50%;
    left: 50%;
    transform-origin: center;
    transform: translate(-50%, -50%) rotate(0deg);
    opacity: 0;
}

.ham_btn.on span.change {
    width: 3rem;
    height: 0.35rem;
    border-radius: 0.2rem;
    background: var(--white-color);
    opacity: 1;
}

.ham_btn.on span:nth-child(1) {
    transform: translate(-50%, -50%) rotate(45deg);
}

.ham_btn.on span:nth-child(2) {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.ham_btn .non {
    opacity: 1;
    transition: opacity 0.3s ease;
}

.ham_btn.on .non {
    opacity: 0;
}

#header.scroll.open .ham_btn.on span.change {
    background: var(--white-color);
}

.ham_menu {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 20;
    opacity: 0;
    transform: translateY(-100%);
    transition: 0.4s ease;
    background: var(--main-color) url('/resources/images/common/gnb_bg.svg') 60% / cover no-repeat;
}

#header.open .ham_menu {
    height: 100vh;
    transform: translateY(0%);
    opacity: 1;
    overflow-y: auto;
}

.ham_menu img {
    width: 25rem;
    filter: invert(99%) sepia(91%) saturate(3%) hue-rotate(257deg) brightness(158%) contrast(100%);
}

.side_li {
    color: var(--white-color);
    font-size: 2.7rem;
    width: calc((100% - 12rem) / 5);
    line-height: 2;
}

.side_li>a {
    border-bottom: 1px solid #ffffff23;
}

.side_2li a {
    font-size: 1.8rem;
    font-weight: 400;
}


/* 서브페이지 헤더 스타일 */
#header.color {
    background: var(--white-color);
}

#header.color .ham_btn span {
    background: var(--main-color);
}

#header.color .gnb_li>a,
#header.color .lnb a {
    color: #1a1a1a;
}

#header.color .lnb .blue_bg a {
    color: #fff;
}

#header.color .hn_logo img {
    filter: unset;
}

#header.color.open .lnb a {
    color: #fff;
}

#header.color.open .ham_btn span {
    background: var(--white-color);
}

/* ========== //header ========== */



/* ========== footer ========== */
#footer {
    background: #F5F5F5;
    border-top: 1px solid #ddd;
    border-bottom: 2rem solid var(--main-color);
    padding: 5rem 0;
    color: #818181;
    font-size: 1.4rem;
    font-weight: 500;
}

.ft_inner {
    align-items: flex-start;
}

.ft_logo {
    width: 20rem;
}

.ft_privacy button {
    color: #818181;
    font-size: 1.5rem;
    border-right: 1px solid #ccc;
    margin-right: 1.5rem;
    padding-right: 1.5rem;
}

.ft_info {
    line-height: 2;
}

.ft_info span {
    display: inline-block;
    margin-right: 1.5rem;
    white-space: nowrap;
}

.ft_privacy li:last-child button,
.ft_menu li:last-child a {
    border-right: none;
    margin: 0;
    padding: 0;
}

.ft_menu li a {
    font-size: 1.6rem;
    border-right: 1px solid #ccc;
    color: #333;
    margin-right: 2.5rem;
    padding-right: 2.5rem;
}

/* ========== //footer ========== */



/* ========== main ========== */

/* visual */
.visual {
    background: url('/resources/images/main/vis_bg.png') center / cover;
    position: relative;
    overflow: hidden;
    color: var(--white-color);
}

.visual:after {
    position: absolute;
    left: 116%;
    top: 145%;
    width: 200%;
    height: 200%;
    background: #fa7b32b4;
    content: '';
    transform: rotate(35deg) translate(-50%, -50%);
    z-index: 0;
}

.vis_inner {
    position: relative;
    z-index: 1;
    justify-content: flex-end;
}

.vis_txt h2 {
    font-size: 8rem;
    font-weight: 700;
}

.vis_txt span {
    font-size: 4rem;
    font-weight: 500;
}

.vis_txt p {
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.4;
}

/* reserve */
.reserve-sec {
    padding: 20rem 0;
    background: url(/resources/images/common/deco_bg.svg) -35rem -100rem / 100% no-repeat;
}

.point_txt {
    color: var(--main2-color);
    font-size: 1.7rem;
    font-weight: 700;
}

.point_txt.light {
    font-weight: 600;
}

.mn_txt {
    font-size: 5rem;
    font-weight: 700;
    color: #272727;
}

.mn_txt.bold {
    font-weight: 800;
}

.mn_p {
    font-size: 1.8rem;
    color: #4E4E4E;
    line-height: 1.4;
}

.res_tit {
    font-size: 1.8rem;
    font-weight: 600;
}

.res_tit:before {
    background: var(--main-color);
    width: 0.4rem;
    height: 2.3rem;
    display: inline-block;
    margin-right: 1rem;
    content: '';
}

.res_tit.orange:before {
    background: var(--main2-color);
}

.res_ex {
    font-size: 1.4rem;
    font-weight: 500;
    color: #999;
}

/* 시설선택 / 코트선택 */
.fac-select,
.date-select {
    width: 80rem;
}

.court-select,
.time-select {
    width: calc((100% - 80rem - 5rem));
}

/* 탭메뉴 */
.tab_menu li {
    width: 16rem;
    height: 4.4rem;
}

.tab_menu li button {
    background: #00617711;
    color: #727272;
    width: 100%;
}

.tab_menu li button.on {
    background: var(--main-color);
    color: var(--white-color);
}

.court-select .tab_menu li {
    width: 8.3rem;
}

.court-select .tab_menu li button {
    background: #fa7b3217;
}

.court-select .tab_menu li button.on {
    background: var(--main2-color);
}

.tab_menu li button:hover {
    background: var(--main-color);
    color: var(--white-color);
    opacity: 1;
}

.court-select .tab_menu li button:hover {
    background: var(--main2-color);
    opacity: 1;
}

.gym-select {
    width: 60rem;
}

.gym-select .tab_menu li {
    width: 100%;
}

.gym-select .tab_menu li button {
    background: #fa7b3217;
}

.gym-select .tab_menu li button.on {
    background: var(--main2-color);
}

.gym-select .tab_menu li button:hover {
    background: var(--main2-color);
    opacity: 1;
}

/* 날짜선택 */
.date-view {
    background: var(--main-color);
    border-radius: 2rem;
    overflow: hidden;
    box-shadow: 0.2rem 0.2rem 0.5rem rgba(0, 0, 0, 0.2);
}

#calendar {
    background: var(--white-color);
    padding: 0 4rem 4rem;
    position: relative;
}

#calendar .link-btn {
    position: absolute;
    right: 4rem;
    top: 3.5rem;
    width: 13rem;
    height: 3.5rem;
    font-size: 1.4rem;
}

#calendar .link-btn img {
    width: 0.9rem;
}

#calendar.fc .fc-toolbar.fc-header-toolbar {
    justify-content: center;
    position: relative;
    margin: 0;
    padding: 3.5rem 0 2.5rem;
    border-bottom: 1px solid #e2e2e2;
}

.fc .fc-toolbar-title {
    font-size: 2.7rem;
    font-weight: 700;
    color: var(--main-color);
}

.fc-direction-ltr .fc-button-group>.fc-button:not(:last-child) {
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
}

.fc .fc-button-group {
    position: absolute;
    left: 50%;
    top: 54%;
    transform: translate(-50%, -50%);
    gap: 12rem;
}

.fc .fc-button-group>.fc-button {
    position: relative;
    padding: 0;
    font-size: 2.5rem;
}

.fc .fc-button-primary {
    background: none;
    border: 0;
    color: var(--main-color);
    transition: 0s;
}

.fc .fc-button-primary:disabled,
.fc .fc-button-primary:disabled:hover {
    opacity: 0;
    background-color: unset;
    border-color: unset;
    visibility: hidden;
}

.fc .fc-button-primary:focus,
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
    background-color: unset;
    border-color: unset;
    color: var(--main-color);
    opacity: 1;
    box-shadow: unset;
}

.fc .fc-button-primary:hover {
    background-color: unset;
    border-color: unset;
    color: var(--main-color);
    opacity: 1;
}

#calendar .fc-view-harness.fc-view-harness-active {
    height: 45rem !important;
}

.fc-theme-standard td,
.fc-theme-standard th,
.fc-theme-standard .fc-scrollgrid {
    border: 0;
}

.fc .fc-daygrid-day-top,
.fc-scrollgrid-sync-inner,
.fc .fc-col-header-cell-cushion {
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    align-items: center;
    font-weight: 500;
}

.fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events {
    display: none;
}

.fc .fc-daygrid-day-frame {
    display: flex;
    align-items: center;
    justify-content: center;
}

.fc .fc-daygrid-day-number {
    width: 100%;
    height: 6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.fc .fc-col-header-cell-cushion {
    font-weight: 700;
    font-size: 1.8rem;
    height: 9rem;
    padding: 0;
}

.fc .fc-day-past {
    pointer-events: none;
}

.fc .fc-daygrid-day.on,
.fc .fc-daygrid-day.fc-day-today.on {
    background: var(--main2-color);
    color: var(--white-color);
}

.fc .fc-daygrid-day a:hover,
.fc .fc-daygrid-day.fc-day-today a :hover {
    opacity: 1;
}

.fc .fc-daygrid-day.fc-day-today {
    background-color: #fa7b321a;
    color: #aaa;
    text-decoration: line-through;
}

.fc-day-past {
    color: #aaa;
    text-decoration: line-through;
}

/* 시간선택 */
.time_view {
    position: relative;
}

.time_view.blocked:before,
.time_view.blocked:after {
    white-space: pre;
    color: var(--white-color);
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.7;
}

.time_view.blocked:before {
    content: '이용 관련 문의는\A CKU스포츠단관리팀으로 문의 해주시기 바랍니다';
    background: #003c4ae3;
    font-size: 1.6rem;
    font-weight: 500;
    padding-bottom: 6rem;
    z-index: 9;
}

.time_view.blocked:after {
    content: '033-649-7915';
    font-size: 3rem;
    font-weight: 700;
    padding-top: 6rem;
    z-index: 9;
}

.time_view li {
    background: #00617711;
    height: 4.8rem;
    color: #4B4B4B;
    font-weight: 500;
    position: relative;
}

.time_view li.closed:after {
    content: '예약마감';
    background: #003c4ad7;
    color: var(--white-color);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* pl-link */
.pl-link {
    height: 55rem;
    background: url('/resources/images/main/pl-link.jpg') center / cover;
}

.pl-link-inner {
    background: linear-gradient(90deg, var(--main-color), #00465575, #ffffff00);
    color: var(--white-color);
}

.pl-txt {
    width: calc(100% - 6rem);
}

.pl-link-inner h2 {
    font-size: 5rem;
    font-weight: 900;
    line-height: 1.3;
}

.pl-link-inner p {
    font-size: 1.8rem;
    line-height: 1.5;
}

.pl-link-inner a {
    font-size: 1.8rem;
}

/* sports */
.sport-gall {
    padding: 20rem 0;
}

.sp-slide.swiper {
    overflow: initial;
}

.sp-cont {
    background: url('/resources/images/main/sport-gall01.jpg') center left / cover;
    width: 50rem;
    height: 65rem;
    color: var(--white-color);
}

.sp-cont:nth-child(2) {
    background: url('/resources/images/main/sport-gall02.jpg') center left / cover;
}

.sp-cont:nth-child(3) {
    background: url('/resources/images/main/sport-gall07.jpg') center left / cover;
}

.sp-cont:nth-child(4) {
    background: url('/resources/images/main/sport-gall08.jpg') center / cover;
}

.sp-cont:nth-child(5) {
    background: url('/resources/images/main/sport-gall03.jpg') center / cover;
}

.sp-cont:nth-child(6) {
    background: url('/resources/images/main/sport-gall05.jpg') center left / cover;
}

.sp-cont:nth-child(7) {
    background: url('/resources/images/main/sport-gall04.jpg') center right / cover;
}

.sp-cont:nth-child(8) {
    background: url('/resources/images/main/sport-gall06.jpg') center left / cover;
}

.sp-txt {
    padding: 5.5rem 5rem;
    justify-content: flex-end;
    background: linear-gradient(357deg, #0012296b, #00122917);
}

.sp-cont span {
    background: var(--main2-color);
    border-radius: 3rem;
    width: 10rem;
    height: 3.5rem;
    font-size: 1.8rem;
    font-weight: 500;
}

.sp-cont h3 {
    font-size: 3.5rem;
    font-weight: 600;
}

.sp-cont p {
    font-size: 1.7rem;
    line-height: 1.5;
}

.sp-cont .link-btn {
    font-size: 1.7rem;
    width: fit-content;
    height: fit-content;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid var(--white-color);
}

.sp-cont .link-btn img {
    width: 0.8rem;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    display: none;
}

.swiper-button-next,
.swiper-button-prev {
    background: var(--main-color);
    border-radius: 3rem;
    width: 5.5rem;
    height: 5.5rem;
    position: initial;
    margin: 0;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    background: #ccc;
    opacity: 1;
}

.swiper-button-next img,
.swiper-button-prev img {
    width: 2rem;
}

.swiper-pagination {
    position: initial;
}

.swiper-pagination-bullet {
    width: 100%;
    border-radius: 0;
    height: 2px;
    transition: 0.3s;
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #333;
}


/* news */
.news {
    background: #eff4f5;
    padding: 20rem 0;
}

.news-slide.swiper {
    overflow: initial;
}

.news-cont .img_wrap {
    height: 25rem;
    overflow: hidden;
}

.news-cont .img_wrap img {
    height: 100%;
    object-fit: cover;
}

.news-cont b {
    background: var(--main-color);
    height: 3rem;
    padding: 0 1.5rem;
    color: var(--white-color);
    width: fit-content;
}

.news-cont h3 {
    font-size: 2.1rem;
    font-weight: 600;
}

.news-cont p {
    color: #3B3B3B;
    line-height: 1.4;
}

.news-cont span {
    color: #A7A7A7;
    font-size: 1.5rem;
    font-weight: 500;
}


/* notice */
.notice {
    padding: 20rem 0;
    background: url(/resources/images/common/deco_bg.svg) -62rem -100rem / 100% no-repeat;
}

.not-inner {
    align-items: flex-start;
}

.not-cont {
    height: 6.5rem;
    border-bottom: 1px solid #ddd;
    padding: 0 2rem;
    background-color: var(--white-color);
}

.not-cont h3 {
    font-size: 1.8rem;
    font-weight: 500;
    width: calc(100% - 12rem);
}

.not-cont span {
    font-size: 1.5rem;
    color: #787878;
    width: 9.5rem;
}

.not-list {
    border-top: 2px solid #000000;
    width: 100rem;
}

.notice .link-btn {
    width: 13rem;
}



/* ========== PAGE ========== */

.sub-head {
    height: 40rem;
    background: url('/resources/images/sub/sub-head01.jpg') center bottom / cover;
}

/* 시설예약페이지 */

.reserve .sub-head {
    background: url('/resources/images/sub/sub-head03.jpg') center -20rem/ cover;
}

.sh-txt {
    height: calc(100% - 5rem);
    color: var(--white-color);
}

.sh-h1 {
    font-size: 3.5rem;
    font-weight: 600;
}

.sh-txt span {
    font-size: 1.5rem;
}

.sub-tab {
    height: 5rem;
    background: #00303a7a;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.sub-tab ul {
    width: 100%;
}

.sub-tab li {
    height: 5rem;
    color: var(--white-color);
    border-right: 1px solid #ffffff79;
    width: 21rem;
}

.sub-tab li:first-child {
    border-left: 1px solid #ffffff79;
}

.facility .sub-tab ul {
    min-width: 900px;
}

.sports .sub-tab ul {
    min-width: 600px;
}

.page .mn_txt {
    font-size: 4rem;
}

.page .mn_txt img {
    width: 4.5rem;
    filter: invert(24%) sepia(86%) saturate(1065%) hue-rotate(157deg) brightness(67%) contrast(103%);
}

.cate {
    color: var(--main-color);
    position: relative;
    font-weight: 600;
}

.cate:before {
    content: '';
    width: 0.2rem;
    height: 3rem;
    display: inline-block;
    background: #448998;
    margin-left: 2rem;
    margin-right: 2rem;
}

.page .reserve-sec {
    padding: 10rem 0;
    background: none;
}

.reserve .time_view li {
    cursor: pointer;
    transition: 0.3s;
}

.reserve .time_view li.closed {
    cursor: initial;
}

.reserve .time_view li:hover {
    background: #fa7b3217;
}

.reserve .time_view li.chosen {
    background: var(--main2-color);
    color: var(--white-color);
}

.reserve .edit-cont select {
    width: 34rem;
    height: 4.5rem;
    border: 1px solid #006277;
    border-radius: 0.8rem;
    padding: 0px 30px 0px 20px;
    background: #FFF url('/resources/images/common/select_arrow_black.png') no-repeat calc(100% - 20px) center/16px auto;
}

/* 파일첨부 */
.file-form {
    font-size: 1.4rem;
}

.file-label {
    padding: 0.8rem 1.5rem;
    background: #999;
    color: #fff;
    border-radius: 0.6rem;
    cursor: pointer;
    transition: background 0.2s;
}

.file-label:hover {
    background: #999;
}

.file-name {
    color: #555;
}

.down-btn {
    width: fit-content;
    height: 4rem;
    border-radius: 3rem;
    padding: 0 1.5rem;
}


/* 고객센터 공지사항 페이지 */
.customer .sub-head {
    background: url('/resources/images/sub/sub-head01.jpg') center 70%/ cover;
}


/* CKU스포츠단 */
.company .sub-head {
    background: url('/resources/images/sub/sub-head05.jpg') center / cover;
}

.gr-inner {
    padding: 10rem 0;
}

.cp_mn {
    font-size: 4rem;
    line-height: 1.6;
}

.cp_mn b {
    color: var(--main-color);
    font-weight: 600;
}

.gr-cont {
    border-top: 1px solid #ddd;
    line-height: 1.7;
}

.gr_txt span {
    font-size: 2rem;
    color: #666;
    letter-spacing: 0.3rem;
    display: block;
    font-weight: 300;
}

.gr_txt p {
    font-size: 1.8rem;
    font-weight: 500;
}

.gr_txt p:before {
    content: '';
    display: block;
    margin: 0 0 4rem;
    width: 100%;
    height: 0.1rem;
    background: #88a4aa;
}

.gr_p {
    font-size: 1.7rem;
    color: #555;
}

.gr-attach {
    height: 30rem;
    background: url('/resources/images/company/company02.jpg') center / cover no-repeat;
    background-attachment: fixed;
}

.history {
    padding: 10rem 0 0;
}

.history dt {
    color: var(--main2-color);
    font-size: 2.5rem;
    font-weight: 700;
}

.history dd {
    font-size: 2rem;
    border-right: 1px solid #ddd;
    padding-right: 5rem;
}

.history dl:last-child dd:last-child {
    border: 0;
    padding: 0;
}

/* 교직원 */
.member {
    padding: 15rem 0;
    background: url(/resources/images/common/deco_bg.svg) -62rem -100rem / 100% no-repeat;
}

.mm-inner {
    align-items: flex-start;
}

.mm-cont {
    width: 100rem;
    font-weight: 500;
}

.mm-cont ul {
    height: 4.5rem;
    color: #444;
    border-bottom: 1px solid #ddd;
    background: rgba(255, 255, 255, 0.322);
    font-size: 1.7rem;
}

.mm-cont ul.mm_tit {
    font-size: 1.8rem;
    height: 5rem;
    background: linear-gradient(180deg, #006277, #003356);
    color: var(--white-color);
}

.mm-cont li {
    width: calc(100% / 3);
}

.mm-cont li:nth-child(2) {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

.mm-cont ul.mm_tit li:nth-child(2) {
    border-color: #4f8d9d;
}


/* 배치도 */
.place {
    padding: 10rem 0;
}

.place img {
    display: block;
}

.map-wrap-pc {
    position: relative;
}

.map-wrap-m {
    display: none;
}

.fac-btn li {
    position: absolute;
    left: 13rem;
    top: 15rem;
    background: var(--white-color);
    border-radius: 5rem;
    /* width: 22rem; */
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.6);
    transition: 0.3s;
    line-height: 1.3;
}

.fac-btn li a {
    padding: 1rem 3rem 1rem 1rem;
}

.fac-btn li:hover {
    transform: translateY(-1rem);
    opacity: 1;
}

.fac-btn li.ten_btn {
    top: auto;
    left: 37rem;
    bottom: 13rem;
}

.fac-btn li.bask_btn {
    top: 12rem;
    left: 39rem;
}

.fac-btn li.out_ten_btn {
    top: 27rem;
    left: 23rem;
}

.fac-btn li.soc_btn {
    top: 41rem;
    left: auto;
    right: 45rem;
}

.fac-btn li.bad_btn {
    top: unset;
    left: auto;
    bottom: 25rem;
    right: 46rem;
}

.fac-btn li.gym_btn {
    top: unset;
    left: auto;
    bottom: 28rem;
    right: 25rem;
}

.fac-btn li.squa_btn {
    top: 22rem;
    left: auto;
    right: 55rem;
}

.fac-btn img {
    display: block;
}

.fac-btn b {
    font-weight: 600;
    font-size: 1.7rem;
}

.fac-btn p {
    width: calc(100% - 5rem);
}

.fac-btn span {
    font-size: 1.5rem;
}

.fac_de {
    position: relative;
    background: #fff;
    padding: 2rem;
    border-radius: 2rem;
    width: calc((100% - 1rem) / 2);
    border: 1px solid #00242c36;
}

.fac_icon {
    background: #f7f7f7;
    width: 6rem;
    height: 6rem;
    border-radius: 1rem;
}

.fac_icon img {
    height: 4rem;
    filter: invert(17%) sepia(95%) saturate(2646%) hue-rotate(174deg) brightness(94%) contrast(101%);
}

.fac_de h3 {
    font-size: 2rem;
    font-weight: 600;
}

.fac_de span {
    font-size: 1.7rem;
    font-weight: 500;
    background: var(--main-color);
    color: white;
    position: absolute;
    right: 1rem;
    top: 1rem;
    border-radius: 5rem;
    width: 3rem;
    height: 3rem;
}


/* 시설안내 */
.facility .sub-head {
    background: url(/resources/images/main/vis_bg.png) center bottom / cover;
}

/* .facility.page .mn_txt {
  font-size: 3.5rem;
} */

.sport-fac {
    padding: 15rem 0;
}

.sport-fac .mn-header p {
    line-height: 1.6;
    color: #555;
}

/* coop */
.coop {
    background: #f5f5f5;
    padding: 3rem 6rem 3rem 4rem;
    border-radius: 10rem;
    margin: 0 auto;
}

.co_icon {
    background: var(--main2-color);
    border-radius: 10rem;
    width: 10rem;
    height: 10rem;
}

.co_icon img {
    width: 5rem;
}

.co_txt b {
    font-size: 2.3rem;
    font-weight: 500;
    color: var(--main2-color);
}

.co_txt p {
    line-height: 1.4;
}

/* fac-info */
.fac_tit {
    font-size: 2.5rem;
    font-weight: 500;
    position: relative;
    z-index: 0;
    padding-left: 3.5rem;
}

.fac_tit:before {
    content: '';
    width: 2rem;
    height: 2rem;
    background: var(--main-color);
    position: absolute;
    left: -0.5rem;
    top: 0.6rem;
    z-index: -2;
    border-radius: 2rem;
}

.fac_tit:after {
    content: '';
    width: 2rem;
    height: 2rem;
    background: #0062777d;
    position: absolute;
    left: 0.5rem;
    top: 0.1rem;
    z-index: -1;
    border-radius: 2rem;
}

.fac_tit2 {
    font-size: 2rem;
    font-weight: 500;
    color: var(--main-color);
}

.fac_tit2:before {
    display: inline-block;
    content: '';
    width: 0.7rem;
    height: 0.7rem;
    background: white;
    border-radius: 1rem;
    border: 0.3rem solid var(--main-color);
}

.fac_tit3 {
    font-size: 1.8rem;
    font-weight: 500;
    color: var(--main2-color);
}

.fac_tit3::before {
    display: inline-block;
    content: '';
    width: 1rem;
    height: 0.3rem;
    background: var(--main2-color);
    /* border-radius: 1rem; */
    /* border: 0.4rem solid var(--main2-color); */
}

.fac_cont {
    line-height: 1.5;
    padding-left: 2rem;
}

.fac_cont ol {
    padding-left: 1.7rem;
}

.fac_ul li {
    position: relative;
    padding-left: 1.5rem;
}

.fac_ul li:before {
    position: absolute;
    left: 0;
    top: 0rem;
    background: var(--main2-color);
    content: '';
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 3rem;
    margin-top: 0.9rem;
}

.deco2 {
    color: var(--main2-color);
    font-weight: 500;
    /* display: inline-block; */
}

.table-wrap table {
    border-collapse: collapse;
    width: calc((100% - 1rem) / 2);
    text-align: center;
}

.table-wrap th,
.table-wrap td {
    border: 1px solid #dce7e9;
    height: 4rem;
    padding: 1rem;
    vertical-align: middle;
    font-weight: 500;
    font-size: 1.5rem;
    word-break: keep-all;
}

.table-wrap th {
    background: #e4f4f7;
    border: 1px solid #dce7e9;
}

.table-wrap thead th {
    color: var(--white-color);
    background: #358fa2;
    border: 1px solid #358fa2;
}

.table-wrap thead th:first-child {
    border-right: 1px solid #649aa7;
}

.fac_img li {
    width: calc((100% - 1rem) / 2);
    height: 39rem;
    overflow: hidden;
    border-radius: 1rem;
}

.fac_img li img {
    height: 100%;
    object-fit: cover;
}


.ready img {
    max-width: 40rem;
    display: block;
    width: 80%;
}

.ready h3 {
    font-size: 5rem;
    font-weight: 600;
    color: #333;
}

.ready p {
    font-weight: 700;
    color: var(--main2-color);
}

/* 이용약관 */
.term .sub-head {
    background: url(/resources/images/sub/sub-head06.jpg) center bottom / cover;
}

.terms {
    padding: 10rem 0;
    line-height: 2;
    color: #666;
    font-size: 1.5rem;
}

.tm-inner h2 {
    font-size: 4rem;
    font-weight: 600;
    color: #333;
}

.tm-div {
    border: 1px solid #ddd;
    padding: 3rem 3.5rem;
    border-radius: 2rem;
}

.tm-inner h3 {
    font-size: 1.8rem;
    font-weight: 500;
    color: #333;
}

.tm-inner h4 {
    font-size: 1.6rem;
    padding-left: 2rem;
}

.tm-inner p,
.tm-inner ul {
    padding-left: 2rem;
}

.tm-inner li {
    padding-left: 1.5rem;
    position: relative;
}

.tm-inner li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 1.3rem;
    display: block;
    width: 3px;
    height: 3px;
    background: #333;
    border-radius: 1rem;
}

@media screen and (max-width: 1400px) {

    /* ========== common =========== */
    a:hover,
    button:hover {
        opacity: 1;
    }

    /* ========== header =========== */
    .gnb {
        display: none;
    }

    /* ========== main =========== */
    #calendar {
        padding: 0 3rem 3rem;
    }

    .fac-select,
    .date-select {
        width: calc((100% - 3rem) / 3 * 2);
    }

    .court-select,
    .time-select {
        width: calc((100% - 3rem) / 3 * 1);
    }

    .res-select {
        gap: 3rem;
    }

    .notice .mn-header {
        text-align: center;
        width: 100%;
        margin-bottom: 0;
    }

    .not-list {
        width: 100%;
    }

    .notice .link-btn {
        margin: 0 auto 3rem;
    }

    .notice .mn_p {
        margin-bottom: 2rem;
    }


    /* ========== page =========== */

    /* 배치도 */
    .map-wrap-pc {
        position: relative;
        display: none;
    }

    .map-wrap-m {
        display: block;
    }
}

@media screen and (max-width: 1280px) {

    /* ========== popup =========== */
    .popup-wrap {
        max-width: 620px !important;
    }

    #popup .slick-initialized .slick-slide {
        height: fit-content;
        margin: 1rem 0;
    }

    #popup .slick-arrow {
        right: 0;
    }

    #popup .slick-prev {
        right: 6rem;
    }

    #popup .close-wrap {
        padding: 0;
    }

    /* ========== header =========== */
    .side {
        justify-content: center;
    }

    .side_li {
        width: fit-content;
    }


    /* ========== main =========== */
    .visual {
        height: 80vh;
    }

    .visual:after {
        left: 75%;
        top: 80%;
        width: 150%;
        height: 160%;
    }

    .vis_inner {
        justify-content: center;
        text-align: center;
    }

    .reserve-sec,
    .sport-gall,
    .notice,
    .sport-fac {
        padding: 10rem 0;
        background: none;
    }

    .news {
        padding: 10rem 0;
    }

    #calendar {
        padding: 0 2rem 2rem;
    }

    .fac-select,
    .court-select {
        width: 100%;
    }

    .sp-cont {
        height: 50rem;
    }

    .sp-txt {
        padding: 4rem 3rem;
    }


    /* ========== page =========== */

    /* 스포츠단 소개 */
    .gr_img {
        height: 40rem;
        overflow: hidden;
        margin-bottom: 2rem;
    }

    .gr_img img {
        height: 100%;
        object-fit: cover;
        object-position: bottom;
    }

    .gr_txt,
    .gr_img {
        width: 100%;
    }

    .gr_top {
        flex-direction: column-reverse;
    }

    .history dd:last-child {
        border: 0;
        padding: 0;
    }

    .his_dl {
        gap: 1rem;
    }

    .history dd {
        width: 18rem;
    }

    /* 교직원 */
    .member {
        padding: 10rem 0;
    }

    .mm-cont {
        width: 100%;
        margin-top: 5rem;
    }

    /* 시설안내 */
    .table-wrap th,
    .table-wrap td {
        font-size: 1.4rem;
        padding: 0.5rem;
    }

    .co_txt {
        width: calc(100% - 13rem);
    }

    .co_txt p br {
        display: none;
    }

    .gym-res {
        display: block;
    }

    .gym-select {
        width: 100%;
        margin-top: 3rem;
    }

}

@media screen and (max-width: 1024px) {

    /* ========== main =========== */

    .res-select {
        gap: 2rem;
    }

    /* .date-select {
        width: calc((100% - 2rem) / 4 * 3);
    }

    .time-select {
        width: calc((100% - 2rem) / 4 * 1);
    } */


    .date-select,
    .time-select {
        width: 100%;
    }

    .court-select,
    .time-select {
        margin-top: 2rem;
    }

    .res-select.mt-60.__flex.gap-50.__flex-wrap {
        margin-top: 4rem;
    }

    .time_view {
        gap: 0.5rem;
    }

    .sp-slide.swiper,
    .news-slide.swiper {
        overflow: hidden;
        margin-top: 5rem;
    }

    .sp-cont p br {
        display: none;
    }

    /* ========== footer =========== */
    .ft-right {
        display: none;
    }

}

@media screen and (max-width: 950px) {

    .reserve-sec .edit-cont .edit_desc {
        width: 12rem;
        font-size: 1.6rem;
    }

    .reserve-sec .edit-cont .edit_sub_desc {
        width: calc(100% - 12rem);
    }

    .reserve-sec .edit-cont input {
        width: 100%;
    }
}

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

    /* ========== header =========== */
    #header {
        height: 6rem;
    }

    .gnb-wrap,
    .lnb {
        gap: 1.5rem;
    }

    .ham_menu {
        justify-content: flex-start;
    }

    .side {
        flex-direction: column;
        align-items: center;
        gap: 0;
        padding-top: 10rem;
    }

    .side_li {
        width: 100%;
    }

    .side_li>a {
        margin-bottom: 0;
        padding: 1rem 0;
    }

    .side_2ul {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 0.7s ease, opacity 0.7s ease;
        background: #ffffff0a;
        padding: 0;
    }

    .side_li.on .side_2ul {
        max-height: 500px;
        opacity: 1;
        padding: 1rem 0;
    }


    /* ========== main =========== */
    .visual:after {
        display: none;
    }

    .vis_txt h2 {
        font-size: 6rem;
    }

    .vis_txt span {
        font-size: 3rem;
    }

    .reserve-sec,
    .sport-gall,
    .notice {
        padding: 8rem 0;
        background: none;
    }

    .tab_menu li {
        width: calc((100% - 3rem) / 4);
    }

    .court-select .tab_menu li {
        width: calc((100% - 5rem) / 6);
    }

    .mn-header {
        text-align: center;
        margin-bottom: 5rem;
        padding-bottom: 0;
    }

    .mn_txt {
        font-size: 4rem;
    }

    .mn_p {
        font-size: 1.7rem;
    }

    .pl-link {
        height: 45rem;
    }

    .pl-link-inner {
        background: linear-gradient(90deg, var(--main-color), #00465599, #00465545);
    }

    /* ========== page =========== */

    /* 서브헤더 */
    .sub-head {
        height: 30rem;
    }

    .reserve .sub-head {
        background: url('/resources/images/sub/sub-head03.jpg') center 0 / cover no-repeat;
    }

    /* 시설안내 */
    .facility.page .mn-header {
        align-items: flex-start;
        text-align: left;
    }

    .table-wrap table {
        width: 100%;
    }

    .table-wrap th,
    .table-wrap td {
        font-size: 12.5px;
        padding: 0.3rem;
    }

    .ready {
        text-align: center;
    }

    .coop {
        border-radius: 0;
    }

    .fac_img li {
        height: 25rem;
    }

    /* 교직원 */

    .page .member .mn-header {
        width: 100%;
    }

    .mm-cont {
        margin-top: 0;
    }

    /* 이용약관/개인정보처리방침 */
    .terms {
        padding: 7rem 0;
    }

    .tm-inner li:before {
        top: 1.2rem;
    }

    .tm-inner h2 {
        font-size: 3rem;
        padding-bottom: 3rem;
    }
}

@media screen and (max-width: 650px) {

    /* header */
    .side_li {
        font-size: 2.3rem;
    }

    .reserve-sec .edit-cont.w-calc-2 {
        width: 100%;
    }

    .reserve-sec .edit-cont.w-calc-2:nth-child(2) {
        border-top: 1px solid #dedede;
    }

    .reserve .reserve-sec .edit-cont {
        border-right: 0;
    }

    /* 시설안내 */
    .coop {
        flex-direction: column;
        align-items: flex-start;
        gap: 2rem;
        padding: 3rem;
    }

    .co_txt {
        width: 100%;
        gap: 1rem;

    }

    .co_icon {
        width: 7rem;
        height: 7rem;
    }

    .co_icon img {
        width: 4rem;
    }

    .fac-info {
        margin-top: 7rem;
    }

    .fac_tit3 {
        margin-top: 3rem;
    }
}

@media screen and (max-width: 540px) {

    /* ========== header =========== */
    .blue_bg {
        background: transparent;
        width: fit-content;
        height: fit-content;
    }

    #header.scroll .blue_bg a,
    #header.color .lnb .blue_bg a {
        color: #272727;
    }

    #header.color.open .lnb .blue_bg a,
    #header.scroll.open .lnb .blue_bg a {
        color: var(--white-color);
    }


    /* ========== main =========== */
    .vis_txt h2 {
        font-size: 5rem;
        margin: 1rem 0 2rem;
    }

    .vis_txt span {
        font-size: 2.5rem;
    }

    .vis_txt p {
        font-size: 1.7rem;
    }

    .tab_menu {
        gap: 0.5rem;
    }

    .tab_menu li {
        width: calc((100% - 1.5rem) / 4);
    }

    .court-select .tab_menu li {
        width: calc((100% - 2rem) / 5);
    }

    #calendar {
        padding: 0 1.5rem 2rem;
    }

    #calendar .fc-view-harness.fc-view-harness-active {
        height: 38rem !important;
    }

    .fc .fc-col-header-cell-cushion {
        height: 7rem;
        font-size: 1.6rem;
    }

    .fc .fc-daygrid-day-number {
        height: 4rem;
    }

    #calendar.fc .fc-toolbar.fc-header-toolbar {
        justify-content: flex-start;
        padding: 2.5rem 4rem 2rem;
    }

    .fc .fc-button-group {
        left: 0px;
        top: 53%;
        transform: translateY(-50%);
    }

    #calendar .link-btn {
        right: 2rem;
        top: 2.5rem;
    }

    .fc .fc-button-primary:disabled,
    .fc .fc-button-primary:disabled:hover {
        background-color: unset;
        border-color: unset;
        color: #a8c5cad7;
        opacity: 1;
        visibility: visible;
    }

    .mn_txt {
        font-size: 3.5rem;
    }

    .pl-link {
        height: 38rem;
    }

    .pl-link-inner {
        background: linear-gradient(180deg, var(--main-color), #1b1b1b5e);
    }

    .pl-txt {
        text-align: center;
        width: calc(100% - 3rem);
    }

    .pl-link-inner a {
        font-size: 1.8rem;
        margin: 0 auto;
    }

    .pl-link-inner h2 {
        font-size: 3.5rem;
    }

    .pl-link-inner p {
        margin: 2rem 0;
    }

    .not-cont {
        height: 5.5rem;
        padding: 0 1rem;
    }

    /* ========== page =========== */

    /* common */
    .sub-head {
        height: 25rem;
    }

    .sh-h1 {
        font-size: 3rem;
        margin-top: 7.5rem;
    }

    .sh-txt {
        height: calc(100% - 4rem);
    }

    .sh-txt span {
        display: none;
    }

    .sub-tab li,
    .sub-tab {
        height: 4rem;
    }

    .page .mn_txt {
        font-size: 3rem;
    }

    .cate {
        display: none;
    }

    .sports .cate {
        display: block;
    }

    .mn-header {
        margin-bottom: 3rem;
    }

    .sports .mn-header {
        margin-bottom: 5rem;
    }

    /* 회사소개 */
    .gr-inner {
        padding: 7rem 0;
    }

    .gr-cont {
        border-top: 0;
        padding-top: 0;
    }

    .gr_img {
        height: 25rem;
    }

    .cp_mn {
        font-size: 2.5rem;
        font-weight: 500;
    }

    .gr_txt span {
        margin: 1rem 0 3rem;
        font-size: 1.5rem;
    }

    .gr_txt p:before {
        margin: 0 0 2rem;
    }

    .gr-attach {
        margin-top: 5rem;
        height: 25rem;
    }

    .history {
        padding: 7rem 0 0;
    }

    /* 교직원 */
    .member,
    .place {
        padding: 7rem 0;
    }

    .mm-cont ul.mm_tit {
        font-size: 1.7rem;
    }

    .mm-cont ul {
        font-size: 1.6rem;
    }

    .mm-cont li {
        padding: 0 0.5rem;
    }

    /* 배치도 */
    .fac_de {
        width: 100%;
    }

    .fac-info {
        margin-top: 5rem;
    }

    .fac_tit2 {
        margin-top: 4rem;
    }

    /* 시설안내 */
    .sport-fac {
        padding: 7rem 0;
    }

    .fac_img li {
        width: 100%;
    }

    .coop {
        padding: 2rem;
    }

    /* 이용약관/개인정보처리방침 */
    .terms {
        line-height: 1.7;
    }

    .tm-inner h3 {
        margin-bottom: 1rem;
    }

    .tm-inner h4,
    .tm-inner p,
    .tm-inner ul {
        padding-left: 0.5rem;
    }

    .tm-div {
        padding: 2.5rem;
        border-radius: 1rem;
    }

    .tm-inner li:before {
        top: 1rem;
    }

}

@media screen and (max-width: 420px) {

    .mo {
        display: block;
    }

    /* ========== header =========== */
    .hn_logo img {
        width: 16rem;
    }

    .ham_btn {
        width: 25px;
        height: 25px;
    }

    .ham_btn span {
        width: 5px;
        height: 5px;
    }

    /* ========== footer =========== */
    #footer {
        padding: 3rem 0;
        border-bottom: 1rem solid var(--main-color);
    }


    /* ========== main =========== */
    .vis_txt span {
        font-size: 2.2rem;
    }

    .vis_txt h2 {
        font-size: 4rem;
    }

    .tab_menu li {
        width: calc((100% - 1.5rem) / 3);
    }

    .court-select .tab_menu li {
        width: calc((100% - 1.5rem) / 4);
    }

    .fc .fc-button-group {
        top: 51%;
    }


    /* ========== page =========== */

    /* 배치도 */
    .fac_de p {
        font-size: 14px;
    }


}

@media screen and (max-width: 350px) {
    /* ========== main =========== */

    .vis_txt h2 {
        font-size: 4rem;
    }

    .reserve-sec .edit-cont .edit_desc {
        width: 10rem;
    }

    .reserve-sec .edit-cont .edit_sub_desc {
        width: calc(100% - 10rem);
    }

}