@charset "UTF-8";
:root {
	/* Colors */
	--white:#fff; 
	--black: #000000;
	--gray130: #011327;
	--gray120: #292e41;
	--gray110: #373f57;
	--gray100: #475067;
	--gray90: #5c667b;
	--gray80: #67738e;
	--gray70: #8491a7;
	--gray60: #96A0B5;
	--gray50: #b4c0d3;
	--gray40: #d7dce5;
	--gray30: #e4e7ee; /*border*/
	--gray20: #eff2f8;
	--gray10: #f8fafc;
	--main10: #EDF7FF;
	--main20: #C5E5FF;
	--main30: #91CAFF;
	--main40: #69B1FF;
	--main50: #4096FF;
	--main60: #1677FF; /*main*/
	--main70: #0958D9;
	--main80: #003EB3;
	--main90: #002C8C;
	--main100: #001D66;
	--main110: #00113D;
	--system-red10: #FBEFF0;
	--system-red20: #F5D6D9;
	--system-red30: #FFB7BC;
	--system-red40: #FB8992;
	--system-red50: #FD6672;
	--system-red60: #F04452; /*red-main*/
	--system-red70: #AB2B36;
	--system-red80: #7A1F26;
	--system-red90: #521419;
	--system-red100: #310C0F;
	--system-red110: #21080A;
}




/*  ==========================
Common
=========================== */
body {
	background: var(--gray30);
}
.wrap {
	position: relative;
	width:100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

/*  ==========================
웹 배너
=========================== */
.web-banner-wrap {
	position: fixed;
	left:calc(50% - 650px);
	width:320px;
	height: 460px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	font-size:15px;
	font-weight: 500;
	color:var(--gray70);
    top: 50%;
    transform: translateY(-50%);
}
.web-banner-wrap .logo {
	width:118px;
	display: block;
	margin-bottom:30px;
}
.web-banner-wrap .main-txt {
	font-size:30px;
	font-weight: 700;
	line-height: 135%;
	color:var(--gray130);
}
.web-banner-wrap .qr-group .txt {
	font-size:18px;
	font-weight: 600;
	margin-bottom:6px;
	display: block;
	color:var(--gray130);
}
.web-banner-wrap .qr-group .sub-txt {
	display: flex;
	align-items: center;
	gap:8px;
	font-size:16px;
	font-weight: 400;
	color:var(--gray80);
}
.web-banner-wrap .qr-group .sub-txt .icon-down {
	width:16px;
	height: 16px;
	display: block;
	background: url(../images/phone/icon-arrow-right-gray.svg);
	background-size:100%;
	transform: rotate(-90deg);
}
.web-banner-wrap .qr-box {
	width:120px;
	height: 120px;
	border-radius: 12px;
	background: #fff;
	padding:16px;
	margin-top:24px;
}


@media (max-width: 1320px) {
	.web-banner-wrap {
		display: none;
	}
}



/*  ==========================
스플래시
=========================== */
.mobile-wrap.splash-wrap {
	width:100%;
	height: 100vh;
	background: var(--main60);
	display: flex;
	align-items: center;
	justify-content: center;
}
.mobile-wrap.splash-wrap h2 {
	width:112px;
	height: 36px;
}




/*  ==========================
메인
=========================== */
.mobile-wrap {
	width:100%;
	min-height: 100vh;
	max-width:560px;
	background: #fff;
	position: relative;
}
.mobile-wrap.tabbar-on {
	padding-bottom:84px;
}
.mobile-wrap {
	padding-bottom:30px;
}



/*  ==========================
마이메뉴 메인
=========================== */
.mymenu-wrap .top-group {
	padding:0 20px;
	position: relative;
}
.mymenu-wrap .top-group .welcome-area {
	font-size:22px;
	line-height: 135%;
	font-weight: 600;
	margin-top:-26px;
	color:var(--gray130);
	position: relative;
}
.mymenu-wrap .top-group .mail {
	font-size:13px;
	color:var(--gray80);
	display: block;
	margin-top:8px;
}
.mymenu-wrap .menu-list li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 54px;
	font-size:16px;
	font-weight: 400;
	padding:0 20px;
}
.mymenu-wrap .menu-list li a:hover .label {
	text-decoration: underline;
}
.mymenu-wrap .menu-list li a .arrow {
	display: flex;
	align-items: center;
	gap:10px;
}
.mymenu-wrap .menu-list li a .arrow i {
	display: block;
	width:12px;
	height: 12px;
	background: url("../images/phone/icon-arrow-gray.svg") no-repeat center;
	background-size:100%;
	transform: rotate(180deg);
}
.mymenu-wrap .menu-list li a .arrow .txt {
	font-size:16px;
	font-weight: 700;
}
.mymenu-wrap .menu-list .label {
	display: flex;
	align-items: center;
	gap:12px;
}
.mymenu-wrap .menu-list .label i {
	width:20px;
	height: 20px;
	display: block;
}
.mymenu-wrap .menu-list .point .label i {
	background: url("../images/phone/icon-point-color.svg") no-repeat center;
	background-size:100%;
}
.mymenu-wrap .menu-list .logout .label i {
	background: url("../images/phone/icon-logout.svg") no-repeat center;
	background-size:100%;
}
.mymenu-wrap .menu-list .review .label i {
	background: url("../images/phone/icon-review.svg") no-repeat center;
	background-size:100%;
}
.mymenu-wrap .menu-list .comment .label i {
	background: url("../images/phone/icon-comment.svg") no-repeat center;
	background-size:100%;
}
.mymenu-wrap .menu-list .edit .label i {
	background: url("../images/phone/icon-setting.svg") no-repeat center;
	background-size:100%;
}
.mymenu-wrap .menu-list .alarm .label i {
	background: url("../images/phone/icon-bell-ringing.svg") no-repeat center;
	background-size:100%;
}
.mymenu-wrap section:nth-of-type(1) {
	padding-bottom:20px;
	border-bottom:8px solid var(--gray20);
}
.mymenu-wrap section:nth-of-type(1) .menu-list {
	padding:5px 0;
}
.mymenu-wrap section:nth-of-type(2) .menu-list {
	padding:16px 0;
}
.mymenu-wrap .banner-mall {
	padding:0 20px;
}
.mymenu-wrap .banner-mall > a {
	background-color: #E2F2FF;
	border-radius: 12px;
	padding:0 24px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content:space-between;
	transition-duration:0.1s;
	transition-timing-function:ease;
	position: relative;
}
.mymenu-wrap .banner-mall .txt-group span:first-child {
	display: block;
	font-size:16px;
	font-weight: 600;
	line-height: 135%;
	margin-bottom:6px;
}
.mymenu-wrap .banner-mall .txt-group span.btn {
	font-size:12px;
	color:var(--gray80);
	display: flex;
	align-items: center;
	gap:2px;
}
.mymenu-wrap .banner-mall .txt-group span.btn i {
	width:12px;
	height: 12px;
	background: url("../images/phone/icon-arrow-gray.svg") no-repeat center;
	background-size:100%;
	transform: rotate(180deg);
}
.mymenu-wrap .banner-mall .img-group {
	height: 66px;
	width:80px;
}
.mymenu-wrap .banner-mall .img-group img {
	height: 66px;
	width:80px;
}


