.media-760,
.media-1080 {display: none;}

/*모바일 메뉴 마이페이지*/
.inner .top-local,
.inner .doc ul {display: grid; grid-template-columns: 1fr 1fr; gap: 0 5px; position: relative; z-index: 1;}
.inner .top-local li {display: inline-flex; justify-content: space-between; align-items: baseline; padding: 5px 10px;}
.inner .top-local li:nth-child(n+3):nth-child(-n+4) {border-bottom: 1px solid #eee; border-top: 1px solid #eee;}
.inner .top-local li p {font-size: 0.8rem; font-weight: bold;}
.inner .top-local li a span {font-size: 1rem; color: #ff0000; font-weight: bold; margin-right: 5px;}

.inner .doc ul {gap: 5px 10px;}
.inner .doc ul li {padding: 10px; border: 1px solid #eee0; margin-bottom: 5px; border-radius: 5px; position: relative; background-color: #fff;}
.inner .doc ul li::before {content: ""; position: absolute; width: calc(100% + 4px); height: calc(100% + 4px); left: -2px; top: -2px; background: #bbb; background: linear-gradient(45deg, #eee 40%, #ddd 60%); border-radius: 5px; z-index: -1; animation: bg-move 6.5s infinite;}
.inner .doc:nth-child(2) ul li:before {background: linear-gradient(45deg, #ddd 40%, #eee 60%);}
.inner .doc ul li a {width: 100%; display: inline-block;}
.inner .doc ul li a::before {display: inline-block; content: ""; background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23bbb' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/></svg>"); background-repeat: no-repeat; background-size: 1rem 1rem; width: 16px; height: 16px; position: absolute; right: 10px;}



/*마이페이지 서브메뉴*/
.sub-menu-m,
.mypage-menu.sub-m {display: none;}
.mypage-menu {max-width: 280px; max-height: calc(100vh - 220px); overflow-y: auto; width: 100%; height: fit-content; padding: 10px; margin: 15px 20px 0 0; background-color: #fff; border-radius: 8px; overflow-x: hidden; box-shadow: 20px 0px 20px -20px #e74c326b; position: sticky; top: 200px;}
.my-menu-box {padding: 5px 0;}
.my-menu-box.radius {border: 1px solid #eee; border-radius: 5px; padding: 5px 15px; margin-bottom: 5px;}
.my-menu-box .pe-2 {color: #006666; font-weight: bold; min-width: 75px;}
.mypage-menu .info_p.in-style {flex-direction: row; border-bottom: none;}
.mypage-menu .info_p.in-style img {width: 35px;}
.mypage-menu .info_p.in-style p {text-align: left;} .my-menu-box .btn-set .btn {font-size: 13px;}
.mypage-menu .btn-toggle {width: 100%; text-align: center;}
.mypage-menu .btn-toggle button {font-size: 13px;}

.b-solid {border-bottom: 1px solid #d9d9d9; margin: 5px 0 10px; padding: 0 !important;}
.t-solid {border-top: 1px solid #eee;}
.mw1280 {max-width: 1280px; margin: 10px auto;}
.c-006666 {color: #006666; font-size: 16px; font-weight: bold; margin: 0 5px;}
.c-ff0000 {color: #ff0000; font-size: 16px; font-weight: bold; margin: 0 5px;}

.inner2-span {max-width: calc(100% - 60px); display: block;}
.top_banner {width:100%; height:auto;}
.top_banner img {height: auto !important;}
.top_banner p{font-size:45px; color:#fff; font-weight:bold; text-align:center; padding:55px 0;}
.top_banner p span{display:block; font-size:20px; color:#fff; font-weight:300;}
.tree_doc02.mw1280 {position: sticky; top: 115px; background-color: #fff; z-index: 10;}
.tree_doc02 span {padding: 5px 0;}
.company_area .agree_layout{margin:0 0 30px !important;}
.money_list{width:100%; margin: 20px auto;}
.money_list ul:after{content:''; display:table; clear:both;}
.money_list ul{width:100%; clear:both; padding-left: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 4rem;}
.money_list ul li{float:left;}
.money_list ul li img{width:100%;}
.money_list ul li:nth-child(12n){margin-right:0;}
.money_list ul li a dl dt{font-weight:300; text-align:center; line-height:17px; margin-top:10px;}
.money_list ul li a dl dt span{display:block; padding:3px 0; font-weight:normal; color:#333;}
.money_list ul li a dl dd div.btn {display:block; margin:0 auto; letter-spacing:0; text-align:center; padding:8px 12px; color:#333; font-size: 0.85rem; border-bottom: 1px solid #8b979f; border-radius: 0; position: relative;}
.money_list ul li a dl dd div.btn::before {content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 0; transition: 0.4s; background-color: #212529;}
.money_list ul li a dl dd div.btn.vip {background-color: #fbd5e1; color: #E7205F; border-bottom-color: #E7205F;}
.money_list ul li a dl dd div.btn.vvip {background-color: #fbedc1; color: #BB8C37; border-bottom-color: #BB8C37;}
span.save{width:40px; position:relative;}

.money_list ul li a dl dd div.btn span {position: relative; z-index: 1;}
.money_list ul li a:hover dl dd div.btn::before {height: 100%;}
.money_list ul li a:hover dl dd div.btn span {color: #fff;}
.money_list ul li a:hover dl dd div.btn.vip::before {background-color: #E7205F;}
.money_list ul li a:hover dl dd div.btn.vvip::before {background-color: #BB8C37;}

span.save button{width:50px;}
span.save img{display:block; margin:0 auto; margin-top:5px;}
span.save02 {float:right; padding:5px 8px; border:1px solid #ddd; font-size:17px;}
.input-number{width:52px; display:block; margin:10px auto; height:28px; position:relative;}
.input-number input{margin:0px; text-indent:0px;}
.input-number .text{width:30px; height:27px; margin-left:5px; line-height:25px; border:1px solid #ddd;}
.input-number02 .text{width:30px; height:27px; margin-left:0px; line-height:25px; padding:0 10px; border:1px solid #ddd;}
.input-number a{display:block;}
.input-number .up,
.input-number .down { position:absolute; right:0; bottom:0; width:13px; height:13px; overflow:hidden; white-space:nowrap; font-size:0; letter-spacing:-100px; text-indent:0; line-height:0; border:0 solid #dbdbdb; border-width:1px; background:#fff url("/GHS/images/mart/btn/btn-e-number.gif") 50% 100% no-repeat; }
.input-number .up { top:0;  background-position:50% 0; }
.input-number .up{background:#fff url("/public/_img/btn-e-number.gif") 50% 0 no-repeat !important;}
.input-number .down{background:#fff url("/public/_img/btn-e-number.gif") 50% 100% no-repeat !important;}
.subject03 h3 {padding: 0;}

.money_list.charge ul li {padding: 5px; border-radius: 6px;}
.money_list.charge ul li dl {margin: 0; border-radius: 6px; flex-direction: column-reverse;}
.money_list.charge ul li dl dt {margin-top: 0;}
.money_list.charge ul li dd {width: 100%;}
.money_list.charge ul li dl dd a.btn {letter-spacing:0;}
.money_list.charge .org {color: #888;}

ul.charge-order {border-radius: 6px; border: 1px solid #eee; padding: 10px;}
ul.charge-order li del {color: #888;}
ul.charge-order li span {color: #e02f30; font-weight: bold; font-size: 16px;}
ul.payment {background-color: #f9f9f9; border-radius: 6px; padding: 10px;}
ul.payment input[type=radio] {accent-color: #669f24;}

/*보유장비*/
.ul-box {/*max-height: calc(100vh - 360px); overflow-y: auto;*/ background-color: #fff; border-radius: 5px;}
.grid-table.my-equipment {display: grid; grid-template-columns: 60px 70px 70px 0.4fr 1fr 150px 100px 100px 100px 100px 100px;}
.grid-table.my-equipment .grid-title {position: sticky; top: 0; background-color: #f4f4f4; z-index: 3;}
.grid-table.my-equipment .grid-title::before {content: ""; position: absolute; background-color: #fff; top: -20px; left: -1px; width: calc(100% + 2px); height: 19px; z-index: -1;}
.grid-table.my-equipment li {border: 1px solid #eee; margin: -1px -1px 0 0; text-align: center; padding: 5px; align-content: center; position: relative;}

/*가짜요소 테두리*/
.grid-table.my-equipment li.total .virtual {position: absolute; width: 1280px; height: calc(100% - 2px); transform: translateX(calc(100% - 1280px)); top: 1px; left: calc(-100%* 9 + 10px); z-index: 1;}
.grid-table.my-equipment li.total .virtual::before {content: ""; width: 100%; height: 100%; display: inline-block;  position: absolute; left: 0; border: 2px solid #00666600;}
.grid-table.my-equipment li.total .virtual:hover::before {border: 1px solid #006666;}
.grid-table.my-equipment li a.btn {position: relative; z-index: 2;}

.grid-table.my-equipment li.non_total {display: none;}
.grid-table.my-equipment li p.return {margin-top: 5px; color: #0d6efd; font-weight: bold;}


@media screen and (max-width: 1280px) {
	.mypage-menu {max-width: 240px;}
	.mypage-menu > div .btn-set .btn {padding: .375rem;}

	.grid-table.my-equipment li.total .virtual {width: 150vw; left: -90vw; transform: unset;}

	span.inner2-span,
	.inner2 .box-pay,
	ul.charge-order,
	ul.payment,
	#pay_type_txt {margin: 0 10px;}
	.money_list ul {margin: 0 10px; width: auto;}
	ul.payment {margin-top: 10px;}
}

@media screen and (max-width: 1080px) {
	.sub-menu-m,
	.m-hide {display: block;}
	
	.sub-menu-m {position: absolute; right: -20px; border-radius: 5px 0 0 5px;}

	.tree_doc02.mw1280 {align-items: flex-end; top: 170px;}
	.tree_doc02.mw1280 > div.flex {max-width: calc(100% - 300px);}

	.mypage-menu.sub-m {display: block;}
	.mypage-menu {border-color: #555; background-color: #fff; border-radius: 5px 0 0 5px; padding: 5px 10px 5px 20px; margin: 0; cursor: pointer;}
	.mypage-menu::before {content: ""; position: absolute; width: 8px; height: 100%; background-color: #555; left: 0; top: 0; border-radius: 5px 0 0 5px;}
	.mypage-menu::after {content: ""; position: absolute; width: calc(100% - 5px); height: 100%; border-top: 1px solid #555; border-bottom: 1px solid #555; left: 5px; top: 0; z-index: -1;}
	.mypage-menu .info_p.in-style p {padding-right: 0 !important;}
	.company_area {width: 100%;}
	.mypage-menu div .pe-2 {min-width: 45px;}
	.sub-tog {display: none;}

	.company_area .agree_layout {margin: 0 0 30px !important;}
	.money_list ul {grid-template-columns: repeat(3, 1fr);}

	/* .ul-box {max-height: calc(100vh - 480px);} */

	/* ul.grid-table.my-equipment {grid-template-columns: 60px 70px 70px 85px 1fr 50px 50px 80px 80px 80px 60px;} */
	ul.grid-table.my-equipment {grid-template-columns: 0.5fr 1fr 65px 0.2fr;}
	ul.grid-table.my-equipment .grid-title .w-50 {width: 50%; text-align: center; border-top: 1px solid #eee;}
	ul.grid-table.my-equipment .grid-title .w-50:first-child {border-right: 1px solid #eee;}
	ul.grid-table.my-equipment .mt-2 .w-50 {width: 50%; text-align: center;}
	ul.grid-table.my-equipment li.flex.justify-center.f-align-center {flex-direction: column;}
	ul.grid-table.my-equipment li.relative {position: relative; padding-top: 20px;}
	ul.grid-table.my-equipment li .absolute {position: absolute; top: 2px; left: 2px;}
	ul.grid-table.my-equipment li p.absolute {background-color: #232323; color: #fff; border-radius: 3px; padding: 2px 4px; min-width: 30px;}
	.my-equipment2 .relative {position: relative; padding-top: 20px;}
	.my-equipment2 .absolute {position: absolute; top: 2px; left: 2px; background-color: #232323; color: #fff; border-radius: 3px; padding: 2px 7px;}

	.media-1080 {display: flex; justify-content: center;}
	.pc-1080 {display: none;}
}

@media screen and (max-width: 760px) {
	.media-760 {display: flex; justify-content: center;}
	.pc-760 {display: none;}

	.payment > div.flex {flex-wrap: wrap;}
	.payment > div.flex label {width: calc(100% / 3);}
	.money_list ul {grid-template-columns: repeat(2, 1fr); gap: 5px;}

	/* .ul-box {max-height: calc(100vh - 520px);}  */
}

@media screen and (max-width: 650px) {
	.tree_doc02.mw1280 {top: 160px;}
	.tree_doc02.mw1280 > div.flex {max-width: calc(100% - 60px);}
	.tree_doc02.mw1280 {margin: 10px auto;}
}

@media screen and (max-width: 620px) {
	.tree_doc02 {align-items: flex-start;}
	#pay_type_txt,
	#pay_type_txt span {font-size: .85rem !important;}
}

@media screen and (max-width: 520px) {
	.payment > div.flex label {width: calc(100% / 2);}

	.money_list ul li dl dd a.btn {padding: 8px;}
}

@media screen and (max-width: 420px) {
	.check span.inner2-span {margin: 60px 10px; max-width: unset;}
}