@charset "utf-8";
/* CSS Document */
.box0{ width:1024px; margin:0 auto}
.box1{ width:1024px; height: 100%; box-sizing: border-box; margin: 0 auto;}


.gnb li.m_hide{ display:none}

body:not(.pop){ display:flex; flex-direction:column}
/* body:not(.isIE){ height:100vh} */
#footer{ margin-top:auto}

#header{ position: fixed; left:0; top:0; width:100%; z-index:1000; background: #fff; box-shadow:0 0 2em rgba(0,0,0,.1)}
#header:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#fff; opacity:.2}
#header .top_wrap {position: relative;}
#header .top_wrap .wrapH{ height:5em}
.headerT{ padding-top:5em}
#header .top_wrap .logo {z-index:3;}
#header .top_wrap .logo > a{ display:block; height:2em; overflow:hidden}
#header .top_wrap .logo .in{ display:block; height:100%;}
#header .top_wrap .logo .in img{ display:block; height:100%}
#header .top_wrap .gnb_wrap .gnb > li .dp1{ padding:1em; box-sizing:border-box; height:5em; min-width:10em; text-align:center; position:relative}
#header .top_wrap .gnb_wrap .gnb > li.on .dp1:after{ content:""; position:absolute; left:50%; bottom:0; width:2em; height:4px; background:#ce271e; transform:translate(-50%, 50%)}
#header .top_wrap .gnb_wrap .gnb > li .dp1 .va{ font-size:1.25em; font-weight:500}
/*#header .top_wrap .gnb_wrap .gnb > li .dp2{ display:none;}*/
#header .top_wrap .etc_wrap .link{ padding:1em; font-size:.938em; opacity:.7}
#header .top_wrap .etc_wrap .all_wrap{ margin-left:2em}
#header .top_wrap .etc_wrap .all_wrap .allBtn .xi{ font-size:2.5em}
#header .top_wrap .m_menu_btn {gap: .3em;}
#header .top_wrap .m_menu_btn .btn {background: var(--siteC); box-shadow:0 0 2em rgba(0,0,0,.1); color: #fff; width: 2.5em; height: 2.5em; line-height: 2.5em; text-align: center; border-radius: 50%;}
#header .top_wrap .m_menu_btn .btn.c1 {background: var(--snsKa); color: #624A3D;}
#header .top_wrap .m_menu_btn .kakao {margin-top: unset !important;  width: 2.5em; height: 2.5em; line-height: 2.5em; text-align: center; border-radius: 50%;}
#header .top_wrap .m_menu_btn .kakao .xi {padding-right: unset !important;}
#header .top_wrap .m_menu_btn .kakao .tt {display: none;}

.scroll #header{ box-shadow:0 0 2em rgba(0,0,0,.1)}

#header .banner_wrap {background: #e8e8e8; color: var(--snsIn); text-align: center; height: 45px;}
#header .banner_wrap .tt { font-size: .9em; font-weight: 800; padding-top: .3em;}

/*gnb*/
#header .va_wrap{ height:5em}

#header .gnb_wrap{ position:absolute; width:100%; left:0; top:0; box-sizing:border-box; padding:0 20em; text-align:center;}
#header .gnb_wrap .gnb{ display:inline-flex; justify-content:center; margin:0 auto}
#header .gnb_wrap .gnb:before{ content:""; position:absolute; left:0; top:5em; width:100%; height:calc(100% - 5em); background:rgba(255,255,255,.9); transform:scaleY(0); transform-origin:left top; transition:.3s; z-index:-1; box-sizing:border-box; box-shadow:0 1px 4px rgba(0,0,0,.2)}
#header .gnb_wrap .gnb > li{ position:relative}
#header .gnb_wrap .gnb > li.m_member,
#header .gnb_wrap .gnb > li.m_mypage,
#header .gnb_wrap .gnb > li.m_guide {display:none;}
#header .gnb_wrap .gnb > li .dp1{ position:relative; z-index:1; transition:.3s; display:block; padding:0 1em; min-width:10em; font-weight:500;}
#header .gnb_wrap .gnb > li:hover .dp1:after,
#header .gnb_wrap .gnb > li.on .dp1:after{ width:3em}

#header .gnb_wrap .gnb > li:hover .dp1{ color:#5c5e5e;}
#header .gnb_wrap .gnb > li.on .dp1 {}
#header .gnb_wrap .gnb > li:hover .dp1:after{ transform:scaleX(1)}
#header .gnb_wrap .gnb > li .dp2{ display:block; opacity:0; height:0; overflow:hidden}
#header .gnb_wrap .gnb > li .dp2 > li > a{ height:auto; padding:.8em 0; color:#5c5e5e;}

#header .gnb_wrap .gnb > li .dp2 {border-right:1px solid #eee;}
#header .gnb_wrap .gnb > li:first-child .dp2 {border-left:1px solid #eee;}
#header .gnb_wrap .gnb > li .dp2 > li:hover > a,
#header .gnb_wrap .gnb > li .dp2 > li.on > a{ color:#ce271e; }
#header .gnb_wrap .gnb > li .dp3{ display:none}
#header .gnb_wrap:hover .gnb:before{transform:scaleY(1); transition:.3s;}
#header .gnb_wrap:hover .gnb:after{ visibility:visible; transition-delay:.3s}
#header .gnb_wrap:hover .gnb > li .dp2{ opacity:1; height:calc(100% - 5em); overflow: visible; transition:.3s; padding:1em 0; box-sizing:border-box;}
#header .gnb_wrap  + .gnb_bg{ position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:-2; opacity:0; visibility:hidden}
#header .gnb_wrap:hover + .gnb_bg{opacity:1; visibility: visible; transition:.3s; transition-delay:.1s;}
#header .gnb_wrap .gnb > li:hover .dp2 {background:rgba(255,255,255,.9)}
/* .scroll #header .gnb_wrap:hover .gnb > li .dp2{height:calc(100% - 4em);} */
#header:hover { background:#fff;}
#header:hover .gnb_wrap .gnb > li .dp1 .va{ color:#333;}
#header:hover .etc_wrap { color:#333;}
#header:hover .top_wrap .logo .in { transform:translateY(0); }

#header .top_wrap .gnb_wrap .gnb > li:hover .dp1 .va .tt {color:#ce271e; transition:.2s;}
/*etc*/
#header .etc_wrap {z-index:999; }
#header .etc_wrap .est_wrap {margin:0 1vw;}
#header .etc_wrap .est_wrap .est a {padding:.85em 2em; background:#1c4ab4; border-radius:50px; color:#fff;}
#header .etc_wrap .mem_wrap {}
#header .etc_wrap .mem_wrap .etc {}
#header .etc_wrap .mem_wrap .etc > li {}
#header .etc_wrap .mem_wrap .etc > li .in { display:block; padding:0 .75em;}
#header .etc_wrap .mem_wrap .etc > li .in .xi {vertical-align:middle; display:inline-block; padding-right:3px; font-size:1.4em;}
#header .etc_wrap .mem_wrap .etc > li .in .tt {font-weight:700; vertical-align:middle; font-size:.95em;}
#header .etc_wrap .mem_wrap .etc > li .in .tt.st1 {border-radius:3em; border:1px solid #fff; padding:.2em 1.3em; font-size:.875em !important}
#header .etc_wrap .mem_wrap .etc > li:hover .in .tt {color:#ce271e; transition:.3s;}

#header .etc_wrap .all_wrap{}
#header .etc_wrap .all_wrap .all_btn{ display:flex; /*color:#242424; line-height:5em; width:5em; text-align:center; position:relative*//*width:3em;*/ align-items:center;}
#header .etc_wrap .all_wrap .all_btn i.tt{margin-right:12px; font-size: .875em;font-weight: 700;} 
/*#header .etc_wrap .all_wrap .all_btn:before{ content:""; position:absolute; left:0; top:0; width:100%; height:0; transition:.3s}*/
#header .etc_wrap .all_wrap .all_btn .xi{ font-size:2em; position:relative;}
/*#header .etc_wrap .all_wrap:hover .all_btn:before,
#header .etc_wrap .all_wrap.on .all_btn:before{ height:100%}*/
#header .etc_wrap .all_wrap.on .all_btn {line-height:4em;}
.scroll #header .etc_wrap .all_wrap .all_btn {line-height:4em;}