/*  ==========================
포인트내역
=========================== */
.point-list-wrap .point-total {
	margin:10px 20px 20px;
	border-radius: 8px;
	background: var(--gray20);
	padding:0 16px;
	height: 58px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.point-list-wrap .point-total .label {
	display: flex;
	align-items: center;
	gap:6px;
	font-size:15px;
	color:var(--gray110);
	font-weight: 500;
}
.point-list-wrap .point-total .label > i {
	width:24px;
	height: 24px;
	background: url("../images/phone/icon-point-color.svg") no-repeat center;
	background-size:100%;
}
.point-list-wrap .point-total .value {
	font-size:18px;
	font-weight: 700;
}
.point-list-wrap .point-list-group .fillter-area {
	margin:0 20px 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.point-list-wrap .point-list-group .fillter-area .day-select {
	display: flex;
	align-items: center;
	gap:10px;
}
.point-list-wrap .point-list-group .fillter-area .day-select select {
	font-size:16px;
	font-weight: 700;
	padding-right:20px;
	position: relative;
	background: url(../images/phone/icon-arrow-down-black.svg) rgba(255,255,255,1) no-repeat right center;
	background-size:16px;
	box-sizing: border-box;
	height: 30px;
}
.point-list-wrap .point-list-group .fillter-area .fillter-btn {
	display: flex;
	align-items: center;
	gap:4px;
	font-size:14px;
	font-weight: 400;
}
.point-list-wrap .point-list-group .fillter-area .fillter-btn i {
	width:16px;
	height: 16px;
	display: block;
	background: url("../images/phone/icon-filter.svg") no-repeat center;
	background-size:100%;
}
.point-list-wrap .point-list-group .list-area > li {
	width:100%;
	padding: 10px 20px;
	border-top:1px solid var(--gray30);
	display: flex;
	align-items:flex-start;
	gap:0px;	
}
.point-list-wrap .point-list-group .list-area li > .day {
	width:100px;
	font-size:14px;
	font-weight:500;
	color:var(--gray80);
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.point-list-wrap .point-list-group .list-area li > ul {
	width:calc(100% - 60px);
}
.point-list-wrap .point-list-group .list-area li li {
	display: flex;
	flex-direction: column;
	padding:8px 0;
	gap:4px;
}
.point-list-wrap .point-list-group .list-area li li > div:first-child {
	width:100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size:16px;
	font-weight: 400;
}
.point-list-wrap .point-list-group .list-area li li .point {
	font-weight: 600;
}
.point-list-wrap .point-list-group .list-area .under-info {
	display: flex;
	align-items: center;
	gap:8px;
	font-size:14px;
}
.point-list-wrap .point-list-group .list-area .under-info .time {
	color:var(--gray70);
}
.point-list-wrap .point-list-group .list-area .save .under-info .status,
.point-list-wrap .point-list-group .list-area .save .point {
	color:var(--main60);
}
.point-list-wrap .point-list-group .list-area .cancel .point {
	color:var(--gray60);
	text-decoration:line-through;
}
/*empty 화면*/
.point-list-wrap .point-list-group .empty-group {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap:16px;
	font-size:15px;
	color:var(--gray60);
	padding-top:120px;
	border-top:1px solid var(--gray30);
}
.point-list-wrap .point-list-group .empty-group img {
	width:80px;
}

/* 포인트코드 */
.btn-point-code{
	min-width:80px;
	height:34px;
	padding:0 10px;
	border:1px solid #ddd;
	font-size:10px;
	border-radius:6px;
	background:#4f46e5;
	font-size:13px;
	color:#fff;
	
	cursor:pointer;
}


.point-banner{
	padding:0 22px 10px 22px;
	display:flex;
	align-items:center;
	gap:10px;
}

.point-banner .btn-group2{
	margin-left:auto;
	display:flex;
	gap:6px;
}

.point-banner .txt{
	flex:1;
}


.btn-point-code:hover{
	background:#4338ca;
}

#giftCodeInput{
	width:100%;
	height:50px;
	font-size:17px;
	text-align:center;
	letter-spacing:2px;
	font-weight:600;

	border:2px solid #4f46e5;
	border-radius:8px;

	padding:10px;
}

#giftCodeInput:focus{
	border-color:#4f46e5;
	box-shadow:0 0 0 2px rgba(79,70,229,0.15);
	outline:none;
}


.point-code-wrap{
	display:flex;
	flex-direction:column;
	align-items:center;
}

.point-code-top{
	margin-bottom:18px;
}

.point-code-badge{
	display:inline-block;
	padding:4px 10px;
	border-radius:999px;
	background:#f3f6fb;
	color:#4b5a6a;
	font-size:11px;
	font-weight:700;
	letter-spacing:0.8px;
	margin-bottom:10px;
}

.point-code-title{
	font-size:20px;
	font-weight:700;
	color:#111;
	line-height:1.3;
	margin-bottom:8px;
}

.point-code-desc{
	font-size:13px;
	color:#777;
	line-height:1.6;
	word-break:keep-all;
}

.point-code-box{
	width:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:14px 14px;
	border:1px solid #ececec;
	border-radius:14px;
	background:#fafafa;
	margin-bottom:18px;
}

.point-code-value{
	font-size:22px;
	font-weight:800;
	letter-spacing:1.2px;
	color:#111;
	line-height:1;
	word-break:break-all;
}

.btn-copy-code{
	height:34px;
	padding:0 12px;
	border:1px solid #dcdcdc;
	border-radius:8px;
	background:#fff;
	font-size:12px;
	font-weight:600;
	color:#333;
	flex-shrink:0;
}

.point-code-qr-box{
	display:flex;
	align-items:center;
	justify-content:center;
	width:220px;
	height:220px;
	padding:12px;
	border:1px solid #f0f0f0;
	border-radius:18px;
	background:#fff;
	box-shadow:inset 0 0 0 1px #fafafa;
	margin-bottom:14px;
}

.point-code-qr-box img{
	display:block;
	width:180px;
	height:180px;
	object-fit:contain;
}

.point-code-guide{
	font-size:12px;
	color:#888;
	line-height:1.5;
	word-break:keep-all;
}

.point-code-modal .modal-content{
	border:0;
	border-radius:18px;
	overflow:hidden;
	box-shadow:0 12px 40px rgba(0,0,0,0.15);
}

.point-code-modal .modal-header{
	padding:16px 18px;
	border-bottom:1px solid #f1f1f1;
	background:#fff;
}

.point-code-modal .modal-title{
	font-size:17px;
	font-weight:700;
	color:#111;
}

.point-code-modal .close{
	padding:0;
	margin:0;
	font-size:24px;
	font-weight:300;
	color:#888;
	opacity:1;
	outline:none;
}

.point-code-modal .modal-body{
	padding:10px 10px 10px 10px;
	background:#fff;
	text-align:center;
	min-height:420px;
	display:flex;
	flex-direction:column;
	justify-content:center;
}

.point-code-modal .modal-dialog{
	max-width:420px;
	width:calc(100% - 24px);
	margin:10px auto !important;
}

.point-code-modal .modal-footer{
	padding:0 20px 20px;
	border-top:0;
	background:#fff;
	display:flex;
	justify-content:center;
}

.point-code-modal .btn-light{
	min-width:90px;
	height:38px;
	border:1px solid #e3e3e3;
	border-radius:10px;
	background:#f8f8f8;
	color:#333;
	font-size:13px;
	font-weight:600;
}

/* 모바일에서 조금 더 안정적으로 */
@media (max-width: 480px){
	.point-code-modal .modal-dialog{
		max-width:calc(100% - 24px);
		margin:10px auto;
	}

	.point-code-title{
		font-size:18px;
	}

	.point-code-value{
		font-size:19px;
	}

	.point-code-qr-box{
		width:200px;
		height:200px;
	}

	.point-code-qr-box img{
		width:160px;
		height:160px;
	}
}



/*  ==========================
문의 및 답변내역
=========================== */
.enquire-wrap .accordion {
	border-bottom:1px solid var(--gray30);
	padding:0 20px;
}
.enquire-wrap .accordion .accordion-btn {
	display: flex;
	align-items: flex-start;
	padding:16px 0;
	justify-content: space-between;
	cursor: pointer;
}
.enquire-wrap .accordion .accordion-btn:hover .tit {
	text-decoration: underline;
}

.enquire-wrap .accordion .accordion-btn > div:first-child {
	width:calc(100% - 74px);
}
.enquire-wrap .accordion .accordion-btn .tag-group {
	height: 22px;
	padding:0 6px;
	border-radius: 3px;
	background:var(--main60);
	font-size:12px;
	font-weight: 600;
	color:var(--white);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top:1px;
}
.enquire-wrap .accordion .accordion-btn .tag-group.end {
	background:var(--gray30);
	color:var(--gray100);
}
.enquire-wrap .accordion .accordion-btn .tit {
	width:100%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	word-break: break-all;
	display: block;
	font-size:16px;
	font-weight: 400;
	margin-bottom:4px;
}
.enquire-wrap .accordion .accordion-btn .date {
	font-size:13px;
	color:var(--gray70);
	display: block;
}

.enquire-wrap .accordion.active .accordion-btn {
	padding-bottom:12px;
}
.enquire-wrap .accordion.active .accordion-btn .tit {
	white-space: unset;
}
.enquire-wrap .hide-content {
	padding-bottom:20px;
}
.enquire-wrap .hide-content .q {
	font-size:14px;
	color:var(--gray100);
	margin-bottom:16px;
	display: block;
}
.enquire-wrap .hide-content .reply {
	color:var(--gray100);
	font-size:14px;
	border-radius: 4px;
	background: var(--gray20);
	padding:12px 16px;
	display: flex;
	gap:6px;
	flex-direction: column;
}
.enquire-wrap .hide-content .reply .name {
	font-weight: 600;
	color:var(--main60);
}



/*  ==========================
알림설정
=========================== */
.alarm-setting-wrap {
	padding:0 20px;
}
.alarm-setting-wrap li {
	padding:18px 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom:1px solid var(--gray30);
}
.alarm-setting-wrap li:last-child {
	border-bottom:none;
}
.alarm-setting-wrap li .label {
	font-size:16px;
	font-weight: 600;
	margin-bottom:4px;
}
.alarm-setting-wrap li .txt {
	font-size:13px;
	color:var(--gray70);
}



/*  ==========================
회원정보 수정
=========================== */
.profile-edit-wrap {
	padding:0 20px;
}
.profile-edit-wrap > div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding:12px 0;
	border-bottom:1px solid var(--gray30);
}

