@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@font-face {
  font-family: 'Paperlogy';
  src: url('/garage/font/Paperlogy-3Light.ttf') format('truetype');
  font-weight: 100; /* Thin */
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('/garage/font/Paperlogy-4Regular.ttf') format('truetype');
  font-weight: 400; /* Regular */
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('/garage/font/Paperlogy-5Medium.ttf') format('truetype');
  font-weight: 400; /* Regular */
  font-style: normal;
}


@font-face {
  font-family: 'Paperlogy';
  src: url('/garage/font/Paperlogy-7Bold.ttf') format('truetype');
  font-weight: 700; /* Bold */
  font-style: normal;
}




img {border: 0px; padding: 0px; margin: 0px}
body {font-size: 14px; color: #191919; margin: 0px;  font-family: "Pretendard", "Paperlogy", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", sans-serif; scrollbar-width: none; -ms-overflow-style: none; letter-spacing: -0.07em;}
body::-webkit-scrollbar {display: none;}

.clear {clear: both}
.no_dis {display: none}
.t_orange {color: #FF6200}
.t_white {color: white}

.m_hide {display: none;}

.bgcover {background-size: cover; background-position: center; background-repeat: no-repeat;}
.bgcontain {background-size: contain; background-position: center; background-repeat: no-repeat;}
.bgvideo {display: block; width: 100%; height: 80vh; object-fit: cover}


.bgbk {display: none; position: fixed; top: 0px; left: 0px; width: 100%; height: 100vh; background-image: url('/garage/images/op70.png'); z-index: 10000}
.font_a {font-family: sans-serif;}
.font_b {font-family: "Paperlogy";}

.lef {float: left}
.rig {float: right}

.wrap {width: 90%; margin: 0px auto}
.wrap_white {width: 90%; padding: 5% 5%; background-color: white}
.wrap_white_info {width: 90%; padding: 5% 5% 10% 5%; background-color: white; margin: 0px 0px 10% 0px}

.wrap_white_se {width: 90%; padding: 5% 5%; background-color: #F6F7F9; margin: 5% 0px 0px 0px}

.wrap_white200 {width: 90%; padding: 5%; background-color: #F6F7F9}

.wrap_gray {width: 100%; padding: 5% 0px; background-color: #F6F7F9}
.wrap_dark {padding: 5% 0px; background-color: #181818}

.wrap_white100 {width: 100%; padding: 5% 0%; background-color: white}
.wrap_gray100 {width: 100%; padding: 10% 0%; background-color: #F6F7F9}

.pad5 {padding: 5%}

.header {
    position: fixed; /* 스크롤해도 상단에 붙어있게 설정 */
    top: 0;
    left: 0;
    z-index: 1;    /* 다른 콘텐츠보다 위에 오도록 */
    
    width: 100%;     /* padding 포함해서 전체 너비 사용 */
    padding: 0px 5%;
    box-sizing: border-box; /* padding 때문에 너비가 늘어나는 것 방지 */
    
    height: 84px;
    line-height: 84px;

}

/* 스크롤 내렸을 때 적용될 스타일 */
.header.scrolled {background-color: white}
.header_logo {float: left; width: 64px; height: 64px; margin: 10px 0px; background-image: url('/garage/images/logo_mob.png'); background-size: 100%; background-position: center; background-repeat: no-repeat}
.header_lang {float: right; width: 24px; height: 24px; margin: 30px 0px; background-image: url('/garage/images/ic_lang.png'); background-size: 100%; background-position: center; background-repeat: no-repeat;}
.header_menu {display: none;}
.header_menu_m {display: none;}
.header_burger {float: right; width: 24px; height: 24px; margin: 30px 0px 0px 20px; background-image: url('/garage/images/ic_header_menu.png'); background-size: 100%; background-position: center; background-repeat: no-repeat;}
.header_burger.scrolled {background-image: url('/garage/images/header_scrolled.png')}

.header_menu_list {display: none; position: absolute; top: 50px; left: -50%; width: 120px; padding: 15px 20px; line-height: 28px; font-size: 14px; background-color: white; box-shadow: 0px 0px 10px gray; border-radius: 2px; font-weight: 500;}
div.header_menu_list a {color: #333; text-decoration: none;}
div.header_menu_list a:hover {color: #FF6200}


.header_wh {width: 90%; padding: 0px 5%; height: 84px; line-height: 84px;  background: none; background-color: white;}
.header_wh_logo {float: left; width: 64px; height: 64px; margin: 10px 0px; background-image: url('/garage/images/logo_mob_wh.png'); background-size: 100%; background-position: center; background-repeat: no-repeat;}
.header_wh_close {float: right; width: 18px; height: 18px; margin: 33px 0px; background-image: url('/garage/images/ic_header_close_wh.png'); background-size: 100%; background-position: center; background-repeat: no-repeat;}
.header_wh_menu {float: right; width: 24px; height: 24px; margin: 30px 0px; background-image: url('/garage/images/ic_header_menu_wh.png'); background-size: 100%; background-position: center; background-repeat: no-repeat;}


.footer {width: 90%; padding: 40px 5% 110px 5%; background-color: #f5f5f5; }
.footer_logo {float: left; width: 64px; height: 64px; background-image: url('/garage/images/logo_footer_mob.png'); background-size: 64px; background-position: center; background-repeat: no-repeat;}
.footer_title {float: left; color: black; font-size: 16px; line-height: 26px; margin: 5px 0px 0px 20px; font-weight: 600}
div.footer_title a {color: black; text-decoration: none}
div.footer_title span {font-size: 30px; font-weight: 700}


.footer_title_se {font-size:14px; color: #8b8b8b; margin: 21px 0px 0px 0px; line-height: 24px}
div.footer_title_se span {font-size: 18px; font-weight: 600; color: black}
div.footer_title_se a {text-decoration: none; color: #8b8b8b}

.footer_info {font-size: 16px; line-height: 24px; color: white}
.footer_link {font-size: 14px; color: #666666; margin: 36px 0px}
div.footer_link a {color: #666; text-decoration: none;}

.footer_bt {position: fixed; bottom: 0px; left: 0px; width: calc(100% - 30px); height: 40px; padding: 15px; background-color: black; text-align: center; z-index: 1000}
.footer_bt_lef {float: left; width: 49%; height: 40px; line-height: 40px; color: white; background-color: #FF6200; font-size: 16px;}
.footer_bt_rig {float: right; width: 49%; height: 40px; line-height: 40px; color: white; background-color: #FF6200; font-size: 16px;}

.footer_sns_insta {float: left; width: 24px; height: 24px; margin: 0px 20px 20px 0px; background-image: url('/garage/images/ic_insta.png');}
.footer_sns_kakao {float: left; width: 24px; height: 24px; margin: 0px 20px 20px 0px; background-image: url('/garage/images/ic_kakao.png');}
.footer_sns_youtube {float: left; width: 24px; height: 24px; margin: 0px 20px 20px 0px; background-image: url('/garage/images/ic_youtube.png');}

.banner {position: absolute; top: 0px; left: 0px; width: 100%; padding: 0px 0px 190% 0px; height: 0px; background-color: #f2f2f2;}
.banner_vct {height: 0px; padding: 0px 0px 190% 0px}
.banner_txt {padding: 5%; background: black; color: white}
.banner_txt_1 {font-size: 16px;}
.banner_txt_2 {font-size: 30px; font-weight: 600; margin: 10px 0px; line-height: 36px}
.banner_txt_3 {font-size: 16px;}
.banner_txt_bt {float: left; width: 175px; height: 50px; line-height: 50px; font-size: 18px; color: white; background-color: #FF6200; margin: 20px 0px 0px 0px; text-align: center;}
.banner_txt_count {float: right; width: 50px; height: 26px; line-height: 26px; color: white; padding: 0px 0px; border-radius: 13px; margin: 32px 0px; background-color: #FF6200; text-align: center;}


.idx_title {font-size: 26px; font-weight: 800; margin: 20px 0px 10px 0px; font-family: "Paperlogy";}

div.idx_title span {color: #FF6200}

.idx_rank {}
.idx_rank_rig {}
.idx_rank_m {width: 100%; padding: 14px 0px; border-bottom: 1px solid gray}
.idx_rank_ml {float: left;}
.idx_rank_mc {float: right; height: 44px; line-height: 44px; margin: 0px 10px; font-size: 14px; color: #2b2b2b}
div.idx_rank_mc span {color: #FF6200; font-weight: 700; font-size: 20px}

.idx_rank_mr {float: right; height: 26px; line-height: 26px; margin: 9px 0px; background-color: #FF6200; border-radius: 13px; padding: 0px 12px; color: white; font-weight: 600;}
div.idx_rank_mr a {color: white; text-decoration: none;}
.idx_rank_mlt {font-size: 18px; line-height: 24px; font-weight: bold;}
.idx_rank_mlb {font-size: 12px; color: #6b6b6b; line-height: 20px;}

.idx_viewmore {text-align: right; text-decoration: underline; font-size: 12px; margin: 30px 0px; font-weight: bold; color: black;}
div.idx_viewmore a {color: white; }
.viewmore_youtube {text-align: right; text-decoration: underline; font-size: 12px; margin: 30px 0px; font-weight: bold; color: black;}
div.viewmore_youtube a {color: white; cursor: pointer;}

.idx_youtube {width: 100%; height: 270px; margin: 30px 0px 0px 0px; padding: 0px 0px; overflow: hidden;}
.idx_youtube::-webkit-scrollbar {display: none}
.idx_youtube_list {width: 100%; height: 270px; padding: 0px 0px 0px 20px; overflow: hidden;}
.idx_youtube_list_dots {display: none}

.idx_youtube_list_m {width: 288px; height: 270px; margin: 0px 0px 0px 20px; background-color: white; border-radius: 10px;}

.idx_youtube_list_mp {position: relative; width: 100%; height: 170px; background-color: #f2f2f2; background-size: cover; background-position: center; border-top-left-radius: 10px; border-top-right-radius: 10px;}
.idx_youtube_list_mc {width: calc(100% - 20px); height: 80px; padding: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
.idx_youtube_list_mct {width: 100%; font-size: 15px; font-weight: bold; line-height: 24px; height: 24px; color: #FF6200; overflow: hidden;}
.idx_youtube_list_mcc {font-size: 12px; line-height: 16px; height: 32px; overflow: hidden; margin: 4px 0px; overflow: hidden;}
.idx_youtube_list_mcb {font-size: 12px; line-height: 20px; height: 20px; overflow: hidden; margin: 2px 0px 0px 0px}




/* 유튜브 링크 감싸는 박스 */
.yt_link_cover {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    text-decoration: none;
    overflow: hidden;
}

/* 썸네일 이미지 */
.yt_thumb_img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 이미지가 찌그러지지 않고 꽉 차게 */
    transition: transform 0.3s;
}

/* 마우스 올렸을 때 이미지 살짝 확대 (효과) */
.yt_link_cover:hover .yt_thumb_img {
    transform: scale(1.05);
}

/* 재생 버튼 아이콘 (CSS로 그림) */
.yt_play_icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 40px;
    background-color: rgba(33, 33, 33, 0.8); /* 반투명 검정 배경 */
    border-radius: 10px;
    z-index: 10;
}

/* 재생 버튼 안의 삼각형 */
.yt_play_icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-style: solid;
    border-width: 8px 0 8px 14px; /* 삼각형 크기 조절 */
    border-color: transparent transparent transparent white;
}

/* 마우스 올리면 버튼 빨갛게 (선택사항) */
.yt_link_cover:hover .yt_play_icon {
    background-color: #FF0000;
}




.dot {float: left; width: 10px; height: 10px; border-radius: 50%; margin: 0px 14px 0px 0px; background-color: #d7d7d7}
.dots {float: left; width: 10px; height: 10px; border-radius: 50%; margin: 0px 14px 0px 0px; background-color: #FF6200}



/* intro */

.c_title {font-size: 26px; font-weight: 700; margin: 0px 5% 5% 5%; font-family: "Paperlogy";}
.c_title_se {font-size: 26px; font-weight: 500; margin: 0px 5% 10% 5%}
.c_title_th {font-size: 26px; font-weight: 500; padding: 0px 0px 5% 0px; margin: 0px 5% 5% 5%; border-bottom: 1px solid #e9e9e9}

.c_sentence {width: 90%; padding: 10% 0px; margin: 0px 5%; border-top: 1px solid #e9e9e9; font-size: 24px; line-height: 32px; font-weight: 400; letter-spacing: -1px}
div.c_sentence span {font-weight: 700;}
.c_sentence70 {width: 75%; padding: 10% 0px; margin: 0px 5%; border-top: 1px solid #e9e9e9; font-size: 20px; line-height: 28px; font-weight: 400; letter-spacing: -1px; word-break: keep-all;}
div.c_sentence70 span {font-weight: 700;}
.c_sentence_mypage {width: 90%; padding: 7.5% 0px 5% 0px; margin: 0px 5%; border-bottom: 1px solid #e9e9e9; font-size: 26px; line-height: 32px; font-weight: 400; letter-spacing: -1px}
div.c_sentence_mypage span {font-weight: 500;}
.c_sentence_sub_mypage {margin: 30px 0px 0px 0px; line-height: 30px; font-size: 16px; font-weight: 400;}

.c_sentenc_myinfo {padding: 5% 0px; margin: 0px 5%; border-bottom: 1px solid #e9e9e9}

.c_sentence_sub {margin: 30px 0px 0px 0px; line-height: 24px; font-size: 16px; font-weight: 400;}
.c_sentence_sub2 {margin: 30px 0px 0px 0px; line-height: 24px; font-size: 16px; font-weight: 400;}

.story_banner_1 {height: 360px; background-image: url('/garage/images/img_story_1.png');}
.story_banner_2 {width: 100%; height: 0px; padding: 0px 0px 90% 0px}
.story_banner_4 {width: 100%; height: 0px; padding: 0px 0px 90% 0px}

.story_m_w {width: 100%; height: 230px; overflow-x: scroll; position: relative}
.story_m_w::-webkit-scrollbar {display: none}
.story_m_w_inner {width: 1000px; height: 230px; position: absolute; top: 0px; left: 0px; padding: 0px 0px 0px 5%}

.story_m {float: left; width: 200px; margin: 0px 40px 0px 0px}
.story_mt {font-size: 64px; color: #cecece; font-family: "Paperlogy";}
.story_mc {font-size: 18px; font-weight: 600; margin: 20px 0px}
.story_mb {font-size: 14px; line-height: 20px}

.story_pic {margin: 0px 5% 5% 5%}
.story_pic_lef {width: 100%; height: 300px; padding: 0px 0px 0px 0px; margin: 0px 0px 20px 0px;}
.story_pic_rig {width: 100%; height: 300px; padding: 0px 0px 0px 0px; margin: 0px 0px 20px 0px;}

.story_pic_t {padding: 20px 0px 0px 0px; font-size: 26px; font-weight: 600; border-top: 1px solid #dfdfdf}
.story_pic_c {font-size: 16px; line-height: 25px; margin: 20px 0px 0px 0px; font-weight: 400;}

.intro_center {width: 100%; height: 250px; overflow-x: hidden}
.intro_banner {width: 100%; height: 250px !important; margin: 0px 0px; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 0px;}
.intro_vct {height: 100px}




.member_title {font-size: 20px; font-family: "Paperlogy"; font-weight: 500; letter-spacing: 10px; padding: 40px 0px; text-align: center;}
.member_m {width: 100%; position: relative; margin: 0px 0px 10% 0px; padding: 10% 0px}
.member_name {font-size: 30px; line-height: 40px; font-weight: 700; text-align: center; letter-spacing: 0px}
div.member_name span {font-size: 20px; font-weight: 400; letter-spacing: 0px}


.member_txt_0 {position: absolute; top: 120px; right: 10%; color: #E6E6E6; font-size: 50px; font-family: "EB Garamond"; line-height: 60px; z-index: 0}
.member_img_0 {width: 90%; height: 450px; background-image: url('/garage/images/member_1.png'); background-size: contain; background-position: center; background-repeat: no-repeat; position: relative; z-index: 1; margin: 0px 10% 0px 0px}
.member_his_0 {font-size: 16px; font-weight: 400; line-height: 28px; margin: 20px 0px 0px 5%}

.member_txt_1 {position: absolute; top: 120px; left: 10%; color: #E6E6E6; font-size: 50px; font-family: "EB Garamond"; line-height: 60px; z-index: 0}
.member_img_1 {width: 90%; height: 450px; background-image: url('/garage/images/member_2.png'); background-size: contain; background-position: center; background-repeat: no-repeat; position: relative; z-index: 1; margin: 0px 0px 0px 10%}
.member_his_1 {font-size: 16px; font-weight: 400; line-height: 28px; margin: 20px 0px 0px 5%}


.member_txt_2 {position: absolute; top: 120px; left: 10%; color: #E6E6E6; font-size: 50px; font-family: "EB Garamond"; line-height: 60px; z-index: 0}
.member_img_2 {width: 100%; height: 450px; background-image: url('/garage/images/member_2.png'); background-size: contain; background-position: center; background-repeat: no-repeat; position: relative; z-index: 1}
.member_his_2 {font-size: 16px; font-weight: 400; line-height: 28px; margin: 20px 0px 0px 5%}

.member_txt_3 {display: none;}
.member_img_3 {width: 100%; height: 450px; background-image: url('/garage/images/member_3.png'); background-size: contain; background-position: center; background-repeat: no-repeat;}
.member_his_3 {font-size: 14px; font-weight: 400; line-height: 30px; margin: 20px 0px 0px 5%}

.member_txt_4 {display: none;}
.member_img_4 {width: 100%; height: 450px; background-image: url('/garage/images/member_4.jpg'); background-size: contain; background-position: center; background-repeat: no-repeat;}
.member_his_4 {font-size: 14px; font-weight: 400; line-height: 30px; margin: 20px 0px 0px 5%}


.equip_tab {margin: 10% 0px 0px 0px; text-align: center; font-size: 16px; font-weight: 500;}
div.equip_tab a {text-decoration: none; margin: 0px 10px}

.equip_m_lef {width: 100%; height: 220px; background: white; box-shadow: 0px 0px 5px #dfdfdf; margin: 0px 0px 14px 0px}
.equip_m_rig {width: 100%; height: 220px; background: white; box-shadow: 0px 0px 5px #dfdfdf; margin: 0px 0px 14px 0px}
.equip_mp {float: left; width: 48%; height: 220px; background-color: #f2f2f2; background-size: cover; background-position: center;}
.equip_mc {float: right; width: 42%; padding: 5%}

.eqiup_mct {font-size: 16px; font-weight: 500; margin: 15px 0px 10px 0px;}
.equip_mcc {font-size: 13px; font-weight: 500; color: #FF6200; margin: 0px 0px 10px 0px}
.equip_mcb {font-size: 13px; line-height: 20px; font-weight: 500;}

.info_banner_1 {width: 1920px; height: 700px; background-image: url('/garage/images/img_info_1.png'); margin: 0px auto}

.info_m {margin: 0px 0px 0px 0px}
.info_ml {width: 100%; border-bottom: 1px solid #e9e9e9; padding: 5% 0px 0px 0px}
div.info_ml img {width: 100%}
.info_mr {width: 100%; border-bottom: 1px solid #e9e9e9; padding: 5% 0px 0px 0px}
.info_mrt {font-size: 24px; font-weight: 700; margin: 5% 0px 0px 0px}
.info_mrc {font-size: 16px; font-weight: 400; line-height: 22px; margin: 5% 0px 10% 0px}

.bbs_m {padding: 15px 0px; border-bottom: 1px solid #e9e9e9}
.bbs_mt {font-size: 18px; height: 30px; line-height: 30px; font-weight: 400; margin: 0px 0px 5px 0px}
.bbs_mc {font-size: 14px; font-weight: 500; color: #7D7D7D}

.bbs_m2 {padding: 0px 0px 15px 0px; border-bottom: 1px solid #e9e9e9}
.bbs_mt2 {float: left; width: 70%; font-size: 18px; height: 30px; line-height: 30px; font-weight: 400; margin: 0px 0px 5px 0px}
.bbs_mc2 {float: right; width: 20%; line-height: 30px; font-size: 16px; font-weight: 500; color: #7d7d7d}

.bbs_view {margin: 5% 0px; font-size: 16px; font-weight: 400; line-height: 24px}
.bbs_return {width: 137px; height: 36px; line-height: 36px; margin: 20% auto; border: 1px solid #DADADA; border-radius: 4px; text-align: center; cursor: pointer; font-size: 14px}


.resv_lef {}
.resv_rig {position: fixed; bottom: 0px; left: 0px; width: 90%; height: 200px; background: white; border-top-left-radius: 15px; border-top-right-radius: 15px; box-shadow: 0px 0px 10px gray; padding: 0px 5%}

.resv_event_w {border: 1px solid #dfdfdf; margin: 0px 5%; background: white; border-radius: 3px;}

.resv_w {width: 100%; height: 36px; line-height: 36px; position: relative;}
.resv_w_fixed {position: absolute; width: 100%; height: 36px; top: 0px; left: 0px; overflow-x: scroll;
    white-space: nowrap; /* 줄바꿈 방지 */
    scroll-behavior: smooth; /* 부드러운 스크롤 이동 */
    -webkit-overflow-scrolling: touch;
}
.resv_w_fixed::-webkit-scrollbar {display: none}
.resv_w_inner {width: 1700px; height: 36px; padding: 0px 0px 0px 5%; position: absolute; top: 0px; left: 0px;}
.resv_w_more {position: absolute; width: 34px; height: 34px; margin: 0px; top: 0px; right: 5%; border-radius: 50%; background-image: url('/garage/images/resv_more.png'); background-size: 150%; background-repeat:no-repeat; background-position: center; z-index: 1;}

.resv_m_s {float: left; padding: 0px 20px; line-height: 32px; border: 1px solid #FF6200; margin: 0px 10px 0px 0px; font-size: 13px; color: white; background-color: #FF6200; cursor: pointer; border-radius: 5px; font-weight: 700}
.resv_m {float: left; padding: 0px 20px; line-height: 32px; border: 1px solid #dadada; margin: 0px 10px 0px 0px; font-size: 13px; color: black; cursor: pointer; border-radius: 5px; font-weight: 700}
.resv_pic {width: 90%; height: 220px; background-color: #f2f2f2; margin: 5%; background-image: url('/garage/images/img_example.png');}

.resv_title {font-size: 24px; font-weight: 600; margin: 5% 5% 2.5% 5%}
.resv_title_se {font-size: 14px; font-weight: 400; color: #FF6200; margin: 0px 5%}
.resv_title_detail {border-top: 1px solid #dfdfdf; padding: 5% 0px; margin: 5%; font-size: 14px; font-weight: 400px; color: #717171; line-height: 24px;}

.resv_event_m {border-bottom: 3px dotted #dfdfdf; margin: 5%; padding: 0px 0px 2.5% 0px}
.resv_event_tab {width: 150px; height: 30px; line-height: 30px; text-align: center; color: white; background-color: #FF6200; color: white; font-size: 16px; margin: 0px 0px 15px 0px}
.resv_event_lef {float: right; width: calc(100% - 30px); font-size: 14px; line-height: 30px; font-weight: 400; color: #686868;}
div.resv_event_lef span {font-size: 18px; font-weight: 600; color: black;}
.resv_event_rig {float: right; font-size: 20px; font-weight: 500;}
.resv_event_lef_b {float: left; width: 70%; font-size: 12px; color: #565656; line-height: 16px}
.resv_event_rig {}
.resv_event_bt {width: 150px; height: 48px; border-radius: 5px; background-color: #d2d2d2; color: white; text-align: center; line-height: 48px; font-size: 20px; font-weight: 400; margin: 50px 0px 0px 0px}

.resv_event_price {font-size: 16px; color: black; font-weight: 500; margin: 5px 0px 0px 0px}
div.resv_event_price span {color: #d2d2d2; text-decoration: line-through; font-weight: normal;}
.resv_event_price_rate {float: right; color: #FF7017; text-decoration: none; margin: 0px 10px 0px 0px; font-weight: 600}

.resv_event_body {min-height: 400px; display: none; margin: 0px 5%;}


.resv_event_detail {float: right; line-height: 16px; font-size: 10px; color: #4d4d4d; background-image: url('/garage/images/arrow_down.png'); background-size: 15px; background-position: right center; background-repeat: no-repeat; padding: 0px 20px 0px 0px; text-align: right; cursor: pointer;}
.resv_event_detail_on {float: right; line-height: 16px; font-size: 10px; color: #4d4d4d; background-image: url('/garage/images/arrow_up.png'); background-size: 15px; background-position: right center; background-repeat: no-repeat; padding: 0px 20px 0px 0px; text-align: right; cursor: pointer;}


.resv_event_chk {float: left; width: 20px; height: 20px; border-radius: 2px; border: 1px solid #c5c5c5; margin: 4px 0px;}
.resv_event_chk_s {float: left; width: 20px; height: 20px; border-radius: 2px; border: 1px solid #FF6200; margin: 4px 0px; background-color: #FF6200; background-image: url('/garage/images/ic_inner_check.png'); background-size: 70%; background-position: center; background-repeat: no-repeat;}

.resv_cart {margin: 5%; background-color: #F6F7F9;}
.resv_cart_total {font-size: 18px; font-weight: 500; height: 40px; line-height: 40px; margin: 30px 0px}
.resv_cart_total .rig span {font-size: 22px; font-weight: 700;}
.resv_cart_total .lef span {color:#adadad; font-size: 16px; font-weight: 400;}

.resv_submit_cart {position: relative; float: left; width: calc(40% - 20px); height: 53px; line-height: 53px; text-align: center; font-size: 18px; color: #FF6200; border: 1px solid #FF6200; border-radius: 5px}
.resv_submit {float: right; width: 60%; height: 55px; line-height: 55px; background-color: #FF6200; border-radius: 5px; text-align: center; color: white; font-size: 18px; cursor: pointer;}
.resv_submit_cart_count {position: absolute; top: -10px; right: -10px; min-width: 20px; height: 20px; line-height: 20px; border-radius: 50%; background-color: #FF6200; color: white; font-size: 10px; font-weight: 600;}

.resv_cart_title {height: 24px; line-height: 24px; padding: 30px 20px 10px 20px; font-size: 18px; font-weight: 400; color: #a1a1a1;}
.resv_cart_body {}
.resv_cart_body::-webkit-scrollbar {display: none}







/* calednar */

.calendar {padding: 0px 2.5%;}
.calendar_tr {width: 100%; height: 40px; border-bottom: 1px solid #E8EAF0; text-align: center; overflow: hidden}

.calendar_td_sat {float: left; width: 15%; height: 38px; line-height: 48px; font-size: 16px; color: #222222; position: relative; cursor: pointer;}
.calendar_td {float: left; width: 14%; height: 38px; line-height: 48px; font-size: 16px; color: #222222; position: relative; cursor: pointer;}
.calendar_td_sun {float: left; width: 15%; height: 38px; line-height: 48px; font-size: 16px; color: #E40000; position: relative}
.calendar_td_this_day {position: absolute; top: 4px; left: calc(50% - 16px); border-radius: 50%; width: 32px; height: 32px; line-height: 32px; background-color: #FF6200; color: white; text-align: center}
.calendar_td_view_day {height: calc((100vh - 170px) / 6); overflow: hidden}

.cal_month_w {width: 95%; padding: 0px 2.5%; height: 48px; background: white; text-align: center; margin: 0px 0px 0px 0px}
.cal_day_m {float: left; width: 14%; height: 48px; line-height: 48px; font-size: 16px}
.cal_day_m_sat {float: left; width: 15%; height: 48px; line-height: 48px; font-size: 16px; color: #222222}
.cal_day_m_sun {float: left; width: 15%; height: 48px; line-height: 48px; font-size: 16px; color: #E40000}

.cal_month {position: relative; height: 18px; line-height: 18px; text-align: center; margin: 40px 10px 10px 10px; font-size: 17px; font-weight: 500; color: #4a5660;}
.cal_prev {position: absolute; top:0px; left: 0px; width: 18px; height: 18px; background-image: url('/garage/images/ic_prev.png'); background-size: 100%; background-position: cover; background-repeat: no-repeat; cursor: pointer;}
.cal_next {position: absolute; top: 0px; right: 0px; width: 18px; height: 18px; background-image: url('/garage/images/ic_next.png'); background-size: 100%; background-position: cover; background-repeat: no-repeat; cursor: pointer;}

.cal_time_title {font-size: 18px; margin: 30px 0px 10px 0px}

.cal_time {float: left; width: calc(25% - 6px); height: 32px; line-height: 32px; text-align: center; border-radius: 5px; font-size: 14px; border: 1px solid #dadada; margin: 0px 5px 5px 0px; cursor: pointer}
.cal_time_off {float: left; width: calc(25% - 6px); height: 32px; line-height: 32px; text-align: center; border-radius: 5px; font-size: 14px; background-color: #F6F7F9; color: #bfbfbf; border: 1px solid #dadada; margin: 0px 5px 5px 0px}
.cal_time_this {float: left; width: calc(25% - 5px); height: 32px; line-height: 32px; text-align: center; border-radius: 5px; font-size: 14px; background-color: #fffaf7; color: #FF6200;  border: 1px solid #FF6200; margin: 0px 5px 5px 0px}



.feedback_m {background: white; margin: 5% 0px 0px 0px; padding: 2.5% 5% 5% 5%;}
.feedback_m_s {float: left; width: 540px; height: 220px; margin: 0px 0px 44px 0px; color: white}

.feedback_ml {float: left; width: 50%; height: 160px; background-image: url('/garage/images/feedback_ml.png'); background-size: cover; background-position: center; cursor: pointer;}
.feedback_ml_pic {float: left; width: 50%; height: 160px; background-size: cover; background-position: center; cursor: pointer;}
.feedback_mr {float: right; width: 50%; height: 160px; background-color: #f7f7f7; line-height: 220px; text-align: center; font-size: 40px; cursor: pointer;}

.feedback_title {text-align: center; font-size: 16px; font-weight: 500px; margin: 5px 0px;}
.feedback_date {font-size: 12px; font-weight: 500; margin: 5px 0px}
.feedback_date_m {float: left; width: 50%; text-align: center;}

.feedback_type {height: 20px; margin: 5px 0px; text-align: center;}
.feedback_type_m {float: left; width: 33.3%; height: 20px; line-height: 20px; margin: 0px 5px 0px 0px; font-size: 13.5px; font-weight: 500; background-color: gray; color: white}
.feedback_type_m_s {float: left; width: 33.3%; height: 20px; line-height: 20px; margin: 0px 5px 0px 0px; font-size: 13.5px; font-weight: 500; background-color: #FF6200; color: white}

.feedback_msg {font-size: 12px; line-height: 18px; margin: 10px 0px 0px 0px; text-align: center;}

.mypage_w {width: 90%; min-height: 500px; padding: 60px 5% 200px 5%; border-top: 1px solid #e9e9e9; }
.mypage_vacant {color: #7c7c7c; font-size: 24px}
.mypage_vacant_bt {width: 305px; height: 58px; line-height: 58px; border-radius: 10px; background-color: #FF6200; font-size: 24px; color: white; margin: 50px 0px; text-align: center; cursor: pointer;}

.mypage_m {border: 1px solid #a4a4a4;color: #FF6200; background-image: url('/garage/images/ic_arw_down.png'); background-size: 40px; background-position: calc(100% - 30px) 30px; background-repeat: no-repeat;}
div.mypage_m span {font-size: 26px; font-weight: 600; color: black}
.mypage_info {border: 1px solid #a4a4a4; padding: 30px 50px; color: #FF6200; background-image: url('/garage/images/ic_arw_down.png'); background-size: 40px; background-position: calc(100% - 30px) 30px; background-repeat: no-repeat;}
div.mypage_info span {font-size: 26px; font-weight: 600; color: black}

.mypage_view {margin: 0px 5%; border-top: 1px solid #e9e9e9}
.mypage_view_lef {float: left; width: 150px; height: 76px; line-height: 76px; border-bottom: 1px solid #E9E9E9; font-size: 18px; font-weight: 700;}
.mypage_view_rig {float: left; width: calc(100% - 150px); height: 76px; line-height: 76px; border-bottom: 1px solid #E9E9E9; font-size: 18px; font-weight: 400; text-align: right; overflow: hidden;}
.mypage_view_rig_more {float: left; width: calc(100% - 180px); height: 76px; line-height: 76px; border-bottom: 1px solid #E9E9E9; font-size: 18px; font-weight: 400; text-align: right; overflow: hidden; padding: 0px 30px 0px 0px; background-image: url('/garage/images/ic_arw_down.png'); background-size: 24px; background-position: center right; background-repeat: no-repeat;}
.mypage_view_more {display: none; padding: 20px; font-size: 16px; border-bottom: 1px solid #e9e9e9; line-height: 24px;}
.mypage_view_bt {float: left; width: calc(35% - 2px); height: 53px; line-height: 53px; padding: 0px; text-align: center; background-color: white; border: 1px solid #FF6200; border-radius: 5px; margin: 80px 0px 100px 0px; cursor: pointer; color: #FF6200; font-size: 18px;}
.mypage_view_bt2 {float: right; width: 60%; height: 55px; line-height: 55px; padding: 0px; text-align: center; background-color: #ff6200; color: white; border-radius: 5px; margin: 80px 0px 100px 0px; cursor: pointer; font-size: 18px;}



.resv_go_title {font-size: 30px; font-weight: 500; color: black; margin: 0px 0px 10px 0px}
div.resv_go_title span {color: #FF6200; font-weight: 700; font-family: "Paperlogy";}
.resv_go_m {height: 24px; line-height: 24px; padding: 38px 0px; border-bottom: 1px solid #c0c0c0;}
.resv_go_m_title {float: left; font-size: 25px;}
.resv_go_m_price {float: right; font-size: 25px; font-weight: 500;}
.resv_go_m_close {float: right; width: 24px; height: 24px; background-image: url('/garage/images/ic_close.png'); background-size: 20px; background-position: center; background-repeat: no-repeat; margin: 0px 0px 0px 30px}

.resv_go_reco_t {font-size: 18px; font-weight: 500; margin: 30px 0px 20px 0px}
.resv_go_reco_m {margin: 20px 16px 0px 16px}
.resv_go_reco_mchk {float: left; width: 18px; height: 18px; margin: 0px 0px 0px 0px; border: 1px solid #c5c5c5; border-radius: 2px}
.resv_go_reco_mchk_s {float: left; width: 18px; height: 18px; margin: 0px 0px 0px 0px; border: 1px solid #FF6200; border-radius: 2px; background-color: #FF6200; background-image: url('/garage/images/ic_inner_check.png'); background-size: 70%; background-position: center; background-repeat: no-repeat;}

.resv_go_reco_mp {float: left; width: 80px; height: 80px; background-color: #efefef; margin: 0px 15px; background-size:cover; background-position: center; background-repeat: no-repeat;}
.resv_go_reco_mc {float: left; width: calc(100% - 130px); padding: 0px 0px}
.resv_go_reco_mct {font-size: 16px; font-weight: 700; width: 100%; height: 22px; line-height: 22px; overflow: hidden; margin: 0px 0px 5px 0px}
.resv_go_reco_mcc {float: left; height: 16px; line-height: 16px; border: 1px solid #FF6200; border-radius: 3px; margin: 0px 2px 1px 0px; padding: 0px 3px; font-size: 11px; color: #FF6200; background-color: #fbf8f7}
.resv_go_reco_mcp {font-size: 16px; font-weight: 500; margin: 5px 0px 0px 0px}
div.resv_go_reco_mcp span {color: black}

.resv_go_total {margin: 20px 0px 0px 0px; padding: 30px 0px 0px 0px; border-top: 1px solid #e9e9e9}
.resv_go_total_t {font-size: 18px; font-weight: 600}
.resv_go_total_c {margin: 10px 0px 10px 0px}
.resv_go_total_ct {float: left; font-size: 16px; font-weight: 600; }
div.resv_go_total_ct span {color: #FF6200}
.resv_go_total_cc {float: right; font-size: 16px; font-weight: 600;}
.resv_go_total_b {font-size: 14px; font-weight: 400; color: #a6a6a6}

.resv_ppl {margin: 30px 0px 0px 0px;}
.resv_ppl_l {float: left; width: 25%; height: 40px; line-height: 40px; color: black; font-size: 18px; font-weight: 600;}
.resv_ppl_r {float: right; width: 75%}
.ipt_resv_ppl_r {width: calc(100% - 22px); height: 38px; line-height: 38px; border: 1px solid #dadada; border-radius: 4px; padding: 0px 10px; font-size: 16px}
.ipt_resv_ppl_r_large {width: calc(100% - 22px); height: 88px; line-height: 24px; border: 1px solid #dadada; border-radius: 4px; padding: 0px 10px; font-size: 16px}

.resv_ppl_box {border-top: 1px solid #e9e9e9; padding: 30px 0px 10px 0px; margin: 30px 0px 0px 0px;}
.resv_ppl_chk {float: left; width: 18px; height: 18px; border-radius: 2px; border: 1px solid #efefef}
.resv_ppl_chk_s {float: left; width: 20px; height: 20px; border-radius: 2px; background-color: #FF6200; background-image: url('/garage/images/ic_inner_check.png'); background-size: 70%; background-position: center; background-repeat: no-repeat;}

.resv_ppl_chk_txt {float: left; height: 20px; line-height: 20px; font-size: 18px; margin: 0px 10px; font-weight: 600;}
.resv_ppl_chk_gray {margin: 15px 10px 30px 15px; font-size: 14px; color: #a6a6a6; line-height: 20px;}

.resv_ppl_bt {height: 55px; line-height: 55px; color: white; text-align: center; background-color: #FF6200; font-size: 18px; font-weight: 700; margin: 180px 0px 20px 0px; border-radius: 10px; cursor: pointer;}
.resv_ppl_bt_gray {height: 55px; line-height: 55px; color: white; text-align: center; background-color: #d2d2d2; font-size: 18px; font-weight: 500; border-radius: 10px; cursor: pointer;}


/* for mobile */
.menu_mob_w {background-color: #FF6200; border-radius: 10px; padding: 20px;}

.menu_mob_m1 {float: left; width: 33.3%; height: 15px; padding: 35px 0px 0px 0px; text-align: center; font-size: 12px; color: white; background-image: url('/garage/images/menu_mob_m1.png'); background-size: 35px; background-position: center top; background-repeat: no-repeat;}
.menu_mob_m2 {float: left; width: 33.3%; height: 15px; padding: 35px 0px 0px 0px; text-align: center; font-size: 12px; color: white; background-image: url('/garage/images/menu_mob_m2.png'); background-size: 35px; background-position: center top; background-repeat: no-repeat;}
.menu_mob_m3 {float: left; width: 33.3%; height: 15px; padding: 35px 0px 0px 0px; text-align: center; font-size: 12px; color: white; background-image: url('/garage/images/menu_mob_m3.png'); background-size: 35px; background-position: center top; background-repeat: no-repeat;}

.menu_mob_m {height: 24px; line-height: 24px; padding: 30px 5%; font-size: 20px; font-weight: 700;}
.menu_mob_m_s {height: 24px; line-height: 24px; padding: 30px 5%; font-size: 20px; font-weight: 700; border-top: 1px solid #a1a1a1; background-image: url('/garage/images/ic_arrow_right.png'); background-size: 14px; background-repeat: no-repeat; background-position: 95% center;}
.menu_mob_m_se {height: 20px; line-height: 20px; margin: 0px 0px 30px 0px; font-size: 15px; padding: 0px 5%; font-weight: 500}




/* 전체 레이아웃 */
.popup_w {width: 100%; height: 100vh}
.popup_white {width: 100%; margin: 0px; padding: 0px; height:100vh; background-color: white; z-index: 1000000; position: fixed; left: 0px; top: 0px; overflow-y: scroll}

/* 팝업 외각 컨테이너 (화면 정중앙 정렬 레이아웃) */
.popup {
    position: fixed;         /* 절대 위치가 아닌 화면에 고정 */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -55%); /* 정확하게 화면 정중앙으로 이동 */
    width: 80%;              /* 좌우 여백 10%씩 남기므로 너비는 80% */
    z-index: 9999;           /* 최상단에 노출 */
}

/* 이미지가 보이는 액자 (가로 3 : 세로 5 비율 보장) */
.popup_img {
    position: relative;      /* absolute 대신 relative로 변경하여 부모 역할을 하도록 함 */
    width: 100%; 
    overflow: hidden;        /* 넘치는 이미지 숨김 */
    padding: 0px 0px 43px 0px;
}

/* [추가] 실제 움직이는 긴 필름 (HTML의 id="pbox_img"에 대응) */
#pbox_img {
    display: flex;       /* 가로 배치 */
    flex-wrap: nowrap;
    width: 100%;
    height: 100%;
}

/* [수정] 개별 이미지 배너 */
.popup_img_banner {
    position: relative; /* absolute 제거 -> relative 권장 */
    width: 100%;        /* 부모 너비 꽉 차게 */
    flex-shrink: 0;     /* [필수] 화면 밖으로 밀려나도 사이즈 줄어들지 않음 */
    aspect-ratio: 3 / 5;     /* ★ 핵심: 가로 3 : 세로 5 비율 강제 유지 (height 지정 불필요) */
    background-position: center; 
    background-size: cover; 
    background-repeat: no-repeat;
    /* top, left 제거 */
}

/* 네비게이션 (점) */
.popup_navi_pc {display: none;} /* PC에서는 숨김 */

.popup_navi {
  position: absolute;
  bottom: 52px;
  left: 50%;
  transform: translateX(-50%); /* 정확한 중앙 배치를 위해 추가 */
  display: flex;               /* flex박스 시작 */
  justify-content: center;     /* 가로 중앙 정렬 */
  align-items: center;         /* 세로 중앙 정렬 (필요시) */
  gap: 7px;                    /* 점 사이의 간격 (margin 대신 사용 가능) */
}

.popup_bt_s {width: 10px; height: 10px; border-radius: 5px; background-color: #FF7017; overflow: hidden;}
.popup_bt {width: 10px; height: 10px; border-radius: 5px; background-color: white; overflow: hidden;}


.popup_bt_m_s {width: 10px; height: 10px; border-radius: 5px; background-color: #FF7017; overflow: hidden;}
.popup_bt_m {width: 10px; height: 10px; border-radius: 5px; background-color: white; overflow: hidden;}




/* 하단 버튼들 */
.popup_img_close {position: absolute; z-index: 10; bottom: 0px; left: 0px; width: calc(50% - 3px); height: 37px; line-height: 37px; background: #efefef; color: black; text-align: center; cursor: pointer;}
.popup_img_exit {position: absolute; z-index: 10; bottom: 0px; right: 0px; width: calc(50% - 3px); height: 37px; line-height: 37px; background: #FF7017; color: white; text-align: center; cursor: pointer;}
div.popup_img_exit a {color: white;}




.terms_wrap {width: 90%; margin: 0px 5% 10% 5%}
.terms_title {font-size: 36px; text-align: center; font-weight: bold; margin: 50px 0px 20px 0px;}
.terms_title_sub {font-size: 16px; text-align: center; color: #777777; margin: 0px 0px 40px 0px}
.terms_body_title {font-size: 22px; font-weight: bold; margin: 35px 0px 0px 0px}
.terms_body_title_se {font-size: 18px; font-weight: bold; margin: 20px 0px 0px 0px}
.terms_body {font-size: 14px; line-height: 24px; margin: 10px 0px; color: #777}
.terms_body_square {font-size: 14px; line-height: 22px; margin: 10px 0px; color: #777; border: 1px  solid #dfdfdf; padding: 15px}

.resv_welcome {font-size: 24px; font-weight: 600; margin: 7.5% 5% 2% 5%; border-top: 1px solid #e9e9e9; padding: 16px 0px 0px 0px}
.resv_welcome2 {font-size: 16px; font-weight: 400; margin: 0px 5% 7.5% 5%}

.resv_category_select {width: 100%; height: 90vh; overflow-y: scroll; background-color: white; border-top-left-radius: 16px; border-top-right-radius: 16px; margin: 0px 0px 0px 0px;}
.resv_category_select_m {height: 20px; line-height: 20px; font-size: 14px;}

.resv_category_select_top {width: 36px; height: 3px; margin: 10px auto; background-color: #bfbfbf; border-radius: 2px;}
.resv_category_select_title {font-size: 16px; font-weight: 600; margin: 20px 5% 0px 5%; padding: 0px 0px 5px 0px; border-bottom: 1px solid #e9e9e9; text-align: center;}
.resv_category_select_m {height: 20px; margin: 15px 5% 0px 5%; font-size: 16px; font-weight: 500;}
.resv_category_select_m_t {float: left; width: 18px; height: 18px; border: 1px solid #bfbfbf; border-radius: 50%; margin: 0px 10px 0px 0px}
.resv_category_select_m_t:hover {border: 1px solid #FF6200; background-color: #FF6200}
.resv_category_select_m_t2 {width: 10px; height: 10px; border-radius: 50%; border: 4px solid white}
.resv_category_select_m_c {float: left;}

.resv_1 {width: 100%}

.cart_w {background-color: #F6F7F9; padding: 5%}

.cart_chk {float: left; width: 20px; height: 20px; border-radius: 2px; border: 1px solid #c5c5c5; margin: 0px 0px; background: white}
.cart_chk_s {float: left; width: 20px; height: 20px; border-radius: 2px; border: 1px solid #FF6200; margin: 0px 0px; background-color: #FF6200; background-image: url('/garage/images/ic_inner_check.png'); background-size: 70%; background-position: center; background-repeat: no-repeat;}
.cart_title {float: left; font-size: 18px; font-weight: 500; height: 22px; line-height: 22px; margin: 0px 0px 10px 10px}
.cart_list {background-color: white; border: 1px solid #dfdfdf; border-radius: 4px; padding: 0px 0px 20px 0px}


.cart_m {border-bottom: 3px dotted #efefef; line-height: 30px; margin: 0px 20px; padding: 15px 0px; font-size: 16px; font-weight: 400;}
.cart_m_t {line-height: 30px; }
.cart_m_c {float: left; line-height: 30px; margin: 0px 0px}
.cart_m_x {float: right; width: 20px; height: 20px; margin: 0px 0px; background-image: url('/garage/images/ic_close.png'); background-size: 10px; background-position: center; background-repeat: no-repeat; cursor: pointer;}

.mcart_m_cate {color: #C04A00; font-size: 12px; margin: 0px 0px 0px 0px}
.mcart_m_chk {float: left; width: 20px; height: 20px; border-radius: 2px; border: 1px solid #c5c5c5; margin: 0px 0px; background: white}
.mcart_m_chk_s {float: left; width: 20px; height: 20px; border-radius: 2px; border: 1px solid #FF6200; margin: 0px 0px; background-color: #FF6200; background-image: url('/garage/images/ic_inner_check.png'); background-size: 70%; background-position: center; background-repeat: no-repeat;}
.mcart_m_t {float: left; max-width: 90%; line-height: 22px; margin: 0px 0px 0px 10px}
.mcart_m_c {line-height: 30px; margin: 0px 0px; text-align: right; font-size: 16px; font-weight: 500;}
.mcart_m_x {float: right; width: 20px; height: 20px; margin: 0px 0px; background-image: url('/garage/images/ic_close.png'); background-size: 10px; background-position: center; background-repeat: no-repeat; cursor: pointer;}
.mcart_m_b {font-size: 12px; color: #a6a6a6}

.close_youtube {position: fixed; top: calc(50vh - 130px); right: calc(50% - 150px); width: 20px; height: 20px; background-image: url('/garage/images/ic_close.png'); background-size: 100%; background-position: center; background-repeat: no-repeat; cursor: pointer;}
.view_youtube_frame {position: absolute; width: 300px; height: 180px; top: calc(50vh - 100px); left: calc(50% - 150px); z-index: 1111}
.info_map {margin: 5% 0px; width: 100%; height: 350px}


.pp_w {width: 80%; margin: 20% 5%; padding: 5%; background-color: white; border-radius: 15px; box-shadow: 0px 0px 10px gray;}
.pp_title {float: left; font-size: 22px; line-height: 28px; font-weight: 700;}
.pp_close {float: right; width: 14px; height: 14px; background-image: url('/garage/images/ic_close.png'); background-size: 100%; background-position: center; background-repeat: no-repeat; margin: 5px 0px}
.pp_text {color: #797979; font-size: 16px; margin: 10px 0px}
div.pp_w img {width: 100%; margin: 10px 0px 0px 0px}

.resv_ppl_bt_type2 {height: 55px; line-height: 55px; color: white; text-align: center; background-color: #FF6200; font-size: 18px; font-weight: 700; margin: 30px 0px 20px 0px; border-radius: 5px; cursor: pointer;}

.mcal_header {font-size: 26px; font-weight: 500; margin: 0px 5% 2.5% 5%; padding: 4% 0px; border-bottom: 1px solid #E9E9E9}
.mcal_middle {line-height: 40px; text-align: center; font-size: 16px; color: #656565; font-weight: 400; background-color: #FF70170D; margin: 0px 5%}
.mcal_cart {line-height: 50px; padding: 0px 0px 10px 0px; border-bottom: 1px solid #e9e9e9; margin: 5% 5%}
.mcal_cart_l {float: left; font-size: 18px; font-weight: 600}
.mcal_cart_r {float: right; min-width: 10px; font-size: 16px; color: #323232; padding: 0px 24px 0px 0px; background-image: url('/garage/images/ic_down_gray.png'); background-size:22px; background-position: center right; background-repeat: no-repeat;}
.mcal_cart_r_s {float: right; min-width: 10px; font-size: 16px; color: #323232; padding: 0px 24px 0px 0px; background-image: url('/garage/images/ic_up_gray.png'); background-size:22px; background-position: center right; background-repeat: no-repeat;}


.mcal_title {position: absolute; width: 120px; height: 50px; line-height: 50px; top: 0px; left: 5%; font-size: 18px; font-weight: bold; z-index: 1; background-color: white; background-image: url('/garage/images/ic_arrow_right.png'); background-size: 12px; background-position: center right; background-repeat: no-repeat;}
.mcal_month {position: absolute; width: 50px; height: 30px; top: 10px; left: 5%}
.mcal_scroll {position: absolute; width: 95%; height: 80px; top: 50px; left: 0px; padding: 0px 0px 0px 5%; overflow-x: scroll; overflow-y: hidden;}
.mcal_scroll::-webkit-scrollbar {display: none}

.mcal_inner {width: 300px; height: 80px}

.mcal_icon {position: absolute; width: 50px; height: 50px; top: 0px; right: 5%; background-image: url('/garage/images/mcal_icon.png'); background-size: 24px; background-position: center; background-repeat: no-repeat;}
.mcal_day {float: left; width: 53px; height: 68px; line-height: 34px; padding: 5px 0px; border: 1px solid #DADADA; border-radius: 3px; margin: 0px 5px 0px 0px; text-align: center; font-size: 14px; font-weight: 400;}
div.mcal_day span {font-weight: 500; font-size: 16px}
.mcal_day_s {float: left; width: 53px; height: 68px; line-height: 34px; padding: 5px 0px; border: 1px solid #FF6200; border-radius: 3px; margin: 0px 5px 0px 0px; text-align: center; font-size: 14px; font-weight: 400; background-color: #fff0e6}
div.mcal_day_s span {font-weight: 500; font-size: 16px; color: #FF6200}


.mcal_cart_view {display: none;}

.cart_alert {display: none; position: fixed; top: 0px; left: 0px; width: 90%; height: 50px; line-height: 50px; padding: 0px 5%; background: #636363; color: white; text-align: center; font-size: 14px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; z-index: 100000}
div.cart_alert a {text-decoration: underline;}


/* .category_se {width: 100%; height: 36px; line-height: 36px; overflow-x: scroll; margin: 5px 0px 0px 0px}
.category_se::-webkit-scrollbar {display: none}
.category_se_inner {display: inline-flex; width: aUto; height: 36px; padding: 0px 0px 0px 20px}
.category_se_m {min-width: 120px; line-height: 36px; height: 35px; border-bottom: 1px solid #efefef; padding: 0px; margin: 0px 0px 0px 0px; font-size: 14px; color: #B9B9B9; text-align: center;}
.category_se_m_s {min-width: 120px; line-height: 36px; height: 35px; border-bottom: 1px solid black; padding: 0px; margin: 0px 0px 0px 0px; font-size: 14px; color: black; font-weight: bold; text-align: center;} */

/* 부모: 가로 스크롤 담당 */
.category_se {
    width: 100%;
    height: 40px; /* 보더 두께 고려해서 살짝 여유 있게 */
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap; /* 중요: 자식 요소들이 줄바꿈되지 않게 함 */
    -webkit-overflow-scrolling: touch; /* 모바일 부드러운 스크롤 */
    margin: 5px 0 0 0;
}

/* 스크롤바 숨기기 */
.category_se::-webkit-scrollbar {
    display: none;
}

/* 내부 컨테이너: 컨텐츠 양에 따라 너비 자동 조절 */
.category_se_inner {
    display: inline-block; /* 내부 요소만큼만 너비 차지 */
    min-width: 100%;
    height: 36px;
    padding-left: 20px;
    vertical-align: top;
}

/* 개별 카테고리 아이템 */
.category_se_m, .category_se_m_s {
    display: inline-block; /* float 대신 inline-block 사용 */
    min-width: 120px;
    height: 35px;
    line-height: 36px;
    text-align: center;
    font-size: 14px;
    cursor: pointer;
    margin: 0;
    padding: 0 10px; /* 글자 양옆 여백 */
}

/* 기본 상태 보더 */
.category_se_m {
    color: #B9B9B9;
    border-bottom: 1px solid #efefef;
}

/* 선택된 상태 보더 */
.category_se_m_s {
    color: black;
    font-weight: bold;
    border-bottom: 2px solid black; /* 강조를 위해 2px 추천 */
}




.login_inner {width: 100%; height: 100vh; background-color: white; overflow: hidden;}
.login_title {font-size: 22px; font-weight: 600; text-align: center; margin: 100px 0px 0px 0px}
div.login_title span {color: #FF6200}
.login_title_se {width: 60%; margin: 15px auto; font-size: 13px; text-align: center; color: #787878; word-break: keep-all;}
.login_kakao {width: 90%; height: 55px; line-height: 55px; background-color: #FAE100; color: black; font-size: 18px; font-weight: 700; text-align: center; border-radius: 5px; margin: 36px auto 0px auto; cursor: pointer;}
div.login_kakao a {text-decoration: none; color: black;}
.login_number {width: 90%; height: 55px; line-height: 55px; background-color: #FF6200; color: white; font-size: 18px; font-weight: 700; text-align: center; border-radius: 5px; margin: 10px auto 0px auto; cursor: pointer;}


.login_mtitle {font-size: 22px; font-weight: 600; text-align: center; margin: 70px 5% 0px 5%; padding: 20px 0px;  border-bottom: 1px solid #e9e9e9; text-align: left}


.login_ipt {margin: 40px 5% 10px 5%; color: black; font-size: 18px; font-weight: 600; text-align: left;}

.ipt_login {width: calc(100% - 22px); height: 44px; line-height: 44px; border: 1px solid #dadada; border-radius: 5px; padding: 0px 10px; font-size: 16px; margin: 0px 0px 10px 0px}
.ipt_login2 {width: calc(90% - 22px); height: 44px; line-height: 44px; border: 1px solid #dadada; border-radius: 5px; padding: 0px 10px; font-size: 16px; margin: 0px 0px 10px 5%}

.login_ipt_se {color: #949494; margin: 0px 5% 0px 5%; font-size: 14px; text-align: left;}
.bt_login {width: 100%; height: 46px; line-height: 46px; border: 0px; background-color: #FF6200; color: white; text-align: center; border-radius: 10px; cursor: pointer; margin: 0px 0px 10px 0px; font-size: 14px; font-weight: 600;}

.login_lef {float: left; width: calc(90% - 125px); margin: 0px 0px 0px 5%}
.login_rig {float: right; width: 115px; margin: 0px 5% 0px 0px}

.login_view_close {position: fixed; top: 20px; right: 20px; width: 20px; height: 20px; background-image: url('/garage/images/ic_close.png'); background-size: 100%; background-position: center; background-repeat: no-repeat; cursor: pointer;}





.nrsvt_complete {margin: 5%; font-size: 14px; color: #a6a6a6; padding: 0px 0px 0px 0px}
div.nrsvt_complete span {color: black; font-weight: 600; font-size: 22px}

.c_sentence_myinfo {padding: 5%; border-bottom: 1px solid #e9e9e9}
.c_sentence_myinfo_lef {float: left; font-size: 14px; font-weight: 400; color: #a6a6a6; line-height: 30px}
div.c_sentence_myinfo span {color: black; font-size: 22px; font-weight: 600}
.c_sentence_myinfo_logout {float: right; font-size: 14px; font-weight: 400; color: #a6a6a6; text-decoration:underline; line-height: 30px;}


.myinfo_date {font-size: 16px; font-weight: 600; margin: 30px 5% 0px 5%}
.myinfo_date_cancel {font-size: 16px; font-weight: 600; margin: 30px 5% 0px 5%; color: #E30000}

.myinfo_product {font-size: 14px; font-weight: 400; color: #787878; margin: 2.5% 5%}
.myinfo_m {border-top: 1px solid #e9e9e9; margin: 0px 5%; padding: 5% 0px}
.myinfo_mt {font-size: 18px; font-weight: 600; margin: 0px 0px 10px 0px;}
.myinfo_mlef {float: left; font-size: 16px; font-weight: 600;}
div.myinfo_mlef span {color: #FF6200}
.myinfo_mrig {float: right; font-size: 16px; font-weight: 500;}
.myinfo_mtxt {font-size: 14px; font-weight: 400; color: #a6a6a6; line-height: 20px; margin: 5px 0px}

.myinfo_mbt1 {float: left; width: 47.5%; height: 32px; border: 1px solid #949494; color: #949494; line-height: 32px; text-align: center; font-size: 14px; border-radius: 5px; cursor: pointer; margin: 20px 0px 30px 0px}
.myinfo_mbt2 {float: right; width: 47.5%; height: 34px; background-color: #949494; color: white; line-height: 34px; text-align: center; font-size: 14px; border-radius: 5px; cursor: pointer; margin: 20px 0px 30px 0px;}



.footer_menu {background-color: white; position: fixed; bottom: 0px; left: 0px; width: 100%; max-height: 75vh; overflow-y: scroll; border-top-left-radius: 15px; border-top-right-radius: 15px; padding: 30px 0px 30px 0px; z-index: 1}
.footer_menu::-webkit-scrollbar {display: none}

.footer_menu_close {position: absolute; top: 0px; left: calc(50% - 25px); width: 50px; height: 3px; background-color: #dfdfdf; border-radius: 1px; margin: 10px auto 30px auto;}
.footer_menu_txt {font-size: 18px; font-weight: 600; margin: 5%}

.footer_menu_bt {line-height: 20px; border: 1px solid #DADADA; border-radius: 5px; margin: 20px 5%; padding: 2.5%; font-size: 16px; font-weight: 500; color: black}
div.footer_menu_bt span {color: #a6a6a6; font-weight: 400px; font-size: 14px;}
.footer_menu_bt:hover {border: 1px solid #ff6200}

.footer_menu_bt_s {line-height: 20px; border: 1px solid #ff6200; border-radius: 5px; margin: 20px 5%; padding: 2.5%; font-weight: 500; font-size: 16px; font-weight: 500; color: black}
div.footer_menu_bt_s span {color: #a6a6a6; font-weight: 400px; font-size: 14px;}
.footer_menu_bt_s:hover {border: 1px solid #ff6200}



.footer_menu_bt1 {height: 20px; line-height: 20px; border: 1px solid #DADADA; border-radius: 5px; margin: 20px 5%; padding: 2.5%; font-size: 16px; font-weight: 500;}
.footer_menu_bt1:hover {border: 1px solid #ff6200}
.footer_menu_bt2 {line-height: 20px; border: 1px solid #DADADA; border-radius: 5px; margin: 20px 5%; padding: 2.5%; font-size: 14px; font-weight: 500; color: #A6A6A6}
div.footer_menu_bt2 span {color: black; font-weight: 500px; font-size: 16px;}
.footer_menu_bt2:hover {border: 1px solid #ff6200}

.footer_menu_bt3 {height: 55px; line-height: 55px; background-color: #ff6200; border-radius: 8px; text-align: center; font-size: 18px; font-weight: 600; color: white; margin: 10% 5%}
.footer_menu_bt4 {float: left; width: calc(45% - 5px); height: 53px; line-height: 53px; border: 1px solid #ff6200; border-radius: 5px; text-align: center; font-size: 18px; color: #FF6200; margin: 5% 0px 5% 5%}
.footer_menu_bt5 {float: right; width: calc(45% - 5px); height: 55px; line-height: 55px; background-color: #ff6200; border-radius: 5px; text-align: center; font-size: 18px; color: white; margin: 5% 5% 5% 0px}

.footer_menu_shut {position: fixed; top: 0px; left: 0px; width: 100%; height: 100vh}


.mypage_banner {
    margin: 5% auto;
    width: 90%;
    /* height: 110px; <- 제거 */
    display: block !important;
    visibility: visible !important;    
    aspect-ratio: 2 / 1; /* ★ 항상 2:1 비율 유지 */
}

.mypage_banner_m {
    width: 100%; 
    height: 100%; /* ★ 부모(.mypage_banner)의 2:1 높이를 그대로 상속 */
    border-radius: 10px; 
    background-position: center; 
    background-repeat: no-repeat; 
    background-size: cover;
    outline: none;
}

.mypage_no_resv {width: 60px; height: 60px; margin: 100px auto 10px auto; background-image: url('/garage/images/no_resv.png'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.mypage_no_resv_txt {color: #a6a6a6; font-size: 16px; text-align: center;}
.mypage_no_resv_bt {width: 240px; height: 34px; line-height: 34px; border: 1px solid #a6a6a6; color: #a6a6a6; text-align: center; font-size: 14px; border-radius: 5px; margin: 30px auto 130px auto}