#header .etc_wrap .all_wrap .all{ position:fixed; left:0; top:0; width:100%; height:100%; background:#fff; visibility:hidden; opacity:0; overflow-y:auto; transition:.3s; transform:scale(.5); z-index:10000}
#header .etc_wrap .all_wrap.on .all{ visibility:visible; opacity:1; transform:scale(1)}
#header .etc_wrap .all_wrap .all .close_btn{ position:absolute; top:1em; right:2em; width:3em; line-height:3em; text-align:center; opacity:.5; transition:.3s}
#header .etc_wrap .all_wrap .all .close_btn .xi{ font-size:3em; color:#333;}
#header .etc_wrap .all_wrap .all .close_btn:hover{ transform:rotate(90deg); opacity:1}
#header .etc_wrap .all_wrap .all .all_logo{ text-align:center; padding:3em 0; justify-content:center;}
#header .etc_wrap .all_wrap .all .gnb a{ height:auto}
#header .etc_wrap .all_wrap .all .gnb{ justify-content:space-between; padding-bottom:5em; color:#333;}
#header .etc_wrap .all_wrap .all .gnb > li{ flex:0 1 24%}
#header .etc_wrap .all_wrap .all .gnb > li.m_mypage,
#header .etc_wrap .all_wrap .all .gnb > li.m_guide {display:none;}
#header .etc_wrap .all_wrap .all .gnb > li .dp2,
#header .etc_wrap .all_wrap .all .gnb > li .dp3{ display:block}
#header .etc_wrap .all_wrap .all .gnb > li .dp1{ border-top:5px solid #ddd; border-bottom:1px solid #aaa; height:5em; position:relative}
#header .etc_wrap .all_wrap .all .gnb > li .dp1:after{ content:""; position:absolute; left:0; top:-5px; width:0; height:5px; background:#ce271e; transition:.3s; color:#333;}
#header .etc_wrap .all_wrap .all .gnb > li .dp1 .va{ font-size:1.25em; font-weight:700}
#header .etc_wrap .all_wrap .all .gnb > li:hover .dp1{ color:#ce271e}
#header .etc_wrap .all_wrap .all .gnb > li:hover .dp1:after{ width:100%}
#header .etc_wrap .all_wrap .all .gnb > li .dp2{}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li > a{ padding:1em; border-bottom:1px solid #ddd; text-align:left; position:relative; padding-left:2em; font-size:.938em;}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li > a:after{ content:"\e913"; font-family:xeicon!important; position:absolute; left:0; top:1em; width:2em; text-align:center; color:#aaa}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li:hover > a{ background:#f5f5f5; color:#ce271e}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li:hover > a:after{ color:#ce271e}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li:hover > .dp3{ background:#f9f9f9}
#header .etc_wrap .all_wrap .all .gnb > li .dp3{ padding:.5em 0; border-bottom:1px solid #ddd}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li > a{ padding:.25em .75em; text-align:left}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li > a .va{ font-size:.875em; color:#666}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li > a .va:before{ content:"- "; display:inline-block; padding-right:1em}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li:hover > a .va{ text-decoration:underline; color:#333}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li:hover > a .va:before{ text-decoration:none}

#header:hover .etc_wrap .mem_wrap .etc > li .in {color:#ce271e;  }
#header:hover .etc_wrap .all_wrap .all_btn .xi {transition:.3s;}
#header:hover .etc_wrap .mem_wrap .etc > li .in .tt.st1 {border:1px solid #5c5e5e;}

.sub_page_top {display: none;}

/*  */
#docbar {
    position: fixed;
    bottom: 0;
    left: 0;
    border-radius: .625rem .625rem 0 0;
    background: #fff;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    padding: 1rem 0 1rem 0;
    width: 100%;
    z-index: 111;
}
#docbar .menu-list .list > li {
    flex: 1;
}
#docbar .menu-list .list > li .icon .xi {
    color: var(--siteC);
    line-height: normal;
}
#docbar .menu-list .list > li .text .app_tt {
    color: var(--siteC);
}
#docbar .menu-list .list > li.on .icon .xi,
#docbar .menu-list .list > li.on .text .app_tt {
    color: var(--siteC);
}

/*  */
#contents{ padding-top:7em;}
#contents .sub_visual_wrap{ position:relative}
#contents .sub_visual_wrap .wrap_in{ position:relative; height:30em}
#contents .sub_visual_wrap .wrap_in .twrap{ height:100%; color:#fff}
#contents .sub_visual_wrap .wrap_in .twrap .t1{ letter-spacing:.75em; text-transform:uppercase; margin-bottom: 1em}
#contents .sub_visual_wrap .wrap_in .twrap .t2{ font-size:3em; font-weight:700}
#contents .sub_tab{background:rgba(0,0,0,.3);}
#contents .sub_tab > .gnb{width:1200px; margin:0 auto;}
#contents .sub_tab .gnb > li{ width:100%}
#contents .sub_tab .gnb > li .dp2{ justify-content:center; padding-left:1px}
#contents .sub_tab .gnb > li .dp2:before {content:''; width:2000px; height:1px; background:#fff; position:absolute; opacity:.7}
#contents .sub_tab .gnb > li .dp2 > li{ flex:1 1 100%; max-width:25%; position:relative}
#contents .sub_tab .gnb > li .dp2 > li > a{ display:block; color:#e5e5e5; padding: 1.4em 0;}
#contents .sub_tab .gnb > li .dp2 > li > a .va{ font-size:1.188em; font-weight:500;}
#contents .sub_tab .gnb > li .dp2 > li:hover > a{ color:#fff}
#contents .sub_tab .gnb > li .dp2 > li.on{ z-index:1; }
#contents .sub_tab .gnb > li .dp2 > li.on:before {content:''; width:100%; position:absolute; height:4px; background:#fff; top:-2px;}
#contents .sub_tab .gnb > li .dp2 > li.on > a{ color:#fff; border-color:transparent; position:relative;}
#contents .sub_tab .gnb > li .dp2 > li > a:before { content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:1em; background:#fff; opacity:.7;}
#contents .sub_tab .gnb > li .dp2 > li:first-child > a:before{ display:none;}

#contents .sub_tit_wrap{ padding:5em 0 0 0}
#contents .sub_tit_wrap .tit{ font-weight:300; font-size:2.75em; letter-spacing:-.063em; word-spacing:.063em; margin-bottom:1em; font-family:'gs',sans-serif; font-weight:700;}
#contents .sub_tit_wrap .nav{ margin-bottom:1em}
#contents .sub_tit_wrap .nav > li{ color:#888; font-size:.938em}
#contents .sub_tit_wrap .nav > li:before{ content:"\e940"; font-family:xeicon; padding:0 .5em; vertical-align:middle}
#contents .sub_tit_wrap .nav > li:first-child:before{ display:none}
#contents .sub_tit_wrap .nav > li:last-child .tt{ text-decoration:}

.dp1on .gnb .dp2{ display:none!important}
.dp2on .gnb > li,
.dp2on .gnb > li .dp1,
.dp2on .gnb > li .dp3{ display:none!important}
.dp2on .gnb > li.on{ display:block!important}
.dp3on .gnb > li,
.dp3on .gnb > li .dp1,
.dp3on .gnb > li .dp2 > li,
.dp3on .gnb > li .dp2 > li > a{ display:none!important}
.dp3on .gnb > li.on,
.dp3on .gnb > li .dp2 > li.on{ display:block!important}

#contents .doc{ padding:2em 0 7em 0}

#footer{ background:#dae7ff; border-top-left-radius: 5em; border-top-right-radius: 5em; overflow: hidden; margin-top:5em; box-shadow:0 0 2em rgba(0,0,0,.1)}
#footer .box0 {gap: 2.5em;}
body.scroll #footer .gotop{ transform:translateY(0); opacity:1; visibility:visible}
#footer .info_wrap{ padding:4.5em 0 6.5em 0}
#footer .info_wrap .info {flex-wrap:wrap; gap: 1em 2em; width: 70%; margin: 0 auto;}
#footer .info_wrap .info > li{font-size: 1.05em; font-weight: 600;}
#footer .info_wrap .info > li.copyright{ font-size:.75em; opacity:.5; letter-spacing:0; margin-top:1.5em}
#footer .info_wrap .info:after{ content:""; display:block; clear:both}
#footer .info_wrap .copyright{ font-size:.9em; opacity:.7; text-transform: uppercase; letter-spacing:0;}