.profile-edit-wrap .value {
	font-size:16px;
	font-weight: 400;
	position: relative;
	display: flex;
	align-items: center;
	gap:6px;
}
.profile-edit-wrap .value i:not(.sns-i) {
	display: block;
	width:16px;
	height: 16px;
	background: url("../images/phone/icon-arrow-gray.svg") no-repeat center;
	background-size:100%;
	transform: rotate(180deg);
}
.profile-edit-wrap div .label {
	font-size:16px;
	font-weight: 400;
	color:var(--gray90);
}
.profile-edit-wrap .value .sns-i {
	width:20px;
	height: 20px;
	display: block;
	margin-right:2px;
}
.profile-edit-wrap .value .sns-i.naver {
	background: url("../images/phone/icon-sns-naver.svg") no-repeat center;
	background-size:100%;
}
.profile-edit-wrap .value .sns-i.kakao {
	background: url("../images/phone/icon-sns-kakao.svg") no-repeat center;
	background-size:100%;
}
.profile-edit-wrap .value .sns-i.google {
	background: url("../images/phone/icon-sns-google.svg") no-repeat center;
	background-size:100%;
}

/* input 스타일 */
.profile-edit-wrap .form-control {
	width:100%;
	max-width:240px;
	padding:8px 10px;
	font-size:14px;
	border:1px solid #ddd;
	border-radius:6px;
	background:#fafafa;
}

.profile-edit-wrap .form-control:focus {
	outline:none;
	border-color:#333;
	background:#fff;
}

/* label 오른쪽 영역 */
.profile-row .address-wrap{
	flex:1;
	display:flex;
	flex-direction:column;     /* 세 줄 */
	align-items:flex-end;      /* ⭐ 우측 정렬 핵심 */
}

/* 각 줄 */
.profile-row .address-line{
	width:100%;
	max-width:260px;           /* 기존 input 폭 맞춤 */
	display:flex;
	justify-content:flex-end;  /* 버튼 포함 우측 */
	margin-top:6px;
}

.profile-row .address-line:first-child{
	margin-top:0;
}

/* 주소찾기 버튼 */
.profile-row .btn-address{
	margin-left:6px;
	white-space:nowrap;
}


/*  ==========================
로그인
=========================== */
.mobile-wrap.login {
	padding-bottom:0px;
}
.login-wrap {
	width:100%;
	padding:0 20px;
	height: calc(100vh - 56px);
}
.login-wrap .text-group {
	padding:50px 20px 0;
}
.login-wrap .text-group .txt {
	font-size:22px;
	font-weight: 500;
	line-height: 145%;
	margin-bottom:20px;
}
.login-wrap .text-group h2 {
	width: 118px;
	height: 38px;
}
.login-wrap .bottom-btn-group {
	display: flex;
	gap:12px;
	flex-direction: column;
	position: absolute;
	bottom:74px;
	width:calc(100% - 40px);
}
.login-wrap .bottom-btn-group button {
	width:100%;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap:10px;
	font-size:15px;
	font-weight: 600;
	height: 50px;
	transition-duration:0.1s;
	transition-timing-function:ease;
}
.login-wrap .bottom-btn-group button i {
	width:18px;
	height: 18px;
	display: block;
}
.login-wrap .bottom-btn-group button.btn-naver {
	background-color:#03C75A;
	color:#fff;
}
.login-wrap .bottom-btn-group button.btn-naver:hover {
	background-color:#03B552;
}
.login-wrap .bottom-btn-group button.btn-naver i {
	background: url("../images/phone/icon-sns-naver-ci.svg") no-repeat center;
	background-size:100%;
}
.login-wrap .bottom-btn-group button.btn-kakao {
	background-color:#FEE500;
}
.login-wrap .bottom-btn-group button.btn-kakao:hover {
	background-color:#FEDC00;
}
.login-wrap .bottom-btn-group button.btn-kakao i {
	background: url("../images/phone/icon-sns-kakao-ci.svg") no-repeat center;
	background-size:100%;
}
.login-wrap .bottom-btn-group button.btn-google {
	background-color:#EDF0F3;
}
.login-wrap .bottom-btn-group button.btn-google:hover {
	background-color:#E4E7EB;
}
.login-wrap .bottom-btn-group button.btn-google i {
	background: url("../images/phone/icon-sns-google-ci.svg") no-repeat center;
	background-size:100%;
}

