@charset "utf-8";/* CSS Document */
.box0 { padding: 0 2vmin}

.gnb li.m_hide,
.gnb .mLink{ display:none}
body { display: flex; flex-direction: column; height: 100vh; height: calc(var(--vh, 1vh) * 100)}

/**/
.inLayer { position: relative}
.inLayer .inLayerBtn .arrow { margin-left: .5em; transition: .3s}
.inLayer .inLayerBtn .arrow:before { content: "\ee1e"; font-family: fontello}
.inLayer .inLayerCon { position: absolute; left: 0; top: 100%; margin-top: .5em; background: #fff; border-radius: 1em; box-shadow: 0 0 1em rgba(0, 0, 0, .2); opacity: 0; visibility: hidden; transform: translateY(1em); box-sizing: border-box; padding: 1em}
.inLayer .inLayerCon:before { content: "\e856"; font-family: fontello; position: absolute; left: .75em; transform: translateY(30%); bottom: 100%; color: #fff; line-height: 1; font-size: 2em}
.inLayer.right .inLayerCon { left: auto; right: 0}
.inLayer.right .inLayerCon:before { left: auto; right: .75em}
.inLayer.on .inLayerBtn .arrow { transform: rotate(180deg)}
.inLayer.on .inLayerCon { transition: .3s; opacity: 1; visibility: visible; transform: translateY(0)}

#adm_header { position: relative; z-index: 1000}
#adm_header .top_wrap .wrapIn { display: flex; align-items: center; justify-content: space-between}
#adm_header .top_wrap .wrapH { height:10vmin}
#adm_header .top_wrap .logo_wrap { display: flex; align-items: center; gap:4vmin; padding-left:1vmin}
#adm_header .top_wrap .logo_wrap .logo{ height:5vmin} 
#adm_header .top_wrap .logo_wrap .logoS{ height:4vmin}
#adm_header .top_wrap .logo > a { padding:1vmin; display: flex; align-items: center; gap:1vmin}
#adm_header .top_wrap .logo .ico { font-size: 3vmin}
#adm_header .top_wrap .logo .tt { font-weight: 800; font-size: 3.3vmin; transform:translateY(-.5vmin)}
#adm_header .top_wrap .colorChange { position: relative}
#adm_header .top_wrap .colorChange .wrapBtn { display: flex; align-items: center; gap: .25em; padding: .5em}
#adm_header .top_wrap .colorChange .wrapCon .list { display: flex; align-items: center; gap: .5em}
#adm_header .top_wrap .colorChange .wrapCon .list:before { content: attr(data-tit); font-size: .75em; font-weight: 700; width: 4em; color: #777}
#adm_header .top_wrap .colorChange .colorSt { width: 1.5em; height: 1.5em; border: 2px solid #fff; border-radius: 50%; box-sizing: border-box}
#adm_header .top_wrap .colorChange .colorArr.check { position: relative}
#adm_header .top_wrap .colorChange .colorArr.check:after { content: "\edb5"; font-family: 'fontello'; position: absolute; width: 100%; height: 100%; left: 0; top: -.125em; display: flex; align-items: center; justify-content: center}
#adm_header .top_wrap .menuToggle { display: flex; align-items: center}
#adm_header .top_wrap .menuToggle .tit { font-size: .813em; font-weight: 500; width: 6em}
#adm_header .top_wrap .menuToggle .tit:after { content: " ON"}
#adm_header .top_wrap .menuToggle .menuToggleBtn:before { content: "\f205"; font-size: 1.5em}
html.lnbOff #adm_header .top_wrap .menuToggle .tit:after { content: " OFF"}
html.lnbOff #adm_header .top_wrap .menuToggle .menuToggleBtn:before { content: "\f204"}
html.lnbOff #adm_contents .subWrap .lnbWrap { display: none}

#adm_header .top_wrap .utility_wrap { display: flex; align-items: center; gap: 3em}
#adm_header .top_wrap .utility_wrap .search { position: relative}
#adm_header .top_wrap .utility_wrap .search .inp { height: 2.5em; width: 16em; padding: .5em 3em .5em 1.5em; border: none; box-sizing: border-box; border-radius: 3em; font-weight: 700}
#adm_header .top_wrap .utility_wrap .search .inp::placeholder { font-weight: 300}
#adm_header .top_wrap .utility_wrap .search .btn { width: 2.5em; height: 2.5em; background: none; border: none; position: absolute; right: .5em; top: 0}
#adm_header .top_wrap .utility_wrap .userW { position: relative}
#adm_header .top_wrap .utility_wrap .userW .userBtn { display: flex; align-items: center; gap: .5em; padding: 1em}
#adm_header .top_wrap .utility_wrap .userW .userBtn .tt { font-size: .938em}
#adm_header .top_wrap .utility_wrap .userW .userBtn .tt strong { font-weight: 700}
#adm_header .top_wrap .utility_wrap .userW .userCon { width: 16em; padding: 0}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .info { color: #111; padding: 1.5em}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .info .profile { display: flex; align-items: center; gap: 1em}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .info .profile .ico { color: #ccc; font-size: 2.5em}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .info .profile .twrap .t1 { font-size: .875em; color: #777}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .info .profile .twrap .t2 { font-weight: 700; font-size: 1em}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .btnW { display: flex; border-radius: 0 0 1em 1em; overflow: hidden}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .btnW .btn { flex: 1 1 1%; height: 2.75em; border: none; position: relative; font-size: .875em; font-weight: 600; color: #fff}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .btnW .btn:not(.siteBg) { background: #eee; color: #666}
#adm_header .top_wrap .utility_wrap .userW.on .userCon .btnW .btn:before { content: ""; position: absolute; left: -1px; top: -1px; width: 100%; height: 100%; border: 1px solid rgba(255, 255, 255, .3); border-right: none; border-bottom: none}
#adm_header .top_wrap .utility_wrap .mallBtn{ display:flex}
#adm_header .top_wrap .utility_wrap .mallBtn .wrap{ position:relative}
#adm_header .top_wrap .utility_wrap .mallBtn .wrap .wrapBtn{ width:9vmin; height:9vmin; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:.5vmin}
#adm_header .top_wrap .utility_wrap .mallBtn .wrap .wrapBtn .ico{ font-size:3vmin; padding-top:.5vmin}
#adm_header .top_wrap .utility_wrap .mallBtn .wrap .wrapBtn .tt{ font-size:1.4vmin}

#adm_header .top_wrap .menu_wrap .gnb > li{ position:relative}
#adm_header .top_wrap .menu_wrap .gnb > li .dp1{ padding:4vmin 4vmin; display:flex; align-items:center; gap:.8vmin; opacity:.5; transition:.3s}
#adm_header .top_wrap .menu_wrap .gnb > li .dp1 .tt{ font-size:2.2vmin; font-weight:700; position:relative}
#adm_header .top_wrap .menu_wrap .gnb > li .dp1 .tt:after{ content:""; position:absolute; left:0; top:100%; width:100%; height:1px; background:var(--siteCD1); display:none}
#adm_header .top_wrap .menu_wrap .gnb > li .dp1 .ico{ font-size:3vmin}
#adm_header .top_wrap .menu_wrap .gnb > li:hover .dp1,
#adm_header .top_wrap .menu_wrap .gnb > li.on .dp1{ opacity:1}
#adm_header .top_wrap .menu_wrap .gnb > li.on .dp1 .tt:after{ display:block}
#adm_header .top_wrap .menu_wrap .gnb > li.more .dp1:after{ content:"\ee1e"; font-family:fontello}
#adm_header .top_wrap .menu_wrap .gnb > li .dp2{ visibility:hidden; opacity:0; position:absolute; left:50%; top:100%; transform:translateX(-50%); border-radius:1vmin; margin-top:2vmin; background:#fff; flex-direction:column; min-width:90%; box-sizing:border-box; padding:2vmin 1vmin; box-shadow:0 1vmin 1vmin rgba(0,0,0,.1)}
#adm_header .top_wrap .menu_wrap .gnb > li:hover .dp2{ visibility:visible; opacity:1; margin-top:-2vmin; transition:.3s}
#adm_header .top_wrap .menu_wrap .gnb > li:hover .dp2:before{ content: "\e856"; font-family: fontello; position: absolute; left:50%; transform: translate(-50%, 30%); bottom: 100%; color: #fff; line-height: 1; font-size: 4vmin}
#adm_header .top_wrap .menu_wrap .gnb > li .dp2 > li > a{ padding:1vmin 2vmin; display:flex; line-height:1; color:#333}
#adm_header .top_wrap .menu_wrap .gnb > li .dp2 > li > a .tt{ font-size:1.7vmin; font-weight:500; opacity:.7; flex:1; min-width:0}
#adm_header .top_wrap .menu_wrap .gnb > li .dp2 > li > a .arrow{ opacity:0; transform:translateX(1vmin)}
#adm_header .top_wrap .menu_wrap .gnb > li .dp2 > li > a .arrow:before{content: "\e93f"; font-family: fontello;}
#adm_header .top_wrap .menu_wrap .gnb > li .dp2 > li > a:hover{ background:var(--siteC); color:#fff; border-radius:3em}
#adm_header .top_wrap .menu_wrap .gnb > li .dp2 > li > a:hover .tt,
#adm_header .top_wrap .menu_wrap .gnb > li .dp2 > li > a:hover .arrow{ opacity:1}

#adm_footer .wrapIn{ display: flex; gap:8vmin; border-radius:1vmin 1vmin 0 0; padding:1.5vmin; padding-top:3vmin; align-items:center}
#adm_footer .logo_wrap{ display:flex; flex-wrap:wrap; gap:1vmin 4vmin; flex:1; min-width:0}
#adm_footer .logo img{ height:3.5vmin}
#adm_footer .menu_wrap{ flex:1; min-width:0; display:flex; gap:3vmin; margin-top:.4vmin}
#adm_footer .menu_wrap > li > a{ position:relative; display:flex; align-items:center; gap:.5vmin; font-size:1.6vmin; padding-right:2vmin}
#adm_footer .menu_wrap > li > a:after{ font-family:fontello; content:"\e980"; font-weight:normal; position:absolute; right:0; top:50%; transform:translateY(-50%)}
#adm_footer .menu_wrap > li.point > a{ font-weight:700}
#adm_footer .menu_wrap > li > a:hover{ text-decoration:underline}
#adm_footer .info{ overflow:hidden; width:100%}
#adm_footer .info > li{ float:left; margin-right:2vmin; margin-bottom:.5vmin; opacity:.8; position:relative; font-size:1.5vmin}
#adm_footer .info > li:before{ content:""; position:absolute; left:-1em; height:70%; top:50%; transform:translateY(-50%); width:1px; background:#fff; opacity:.2}
#adm_footer .info > li.point{ font-weight:700}
#adm_footer .info > li.br{ clear:left}
#adm_footer .info > li.copyright{ opacity:.5; margin-top:.5vmin; text-transform:uppercase}
#adm_footer .cs_wrap{ display:flex; gap:0 6vmin}
#adm_footer .cs{ display:flex; flex-direction:column; gap:.5vmin;; box-sizing:border-box; padding:1em}
#adm_footer .cs .tit{ font-size:1.6vmin; font-weight:700; display:flex; align-items:center; gap:.5vmin}
#adm_footer .cs .tit .ico { font-size:2vmin}
#adm_footer .cs .tt{ font-size:1.4vmin; text-align:right}
#adm_footer .cs .no{ display:flex; align-items:center; gap:.5em; margin-top:1vmin}
#adm_footer .cs .no .ico{ width:3vmin; height:3vmin; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.2); color:#fff; border-radius:50%}
#adm_footer .cs .no .t1{ font-weight:800; font-size:2.1vmin}

#adm_contents { flex: 1; min-height: 0; box-sizing: border-box; position: relative; display: flex}
#adm_contents .subWrap { display: flex; gap: 1em; align-items: flex-start; flex: 1; overflow:hidden; font-size:13px}
#adm_contents .subWrap .lnbWrap .gnb { padding: 1em; gap: .5em}
#adm_contents .subWrap .lnbWrap .gnb,
#adm_contents .subWrap .lnbWrap .gnb .flex { flex-direction: column}
#adm_contents .subWrap .lnbWrap .gnb a { text-align: left; display: flex; align-items: center; gap: .25em; position: relative}
#adm_contents .subWrap .lnbWrap .gnb > li { position: relative}
#adm_contents .subWrap .lnbWrap .gnb > li .dp1 { gap: .5em; height: 2.5em; display: flex; align-items: center; justify-content: center; padding: 0 1.25em; border-radius: 2em; background: rgba(255, 255, 255, .5)}
#adm_contents .subWrap .lnbWrap .gnb > li .dp1 .ico { width: 2.5em; height: 2.5em; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .2); border-radius: 50%; transition: .3s; color: #fff}
html:not(.main) #adm_contents .subWrap .lnbWrap .gnb > li .dp1 .ico { display: none}
html:not(.main) #adm_contents .subWrap .lnbWrap .gnb > li.on .dp1,
html:not(.main) #adm_contents .subWrap .lnbWrap .gnb > li:hover .dp1 { background: var(--siteC); color: #fff}
#adm_contents .subWrap .lnbWrap .gnb > li .dp1 .ico:before { font-size: 1.25em}
#adm_contents .subWrap .lnbWrap .gnb > li .dp1 .tt { font-weight: 700; font-size: 1.063em}
#adm_contents .subWrap .lnbWrap .gnb li > a .arrow { margin-left: auto}
#adm_contents .subWrap .lnbWrap .gnb li.more > a .arrow:before { content: '\ee26'}
#adm_contents .subWrap .lnbWrap .gnb li.on > a .arrow:before { content: '\ee28'}
#adm_contents .subWrap .lnbWrap .gnb > li.more:not(.on) > .mLink { position: absolute; left: 0; top: 0; width: 100%; height: 100%; cursor: pointer}
#adm_contents .subWrap .lnbWrap .gnb > li:hover .dp1 .ico,
#adm_contents .subWrap .lnbWrap .gnb > li.on .dp1 .ico { background: var(--siteC)}
#adm_contents .subWrap .lnbWrap .gnb > li .dp2 { margin: .25em 0 0 0}
/*#adm_contents .subWrap .lnbWrap .gnb > li.on .dp2 { padding-bottom:.75em } */
#adm_contents .subWrap .lnbWrap .gnb > li .dp2 > li > a { padding: .5em 1em; font-weight: 500 } 
#adm_contents .subWrap .lnbWrap .gnb > li .dp2 > li > a .ico { text-align: center}
#adm_contents .subWrap .lnbWrap .gnb > li .dp2 > li > a .ico:before { content: '\e97e'; font-family: 'fontello'}
#adm_contents .subWrap .lnbWrap .gnb > li .dp2 > li > a .tt { font-size: .938em; position: relative}
#adm_contents .subWrap .lnbWrap .gnb > li .dp2 > li > a .tt:after { content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 1px; transition: .3s}
#adm_contents .subWrap .lnbWrap .gnb > li .dp2 > li.on > a .tt:after,
#adm_contents .subWrap .lnbWrap .gnb > li .dp2 > li:hover > a .tt:after { width: 100%}
#adm_contents .subWrap .lnbWrap .gnb > li:not(.on) .dp2 { display: none}
#adm_contents .subWrap .lnbWrap .gnb > li.show .dp2 { display: flex}

#adm_contents .subWrap .lnbWrap{ width: 31vmin; display:flex; flex-direction:column; box-sizing:border-box; height:100%; box-shadow:0 0 2vmin rgba(0,0,0,.1); border:1px solid var(--siteCL1); background:var(--siteCL3)}
#adm_contents .subWrap .lnbWrap .inPd{ padding:2vmin;}
#adm_contents .subWrap .lnbWrap .userW{ padding:4vmin 2vmin; display:flex; flex-direction:column; gap:3vmin}
#adm_contents .subWrap .lnbWrap .userW .userSt{ display:flex; gap:2vmin; align-items:center; flex-direction:column}
#adm_contents .subWrap .lnbWrap .userW .userSt .ico{ width:7vmin; height:7vmin; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--siteCD2); color:#fff}
#adm_contents .subWrap .lnbWrap .userW .userSt .ico:before{ content:"\f0f8"; font-size:3vmin}
#adm_contents .subWrap .lnbWrap .userW .userSt .con{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:1vmin}
#adm_contents .subWrap .lnbWrap .userW .userSt .con .t1{ font-weight:700; font-size:2.2vmin}
#adm_contents .subWrap .lnbWrap .userW .userSt .con .t2{ font-weight:500; font-size:1.5vmin; opacity:.7}
#adm_contents .subWrap .lnbWrap .userW .userInfo{ border-radius:1vmin; background:var(--siteCL2); padding:2vmin; display:flex; flex-direction:column; gap:3vmin}
#adm_contents .subWrap .lnbWrap .userW .userInfo .info{ display:flex; flex-direction:column; gap:1vmin}
#adm_contents .subWrap .lnbWrap .userW .userInfo .info .tit{ display:flex; align-items:center; gap:.5em}
#adm_contents .subWrap .lnbWrap .userW .userInfo .info .tit .t1{ font-weight:700; font-size:1.5vmin}
#adm_contents .subWrap .lnbWrap .userW .userInfo .info .tt{ font-size:1.4vmin; font-weight:500; word-break:keep-all; line-height:1.3; opacity:.7}

.dp1_charge #adm_contents .subWrap .lnbWrap,
.dp1_charge #adm_footer .cs_wrap { display: none}

#adm_contents .subWrap .conWrap { flex: 1 1 0%; min-width: 0; display:flex; flex-direction:column;}
#adm_contents .subWrap > div{ height: 100%; border-radius: 1vmin; box-sizing: border-box}
#adm_contents .subWrap .scrollst{ height: 100%}
#adm_contents .subWrap .conWrap .conIn{ max-height:100%; overflow-y:scroll}
#adm_contents .subWrap .subTab .gnb{ display:inline-flex; margin:0 2.5vmin; overflow:hidden; border-radius:1vmin 1vmin 0 0;}
#adm_contents .subWrap .subTab .gnb > li{ position:relative}
#adm_contents .subWrap .subTab .gnb > li > a{ display:flex; align-items:center; justify-content:center; text-align:center; height:5.5vmin; min-width:22.5vmin; padding:1vmin; box-sizing:border-box; position:relative; background:var(--siteCL3)}
#adm_contents .subWrap .subTab .gnb > li > a:before{ content:""; position:absolute; left:-1px; top:50%; height:30%; width:1px; background:rgba(0,0,0,.2); transform:translateY(-50%)}
#adm_contents .subWrap .subTab .gnb > li > a .tt{ font-weight:700; font-size:2vmin; opacity:.6}
#adm_contents .subWrap .subTab .gnb > li.on{ z-index:1}
#adm_contents .subWrap .subTab .gnb > li.on > a{ background:var(--siteCL2)}
#adm_contents .subWrap .subTab .gnb > li.on > a:before{ opacity:0}
#adm_contents .subWrap .subTab .gnb > li.on > a .tt{ opacity:1}

.adm_grid { display: grid; gap: 1vmin; box-sizing: border-box; height: 100%; grid-template-columns: 100%; grid-template-rows: 100%} 
#adm_contents .subWrap .conWrap .conIn,
.adm_grid .gridW { box-shadow: 0 0 1vmin rgba(0, 0, 0, .1); background: var(--siteCL2); box-sizing: border-box; border-radius:1vmin; display: flex; flex-direction: column}
.adm_grid .gridW .col { display: flex; flex-direction: column} 
.adm_grid .gridW .g0 { gap: 0}
.adm_grid .gridW .grow { flex: 1 1 0%; min-height: 0}
.adm_grid .gridW.noSt{ border:none; box-shadow:none}

.admTitW{ display:flex; align-items:center; gap:1vmin; padding:2vmin; padding-top:2.5vmin}
.admTitW .tit{ flex:1; min-width:0; display:flex; align-items:center; gap:1vmin}
.admTitW .tit .ico{ display:flex; align-items:center; justify-content:center; border-radius:50%}
.admTitW .tit .ico:before{ font-size:2.5vmin}
.admTitW .tit .t1{ font-weight:700; font-size:2.3vmin}
.admTitW.bottom{ box-shadow:0 -.5vmin .5vmin rgba(0,0,0,.1)}

#adm_contents .subWrap .conWrap .conIn{ flex:1; min-height:0; padding:3vmin}
#adm_contents .subWrap .conWrap .conIn .conDoc{ flex:1 0 0% }
.admConW{ flex:1; min-height:0; padding:2vmin; padding-top:1px}

.adm_page_tit{ display:flex; align-items:center; gap:1vmin}
.adm_page_tit .t1{ font-weight:700; font-size:2.4vmin; line-height:1}
.adm_page_tit .t2{ font-weight:500; font-size:1.7vmin}
.adm_page_tit .ico:before{ color:var(--siteC); font-size:2.4vmin}
.adm_page_tit .line{ display:inline-block; position:relative; padding:0 .5vmin}
.adm_page_tit .line:before{ content:""; position:absolute; left:0; bottom:0; height:.375em; width:100%; background:var(--siteC); opacity:.5; transform:translateY(50%) skew(-30deg); border-radius:1vmin}
.adm_page_tit .line > i{ position:relative}

.stepW{ display:flex; align-items:center; margin-bottom:3vmin}
.stepW .step_tit{ flex:1; min-width:0; padding-left:.5vmin}
.stepW .step_tit .t1{ font-weight:700; font-size:3vmin}
.step_st{ display:flex; flex-direction:row-reverse}
.step_st > li{ min-width:14vmin}
.step_st > li .wrap_in{ display:flex; flex-direction:column; align-items:center; gap:1vmin}
.step_st > li .wrap_in .ico{ position:relative; width:4vmin; height:4vmin}
.step_st > li .wrap_in .ico .no{ position:relative; box-sizing:border-box; width:100%; height:100%; border-radius:50%; background:#eee; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:1.5vmin}
.step_st > li .wrap_in .ico .xi{ position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; display:flex; align-items:center; justify-content:center; border-radius:50%;}
.step_st > li:not(:last-child) .wrap_in .ico:before{ content:""; position:absolute; right:50%; top:50%; transform:translateY(-50%); width:14vmin; height:4px; background:#eee}
.step_st > li .wrap_in .tt{ opacity:.6; font-size:1.4vmin; font-weight:700}
.step_st > li.on ~ li .wrap_in .ico:before,
.step_st > li.on .wrap_in .ico:before{ background:#666}
.step_st > li.on ~ li .wrap_in .ico .xi,
.step_st > li.on .wrap_in .ico .xi{ z-index:1; background:var(--siteC); color:#fff; border:2px solid var(--siteC)}
.step_st > li.on ~ li .wrap_in .ico .xi:before,
.step_st > li.on .wrap_in .ico .xi:before{ content:"\e928"}
.step_st > li.on ~ li .wrap_in .tt,
.step_st > li.on .wrap_in .tt{ font-weight:800; opacity:1}

.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}

/**/
.admOrderWrap{ width:100%; height:100%; box-sizing:border-box; display:flex; gap:3vmin}
.admOrderWrap .orderList{ flex:1; min-width:0}
.admOrderWrap .orderForm{ right:0; top:0; width:36vmin; background:#fff; box-shadow:-1em 0 1em rgba(0,0,0,.1); border-radius:1vmin; overflow:hidden; box-sizing:border-box; display:flex; flex-direction:column; padding:1vmin 0 0 0; color:#111}
.admOrderWrap .orderForm .formDv.grow,
.admOrderWrap .orderForm .formDv .grow{flex:1; min-height:0; display:flex; flex-direction:column}
.admOrderWrap .orderForm .formDv{ padding:2vmin; display:flex; flex-direction:column; gap:1vmin}
.admOrderWrap .orderForm .formDv:not(:first-child){ border-top:1px dashed #ccc} 
.admOrderWrap .orderForm .formDv .tit .t1{ font-weight:700; font-size:1.6vmin; color:var(--siteC)}
.admOrderWrap .orderForm .wrapBtn{ height:6vmin; background:var(--siteC); color:#fff; border:none; font-size:2.2vmin; display:flex; align-items:center; justify-content:center; gap:1vmin}
.admOrderWrap .orderForm .wrapBtn .t1{ font-weight:700}
.admOrderWrap .orderForm .wrapBtn .arrow{ margin-left:-3.2vmin; opacity:0; transition:.3s}
.admOrderWrap .orderForm .wrapBtn:hover .arrow{ margin-left:0; opacity:1}
.admOrderWrap .orderForm .selList{ border-radius:1vmin; background:#f5f5f5; padding:2vmin; gap:1vmin; box-shadow:0 0 1vmin rgba(0,0,0,.1) inset}
.admOrderWrap .orderForm .selList > li{ display:flex; flex-direction:column; gap:.5vmin; padding-bottom:1vmin; border-bottom:1px dashed #ccc}
.admOrderWrap .orderForm .selList > li .tit{ font-weight:700}
.admOrderWrap .orderForm .selList > li .opL{ display:flex; flex-wrap:wrap; justify-content:flex-end; gap:2vmin; color:#666}
.admOrderWrap .orderForm .total{ padding:1.5vmin 0 0 0; font-size:1.125em; text-align:right}

.sticKyW{ position:sticky; z-index:1000}

.adm_login { position: fixed; width: 100%; height: 100%; left: 0; top: 0; display: flex}
.adm_login .vod_wrap { flex: 1 1 0%; min-width: 0; position:absolute; left:0; bottom:0; width:100%; height:100%}
.adm_login .vod_wrap video { object-fit: cover; width: 100%; height: 100%}
.adm_login .vod_wrap .layer { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background:black; mix-blend-mode:overlay; opacity:.2}
.adm_login .vod_wrap .layerD { position: absolute; left: 0; bottom: 0; padding: 1.5em; font-family: fantasy; color: #fff; display:flex; flex-wrap:wrap; gap:1vmin; align-items:baseline}
.adm_login .vod_wrap .layerD .di{ display:inline-block; vertical-align:baseline}
.adm_login .vod_wrap .layerD .t1 { font-size: 14vmin}
.adm_login .vod_wrap .layerD .t2 { font-size: 6vmin}
.adm_login .con_wrap { position: relative; width: 70vmin; padding: 6vmin; display: flex; align-items: center; box-sizing: border-box; border-left: 1px solid rgba(255, 255, 255, .1); color:#111; background:rgba(255,255,255,.9); margin-left:auto}
.adm_login .con_wrap .wrap_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--siteBg)}
.isMobile .adm_login .vod_wrap .layerD .t1{ font-weight:bold; font-style:italic; font-family:serif; letter-spacing:-.05em}
.isMobile .adm_login .vod_wrap .layerD .t1{}

.adm_login .login { width: 100%; position: relative}
.adm_login .login .wrap_in { padding: 2em; margin: 2em 0; border-radius:1em}
.adm_login .login_tit { display: flex; flex-direction: column; align-items: center; gap:.5em; justify-content: center}
.adm_login .login_tit .logo { height: 2em}
.adm_login .login_tit .tt { font-size: 2.5em; font-weight: 900; word-spacing:.125em}

.adm_login .link_wrap { margin:3vmin 0; padding: 0 4.5vmin}
.adm_login .link_wrap .t1 { color: #fff; font-size:1.5vmin}
.adm_login .link_wrap .t1 .xi { font-size: 3vmin}
.adm_login .link_wrap .link { font-size: 1.6vmin}
.adm_login .link_wrap .link .tt { padding: 0 .5vmin; display: inline-block}
.adm_login .link_wrap .link:hover .tt { text-decoration: underline}
.adm_login .link_wrap .link.st1 { color: #fff}
.adm_login .link_wrap .link.st2 { color: #fff; font-weight: 500}
.adm_login .memo_wrap .t1 { display: flex; justify-content: center; line-height: 1.3; gap: 0 .5em; font-size: .938em; opacity: .7}

.adm_form { display: flex; flex-direction: column; gap:1.5em}
.adm_form > li { position: relative}
.adm_form > li .error:not(input){ position: absolute; left: 0; text-align:right; top: 50%; transform:translateY(-50%); width: 100%; padding: .25em .5em; box-sizing: border-box; font-weight: 500; color: red}
.adm_form > li .in { position: relative; padding: 0 1em 0 4em}
.adm_form > li .in .icon { position: absolute; left: 0; top: 50%; width: 4em; transform: translateY(-50%); text-align: center; font-size: 1em; z-index: 1; color:#777}
.adm_form > li .in .icon:before { font-size: 1.5em}
.adm_form > li .in .lab { position: absolute; left: 4em; top: 50%; line-height: 1; margin-top: -.5em; padding: 0 .25em; transition: .3s}
.adm_form > li .in .inp { width: 100%; font-size: 1.25em; box-sizing: border-box; padding: 1em 0; height: 3.5em; border: none; position: relative; z-index: 1; background: none; font-weight: bold}
.adm_form > li .in .inp:-webkit-autofill { transition: background-color 5000s ease-in-out 0s; -webkit-transition: background-color 9999s ease-out; -webkit-box-shadow: 0 0 0px 1000px transparent inset !important}
.adm_form > li .in .inp:not(.on):-webkit-autofill{ -webkit-text-fill-color:transparent !important}
.adm_form > li .in .inp:-webkit-autofill:focus{ -webkit-text-fill-color:#111 !important}
.adm_form > li .in .line { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: .5em; box-sizing: border-box; transition: .3s; border:1px solid rgba(0,0,0,.2)}
.adm_form > li .in .inp:focus ~ .lab,
.adm_form > li .in .inp.on ~ .lab,
.adm_form > li .in .inp.error ~ .lab { transform: scale(.9, .9); top: 0; margin-left: -1vmin; font-weight:500; z-index: 1; color:#111;}
.adm_form > li .in .inp:focus ~ .icon,
.adm_form > li .in .inp.on ~ .icon { color:#111}
.adm_form > li .in .inp:focus,
.adm_form > li .in .inp.on { color: var(--siteBrandC2)}

.adm_form > li.check_wrap { font-size: 1.063em; font-weight: 500}
.adm_form > li.select_wrap{ padding:1em; display:flex; justify-content:center; gap:4em; border:2px solid var(--siteBrandC); border-radius:.5em; margin-bottom:.75em}
.adm_form > li.select_wrap label{ font-size:1.125em}
.adm_form > li.btn_wrap { display: flex; gap: 1em}
.adm_form > li.btn_wrap .btn { flex: 1; padding: 0 2em; height:3.5em; border-radius: .5em; background: var(--siteBrandC); color: #fff; border: none; font-weight: bold; font-size:1.25em}

/**/
.admTable{ line-height:1.3}
.admTable,
.admTable .thead,
.admTable .tbody{ display:flex; flex-direction:column}
.admTable .thead{ border-radius:1vmin}
.admTable .tr{ display:flex; padding:0 0 0 1px; border-radius:1vmin}
.admTable .cell{ display:flex; flex-direction:column; min-height:4vmin; align-items:center; justify-content:center; box-sizing:border-box; padding:.5vmin 1.5vmin; border:1px solid var(--siteCD3); margin:-1px 0 0 -1px}
.admTable .cell.al{ align-items:flex-start !important}
.admTable .cell.ar{ align-items:flex-end !important}
.admTable .cell.ac{ align-items:center !important}
.admTable .cell.th{ font-weight:700}
.admTable .cell.td{ min-height:6vmin;}
.admTable.h1 .cell.td {min-height: 4vmin;}
.admTable .tr:first-child .cell:first-child{ border-top-left-radius:1vmin}
.admTable .tr:first-child .cell:last-child{ border-top-right-radius:1vmin}
.admTable .tbody:last-child .tr:last-child .cell:first-child{ border-bottom-left-radius:1vmin}
.admTable .tbody:last-child .tr:last-child .cell:last-child{ border-bottom-right-radius:1vmin}
.admTable .thead .tr:last-child .cell:first-child{ border-bottom-left-radius:0}
.admTable .thead .tr:last-child .cell:last-child{ border-bottom-right-radius:0}
.admTable .thead ~ .tbody .tr:first-child .cell:first-child,
.admTable .thead ~ div .tbody .tr:first-child .cell:first-child{ border-top-left-radius:0}
.admTable .thead ~ .tbody .tr:first-child .cell:last-child,
.admTable .thead ~ div .tbody .tr:first-child .cell:last-child{ border-top-right-radius:0}
.admTable .bg1,
.admTable .bg1 .cell{ background:var(--siteCL); border-color:rgba(0,0,0,.1)}
.admTable .bg2,
.admTable .bg2 .cell{ background:var(--siteC); border-color:rgba(255,255,255,.5); color:#fff}
.admTable .bg3,
.admTable .bg3 .cell{ background:var(--siteCD3)}
.admTable .wProd,
.admTable .wFormCon{ flex:1; min-width:0}
.admTable .wNo{ width:5vmin}
.admTable .wCheck{ width:6vmin}
.admTable .wBtn{ width:10vmin}
.admTable .wBtn2{ width:14vmin}
.admTable .wPrice{ width:16vmin}
.admTable .wVol{ width:10vmin}
.admTable .wVolBtn{ width:16vmin}
.admTable .wState{ width:16vmin}
.admTable .wOrderNo{ width:16vmin}
.admTable .wDate2{ width:18vmin}
.admTable .wFormTit{ width:20vmin}
.admTable.form .cell{ padding:1vmin}
.admTable.form .cell.th{ background:var(--siteCD4)}
.admTable.form .cell.td{ align-items:flex-start}
.admTable.form .cell.th.blank{border-right:none;}
.admTable.form .cell.td.blank{border-left:none;}
.admTable.form .cell.blank{ background:var(--siteCD4)}
.admTable .cell.p1{ padding:2vmin}

.admTable .tShow{ display:flex; flex-direction:column}
.admTable .tShow .hideW{ display:none}
.admTable .tShow .tShowBtn .fi:before{ content:"\e81a"}
.admTable .tShow.on:last-child .tr.hideW .cell:first-child{ border-bottom-left-radius:1vmin}
.admTable .tShow.on:last-child .tr.hideW .cell:last-child{ border-bottom-right-radius:1vmin}
.admTable .tShow.on{ z-index:1; position:relative; box-shadow:0 0 2vmin rgba(0,0,0,.1)}
.admTable .tShow.on:after{ content:""; position:absolute; left:0; top:-1px; height:1px; width:100%; background:#111}
.admTable .tShow.on .hideW .cell{ border-bottom-color:#111}
.admTable .tShow.on .cell:first-child{ border-left-color:#111}
.admTable .tShow.on .cell:last-child{ border-right-color:#111}
.admTable .tShow.on .tr:not(.hideW) .cell{ background:var(--siteCD4); border-radius:0 !important}
.admTable .tShow.on .hideW{ display:flex; order:1}
.admTable .tShow.on .tShowBtn .fi:before{ content:"\e81c"}
.admTable .tShow[data-class='on1'] .hideW.on1,
.admTable .tShow[data-class='on2'] .hideW.on2,
.admTable .tShow[data-class='on3'] .hideW.on3{ display:flex}

.admTable .caption{ display:flex; gap:1vmin; font-weight:bold; position:relative; padding-left:1em; margin-bottom:.5vmin}
.admTable .caption .t1{ font-size:1.125em;}
.admTable .caption:before{ content:""; position:absolute; left:0; top:50%; transform:translateY(-50%) rotate(45deg); width:.75em; height:.75em; border-radius:50%; background:var(--siteC)}

.admTableW{ display:flex; flex-direction:column; gap:2vmin}
.admTableW:not(:first-child){ margin-top:6vmin}

.tableSummary{ display:flex; align-items:center}
.tableSummary.vb{ align-items:flex-end}
.tableSummary:first-child{ margin-top:0}
.tableSummary .mgL{ margin-left:auto}
.tableSummary .total{  position:relative; display:flex; align-items:center; gap:1em}
.tableSummary .total .t1{flex:1; min-width:0}
.tableSummary .total .t1 .point{ font-weight:800; font-size:1.25em; margin:0 .2vmin}
.tableSummary .total:before{ content:"\f160"; font-family:fontello; box-sizing:border-box; width:4vmin; height:4vmin; bordre-radius:50%; border:1px solid #ddd; display:flex; align-items:center; justify-content:center; font-size:1.5vmin; border-radius:50%; line-height:1}

.admFilter{ border-radius:1vmin; padding:1vmin 2vmin; box-shadow:0 0 1vmin rgba(0,0,0,.1); display:flex; flex-direction:column; gap:1vmin; background:var(--siteCL)}
.admFilter .wrapIn{ display:flex;}
.admFilter .wrapTit{ display:flex; align-items:center; font-size:1.6vmin; gap:1vmin; width:16vmin}
.admFilter .wrapTit .t1{ font-weight:700}
.admFilter .wrapTit .ico{ font-size:1.25em}
.admFilter .wrapList{ display:flex; gap:1vmin; flex-wrap:wrap; flex:1; min-width:0}
.admFilter .wrapList > li.grow{ flex:1}
.admFilter .wrapList > li.grow.fix1{ max-width:25vmin}

.admProdList{ display:flex; align-items:center; gap:1vmin; box-sizing:border-box; width:100%; padding: 0.5em 0;}
.admProdList:last-child { border-bottom:none}
.admProdList .imgW{ width:8vmin}
.admProdList .imgW.w1{ width:12vmin}
.admProdList .conW{ flex:1; min-width:0; display:flex; flex-direction:column; gap:.5vmin}
.admProdList .conW:last-child { border-right:none;}
.admProdList .conW .tit1{ font-weight:700; font-size:1.7vmin}
.admProdList .conW .tit2{ font-weight:700; font-size:1.5vmin}
.admProdList .conW .cate1{ font-weight:700; color:var(--siteC)}
.admProdList .specSt{ width:55vmin; padding:1vmin 0}

.admVol{ display:flex; max-width:100%}
.admVol .st{ height:4vmin; border:1px solid var(--siteCD2); background:var(--siteCL1); box-sizing:border-box; text-align:center}
.admVol .st.inp{ border-left:none; border-right:none; font-weight:700; flex:1; min-width:0;}
.admVol .st.btn{ width:4vmin}
.admVol .st.btn.down .fi:before{ content:"\e81b"}
.admVol .st.btn.up .fi:before{ content:"\e819"}

.specSt{ display:flex; flex-wrap:wrap; gap:1.2vmin; font-size:1.4vmin; line-height:1.1}
.specSt > li{ width:calc(50% - 1vmin); display:flex; gap:2vmin}
.specSt > li.w100{ width:100%}
.specSt > li .tit{ width:8vmin; position:relative; padding-right:2vmin; box-sizing:border-box}
.specSt > li .tit:after{ content:":"; position:absolute; right:0; top:50}
.specSt > li .tit .t1{ font-weight:700}
.specSt > li .tt{ flex:1; min-width:0}
.specSt > li .tt .t1{ font-weight:700; opacity:.7}
.specSt > li .tt .t2{ font-weight:700; color:var(--siteC)}

.admNocon { color: #777; display: flex; align-items: center; justify-content: center; gap: .5em; height:100%}
.admNocon:before { content: "\f394"; font-family: fontello; font-size: 2em}

.adm_tit1 { font-weight: 700; font-size: 1.5em}
.adm_tt1 { font-weight: 700; font-size: 1.375em}

.popMenu .popMenuCon { position: fixed; color: #111; background: #fff; display: none; box-shadow: .25em .25em 1em rgba(0, 0, 0, .1); border-radius: .5em; z-index: 10}
.popMenu .popMenuCon .menu_div { padding: .5em 0}
.popMenu .popMenuCon .menu_div:not(:last-child) { border-bottom: 1px solid #ddd}
.popMenu .popMenuCon .menu_div > li > .in { padding: .5em 1em; padding-right: 2em; display: flex; cursor: pointer}
.popMenu .popMenuCon .menu_div > li > .in:hover { background: #f1f1f1}
.popMenu .popMenuBtn { cursor: pointer}
.popMenu.menuOn .popMenuCon { display: block}
.popMenu.actOn { background: var(--siteC) !important; border-color: transparent; color: #fff}
.popMenu.actOn * { color: #fff !important}
.popMenu.actOn .popMenuCon * { color: #111 !important}
.popMenu.actOn .popMenuCon .siteC { color: var(--siteC) !important}

.bi { display: inline-flex; align-items: center; gap:.5vmin}
.bi .fi { font-size:1.6vmin; width:2vmin; text-align: center}
.bi .tt{ font-size:1.5vmin}
.bi.add .fi:before { content: "\f196"}
.bi.bookmark .fi:before { content: "\f043"}
.bi.bookmark.on .fi:before { content: "\f042"}
.bi.calc .fi:before { content: "\f1ec"}
.bi.card .fi:before { content: "\e89a"}
.bi.company .fi:before { content: "\ef20"}
.bi.cog .fi:before { content: "\ec53"}
.bi.copy .fi:before { content: "\eeca"}
.bi.delete .fi:before { content: "\f147"}
.bi.ess .fi:before { content: "\f338"; color: var(--siteC); font-size: .5em; vertical-align: super}
.bi.manager .fi:before { content: "\e809"}
.bi.modify .fi:before { content: "\f393"}
.bi.more .fi:before { content: "\e94a"}
.bi.print .fi:before { content: "\f078"}
.bi.pOk .fi:before { content: "\f06d"}
.bi.pClose .fi:before { content: "\e922"}
.bi.refresh .fi:before { content: "\e867"}
.bi.search .fi:before { content: "\ee91"; transform: rotateY(180deg)}
.bi.sort .fi { transform: translateY(-.063em)}
.bi.sort .fi:before { content: "\e936"; transition: .3s}
.sortW.on .bi.sort .fi:before { transform: rotate(180deg)}
.sortW a { text-decoration: underline}
.bi.stamp .fi:before { content: "\ed5c"; font-size: 1.125em}
.bi.status .fi:before { content: "\ecd4"}
.bi.trash .fi:before { content: "\e83b"}
.bi.tel .fi:before { content: "\ef63"}
.bi.write .fi:before { content: "\ec19"}
.bi.download .fi:before { content: "\eb7c"}
.bi.upload .fi:before { content: "\eb7e"}
.bi.add .fi:before { content: "\e819"}
.bi.newwin .fi:before { content: "\f081"}
.bi.dot .fi:before { content: "\ee60"}
.bi.prev .fi:before { content: "\e85a"}
.bi.next .fi:before { content: "\e85b"}
.bi.logout .fi:before { content: "\f02c"}
.bi.pay .fi:before { content: "\ecd3"}
.bi.back .fi:before { content: "\edc3"}
.bi.cart .fi:before { content: "\eebb"}
.bi.newWin .fi:before { content: "\e980"}
.bi .fi.arrow{ margin-left:1vmin}
.bi .fi.arrow:before{ content: "\ee24"}
.bi .fi.arrow2:before{ content: "\e93f"}
.bi.delete2 .fi:before{ content:"\e83b"}

.biW { display: flex; align-items: center; gap:1vmin}
.biW.mgL{ margin-left:auto}
.biW.mgT{ margin-top:auto}
.biW .bi { padding:1vmin}

.icoSt{ display:flex; align-items:center; justify-content:center; width:4vmin; height:4vmin; border-radius:50%; border:1px solid transparent}
.icoSt .fi{ font-size:2.5vmin}
.icoSt.cart .fi:before{ content:"\eebb"}
.icoSt.wish .fi:before{ content:"\edaa"}
.icoSt.wish.on .fi:before{ content:"\eda9"}
.icoSt.wish.on .fi{animation: icoWishAni 1s; color: #F30}
.icoSt.plus .fi:before{ content:"\effb"}
.icoSt.delete .fi:before{ content:"\e83b"}
.icoSt.receipt .fi:before{ content:"\eb71"}
.icoSt.confirm .fi:before{ content:"\f06d"}
@keyframes icoWishAni {
80% { opacity:0; transform:scale(1.5)}
90% { transform:scale(1)}
100% {opacity:1; transform:scale(1)}
}

.inW{ display:flex; gap:.5vmin; flex-wrap:wrap; box-sizing:border-box; width:100%; align-items:center}
.inW.col{ flex-direction:column}
.inW.g1{ gap:1vmin}
.inW.g2{ gap:1vmin 4vmin}
.inW:not(.fix) > *{ flex:1}
.inW.hc{ justify-content:center}
.inW.hr{ justify-content:flex-end}
.inW .mgL{ margin-left:auto}
.inW .mgR{ margin-right:auto}
.inW .max1{ max-width:30vmin}
.inW .max2{ max-width:60vmin}
.inW .inTT{ color:#666}
.inW .w100{ flex:0 0 auto; box-sizing:border-box; width:100%}
.inW .wAuto{ flex:0 0 auto}
.inW .tt{ color:#777}

.inBox{ display:flex; flex-direction:column; align-items:center; gap:2vmin; border:1px solid #ddd; border-radius:1vmin; padding:4vmin}
.inBox.st1{ background:#f5f5f5; border:none; border-top:1px solid #111; border-radius:0 0 1vmin 1vmin}
.inBox > *{ width:100%; box-sizing:border-box}
.inBox.p1{ padding:6vmin 4vmin}
.inBox.bd0{ border:none}
.inBox .twrap .ico{ font-size:7vmin; color:#ccc}
.inBox .twrap{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:1vmin}
.inBox .twrap .t1{ font-weight:700; font-size:2.5vmin}
.inBox .twrap .t2{ color:#666; line-height:1.6}

.adm_con { padding: .75em 1em; box-sizing: border-box; width: 100%}
.adm_con.bd { border-bottom: 1px solid var(--siteC)}
.adm_con.mgT { margin-top: auto}
.adm_con.bg1 { background: #ccc}
.adm_con.bg2 { background: #f5f5f5}
.adm_con.round { border-radius: 1em 1em 0 0}
.adm_con.p1 { padding: 1em}
.adm_con.p2 { padding: .25em 1em}

.flexW { display: flex; flex-wrap: wrap; align-items: center; gap: .25em}
.flexW .br { width: 100%}
.flexW.hc { justify-content: center}
.flexW.hr { justify-content: flex-end}
.flexW.g0 { column-gap: 0}
.flexW.g1 { column-gap: 1em}
.flexW.g2 { column-gap: 2em}
.flexW .mgL { margin-left: auto}
.flexW .w1 { width: 10em}
.flexW .w100 { width: 100%}
.flexW .w25 { width: 25%}
.flexW .w33 { width: 33%}
.flexW .w45 { width: 45%}
.flexW .w49 { width: 49%}
.flexW .w50 { width: 50%}
.flexW .w_auto { flex: 1 1 0%; min-width: 0}

.adm_spec { display: flex; align-items: center; flex-wrap: wrap; gap: .5em 3em}
.adm_spec > li { position: relative}
.adm_spec > li.mgL { margin-left: auto}
.adm_spec.line > li:not(:last-child):before { content: ""; position: absolute; right: -1.5em; top: 50%; transform: translateY(-50%); width: 1px; height: 70%; background: rgba(0, 0, 0, .3)}

.adm_tab { display: flex; border-bottom: 1px solid var(--siteC); margin-bottom: -1px}
.adm_tab > li > a { height: 2.25em; box-sizing: border-box; display: flex; align-items: center; justify-content: center; background: #eee; color: #666; padding: 0 1.5em; font-weight: bold; font-size: 1.063em; position: relative}
.adm_tab > li > a:before { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 50%; background: rgba(0, 0, 0, .1)}
.adm_tab > li:first-child > a { border-top-left-radius: .5em}
.adm_tab > li:last-child > a { border-top-right-radius: .5em}
.adm_tab > li.on > a { background: var(--siteC); color: #fff; padding-right: 3em; } 
.adm_tab > li:last-child > a:before,
.adm_tab > li.on > a:before { display: none}
.adm_tab > li.on > a:after { content: "\e942"; font-family: fontello; position: absolute; right: 1em; top: 50%; transform: translateY(-50%)}

.adm_list { display: flex; flex-wrap: wrap; gap: .75em; box-sizing: border-box; width: 100%}
.adm_list > li { width: 19%; position: relative}
.adm_list > li .listIn { padding: .75em; border: 1px solid #ddd; border-radius: .5em}
.adm_list > li .hover_btn { position: absolute; left: 100%; top: 0; display: none}
.adm_list > li .hover_btn > li > a { color: #fff; width: 2em; height: 2em; display: flex; align-items: center; justify-content: center; background: var(--siteC)}
.adm_list > li .hover_btn > li:not(:last-child) > a { border-bottom: 1px solid rgba(255, 255, 255, .5)}
.adm_list > li .hover_btn > li:first-child > a { border-top-right-radius: .5em}
.adm_list > li .hover_btn > li:last-child > a { border-bottom-right-radius: .5em}
.adm_list > li:hover { z-index: 1}
.adm_list > li:hover .listIn { border-color: var(--siteC); border-top-right-radius: 0}
.adm_list > li:hover .hover_btn { display: block}

.adm_page_menu { display: flex; gap: .5em; flex-wrap: wrap; } 
.adm_page_menu > li { width: calc(50% - .25em)}
.adm_page_menu > li.w100 { width: calc(100% - .25em)}
.adm_page_menu > li > a { display: block; position: relative}
.adm_page_menu > li > a .in { position: relative; display: flex; align-items: center; gap: .25em; padding: .5em; box-sizing: border-box; height: 2.5em; border-radius: .5em; border: 1px solid #ddd; color: #777}
.adm_page_menu > li > a .ico { width: 1.25em; text-align: center; font-size: 1.5em; display: none}
.adm_page_menu > li > a .tt { font-weight: bold; font-size: 1.063em}
.adm_page_menu > li:not(.on):hover > a .in { box-shadow: 3px 3px 1px rgba(0, 0, 0, .2) inset}
.adm_page_menu > li.on > a .in { background: var(--siteC); color: #fff; border-color: rgba(255, 255, 255, .2)}
.adm_page_menu > li.on > a:before { content: ""; position: absolute; left: 3px; top: 3px; width: 100%; height: 100%; background: var(--siteC); border-radius: .5em; filter: brightness(0.8)}

.adm_note { display: flex; flex-direction: column; align-items: center; gap: 1em; padding: 2em}
.adm_note .ico { font-size: 5em; opacity: .1}
.adm_note .ico:before { content: "\e838"}

.adm_hover_st1 { border: 1px solid #DDD; overflow: hidden; border-radius: 1em; transition: .3s}
.adm_hover_st1:hover { border-color: var(--siteC); box-shadow: 0 0 1em rgba(0, 0, 0, .1)}
.adm_hover_st1:hover .hoverT { background: var(--siteC); color: #fff}

.admPs { margin-top: 2em}

.adm_main_memo { display: flex; flex-direction: column; gap: .5em}
.adm_main_memo > li { width: 100%}
.adm_main_memo > li > .wrap_in { border: 1px dashed var(--siteC); border-top-style: solid; border-radius: 0 0 1em 1em; overflow: hidden}
.adm_main_memo > li > .wrap_in .memo { padding: 1em}

.admCalendarTit { display: flex; align-items: center; gap: 1em}
.admCalendarTit .tit { font-weight: 800; font-size: 1.75em}
.admCalendarTit .bi .fi { width: 2em}
.admCalendarW { display: flex; flex-direction: column; flex: 1 1 0%; min-height: 0}
.admCalendar { display: flex; flex-wrap: wrap; border-top: 1px solid var(--siteC); position: relative}
.admCalendar:after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: var(--siteC)}
.admCalendar > li { width: 14.28%}
.admCalendar > li .in { display: flex; flex-direction: column; padding: .25em; box-sizing: border-box; border-bottom: 1px solid #ddd}
.admCalendar > li.titW .in { height: 2em; justify-content: center; padding: .5em; } 
.admCalendar > li.conW .in { height: 10vh}
.admCalendar > li.conW:not(.blank) .in { cursor: pointer}
.admCalendar > li.sun .in { color: #F30}
.admCalendar > li.sat .in { color: #09F}
.admCalendar > li .in .dateT { width: 2em; line-height: 2em; border-radius: 50%; text-align: center; font-weight: bold}
.admCalendar > li .in .dateC { padding: .5em}
.admCalendar > li.titW .in .dateT { font-weight: bold}
.admCalendar > li.today .in .dateT { background: var(--siteC); color: #fff}
.admCalendarW .admCalendarMemo { flex: 1 1 0%; min-height: 10em; position: relative; box-sizing: border-box}
.admCalendarW .admCalendarMemo:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--siteC); opacity: .1}
.admCalendarW .admCalendarMemo .wrap_in { position: relative; box-sizing: border-box; padding: .5em 0; min-height: 100%; border-radius: 0 0 .5em .5em}
.admCalendarW .dayList { display: flex; flex-direction: column; gap: .5em}
.admCalendarW .dayList > li { position: relative; padding-left: .625em}
.admCalendarW .dayList > li:before { content: "\ee60"; font-family: fontello; position: absolute; left: 0; top: 0; color: var(--siteC); transform: scale(1.2)}
.admCalendarW .dayListW { overflow: hidden}
.admCalendarW .dayListW > li { width: 46%; float: left; margin: .5em 2%; display: flex}
.admCalendarW .dayListW > li .day { width: 4em; font-size: 1.313em; font-weight: 800}
.admCalendarW .dayListW > li .dayList { flex: 1 1 0%; min-width: 0; padding-top: .125em}
.admCalendarW .dayListW > li .dayList > li { font-size: 1.188em; font-weight: 600; color: #666}

/**/
.orderTotal{ background:var(--siteCD3); border-radius:1vmin; padding:2vmin 4vmin; display:flex; justify-content:flex-end; align-items:center}
.orderTotal .ico{ padding-left:6vmin; position:relative}
.orderTotal .ico:before{ font-family:fontello; transform:translateX(-3vmin)}
.orderTotal .ico.plus:before{ content:"\e8c8"}
.orderTotal .ico.minus:before{ content:"\e8c9"}
.orderTotal .ico.eq:before{ content:"\e8ce"}

.orderStateWrap{ display:flex; justify-content:space-around; gap:3vmin}
.orderStateWrap .el{ width:9vmin; display:flex; flex-direction:column; align-items:center; gap:1vmin}
.orderStateWrap .el .icoW{ width:100%; border-radius:50%; background:var(--siteCD2); color:#fff; box-sizing:border-box; position:relative; border:2px solid transparent}
.orderStateWrap .el:not(:last-child) .icoW:after{ content:"\f28f"; font-family:fontello; position:absolute; right:-2vmin; top:50%; transform:translateY(-50%); color:#aaa}
.orderStateWrap .el .icoW .re{ display:flex; align-items:center; justify-content:center; flex-direction:column; gap:.5vmin}
.orderStateWrap .el .icoW .ico{ font-size:1.75em}
.orderStateWrap .el .icoW .tt_price{ font-size:1.25em}
.orderStateWrap .el .conW{ display:flex; flex-direction:column; gap:.5vmin; align-items:center; box-sizing:border-box; width:100%}
.orderStateWrap .el .conW .t1{ font-weight:bold; opacity:.6}
.orderStateWrap .el .conW .no{ padding:.2vmin 1vmin; background:#aaa; color:#fff; border-radius:2vmin}
.orderStateWrap .el.on{ cursor:pointer}
.orderStateWrap .el.on .icoW{ background:var(--siteC); border-color:var(--siteCD3)}
.orderStateWrap .el.on.on .conW .t1{ opacity:1}
.orderStateWrap .el.on:hover .conW .t1{ opacity:1; text-decoration:underline}

.login_label [type="radio"], span {vertical-align: middle;}
.login_label [type="radio"] { appearance: none;  border: max(2px, 0.1em) solid gray;  border-radius: 50%;  width: 1.25em;  height: 1.25em;transition: border 0.5s ease-in-out;margin-right: .3em;}
.login_label [type="radio"]:checked { border: 0.4em solid #5a69b8;  background: #fff;}
.login_label [type="radio"]:focus-visible { outline-offset: max(2px, 0.1em);  outline: max(2px, 0.1em) dotted tomato;}
.login_label [type="radio"]:hover { box-shadow: 0 0 0 max(4px, 0.2em) lightgray; cursor: pointer;}
.login_label [type="radio"]:hover + span {cursor: pointer;}
.login_label [type="radio"]:disabled { background-color: lightgray;  box-shadow: none;  opacity: 0.7;  cursor: not-allowed;}
.login_label [type="radio"]:disabled + span { opacity: 0.7;  cursor: not-allowed;}

/**/
.alert-popup { position: fixed; top: 10%; left: 50%; transform: translate(-50%, -50%); z-index: 9999; background-color: var(--siteC); box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); padding: 10px; border-radius: 8px; opacity: 0; animation-duration: 0.25s; animation-fill-mode: forwards; } 
.slide-in { animation-name: slide-in; } 
.slide-out { animation-name: slide-out; } 
@keyframes slide-in { 
0% { opacity: 0; transform: translate(-50%, -100%); } 

100% { opacity: 1; transform: translate(-50%, -50%); } 
}

@keyframes slide-out { 
0% { opacity: 1; transform: translate(-50%, -50%); } 

100% { opacity: 0; transform: translate(-50%, -100%); } 
}
.alert-popup p { font-size: .875em; font-weight: bold; text-align: center; color:#fff; } 

.vgap0{gap:0 !important;}

/* popup join request */
.join_request_pop {width: 100%; height: 100%;}
.join_request_pop .popWrap {width: 100%;}

.join_request_pop .info_box {margin-top: 6em; background: #f4f4f4; padding: 1.5em; text-align: center;}
.join_request_pop .info_box .tt {font-size: 1.125em; font-weight: 600; line-height: 1.6; color:#111}
.join_request_pop .info_box .ico {font-size: 3em; margin-bottom: .5em; color: var(--siteBrandC);}
.join_request_form {margin-top: 2em; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 1em 0;}
.join_request_form li {margin-bottom: 1.5em;}
.join_request_form li:last-child {margin-bottom: unset;}

/* payment */
.payment_list {border-top: 2px solid #ddd; border-bottom: 2px solid #ddd; padding: 2em 0; gap: 1em;}
.payment_list li {border: 1px solid #ddd; border-radius: .5em; flex: 1 24%; max-width: 25%; overflow: hidden;}
.payment_list li .in {padding: 2em; font-size: 1.125em; font-weight: 600;}
.payment_list li .in .fi.arrow {}
.payment_list li .in .fi.arrow:before{ content: "\e93f"}

.payment_list li:hover .in {background: var(--siteC); color: #fff;}