@keyframes downAni{
70% { transform:translateY(0)}
85% { transform:translateY(.5em)}
100% { transform:translateY(0)}
}

/* main */

/* .contents_st {padding: 1em; border-radius: .8em; overflow: hidden; background: rgba(255,255,255,.8); box-shadow:0 0 2em rgba(0,0,0,.1);}
.contents_st2 {padding: 2em 0 7em; border-top-left-radius: 5em; border-top-right-radius: 5em; overflow: hidden; background: #fff; box-shadow:0 0 2em rgba(0,0,0,.1);}
.contents_st3 {padding: 1em; border-radius: .8em; overflow: hidden; background: #fff; box-shadow:0 0 2em rgba(0,0,0,.1);} */

.mainTop_title {margin: 2em 0;}
.mainTop_title .t1 {font-size: 2em; font-weight: 800; }
.mainTop_title .t2 {font-size: 1.125em; margin-top: 1em;}

.main_title {margin: .5em 0;}
.main_title .t1 {font-size: 1.25em; font-weight: 800;}

.store_title .tit {font-size: 1.05em; font-weight: 600;}
.store_title > .input_st {font-size: .76em !important;}

/*  */
.drive_form {}
.drive_form .in { position:relative; margin-bottom:16px; overflow: hidden; border-radius: 8px; box-shadow: 0 0 5px rgba(0, 0, 0, .1);}
.drive_form .in.st2 {flex-wrap: wrap; gap: 0 0.5em; box-shadow: unset;}
.drive_form .icon { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--siteC); font-size:22px; }
.drive_form .inp { width:100%; box-sizing: border-box; padding-left: 45px; border:1px solid #eee; border-radius:8px; font-size:16px; height: 3em;}
.drive_form .lab { font-size:14px; color:#888; margin-left:8px; }
.drive_form .dest_group {gap: .5em;}
.drive_form .waypoint_btn {width: 15em; text-align: center; background: var(--siteC); color: #fff; border-radius: .5em; height: 3em; line-height: 3em; font-size: .8em;}
.drive_form .waypoint_btn .xi {width: 1.3em; height: 1.3em; background: #fff; color: var(--siteC); border-radius: 50%; line-height: 1.3em; text-align: center; margin-left: .5em;}
.drive_form .in .mypoint {background: var(--crGray); height: 2.5em; line-height: 2.5em; padding: 0 1em; border-radius: .5em; color: var(--siteC); font-weight: 700;}
.drive_form .in .mypoint > b {vertical-align: baseline;}

.drive_form .flex_between { display:flex; align-items:center; gap:8px;}
.drive_form .flex_between .w1 {flex: 1;}
.drive_form .flex_between .w2 {width: 10em;}
.drive_form .flex_between .w3 {width: 15em;}
.drive_form .flex_between .w4 {width: 50%;}
.drive_form .flex_between .price_t {position: relative; padding-left: 45px; font-size: 16px; background: #dae7ff; height: 3em; line-height: 3em; flex: 1; border-radius: 8px; color: var(--siteC); font-weight: 800;}

.drive_form .mileage_label_wrap {margin-bottom: 16px; background: #f7f7f7; padding: 10px 15px; overflow: hidden; border-radius: 8px;}
.mileage_label { display:flex; align-items:center; font-size:13px; color:#333; font-weight: 600; margin-bottom: 5px; padding-left: 1em;position: relative;}
.mileage_label::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: var(--siteC); position: absolute; left: 0; top: 6px;} 
.mileage_label:last-child { margin-bottom:0;}
.mileage_label b { color:var(--siteC); }

.drive_form .pay_method {background: #fff; border-radius: .5em; height: 3em; line-height: 3em; gap: .7em; text-align: center;}
.drive_form .pay_method label { font-size:14px; }
.drive_form .pay_method label.fs16 {font-size: 16px;}
.drive_form .pay_method label [type="radio"] {
    appearance: none;
    border-radius: 50%;
    box-sizing: border-box;
    width: 15px;
    height: 15px;
    border: 1px solid gray;
    cursor: pointer;
}
.drive_form .pay_method label [type="radio"]:checked {
    border: 4px solid var(--siteC);
}


/* */
.mainBannerSlide{ width:100%; margin-top: 1.5em; gap: .5em; flex-wrap: wrap;}
.mainBannerSlide .el {border-radius: .5em; overflow: hidden;}
/* .mainBannerSlide .el:last-child {margin-bottom: unset;} */
.mainBannerSlide .el[onclick]{ cursor:pointer}
.mainBannerSlide .bg{ padding-bottom:50%; border-radius:1em}
.mainBannerSlideW{ display:flex; flex-direction:column; gap:1em}

.swiperBtn{ width:2em; height:2em; position: static; display:flex; align-items:center; justify-content:center; z-index:100; cursor:pointer; font-size:1.125em; color:#666; border:1px solid transparent; box-sizing:border-box; opacity:1; background:none; transition:.3s}
.swiperBtn:before{font-family:xeicon}
.swiperBtn.prev:before{content:"\e93b"}
.swiperBtn.next:before{content:"\e93e"}
.swiperBtn.pause:before{content:"\ea3b"}
.swiperBtn.play:before{content:"\ea3e"}
.swiperBtn.ab{ position:absolute; top:50%;}
.swiperBtn.ab.prev{ left:0; transform:translate(-100%, -50%)}
.swiperBtn.ab.next{ right:0; transform:translate(100%, -50%)}
.swiperBtn.ab.in.prev{ transform:translate(.5em, -50%)}
.swiperBtn.ab.in.next{ transform:translate(-.5em, -50%)}
.swiperBtn.line{ border:1px solid #ddd}
.swiperBtn.round{ border-radius:50%}
.swiperBtn.s1{ font-size:1.5em}
.swiperBtn.s1.prev:before{ content:"\e93d"}
.swiperBtn.s1.next:before{ content:"\e940"}
.swiperBtn.prev.vertical:before{content:"\e944"}
.swiperBtn.next.vertical:before{content:"\e941"}
.swiperBtn.white{ color:#fff; border-color:rgba(255,255,255,.5)}
.swiperBtn.c1{ background:#fff; border-color:#ddd}
.swiperBtn:hover{ color:#111}
.swiperBtn.line.white:hover,
.swiperBtn.line.white.play{ background:#1f5aa7; border-color:rgba(255,255,255,.2)}

.swiperControl{ display:flex; align-items:center; gap:.5em; z-index:10}
.swiperControl.hc{ justify-content:center;}
.swiperControl .paging{ width:auto; display:flex; align-items:center; gap:.5em}
.swiperControl .paging.grow{ flex:1 1 0%; min-width:0}
.swiperControl .paging:first-child{ margin-right:1em}
.swiperControl .paging.swiper-pagination-fraction{ line-height:1}
.swiperControl .paging.swiper-pagination-fraction > span.swiper-pagination-current{ color:var(--siteC); font-size:1.375em; font-weight:700}
.swiperControl .paging.swiper-pagination-fraction > span.swiper-pagination-total{ color:#333; padding-left:.5em; margin-left:.5em; position:relative}
.swiperControl .paging.swiper-pagination-fraction > span.swiper-pagination-total:before{ content:""; position:absolute; left:0; top:0; width:1px; height:100%; background:#333; transform:rotate(30deg)}
.swiperControl .paging .swiper-pagination-bullet{ position:relative; border:1px solid #111; background:none; opacity:1; border-radius:0; width:.5em; height:.5em; margin:0; transition:.5s}
.swiperControl .paging .swiper-pagination-bullet.swiper-pagination-bullet-active{ background:#111; transform:rotate(45deg)}

.swiperPauseWrap .play{ display: none}
.swiperPauseWrap.pause .play{ display: flex; background:#111; color:#fff}
.swiperPauseWrap.pause .pause{ display: none}
.swiperPaging span.swiper-pagination-progressbar-fill{ background:#111}

/* 메인 모달 */
#wayPointList {width: 100%;}
#wayPointList input {margin-top: .5em; padding-left: 15px;}

.place-modal {position: fixed; top: 0; left: 0; right: 0; z-index: 9999; background: rgba(0,0,0,0.4); width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center;}
.place-modal .placeItem {height: 84vh; background: #fff;border-radius: 16px;box-shadow: 0 4px 24px rgba(0,0,0,0.15);width: 95vw;max-width: 420px;padding: 24px 20px; display: flex; flex-direction: column;}
.place-modal .topbox {}
.place-modal .topbox .map_wrap {margin-top: 10px;}
.place-modal .topbox .mapBox {border: 1px solid #ddd; margin-bottom: 0.5em; background: #f4f4f4; text-align: center; display: flex; align-content: center; align-items: center;
  height: 50vh;      
  position: relative;
  overflow: hidden;
  width: 100%;
}
@supports not (height: 1vh) {
  .place-modal .topbox .mapBox { height: 60vh; }
}
.place-modal .topbox .mapInfo .mapTitle {font-weight: 800; margin-bottom: 5px;}
.place-modal .topbox .mapInfo .mapAddr {font-size: .8em; margin-bottom: 1em; border-bottom: 1px dashed #ddd; padding-bottom: 1em;}

.place-modal .topbox .input_st {padding: .5em;}
.place-modal .bottombox {overflow-y: auto; height: 350px; border-top: 1px solid var(--siteC); margin-top: 1em;}
.place-modal .bottombox .placeType {padding: .5em 0; gap: 1em;}
.place-modal .bottombox .placeType li {position: relative;}
.place-modal .bottombox .placeType li::after {position: absolute; content: ""; width: 1px; height: 7px; background: #ddd; top: 12px; right: -8px;}
.place-modal .bottombox .placeType li > a {display: block; padding: .5em 0; font-size: .8em !important;}
.place-modal .bottombox .placeType li > a .xi {margin-right: .5em; color: var(--siteC);}
.place-modal .bottombox .tit {font-size: 1.05em; font-weight: 600; margin-bottom: .5em;}
.place-modal .bottombox .tit .in {border: 1px solid #ddd; padding: .3em .5em;}
.place-modal .recentPlace {border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.place-modal .recentPlace li {border-bottom: 1px dashed #ddd;}
.place-modal .recentPlace li:last-child {border-bottom: unset;}
.place-modal .recentPlace li .in {padding: 1em 0; gap: 1em;}
.place-modal .recentPlace li .in .xi {width: 1.5em; height: 1.5em; text-align: center; line-height: 1.5em; background: var(--siteBg2); border-radius: .5em; overflow: hidden; color: var(--siteC);}
.place-modal .recentPlace li .in .info {}
.place-modal .recentPlace li .in .info .t1 {font-weight: 600;}
.place-modal .recentPlace li .in .info .t2 {font-size: .8em; margin-top: .5em;}

/* 스타일: 기존 모달 참고, 색상/폰트/레이아웃 통일 */
.match-modal {
  position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
  background: rgba(0,0,0,0.4); width: 100vw; height: 100vh;
  display: flex; justify-content: center; align-items: center;
}
.match-modal-content {
  background: #fff; border-radius: 16px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.15);
  width: 95vw; max-width: 420px; padding: 32px 24px;
  text-align: center;
}
.match-title {
  font-size: 1.15em; font-weight: 700; margin-bottom: 1em;
}
.match-desc {
  font-size: .98em; color: #555; margin-bottom: 1.5em;
}
.match-loader {
  margin: 0 auto 1.5em auto; border: 6px solid #eee; border-top: 6px solid var(--siteC3, #3498db);
  border-radius: 50%; width: 40px; height: 40px; animation: spin 1s linear infinite;
}
@keyframes spin { 100% { transform: rotate(360deg); } }
.match-fee-options {
  display: flex; gap: 1em; justify-content: center; margin-bottom: .5em; flex-wrap: wrap;
}
.match-fee-options .fee-options-top {gap: 1em;}
.match-fee-options button {
  padding: .7em 1.5em; border-radius: 8px; border: none;
  background: var(--siteC3, #3498db); color: #fff; font-size: 1em; font-weight: 600; cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.07);
  transition: background 0.2s;
}
.match-fee-options button:hover {
  background: var(--siteC, #217dbb);
}
.match-close-btn {
  padding: .7em 2em; border-radius: 8px; border: none;
  background: var(--siteC3, #3498db); color: #fff; font-size: 1em; font-weight: 600; cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.07);
  transition: background 0.2s;
}
.match-close-btn:hover {
  background: var(--siteC, #217dbb);
}


/*  */
.btn_wrap .btn {box-sizing: border-box; display: inline-block; vertical-align: middle; border: 2px solid var(--siteC); max-width: 100%; height: 3.5em; padding: .5em 0; border-radius: .8em; overflow: hidden; background: #fff; color: var(--siteC); font-weight: 700; font-size: 20px;}

.main_btncon {padding-top: 1em; margin-top: 1em; gap: 1em; border-top: 1px solid #ddd;}
.main_btncon .btn {color: #fff; background: var(--siteC); font-weight: 800; font-size: 1.25em; flex: 1; border: 1px solid var(--siteC); padding: 1em; border-radius: .8em; overflow: hidden;}
.main_btncon .btn .tt .xi {margin-right: .5em; background: #fff; color: var(--siteC); width: 1.5em; height: 1.5em; line-height: 1.5em; text-align: center; border-radius: 50%;}

.main_notice .tit {font-size: 1.125em; font-weight: 800; margin-bottom: .5em;}
.main_notice .list {}
.main_notice .list li {margin-bottom: .5em;}
.main_notice .list li:last-child {margin-bottom: unset;}
.main_notice .list li a {padding: .5em 1em; background: #f4f4f4; border-radius: 10px;}
.main_notice .list li a .tt {}
.main_notice .list li a .arrow {}


/*  */
.page-tit {
    padding: 1.25rem 0 2.5rem 0;
}
.page-tit > p {
    margin-top: 1.25rem;
}

.app_tt {
    font-size: 1em;
    word-break: keep-all;
    line-height: 1.4;
    white-space: normal;
}
.app_tt.small {
    font-size: .625rem
}
.app_tt.s0 {
    font-size: .75rem
}
.app_tt.s1 {
    font-size: .875rem
}
.app_tt.s2 {
    font-size: 1.125rem
}
.app_tt.s3 {
    font-size: 1.25rem
}
.app_tt.s4 {
    font-size: 1.5rem
}
.app_tt.s5 {
    font-size: 1.75rem
}
.app_tt.s6 {
    font-size: 2rem
}
.app_tt.s7 {
    font-size: 1rem
}
.app_tt.pause {
    opacity: .3;
}

/* Join - Agree */
.label_st input[type=checkbox],
.label_st input[type=radio] {
}
.agree-list > li {
    position: relative;
}
.agree-list > li:last-child .label_st {
    padding-top: 0;
}
.agree-list > li .label_st {
    color: #aaa;
    width: 100%;
}
.agree-list > li.all-check {
    border-bottom: 1px solid #ddd;
}
.agree-list > li.all-check .label_st .app_tt {
    color: #888;
}
.agree-list > li .chkN:checked ~ .agree-list > li .xi {
    color: #042d5c;
}
.agree-list > li.all-check.chk .label_st .xi {
    color: #042d5c;
}
.agree-list > li.all-check.chk .label_st .app_tt {
    color: #222;
}
.agree-list > li.check-item.chk .label_st .xi {
    color: #042d5c;
}
.agree-list > li.check-item.chk .label_st .app_tt {
    color: #555;
}
.agree-list > li .label_st .app_tt.s2 {
    color: #aaa;
}
.agree-list > li .info-pop {
    text-align: right;
    min-width: fit-content;
}
.agree-list > li .check-wrap .xi {
    padding-right: 0.625rem;
    min-width: fit-content;
}

/* Join - Profile */
.profile-wrap {
    position: absolute;
    top: calc(50% - 3.5rem);
    left: 50%;
    transform: translate(-50%, -50%) scale(0.3);
    transition: .5s;
}
.profile-wrap.scale {
    transform: translate(-50%, -50%) scale(1);
}
.profile-wrap .profile-img {
    position: relative;
    width: fit-content;
    margin: 0 auto;
}
.profile-wrap .profile-img .imgfix {
    overflow: hidden;
    width: 10rem;
    height: 10rem;
    border-radius: 65px;
    margin: 0 auto;
}

/* Join - Drive */
.license-img {
    margin-top: 1em;
    position: relative;
}
.license-img > .imgfix {
    background-color: #eee;
    height: 45vw;
    overflow: hidden;
    border-radius: .625rem;
}
.license-img.imgThumbs {
    display: flex;
    gap: .625rem;
    overflow-x: scroll;
}
.license-img.imgThumbs::-webkit-scrollbar {
    display: none;
}
.license-img.imgThumbs > .imgfix {
    border: 1px solid #ddd;
    background-color: transparent;
    min-width: 25vw;
    min-height: 25vw;
    width: 25vw;
    height: 25vw;
    position: relative;
}
.license-img.imgThumbs > .imgfix > img {
    object-fit: cover;
}
.license-img.imgThumbs > .imgfix .xi {
    position: absolute;
    right: 0.25rem;
    top: 0.25rem;
    font-size: 0.875rem;
  
    background: rgba(0, 0, 0, 0.8);
    border-radius: 50%;
    overflow: hidden;
    padding: 0.3125rem;
}
.license-img .add-img-btn {
    display: none;
}
.license-img.imgThumbs .add-img-btn {
    min-width: 25vw;
    min-height: 25vw;
    width: 25vw;
    height: 25vw;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #008CE5;
    border: 1px solid #008CE5;
    border-radius: .625rem;
}
.license-img.imgThumbs .add-img-btn .xi {
    font-size: 2.125rem;
}
.license-img.imgThumbs .add-img-btn .app_tt {
    margin-top: .3125rem;
}
.license-img.imgThumbs .add-plus-btn {
    display: none;
}
.license-img .add-plus-btn {
    bottom: 50%;
    right: 50%;
    transform: translate(50%, 50%);
}

/* Login */
.login-section {
}
.login-section .logo-wrap {
    max-width: 15.5rem;
    margin: 0 auto 2.5rem auto;
}
.input-wrap.login .input-sec .input_st {
    padding-left: 3.125rem;
    font-size: 1rem;
    height: 3.75rem;
}
.input-wrap.login .input-sec > .xi {
    position: absolute;
    top: 50%;
    left: 0.5rem;
    transform: translateY(-50%);
    display: inline-block;
    font-size: 1.5rem;
}
.input-wrap.login .input-sec .xi-eye-o {
    left: auto;
    right: 0.5rem;
}
/* Join - Fin */
.join-finish .img-wrap .imgfix {
    width: 3.125em;
    height: 3.125rem;
    margin: 0 auto;
}
.join-finish .fin-tit {
    padding: 1.25rem 0;
}

.login_choice {gap: 0.5em; padding-bottom: 2em;}
.login_choice li {flex: 1; text-align: center; border: 1px solid var(--siteC); border-radius: .5em; overflow: hidden;}
.login_choice li > a {display: block; padding: 1em 0; background: #fff;}
.login_choice li > a .xi {background: var(--siteC); color: #fff; width: 2em; height: 2em; line-height: 2em; text-align: center; border-radius: 50%;}
.login_choice li > a .tt {margin-top: .5em; font-weight: 600;}
.login_choice li > a.on {background: var(--siteC);}
.login_choice li > a.on .xi {background: #fff; color: var(--siteC);}
.login_choice li > a.on .tt {}

/* Input */
.sub-info-con {
    padding-bottom: 3rem;
}
.input-wrap:not(.login) .input-sec {
    margin-bottom: 1.875rem;
}
.input-wrap .input-sec > .xi {
    color: #aaa;
}
.input-wrap .input-sec .input-tit {}
.input-wrap .input-sec .input-tit > p {
    position: relative;
    display: inline-block;
}
.input-wrap .input-sec .input-tit > p:before {
    content: '';
    position: absolute;
    top: -.15rem;
    right: -.25rem;
    width: .25rem;
    height: .25rem;
    border-radius: 50%;
    background: #F4655C;
}
.input-wrap .input-sec .input_st {
    font-size: .875rem;
    width: 100%;
    height: 3.125rem;
    border: none;
    border-bottom: 3px solid #eee;
    border-radius: 0;
}
.input-wrap .input-sec .input_st::placeholder {
    color: #ccc;
}
.input-wrap .input-sec .input_st:focus,
.input-wrap .input-sec .input_st.val {
    border-bottom-color: var(--siteC);
}
.input-wrap .input-sec .input_st.error {
    border-bottom-color: #F4655C;
}
.input-wrap .input-sec .input_st:focus ~ .input-wrap .input-sec > .xi {
    color: #222;
}
.inp-info {
    font-size: .75rem;
    margin-top: 0.625rem;
}
.input-wrap .btn-wrap {
    margin-top: 1.5rem;
}
.input-wrap .btn-wrap .input_st {
    width: 100%;
    border-radius: 50px;
    font-size: 1rem;
    font-weight: 500;
}
.input-wrap .OR-wrap {
    margin: 0.625rem 0;
}
.input-wrap .OR-wrap .line {
    flex: 1 1 auto;
    height: 1px;
    background: #ddd;
}
.input-wrap .OR-wrap .OR {
    flex: 0 0 20%;
    font-size: .75rem;
}
.input-wrap .forgot {
    font-size: .75rem;
    text-decoration: underline;
    margin-top: 1.25rem;
    display: block;
}
.inp-info {}
.inp-info.error {
    display: block;
}
.choice-btn {
    margin-top: 1rem;
    gap: .625rem;
}
.choice-btn .btn {
    flex: 1;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    color: #888;
    height: 3rem;
}
.choice-btn .btn.select {
    background: #042d5c;
    border: 1px solid #042d5c;
  
}
.add-btn {
    margin-top: 1rem;
}
.add-btn .btn {
    flex: 1;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    color: #222;
    height: 3rem;
}
.verify-btn {
    margin-top: 0.625rem;
}
.verify-btn .btn {
    border-radius: 5px;
    width: 100%;
    height: 3rem;
    background: #042d5c;
  
    border: 1px solid #042d5c;
}

.add-plus-btn {
    position: absolute;
    right: 0;
    bottom: 0;
}
.add-plus-btn .xi {
    font-size: 3rem;
    color: #008CE5;
    position: relative;
}
.add-plus-btn .xi {
    z-index: 1;
    position: relative;
    top: 0;
    left: 0;
}
.add-plus-btn .xi:before {
    z-index: 1;
    position: relative;
}
.add-plus-btn .xi:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    z-index: 0;
}

/* Community - notice */
.notice-wrap {
    padding: .625rem 0 8rem 0;
}
.notice-wrap .list {}
.notice-wrap .list > li {
    border-bottom: 1px solid #eee;
}
.notice-wrap.view .list > li {
    border: none;
}
.notice-wrap .list > li .in {
    padding: .9375rem 0;
}
.notice-wrap .list > li .in {}
.notice-wrap .list > li .in .in-contents {
    margin-top: 1.25rem;
}
.notice-wrap .list > li .in .in-contents .imgfix > img {
    border-radius: .625rem;
}
.notice-wrap .list > li .in .in-contents > p {
    word-break: break-word;
}


.notice_search {
    padding-bottom: .625rem;
}
.notice_search .total {
    margin-bottom: .3125rem;
}
.notice_search .search {
    gap: 1.25rem
}
.notice_search .input-wrap {
    width: 100%;
}
.notice_search .search .select .input_st {
    padding-left: 0;
    padding-right: 1.25rem;
    border: none;
    background: url(../images/inc/arrow_down.svg) right .5rem center no-repeat #fff;
    background-size: 0.5rem auto;
}

/* Community - menu */
.community-menu {
    padding: 1.25rem 0;
}
.community-menu .list {
    gap: .625rem;
}
.community-menu .list > li {
    flex: 1;
    border-radius: .625rem;
    background: #f8f8f8;
}
.community-menu .list > li .in {
    padding: .625rem;
}
.community-menu .list > li .in .img-wrap {}
.community-menu .list > li .in .img-wrap .imgfix {
    width: 3.125rem;
    height: auto;
    margin: 0 auto;
}
.community-menu .list > li .in .txt-wrap {
    margin-top: .3125rem;
}

/* Community - FAQ */
.faq-wrap {
    padding: .625rem 0 8rem 0;
}
.faq-wrap .board_faq {
    border-top: 1px solid #ddd;
}
.faq-wrap .board_faq > li .faqTit .wrap_in {
    padding: .9375rem 1rem .9375rem 0;
}
.faq-wrap .board_faq > li .wrap_in {
    gap: 0 .625rem;
}
.faq-wrap .board_faq > li .wrap_in .tit {
    width: 2rem;
}
.faq-wrap .board_faq > li .wrap_in .ico {
    width: 2rem;
}
.faq-wrap .board_faq > li .wrap_in .ico .arrow {
    font-size: 1rem;
}
.faq-wrap .board_faq > li.on .faqCon .wrap_in {
    padding: .9375rem 0;
}
.faq-wrap .board_faq > li .wrap_in .con {
    padding: 0 1rem 0 0;
}

/* Community - event */
.event-wrap {
    padding: .625rem 0 8rem 0;
}
.event-wrap .board_wrap {
    padding-top: .625rem;
    border: none;
}
.event-wrap .board_gallery > li {
    width: 100%;
}
.event-wrap .board_gallery > li .wrap_in .img_wrap {
    border-radius: .625rem;
}
.event-wrap .board_gallery > li .wrap_in .con_wrap {
    padding: .9375rem .3125rem;
    gap: .3125rem;
}

/*costlist-btn*/
.mypage-B.border-b {}
.wrap_idx.mt0 {
    margin-top: 0em;
}
.wrap_idx.scroll {
    overflow-x: scroll;
    border-bottom: 1px solid #ddd;
}
.wrap_idx.scroll::-webkit-scrollbar {
    display: none;
}
.wrap_idx .sub-tab.calender {
    border-top: none;
    gap: 1.25em;
    padding: 0 1.25rem;
    border-bottom: none;
}
.wrap_idx .sub-tab.calender > li {
    min-width: 3em;
    flex: 1;
}
.wrap_idx .sub-tab.calender > li:last-of-type {
    padding-right: 1.25rem;
}

/*mypage*/
.profile-Wrap {
    gap: 1.5em;
    margin-top: 2em;
}
.profile-Wrap .profile-img {
    position: relative;
    flex: 1 1 40%;
}
.profile-Wrap .profile-img > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    box-shadow: 4px 0 12px rgba(0, 0, 0, .15);
    border-radius: 50%;
}
.profile-Wrap .profile-img .grap-t {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}
.profile-Wrap .profile-img .grap-t > p {
    display: inline-block;
    padding: .3em .8em;
    font-size: .85rem;
    font-weight: 600;
    background: #ebf1ff;
    color: #0065b6;
    box-shadow: 4px 1px 12px rgba(0, 0, 0, .15);
    border-radius: 1em;
}
.profile-Wrap .profile-info {
    flex: 1 1 60%;
}

.mypage-Wrap {
    gap: 1.25rem;
}
.mypage-Wrap .profile-Con {
    min-width: fit-content;
}
.mypage-Wrap .info_Con {}
.mypage-Wrap .skill {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    position: relative;
    transform: scale(.9);
    left: -.5em;
}
.mypage-Wrap .outer {
    height: 140px;
    width: 140px;
    border-radius: 50%;
    padding: 10px;
    position: relative;
    box-shadow: 6px 6px 18px -1px rgba(0, 0, 0, 0.1), -6px -6px 10px -1px rgba(255, 255, 255, 0.2);
}
.mypage-Wrap .inner {
    position: relative;
    height: 5rem;
    width: 5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: inset 4px 4px 6px -1px rgba(0, 0, 0, 0.2), inset -4px -4px 6px -1px rgba(255, 255, 255, 0.7), -0.5px -0.5px 0px rgba(255, 255, 255, 1), 0.5px 0.5px 0px rgba(0, 0, 0, 0.15), 0px 12px 10px -10px rgba(0, 0, 0, 0.05);
}
/* .mypage-Wrap .inner:before{ height: 150px; width: 150px; min-width: 150px; min-height: 150px; background: #f5f5f5; content: ''; z-index: -1; border-radius: 50%; box-shadow: 1px 0 8px rgba(0,0,0, .15);} */
#number {
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-block;
    padding: .3em .8em;
    font-size: .85rem;
    font-weight: 600;
    background: #ebf1ff;
    color: #0065b6;
    box-shadow: 4px 1px 12px rgba(0, 0, 0, .15);
    border-radius: 1em;
    z-index: 2;
}
#number > p {}
.mypage-Wrap circle {
    fill: none;
    stroke: url(#GradientColor);
    stroke-width: 3px;
    stroke-dasharray: 440;
    stroke-dashoffset: calc(440 - (440 * var(--total-skill) / 100));
    transition: all 1.5s ease-in-out;
}
.mypage-Wrap svg {
    position: absolute;
    top: 0;
    left: 0;
    transition: all 1.5s ease-in-out;
    transform: rotate(90deg);
}

.con_idx {
    position: relative
}
.con_idx > .idx {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    visibility: hidden;
    filter: alpha(opacity=0);
    opacity: 0;
    display: none;
}
.con_idx > .idx.on {
    position: relative;
    visibility: visible;
    filter: alpha(opacity=100);
    opacity: 1;
    display: block;
}
.wrap_idx {
    margin-top: 1em;
}

.con_idx .idx > .idx-Wrap {
    padding: 2rem 1.25rem 9rem 1.25rem;
}
.con_idx .idx .pb-Wrap {
    padding: 0 0 9rem 0;
}
.profile-btn {}
.profile-btn > a {
    background: #f1f1f1;
    border-radius: .625rem;
    padding: 8px;
    width: 100%;
    display: block;
    box-sizing: border-box;
}
.sub-tab {
    gap: 1em;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.sub-tab > li {
    position: relative;
    flex: 1 1 25%;
    display: flex;
    height: 3em;
    align-items: center;
    justify-content: center;
}
.sub-tab > li > span {
    color: #aaa;
    font-size: .875rem;
}
.sub-tab > li.on > span {
    color: #222;
}
.sub-tab > li:before {
    position: absolute;
    bottom: 0px;
    width: 0%;
    height: 2px;
    background: #fff;
    content: '';
    transition: .25s;
}
.sub-tab > li.on:before {
    width: 100%;
    background: #042d5c;
    transition: .25s;
}
.sub-tab.w_85 {}
.sub-tab > li .tab-btn {
    font-size: 1.125em;
    width: 100%;
    text-align: center;
    font-weight: 600;
}

.active-Box {
    padding: 1.5em;
    box-sizing: border-box;
    background: #f3f5f8;
}
.active-Box .Box-list {}
.active-Box .Box-list > li {
    gap: .5em;
    align-items: center;
    font-size: .825rem;
    margin-bottom: .9375rem;
}
.active-Box .Box-list > li:last-of-type {
    margin-bottom: 0em;
}
.active-Box .Box-list > li .txt {}
.active-Box .Box-list > li .txt.Cd {
    color: #008CE5;
    font-weight: 600;
}
.active-Box .Box-list > li > i {
    width: 16px;
}
.active-Box .Box-list > li > i > img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.active-Box .Box-list > li > .hello {
    color: #222;
}
.active-Box .Box-list > li > .truck {}
.active-Box .Box-list > li > .order {}

.Link-listCon {
    margin-top: 2em;
    border-top: 1px solid var(--siteC);
}
.Link-listCon.mt0 {
    margin-top: 0;
}
/* .Link-listCon.mt0 .Link-list > li:first-of-type{ border-top: none;} */
.Link-listCon > .Link-list > li {
    padding: 1em 1.25rem;
    border-bottom: 1px solid #ddd;
    /* border-top: 1px solid #ddd; */
}
/* .Link-listCon > .Link-list > li:first-of-type{ border-top: 1px solid #ddd;} */
.Link-listCon > .Link-list > li > a {}
.Link-listCon > .Link-list > li > a .left_con {
    gap: 1rem;
    font-size: 1.05rem;
    color: #111;
    align-items: center;
}
.Link-listCon > .Link-list > li > a .left_con > span > .num {
    color: #008CE5;
    font-weight: 600;
    padding-left: .5rem;
}
.Link-listCon > .Link-list > li > a .right_con {}
.Link-listCon > .Link-list > li > a .right_con > i {
    color: #888;
}

.info-Con-C {
    margin-bottom: 1rem;
}
.info-Con-C.mb0 {
    margin-bottom: 0rem;
}
.info-Con-C:last-of-type {
    margin-bottom: 0em;
}
.info-Con-C .dot {
    display: inline-block;
    position: relative;
    margin-bottom: .8em;
}

.info-Con-C .input-Con {
    margin-bottom: 1.8rem;
}
.info-Con-C .input-Con:last-of-type {
    margin-bottom: 0rem;
}
.info-Con-C .input-Con .type {
    gap: .5em;
}
.info-Con-C .input-Con .type .input-tt {
    flex: 1 1 49%;
}
.info-Con-C .input-Con .input-tt {
    padding: 0.6rem 0.7rem;
    background: #f9f9f9;
    border-radius: 0.5em;
    box-shadow: 1px 2px 3px rgba(0, 0, 0, .05);
}
.info-Con-C .input-Con .license-img {
    margin-top: 0em;
}

.Account-info {
    background: #f3f5f8;
    padding: 1.25rem;
}
.Account-info .Account-box {
    padding: 1.5rem 2rem;
    border-radius: .5rem;
    background: linear-gradient(180deg, rgba(122, 142, 254, 1) 17%, rgba(110, 157, 247, 0.989233193277311) 79%);
}
.Account-info .Acc-ttl {}
.Account-info .Acc-info-list {
    margin-top: 1rem;
}
.Account-info .Acc-info-list > li {
    gap: .5em;
    margin-bottom: .5rem;
    font-size: .9rem;
  
}
.Account-info .Acc-info-list > li:last-of-type {
    margin-bottom: 0rem;
}
.Account-info .Acc-info-list > li .ttl {
    flex: 1 1 20%;
    font-weight: 700;
}
.Account-info .Acc-info-list > li .txt {
    flex: 1 1 80%;
}

.Account-info .caution-box {
    background: #fff;
    margin-top: 1rem;
    border-radius: .5rem;
    padding: 1rem;
    font-size: .8rem;
}
.Account-info .caution-box .ca-Con {
    gap: .8rem;
}
.Account-info .caution-box .ca-Con > i {
    color: #042d5c;
}
.Account-info .caution-box .ca-Con > span {}

/*  */

.Sub-ttl {
    margin-bottom: 2em;
}
.Sub-ttl .unmem {
    text-decoration: underline;
    padding-bottom: .05rem;
}

.certiC-Wrap {margin-top: 2em;}
.numem-Wrap {}
.numem-Wrap .unmem-guide {}
.numem-Wrap .unmem-guide .unmem-ttl {}
.numem-Wrap .unmem-guide .guide-box {}
.numem-Wrap .unmem-guide .guide-box .guide-list {}
.numem-Wrap .unmem-guide .guide-box .guide-list > li {
    padding: .8rem 1rem;
    background: #f3f5f8;
    margin-bottom: 1rem;
    border-radius: .3rem;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, .065);
}
.unmem-line {
    margin: 2em 0;
    width: 100%;
    height: 1px;
    background: #ddd;
}

.feedback-box {
    padding: .9375rem;
    box-sizing: border-box;
    background: #f9f9f9;
    border: 1px solid #f3f5f8;
    border-radius: .3rem;
    margin-top: 1rem;
}
.feedback-box .feedback-list {}
.feedback-box .feedback-list > li {
    margin-bottom: 1rem;
    color: #666;
}
.feedback-box .feedback-list > li:last-of-type {
    margin-bottom: 0rem;
}
.feedback-box .feedback-list > li .select {
    gap: .5em;
}
.feedback-box .feedback-list > li .select > i {
    color: #999;
}
.feedback-box .feedback-list > li.on .select > i {
    color: #008CE5;
    opacity: 1;
}
.feedback-box .feedback-list > li.on {
    color: #333;
    font-weight: 600;
}

.feedback-box .feedback-list > li .select [type="radio"] {appearance: none; border-radius: 50%; box-sizing: border-box; width: 15px; height: 15px; border: 1px solid gray; cursor: pointer;}
.feedback-box .feedback-list > li .select [type="radio"]:checked {border: 4px solid var(--siteC);}

.APP-input textarea {
    background: #fff;
    border: 1px solid #ddd;
    padding: .8rem;
    box-sizing: border-box;
    border-radius: .5rem;
    height: 6.5rem;
}

/*  */
.mypage_top {padding: 1em; gap: 0 1.5em;}
.mypage_top .back_btn {}
.mypage_top .tit {}

.order_list {}
.order_list li {background: #fff; padding: 1em; border-radius: .5em; border: 1px solid #ddd; margin-bottom: .5em;}
.order_list li:last-child {margin-bottom: 0;}
.order_list li .topcon {padding-bottom: .5em;}
.order_list li .topcon .state {background: #000; color: #fff; font-size: .8em; padding: .5em 1em; border-radius: 3em;}
.order_list li .topcon .state.c1 {background: var(--siteC);}
.order_list li .topcon .state.c2 {background: #2d4990;}
.order_list li .topcon .state.c3 {background: #39a23d;}
.order_list li .topcon .state.c4 {background: #999999;}
.order_list li .topcon .tit {font-weight: 600;}
.order_list li .topcon .tit span {font-size: .76em;}

.order_list li .info { margin-bottom: 1em;}
.order_list li .info .tt {font-size: .9em; margin-bottom: .5em;}
.order_list li .info .tt:last-child {margin-bottom: 0;}
.order_list li .info .tt span {color: #6c6c6c; width: 7em;}

.order_list li .btnbox {gap: .5em;}
.order_list li .btnbox .input_st {flex: 1;}

.mypoint_top {background: #fff; border: 1px solid var(--siteC); border-radius: .5em; overflow: hidden; padding: 1em; margin-top: 2em;}
.mypoint_top .tt {font-weight: 600;}
.mypoint_top .tt span {vertical-align: baseline;}
.mypoint_list {margin-top: 1em;}
.mypoint_list li {border: 1px solid #ddd; border-radius: .5em; overflow: hidden; padding: 1em; margin-bottom: 0.5em;}
.mypoint_list li .data {font-size: .8em; font-weight: 600; color: #555;}
.mypoint_list li .info {gap: 1em; margin-top: 0.5em;}
.mypoint_list li .info .xi {color: #fff; background: var(--siteC); width: 1.5em; height: 1.5em; line-height: 1.5em; text-align: center; border-radius: 50%;}
.mypoint_list li .info .tit {font-weight: 600; margin-bottom: 5px;}
.mypoint_list li .info .tt {font-size: 0.86em; font-weight: 600; color: var(--siteC);}

.regiHome {border: 1px solid var(--siteC); border-radius: .5em; overflow: hidden; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);}
.regiHome li {border-bottom: 1px solid #ddd;}
.regiHome li .in {display: block; padding: 1em;}
.regiHome li .in .tit {font-weight: 600;}
.regiHome li .in .tit .xi {color: var(--siteC); margin-right: .3em; font-size: 1.2em;}
.regiHome li .in .tt {font-size: .9em; margin-top: .5em; color: #555;}

.myplace_add {margin-top: 1.5em;}
.myplace_add .titbox {}
.myplace_add .titbox .tit {font-weight: 600;}
.myplace_add .titbox .tit .xi {}
.myplace_add .titbox .add_btn {font-size: .9em; color: #555;}
.myplace_add .titbox .add_btn .xi {border: 1px solid #ddd; width: 1.5em; height: 1.5em; text-align: center; line-height: 1.5em; border-radius: 50%; font-size: 1em; margin-left: .5em;}
.myplace_add .myplace_list {border-top: 1px solid #ddd; margin-top: .5em;}
.myplace_add .myplace_list li {border-bottom: 1px dashed #ddd;}
.myplace_add .myplace_list li .in {display: block; padding: .8em 0;}
.myplace_add .myplace_list li .in .tit {font-size: .9em;}
.myplace_add .myplace_list li .in .xi {color: var(--siteC); margin-right: .5em;}

.agree_box {background: #f4f4f4; border: 1px solid #ddd; padding: 1em; height: 50vh; overflow-y: auto;}

.search_wrap {border: 1px solid var(--siteC); padding: 1em; border-radius: .5em; overflow: hidden; gap: 3em; background: #fff;}
.search_wrap .title {font-size: 1.05em; font-weight: 700; margin-bottom: .5em;}
.search_wrap .in {gap: .5em;}
.search_wrap .in > .con1 {display: flex; align-items: center; flex: 1;}
.search_wrap .in > .con1 .input_st {border-radius: .5em; overflow: hidden; width: 100%;}
.search_wrap .in .search_btn {padding: .5em 1.5em; border-radius: .5em; background: var(--siteC); color: #fff;}

.viewQ_wrap {height: 100vh; overflow: hidden; position: relative;}
.viewQ_wrap .bg,
.viewQ_wrap .bg img {height: 100%; width: 100%;}
.viewQ_wrap .bg2 {display: none;}
.viewQ_wrap .bg3 {display: none;}
.viewQ_wrap .title {position: absolute; top: 9%; left: 50%; transform: translate(-50%, -50%); text-align: center; font-size: 3em; font-weight: 800; color: #fff; width: 100%;}
.viewQ_wrap .tbox {position: absolute; top: 48%; left: 50%; transform: translate(-50%, -50%); text-align: center; padding: 0 1em; width: 100%;}
.viewQ_wrap .tbox .top {margin-bottom: 1em;}
.viewQ_wrap .tbox .top .qrbox {width: 150px; margin: 0 auto; border-radius: .8em; overflow: hidden;}
.viewQ_wrap .tbox .top .t1 {font-size: 1.05em; font-weight: 600; margin-top: 1em;}
.viewQ_wrap .tbox .bottom .t1 {font-size: 1.125em; font-weight: 800; line-height: 1.5; margin-bottom: 1em;}
.viewQ_wrap .tbox .bottom .t1:last-child {margin-bottom: 0;}
.viewQ_wrap .tbox .bottom .t1 span {color: var(--siteC);}
.viewQ_wrap .tbox .bottom .logo {width: 75px; margin: 0 auto .5em; }

.dp2_viewQ .mypage_top {border-bottom: 1px solid #ddd;}

.store_pointreg_con {}
.store_pointreg_con .card {background: #f4f4f4; padding: 1em; border-radius: .5em; margin-bottom: 0.5em;}
.store_pointreg_con .card.st1 {border: 2px solid var(--siteC); background: #fff;}
.store_pointreg_con .card .t1 {font-size: 1.125em; font-weight: 800; margin-bottom: .5em;}
.store_pointreg_con .card .t2 {font-size: .9em; font-weight: 600; margin-top: .5em;}
.store_pointreg_con .card .t3 {font-weight: 800;}

.store_pointreg_con .bank_box {gap: .5em;}
.store_pointreg_con .bank_box .input_st {width: 70%;}
.store_pointreg_con .bank_box .label_select {width: 30%;}

/*  */
@media screen and (max-width:1024px){
.box0 { width:94%; margin: 0 auto;}
.box1 {width: 94%; margin: 0 auto;}

.viewQ_wrap {height: 85vh;}
.viewQ_wrap .title {font-size: 3.5em; font-weight: 800; color: #fff;}
.viewQ_wrap .tbox .top .qrbox {width: 200px;}
.viewQ_wrap .tbox .top .t1 {font-size: 1.25em;}
.viewQ_wrap .tbox .bottom .t1 {font-size: 1.5em;}

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

.viewQ_wrap .tbox .top .qrbox {width: 150px;}
.viewQ_wrap .tbox .top .t1  {font-size: 1em;}
.viewQ_wrap .tbox .bottom .t1 {font-size: 1.25em;}
}
@media screen and (max-width:780px){

#footer {border-top-left-radius: 3em; border-top-right-radius: 3em;}
#footer .box0 {gap: 2em;}
#footer .info_wrap {padding: 2.5em 0 6.5em 0;}
#footer .info_wrap .info {width: 85%; gap: 1em;}
#footer .info_wrap .info > li {font-size: .9em;}
#footer .info_wrap .copyright {font-size: .7em;}

.btn_wrap .btn {height: 3.5em; font-size: 18px;}

.search_wrap {flex-wrap: wrap; gap: .5em; padding: 1em;}
.search_wrap .title,
.search_wrap .in {flex-wrap: wrap; gap: .5em;}
.search_wrap .in > p.w1,
.search_wrap .in > p.w2,
.search_wrap .in .search_btn {width: 100%;}
.search_wrap .in > p .input_st,
.search_wrap .in .search_btn {height: 2.5em; padding: .5em .75em; font-size: .938em; }

.drive_form .pay_mode_card .flex_between {flex-wrap: wrap; gap: unset;}
.drive_form .pay_mode_card .flex_between .in {width: 100%; flex: 1 100%;}
}
@media screen and (max-width:500px){

/* header */
#header .top_wrap .logo > a {height: 1.5em;}
#header .top_wrap .m_menu_btn .btn {width: 2.3em; height: 2.3em; line-height: 2.3em;}

#footer .info_wrap .info {gap: .5em;}
#footer .info_wrap .info > li {font-size: .86em;}

/*  */
.contents_st2 {border-top-left-radius: 3em; border-top-right-radius: 3em;}

/* main */
.drive_form .flex_between .w2 {width: 8em;}
.drive_form .pay_method {gap: .5em;}
.drive_form .pay_method label {font-size: 12px;}
.drive_form .waypoint_btn {width: unset; flex: 1;}
.main_btncon .btn {font-size: 1.125em;}

.mainTop_title .t1 {font-size: 1.7em;}
.mainTop_title .t2 {font-size: 1em;}
.main_notice .list li a .tt {font-size: .9em;}

.place-modal .placeItem,
.match-modal-content {width: 82%;}

/* sub */
.app_tt.s6 {font-size: 1.8rem;}

.viewQ_wrap {height: 100%;}
.viewQ_wrap .bg1 {display: none;}
.viewQ_wrap .bg2 {display: block;}
.viewQ_wrap .title {font-size: 2em; top: 7%;}
.viewQ_wrap .tbox {top: 43%;}
.viewQ_wrap .tbox .top .qrbox {width: 140px;}
.viewQ_wrap .tbox .top .t1 {font-size: .9em;}
.viewQ_wrap .tbox .bottom .t1 {font-size: 1.05em; margin-bottom: .5em;}


}
@media screen and (max-width:380px){
.viewQ_wrap .bg2 {display: none;}
.viewQ_wrap .bg3 {display: block;}
}

@media screen and (max-width:360px){
#footer .info_wrap .copyright { font-size: .6em;}

.viewQ_wrap .title {font-size: 1.8em; top: 8%;}
/* .viewQ_wrap .tbox .top .qrbox {width: 120px;} */
.viewQ_wrap .tbox .top .t1 {font-size: .8em;}
.viewQ_wrap .tbox .bottom .t1 {font-size: 1em;}

}

@media screen and (max-height:740px){
.viewQ_wrap {height: 100%;}
}
@media screen and (max-height:670px){
.viewQ_wrap {height: 100%;}

.viewQ_wrap .title {font-size: 1.8em; top: 8%;}
/* .viewQ_wrap .tbox .top .qrbox {width: 80px;} */
.viewQ_wrap .tbox .top .t1 {font-size: .7em; margin-top: .5em;}
.viewQ_wrap .tbox .bottom .t1 {font-size: .76em; margin-bottom: .5em;}

}