.login-wrap .bottom-btn-group button.btn-apple {
	background-color:#FFFFFF;
	border:1px solid #666;
}
.login-wrap .bottom-btn-group button.btn-apple:hover {
	background-color:#F7F7F7;
	border:1px solid #666;
}
.login-wrap .bottom-btn-group button.btn-apple i {
	height:20px;
	width:16px;
	background: url("../images/phone/icon-sns-apple-ci.svg") no-repeat center;
	background-size:100%;
}



/*  ==========================
나의 리뷰 내역
=========================== */
.my-review-wrap .total-group {
	width:100%;
	padding:4px 20px 12px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap:4px;
	font-size:14px;
	font-weight: 500;
}
.my-review-wrap .total-group .value {
	font-weight: 600;
	color:var(--main60);
}
.my-review-wrap .review-list li {
	border-top:1px solid var(--gray30);
}
.my-review-wrap .review-list li {
	width:100%;
	padding:16px 20px;
	display:flex;
	flex-direction: column;
	gap:4px;
}
.my-review-wrap .review-list > div {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.my-review-wrap .review-list .date {
	font-size:14px;
	color:var(--gray70);
}
.my-review-wrap .review-list .name {
	font-size:16px;
	font-weight: 400;
	width:calc(100% - 100px);
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.my-review-wrap .review-list .star-group {
	display: flex;
	align-items: center;
	gap:6px;
}
.my-review-wrap .review-list .star-group .star-set {
	display: flex;
	align-items: center;
}
.my-review-wrap .review-list .star-group .star-set i {
	width:16px;
	height: 16px;
	background: url("../images/phone/icon-star-yellow.svg") no-repeat center;
	background-size:100%;
	display: block;
}
.my-review-wrap .review-list .star-group .num {
	font-size:14px;
	font-weight: 500;
}

.my-review-wrap .accordion-btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.my-review-wrap .accordion-btn .name {
	flex: 1;
	min-width: 0; /* 말줄임 필수 */
}

.my-review-wrap .accordion-btn .star-group {
	display: flex;
	align-items: center;
	flex-shrink: 0; /* 줄바꿈 방지 핵심 */
}



/*  ==========================
리뷰 작성 완료
=========================== */
.review-finish-wrap .content-group {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	height: calc(100vh - 136px);
}
.review-finish-wrap .content-group .btn-group .icon-point {
	background: url("../images/phone/icon-point-white.svg") no-repeat center;
	background-size:100%;
}
.review-finish-wrap .content-group .illust-point {
	width:96px;
	display: block;
	margin-bottom:20px;
}
.review-finish-wrap .content-group .main-txt {
	text-align: center;
	font-size:24px;
	line-height: 140%;
	font-weight: 600;
	margin-bottom:10px;
}
.review-finish-wrap .content-group .sub-txt {
	margin-bottom:30px;
	font-size:15px;
	color:var(--gray80);
	text-align: center;
}
.review-finish-wrap .content-group .sub-txt .point {
	color:var(--main60);
	font-weight: 500;
}
.review-finish-wrap .content-group .btn-group {
	margin-bottom: 80px;
}




/*  ==========================
리뷰 작성 완료
=========================== */
.estimate-company-wrap .top-group {
	margin:10px 0 24px;
	padding:0 20px;
}
.estimate-company-wrap .top-group .item {
	font-size:22px;
	font-weight: 600;
	margin-bottom:8px;
	display: block;
}
.estimate-company-wrap .top-group .sub-txt {
	font-size:14px;
	color:var(--gray100);
}
.estimate-company-wrap .top-group .sub-txt .point {
	font-weight: 500;
	color:var(--main60);
}
.estimate-company-wrap .list-group {
	margin:0 20px;
	display: flex;
	flex-direction: column;
	gap:16px;
}
.estimate-company-wrap .list-group > li {
	border-radius: 8px;
	background: var(--gray10);
	border:1px solid var(--gray30);
	padding:16px;
	display: flex;
	flex-direction: column;
	gap:16px;
}
.estimate-company-wrap .list-group .company-info {
	display: flex;
	align-items: center;
	gap:12px;
}
.estimate-company-wrap .list-group .company-info:hover .name {
	text-decoration: underline;
}
.estimate-company-wrap .list-group .company-info .profile-img {
	width:40px;
	height: 40px;
	border-radius: 99px;
	overflow: hidden;
}
.estimate-company-wrap .list-group .company-info .profile-img img {
	object-fit: cover;
	width:100%;
	height: 100%;
}
.estimate-company-wrap .list-group .company-info .profile-info {
	width:calc(100% - 52px);
	position: relative;
	padding-right:24px;
}
.estimate-company-wrap .list-group .company-info .profile-info .name {
	font-size:16px;
	font-weight: 600;
	line-height: 135%;
	margin-bottom:2px;
	display: block;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.estimate-company-wrap .list-group .company-info .profile-info > div {
	display: flex;
	align-items: center;
	gap:16px;
	font-size:13px;
	line-height: 135%;
	color:var(--gray90);
	font-weight: 400;
}
.estimate-company-wrap .list-group .company-info .profile-info::after {
	content:"";
	display: block;
	width:16px;
	height: 16px;
	background: url("../images/phone/icon-arrow-gray.svg") no-repeat center;
	background-size:100%;
	position: absolute;
	right:0;
	top:50%;
	transform: translateY(-50%) rotate(180deg);
}
.estimate-company-wrap .list-group .company-info .profile-info .review-grade {
	display: flex;
	align-items: center;
	gap:4px;
	position: relative;
}
.estimate-company-wrap .list-group .company-info .profile-info .review-grade::before {
	content:"";
	display: block;
	width:14px;
	height: 14px;
	background: url("../images/phone/icon-star-yellow.svg") no-repeat center;
	background-size:100%;
}
.estimate-company-wrap .list-group .company-info .profile-info .review-grade::after {
	content:"";
	display: block;
	width:1px;
	height: 10px;
	background: var(--gray50);
	position: absolute;
	right:-8px;
}
.estimate-company-wrap .list-group .detail {
	display: flex;
	flex-direction: column;
	gap:5px;
}
.estimate-company-wrap .list-group .detail li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size:15px;
}
.estimate-company-wrap .list-group .detail .label {
	color:var(--gray100);
}
.estimate-company-wrap .list-group .detail .price {
	color:var(--main60);
	font-weight: 600;
}




/*  ==========================
업체 정보
=========================== */
.company-profile-wrap .company-info {
	margin-top:8px;
	padding:0 20px;
	display: flex;
	align-items: flex-start;
	gap:16px;
}
.company-profile-wrap .company-info .profile-img {
	width:80px;
	height: 80px;
	border-radius: 99px;
	overflow: hidden;
}
.company-profile-wrap .company-info .profile-img img {
	object-fit: cover;
	width:100%;
	height: 100%;
}
.company-profile-wrap .company-info .profile-info {
	width:calc(100% - 96px);
	margin-top:3px;
	display: flex;
	flex-direction: column;
	gap:5px;
}
.company-profile-wrap .company-info .profile-info .name {
	font-size:18px;
	font-weight: 600;
}
.company-profile-wrap .company-info .profile-info .txt {
	font-size:14px;
	color:var(--gray80);
}
.company-profile-wrap .review-total-group {
	padding:0 20px;
	margin:20px 0 12px;
	display: flex;
	align-items: center;
	gap:4px;
}
.company-profile-wrap .review-total-group .review-total {
	font-size:13px;
	color:var(--gray70);
	font-weight: 400;
}
.company-profile-wrap .review-total-group .review-grade {
	display: flex;
	align-items: center;
	gap:8px;
	font-size:20px;
	font-weight: 600;
}
.company-profile-wrap .review-total-group .review-grade::before {
	content:"";
	display: block;
	width:20px;
	height: 20px;
	background: url("../images/phone/icon-star-yellow.svg") no-repeat center;
	background-size:100%;
}
.company-profile-wrap .review-list-area {
	padding:0 20px;
	display: flex;
	flex-direction: column;
	gap:12px;
}
.company-profile-wrap .review-list-area li {
	background: var(--gray20);
	border-radius: 8px;
	padding:16px;
	display: flex;
	flex-direction: column;
	gap:12px;
}
.company-profile-wrap .review-list-area .review-txt {
	font-size:15px;
}
.company-profile-wrap .review-list-area .user-info {
	display: flex;
	align-items: center;
	font-size:13px;
	font-weight: 400;
	color:var(--gray100);
	gap:4px;
	margin-bottom:3px;
}
.company-profile-wrap .review-list-area .user-info .addr {
	font-weight: 300;
	color:var(--gray70);
}
.company-profile-wrap .review-list-area .sub-info {
	display: flex;
	align-items: center;
	gap:16px;
	position: relative;
}
.company-profile-wrap .review-list-area .sub-info .date {
	font-size:13px;
	color:var(--gray70);
	line-height: 135%;
}
.company-profile-wrap .review-list-area .sub-info .star-group {
	display: flex;
	align-items: center;
	gap:4px;
	position: relative;
	font-size:13px;
	font-weight: 500;
	line-height: 135%;
}
.company-profile-wrap .review-list-area .sub-info .star-group::after {
	content:"";
	width:1px;
	height: 10px;
	background: var(--gray50);
    position: absolute;
    right: -8px;
}
.company-profile-wrap .review-list-area .sub-info .star-group .star-set {
	display: flex;
	align-items: center;
}
.company-profile-wrap .review-list-area .sub-info .star-group .star-set i {
	width:14px;
	height: 14px;
	display: block;
	background: url("../images/phone/icon-star-yellow.svg") no-repeat center;
	background-size:100%;
}




/*  ==========================
리뷰 작성
=========================== */
.review-write-wrap {
	padding-bottom:60px;
}
.review-write-wrap > .tit {
	margin-top:20px;
	text-align: center;
	font-size:24px;
	font-weight: 600;
	display: block;
	padding:0 20px;
}
.review-write-wrap section {
	margin-top:30px;
}
.review-write-wrap section .label {
	width:100%;
	text-align: center;
	display: block;
	font-size:16px;
	margin-bottom:16px;
}
.review-write-wrap .star-grade-set {
	display: flex;
	align-items: center;
	gap:2px;
	justify-content: center;
	margin-top:-4px;
} 
.review-write-wrap .star-grade-set button {
	width:36px;
	height: 36px;
	display: block;
	background: url("../images/phone/icon-star-gray.svg") no-repeat center;
	background-size:100%;
}
.review-write-wrap .star-grade-set button.active {
	background: url("../images/phone/icon-star-yellow.svg") no-repeat center;
	background-size:100%;
}
.review-write-wrap .photo-edit-group .file-uploader {
	margin-bottom:12px;
	position: relative;
	padding:0 20px;
}
.review-write-wrap .photo-edit-group .file-uploader label {
	width:100%;
	height: 48px;
	border-radius: 4px;
	border:1px solid var(--gray30);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size:15px;
	font-weight: 500;
	cursor: pointer;
	gap:8px;
}
.review-write-wrap .photo-edit-group .file-uploader label i {
	width:18px;
	height: 18px;
	display: block;
	background: url("../images/phone/icon-camera.svg") no-repeat center;
	background-size:100%;
}
.review-write-wrap .photo-edit-group .file-uploader label:hover {
	background: var(--gray10);
}
.review-write-wrap .photo-edit-group .file-uploader input {
	position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    font-size: 1;
    width:0;
    height: 100%;
    opacity: 0;
}
.review-write-wrap .photo-edit-group .swiper-container {
	margin:12px 0;
	position: relative;
	overflow: hidden;
}
.review-write-wrap .photo-edit-group .swiper-container .swiper-slide {
	width:25%;
	background: var(--gray20);
	position: relative;
}
.review-write-wrap .photo-edit-group .swiper-slide .img-box {
	width: 100%;
	aspect-ratio: 1 / 1;   /* 폭 기준으로 높이 자동 */
	overflow: hidden;
	border-radius: 4px;
}
.review-write-wrap .photo-edit-group .swiper-container .swiper-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.review-write-wrap .photo-edit-group .swiper-container .btn-del {
	width:18px;
	height: 18px;
	position: absolute;
	top:4px;
	right:4px;
	background: url("../images/phone/icon-close-white.svg") no-repeat center;
	background-size:12px;
	background-color:rgba(0,0,0,.8);
	border-radius: 99px;
}
.review-write-wrap .photo-edit-group .swiper-container .btn-del:hover {
	background-color:var(--main70);
}
.review-write-wrap .textarea-group {
	padding:0 20px;
}




/*  ==========================
견적내역 메인
=========================== */
.estimate-main {
	background: var(--gray20);
}
.estimate-main .estimate-list-wrap {
	padding:20px 20px 0;
}
.estimate-main .estimate-list-wrap > ul {
	display: flex;
	gap:16px;
	flex-direction: column;
}
.estimate-main .estimate-list-wrap li {
	box-shadow: 0 4px 16px rgba(0,0,0,.06);
	background: #fff;
	border-radius: 8px;
	padding:16px 20px 20px;
}
.estimate-main .estimate-list-wrap li .top-group {
}
.estimate-main .estimate-list-wrap li .top-group .name {
	font-size:16px;
	font-weight: 600;
	line-height: 135%;
	margin-bottom:3px;
	display: block;
}
.estimate-main .estimate-list-wrap li .top-group .date {
	font-size:13px;
	line-height: 135%;
	font-weight: 400;
	color:var(--gray60);
	display: flex;
} 
.estimate-main .estimate-list-wrap li .top-group > div {
	display: flex;
	align-items: center;
	gap:16px;
	position: relative;
}
.estimate-main .estimate-list-wrap li .top-group .time {
	font-size:13px;
	font-weight: 400;
	line-height: 135%;
	color:var(--system-red60);
}
.estimate-main .estimate-list-wrap li .top-group span {
	position: relative;
}
.estimate-main .estimate-list-wrap li .top-group > div > span:not(:last-child)::after {
	content:"";
	width:1px;
	height: 10px;
	display: block;
	background: var(--gray40);
	position: absolute;
	right:-8px;
	top:50%;
	transform: translateY(-50%);
}
.estimate-main .estimate-list-wrap .progress-area {
	width:100%;
	margin-bottom:16px;
	margin-top:16px;
}
.estimate-main .estimate-list-wrap .progress-area .bar-group {
	width:100%;
	height: 6px;
	border-radius: 99px;
	background: var(--gray30);
	position: relative;
	overflow: hidden;
}
.estimate-main .estimate-list-wrap .progress-area .bar-group::before {
	content:"";
	width:22px;
	height: 100%;
	background: linear-gradient( 90deg, rgba(54, 185, 255, 1) 0%, rgba(22, 119, 255, 1) 100%);
	display: block;
	transition-duration:0.3s;
	transition-timing-function:ease;
}
.estimate-main .estimate-list-wrap .progress-area .bar-group::after {
	content:"";
	display: block;
	width:6px;
	height: 6px;
	border-radius: 99px;
	background: var(--main90);
	position: absolute;
    top: 0;
    left: 20px;
	transition-duration:0.3s;
	transition-timing-function:ease;
}
.estimate-main .estimate-list-wrap .progress-area .label-group {
	width:100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size:13px;
	font-weight: 600;
	line-height: 135%;
	color:var(--gray60);
	margin-top:5px;
}
.estimate-main .estimate-list-wrap .progress-area .label-group span:first-child {
	color:var(--main60);
}
.estimate-main .estimate-list-wrap .progress-area.step02 .label-group span:first-child,
.estimate-main .estimate-list-wrap .progress-area.step02 .label-group span:last-child {
	color:var(--gray60);
}
.estimate-main .estimate-list-wrap .progress-area.step02 .label-group span:nth-child(2) {
	color:var(--main60);
}
.estimate-main .estimate-list-wrap .progress-area.step02 .bar-group::before {
	content:"";
	width:50%;
	height: 100%;
	background: linear-gradient( 90deg, rgba(54, 185, 255, 1) 0%, rgba(22, 119, 255, 1) 100%);
	display: block;
}
.estimate-main .estimate-list-wrap .progress-area.step02 .bar-group::after {
	content:"";
	display: block;
	width:6px;
	height: 6px;
	border-radius: 99px;
	background: var(--main90);
	position: absolute;
    top: 0;
    left: 50%;
	transform: translateX(-50%);
}
.estimate-main .estimate-list-wrap .progress-area.step03 .label-group span:first-child,
.estimate-main .estimate-list-wrap .progress-area.step03 .label-group span:nth-child(2) {
	color:var(--gray60);
}
.estimate-main .estimate-list-wrap .progress-area.step03 .label-group span:last-child {
	color:var(--main60);
}
.estimate-main .estimate-list-wrap .progress-area.step03 .bar-group::before {
	content:"";
	width:100%;
	height: 100%;
	background: linear-gradient( 90deg, rgba(54, 185, 255, 1) 0%, rgba(22, 119, 255, 1) 100%);
	display: block;
}
.estimate-main .estimate-list-wrap .progress-area.step03 .bar-group::after {
	content:"";
	display: block;
	width:6px;
	height: 6px;
	border-radius: 99px;
	background: var(--main90);
	position: absolute;
    top: 0;
    left: calc(100% - 6px);
}
.estimate-main .estimate-list-wrap .estimate-list-set {
	display: flex;
	align-items: flex-start;
	gap:6px;
	margin-top:12px;
}
.estimate-main .estimate-list-wrap .estimate-list-set .txt {
	font-size:14px;
	font-weight: 600;
	color:var(--main60);
	padding-top: 1.5px;
}
.estimate-main .estimate-list-wrap .estimate-list-set .profile-set {
	display: flex;
	align-items: center;
	gap:0px;
}
.estimate-main .estimate-list-wrap .estimate-list-set .profile-set > div {
	width:24px;
	height: 24px;
	border:2px solid #fff;
	border-radius: 99px;
	overflow: hidden;
}
.estimate-main .estimate-list-wrap .estimate-list-set .profile-set > div:first-child {
	margin-left: -2px;
}
.estimate-main .estimate-list-wrap .estimate-list-set .profile-set > div:not(:first-child) {
	margin-left: -9px;
}
.estimate-main .estimate-list-wrap .estimate-list-set .profile-set > div.more {
	background: var(--main60);
	color:#fff;
	font-size:12px;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
}
.estimate-main .estimate-list-wrap .estimate-list-set .profile-set > div img {
	object-fit: cover;
	width:100%;
	height: 100%;
}
.estimate-main .estimate-list-wrap .end .estimate-list-set {
	margin-bottom:16px;
}
.estimate-main .estimate-list-wrap .end .estimate-list-set ~ .btn-group {
	display: flex;
	align-items: center;
	gap:10px;
}
.estimate-main .estimate-list-wrap .end .estimate-list-set ~ .btn-group.half .fill-gray {
	width:140px;
	max-width: 200px;
}
.estimate-main .estimate-list-wrap .end .estimate-list-set ~ .btn-group.half button {
	padding:0;
}
.estimate-main .estimate-list-wrap .banner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: 8px;
	background: #C5E5FE;
	height: 88px;
	width:100%;
	margin-bottom:20px;
	padding:0 30px 0 20px;
	transition-duration:0.1s;
	transition-timing-function:ease;
}
.estimate-main .estimate-list-wrap .banner:hover {
	background: #B8DFFE;
}
.estimate-main .estimate-list-wrap .banner img {
	height: 100%;
	object-fit: cover;
	width:89px;
}
.estimate-main .estimate-list-wrap .banner .txt {
	font-size:16px;
	font-weight: 600;
	letter-spacing: -0.0125em;
}




/*  ==========================
견적상세
=========================== */
.estimate-detail-wrap {
	padding-bottom:64px;
}
/*scroll button*/
.estimate-detail-wrap .scroll-tab-group .swiper {
	width: 100%;
	position: relative;
	overflow: hidden;
	padding:12px 0;
	border-top:1px solid var(--gray30);
	border-bottom:1px solid var(--gray30);
	position: sticky;
    top: 56px;
	background: #fff;
}
.estimate-detail-wrap .scroll-tab-group .swiper-wrapper {
	display: flex;
}
.estimate-detail-wrap .scroll-tab-group .swiper-slide {
	width: fit-content !important;
	height: 48px !important;
	border-radius: 4px;
	justify-content: center;
	align-items: center;
	gap: 6px;
	display: flex;
	background: var(--gray20);
	font-size: 14px;
	font-weight: 600;
	flex-shrink: 0;
	cursor: pointer;
	line-height: 135%;
	overflow: hidden;
}
.estimate-detail-wrap .scroll-tab-group .swiper-slide.active {
	background: var(--gray130);
	color: #fff;	
}
.estimate-detail-wrap .scroll-tab-group .swiper-slide.active .name {
	color:#fff;
}
.estimate-detail-wrap .scroll-tab-group .swiper-slide .txt-group {
	padding:0 10px;
    display: flex;
    flex-direction: column;
}
.estimate-detail-wrap .scroll-tab-group .swiper-slide .name {
	font-size:12px;
	color:var(--gray80);
	font-weight: 400;
}
.estimate-detail-wrap .scroll-tab-group .swiper-slide .img-frame {
	height: 100%;
    width: 48px;
}
.estimate-detail-wrap .scroll-tab-group .swiper-slide .img-frame img {
	height: 100%;
	width: 100%;
	 object-fit: cover;
}
.estimate-detail-wrap .scroll-tab-group .tab-content {
	display: none;
}
/*detail*/
.estimate-detail-wrap .tab-detail article {
	padding:24px 20px;
	border-bottom:8px solid var(--gray20);
}
.estimate-detail-wrap .tab-detail article:first-child {
	padding-top:16px;
}
.estimate-detail-wrap .tab-detail article:last-child {
	border-bottom:0;
}
.estimate-detail-wrap .tab-detail article .sc-tit {
	font-size:16px;
	font-weight: 600;
	line-height: 135%;
	margin-bottom:20px;
}
.estimate-detail-wrap .tab-detail .company-info {
	display: flex;
	align-items: center;
	position: relative;
	gap:12px;
	padding-right:28px;
}
.estimate-detail-wrap .tab-detail .company-info::after {
	content:"";
	display: block;
	width:16px;
	height: 16px;
	background: url("../images/phone/icon-arrow-gray.svg") no-repeat center;
	background-size:100%;
	transform: translateY(-50%) rotate(180deg);
	position: absolute;
	right:0;
	top:50%;
}
.estimate-detail-wrap .tab-detail .company-info .profile-img {
	width:60px;
	height: 60px;
	border-radius: 99px;
	overflow: hidden;
}
.estimate-detail-wrap .tab-detail .company-info .profile-img img {
	width:100%;
	height: 100%;
	object-fit: cover;
}
.estimate-detail-wrap .tab-detail .company-info .profile-info {
	display:flex;
	gap:4px;
	flex-direction: column;
}
.estimate-detail-wrap .tab-detail .company-info .profile-info .name {
	font-size:18px;
	font-weight: 600;
	line-height: 135%;
	display: block;
}
.estimate-detail-wrap .tab-detail .company-info .profile-info > div {
	display: flex;
	align-items: center;
	gap:16px;
	font-size:13px;
	font-weight: 400;
	color:var(--gray90);
}
.estimate-detail-wrap .tab-detail .company-info .profile-info .review-grade {
	position: relative;
	display: flex;
	align-items: center;
	gap:4px;
}
.estimate-detail-wrap .tab-detail .company-info .profile-info .review-grade::before {
	content:"";
	width:14px;
	height: 14px;
	display: block;
	background: url("../images/phone/icon-star-yellow.svg") no-repeat center;
	background-size:100%;
}
.estimate-detail-wrap .tab-detail .company-info .profile-info .review-grade::after {
	content:"";
	width:1px;
	height: 10px;
	background: var(--gray50);
	display: block;
	position: absolute;
	right:-8px;
	top:50%;
	transform: translateY(-50%);
}
.estimate-detail-wrap .tab-detail .suggest-group {
	margin-top:16px;
	width:100%;
	border-radius: 8px;
	background: #E4F3FF;
	padding:16px 12px 12px;
	text-align: center;
}
.estimate-detail-wrap .tab-detail .suggest-group .label {
	display: block;
	font-size:14px;
	font-weight: 400;
	color:var(--gray80);
}
.estimate-detail-wrap .tab-detail .suggest-group .price {
	font-size:20px;
	font-weight: 600;
	display: block;
	margin-bottom:16px;
}
.estimate-detail-wrap .tab-detail .suggest-group .time-group {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width:100%;
	border-radius: 4px;
	padding:8px 16px;
	background: #fff;
}
.estimate-detail-wrap .tab-detail .suggest-group .time {
	font-weight: 400;
}
.estimate-detail-wrap .tab-detail .info-group {
	font-size:14px;
	color:var(--gray60);
	display: flex;
	flex-direction: column;
	gap:6px;
}
.estimate-detail-wrap .tab-detail .info-group li {
	position: relative;
	padding-left:12px;
}
.estimate-detail-wrap .tab-detail .info-group li::before {
	content:"";
	width:2.5px;
	height:2.5px;
	border-radius: 99px;
	background:var(--gray60);
	display: block;
	position: absolute;
	left: 0;
    top: 9px;
}
.estimate-detail-wrap .tab-detail .table-group {
	border-top:1px solid #000;
}
.estimate-detail-wrap .tab-detail .table-group tr {
	height: 46px;
	border-bottom:1px solid var(--gray30);
}
.estimate-detail-wrap .tab-detail .table-group th:not(:last-child),
.estimate-detail-wrap .tab-detail .table-group td:not(:last-child) {
	border-right:1px solid var(--gray30);
}
.estimate-detail-wrap .tab-detail .table-group td {
	text-align: center;
}
.estimate-detail-wrap .tab-detail .table-group thead {
	background: var(--gray20);
}
.estimate-detail-wrap .tab-detail .table-group th {
	font-weight: 600;
	font-size:13px;
}
.estimate-detail-wrap .tab-detail .table-group td:first-child {
	font-weight: 400;
}
.estimate-detail-wrap .tab-detail .table-group td:not(:first-child) {
	color:var(--gray100);
}
.estimate-detail-wrap .tab-detail .price-detail-group .sc-tit {
	margin-bottom:0;
}
.estimate-detail-wrap .tab-detail .price-detail-group .price-area li > div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 0;
	font-size:15px;
}
.estimate-detail-wrap .tab-detail .price-detail-group .price-area li:not(:last-child) {
	border-bottom:1px solid var(--gray30);
}
.estimate-detail-wrap .tab-detail .price-detail-group .price-area div:not(.detail-list) .label {
	color:var(--gray80);
}
.estimate-detail-wrap .tab-detail .price-detail-group .price-area li > div > .value {
	font-weight: 600;
}
.estimate-detail-wrap .tab-detail .price-detail-group .price-area .support > div,
.estimate-detail-wrap .tab-detail .price-detail-group .price-area .support .label {
	color:var(--system-red60);
}
.estimate-detail-wrap .tab-detail .price-detail-group .price-area .detail-list {
	padding:12px 16px;
	border-radius: 4px;
	background: var(--gray20);
	display: flex;
	flex-direction: column;
	gap:10px;
}
.estimate-detail-wrap .tab-detail .price-detail-group .price-area .detail-list > div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size:14px;
	font-weight: 300;
	color:var(--gray80);
	width: 100%;
}





/*  ==========================
견적받기 step01
=========================== */
.request-step01-wrap .scroll-tab-group .tab-buttons {
	display: flex;
	gap:20px;
	padding:10px 20px 24px;
	border-bottom:8px solid var(--gray20);
	position: sticky;
	top:56px;
	background: #fff;
}
.request-step01-wrap .scroll-tab-group .tab-buttons > div {
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap:8px;
	flex-direction: column;
}
.request-step01-wrap .scroll-tab-group .tab-buttons .img-group {
	width:60px;
	height: 60px;
	border-radius: 99px;
	overflow:hidden;
	background:var(--gray20);
	display: flex;
	align-items: center;
	justify-content: center;
}
.request-step01-wrap .scroll-tab-group .tab-buttons #all .img-group {
	font-size:14px;
	font-weight: 700;
}
.request-step01-wrap .scroll-tab-group .tab-buttons #apple .img-group img {
	width:16px;
}
.request-step01-wrap .scroll-tab-group .tab-buttons #samsung .img-group img {
	width:52px;
}
.request-step01-wrap .scroll-tab-group .tab-buttons .txt {
	font-weight: 500;
	font-size:14px;
}
.request-step01-wrap .scroll-tab-group .tab-buttons .active .img-group {
	background: #fff;
	border:2px solid var(--main60);
}
.request-step01-wrap .scroll-tab-group .tab-buttons .active .txt {
	color: var(--main60);
}
.request-step01-wrap .tab-detail {
	padding:12px 10px;
}
.request-step01-wrap .tab-detail .item {
	height: 52px;
	width:100%;
	padding:0 10px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	font-size:15px;
	font-weight: 400;
	border-radius: 8px;
}
.request-step01-wrap .tab-detail .item:hover {
	background: var(--gray10);
	cursor: pointer;
}





/*  ==========================
견적받기 step02 - 채팅
=========================== */
.request-step02-wrap .chat-area {
	padding:20px 10px 10px;
	width:100%;
	gap:20px;
	display: flex;
	flex-direction: column;
}
.request-step02-wrap .progress-group {
	position: sticky;
	top:56px;
	z-index: 1;
}
.request-step02-wrap .chat-area .message-data {
	display: flex;
	flex-direction: column;
	gap:8px;
}
.request-step02-wrap .chat-area .message-data .box {
	padding:20px;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	gap:20px;
	background: var(--gray20);
	width: fit-content;
	max-width: 280px;
}
.request-step02-wrap .chat-area .message-data .box .txt {
	font-size:15px;
	font-weight: 600;
}
.request-step02-wrap .chat-area .message-data.send {
	flex-direction: row;
	gap:0;
	justify-content: flex-end;
	align-items: center;
}
.request-step02-wrap .chat-area .message-data.send .box {
	padding:12px 20px;
	background: var(--gray130);
}
.request-step02-wrap .chat-area .message-data.send .box .txt {
	font-weight: 300;
	color:#fff;
}
.request-step02-wrap .chat-area .message-data.send .btn-edit {
	padding:0 10px;
	height: 44px;
	font-size:14px;
	font-weight: 400;
	color:var(--gray80);
}
.request-step02-wrap .chat-area .message-data.send .btn-edit:hover {
	color:var(--gray130);
}
.request-step02-wrap .chat-area .message-data .info-group {
	display: flex;
	flex-direction: column;
	gap:8px;
}
.request-step02-wrap .chat-area .message-data .info-group li {
	display: flex;
	align-items: flex-start;
	position: relative;
	gap:8px;
}
.request-step02-wrap .chat-area .message-data .info-group li .txt {
	display: block;
	font-weight: 300;
	width:calc(100% - 11px);
}
.request-step02-wrap .chat-area .message-data .info-group li::before {
	content:"";
	width:3px;
	height: 3px;
	border-radius: 99px;
	background: var(--gray130);
	margin:9px 0;
}
.request-step02-wrap .chat-area .message-data.send .info-group li::before {
	content:"";
	width:3px;
	height: 3px;
	border-radius: 99px;
	background: var(--white);
	margin:9px 0;
}
.request-step02-wrap .chat-area .message-data .textarea-group textarea {
	background: #fff;
	border:none;
	border-radius: 8px;
	min-height: 100px;
}
.request-step02-wrap .chat-area .message-data .textarea-group,
.request-step02-wrap .chat-area .message-data .radio-group,
.request-step02-wrap .chat-area .message-data .selectbox-group,
.request-step02-wrap .chat-area .message-data .checkbox-group,
.request-step02-wrap .chat-area .message-data:not(.send) .info-group {
	width:240px;
}






/*  ==========================
main index - 메인 홈화면
=========================== */
.main-wrap {
	margin-bottom:20px;
	margin-top:-100px;
}
.main-wrap .banner-estimate {
	margin:0 20px;
	width:calc(100% - 40px);
	border-radius: 12px;
	background: #D5E7FF;
	position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.main-wrap .banner-estimate .text-group {
	display: flex;
	align-items: center;
    flex-direction: column;
	padding-top:20px;
	text-align: center;
	margin-bottom:8px;
}
.main-wrap .banner-estimate .text-group .point {
	font-size:16px;
	font-weight: 500;
	line-height: 135%;
	color:var(--main60);
	margin-bottom:4px;
}
.main-wrap .banner-estimate .text-group .main {
	font-size:24px;
	font-weight: 700;
	line-height: 135%;
	color:var(--gray130);
	margin-bottom:4px;
}
.main-wrap .banner-estimate img {
	display: block;
	--width:160px;
}
.main-wrap .banner-estimate .btn-group {
	position: absolute;
	bottom:16px;
}
.main-wrap .banner-estimate .btn-group i {
	background: url("../images/phone/icon-arrow-right-white.svg") no-repeat center;
	background-size:100%;
}
.main-wrap .banner-mall {
	width:calc(100% - 40px);
	margin:0 20px 16px;
	background-color: #F2F3F5;
	border-radius: 12px;
	padding:0;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content:space-between;
	transition-duration:0.1s;
	transition-timing-function:ease;
	position: relative;
}
.main-wrap .banner-mall .txt-group span:first-child {
	display: block;
	font-size:16px;
	font-weight: 600;
	line-height: 135%;
	margin-bottom:6px;
}
.main-wrap .banner-mall .txt-group span.btn {
	font-size:12px;
	color:var(--gray80);
	display: flex;
	align-items: center;
	gap:2px;
}
.main-wrap .banner-mall .txt-group span.btn i {
	width:12px;
	height: 12px;
	background: url("../images/phone/icon-arrow-gray.svg") no-repeat center;
	background-size:100%;
	transform: rotate(180deg);
}
.main-wrap .banner-mall  .img-group {
	height: 66px;
	width:80px;
}
.main-wrap .banner-mall  .img-group img {
	height: 66px;
	width:80px;
}
.main-wrap .top-navi-group {
    position: absolute;
    top: 56px;
	z-index: 5;
	height: 44px;
}
.main-wrap .top-navi-group {
	padding:0 20px;
	width: 100%;
}
.main-wrap .top-navi-group > div {
	display: flex;
	align-items: center;
	gap:20px;
	height: 100%;
}
.main-wrap .top-navi-group a {
	display: block;
	height: 100%;
	font-size:18px;
	font-weight: 600;
	color:rgba(255,255,255,.5);
	position: relative;
	display: flex;
	align-items: center;
	transition-duration:0.1s;
	transition-timing-function:ease;
}
.main-wrap .top-navi-group a.active {
	color:#fff;
}
.main-wrap .top-navi-group a.active::after {
	content:"";
	position: absolute;
	display: block;
	width:100%;
	height: 3px;
	background: #fff;
	bottom:0;
}
.main-wrap .top-navi-group a:not(.active):hover {
	color:#fff;
}
.main-wrap .main-banner-swiper {
	width:100%;
	background: #dedede;
	position: relative;
	margin-bottom:20px;
	overflow: hidden;
	padding-bottom: calc(100% + 130px);
}
.main-wrap .main-banner-swiper .swiper-wrapper {
	position: absolute;
}
.main-wrap .main-banner-swiper .main-banner-pagination {
	position: absolute;
	right: 20px;
	top: 152px;
	z-index: 1;
	display: flex;
    align-items: center;
    justify-content: center;
	width: auto;  
	height: auto; 
	padding: 2px 10px;
	left: unset;
    bottom: unset;
	border-radius: 99px;
	background: rgba(0,0,0,.4);
	font-size:12px;
	font-weight: 300;
	color:rgba(255,255,255,.5);
	gap:3px;
}
.main-wrap .main-banner-swiper .main-banner-pagination .swiper-pagination-current {
	font-weight: 600;
	color:rgba(255,255,255,1);
}
.main-wrap .main-banner-swiper .img-box {
	position: absolute;
	bottom:0;
	display: flex;
}