@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700&display=swap');
@font-face {
    font-family: 'KCC-Dodamdodam';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302@1.0/KCC-DodamdodamR.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}
:root {
	/* 1차 변수 START */

	/* 컬러 */
	--color-primary: #3EA7EC;			/* 메인 색상 기본 */
	--color-primary-effect: #009AFF;	/* 메인 색상 효과 (호버) */
	--color-primary-contrast: #fff;	/* 메인 색상 콘트라스트 색상 */

	--color-second: #FFCB00;			/* 서브 색상 기본 */
	--color-second-effect: #FCA000;	/* 서브 색상 효과 (호버) */
	--color-second-contrast: #fff;		/* 서브 색상 콘트라스트 색상 */

	--color-point: #FF8080;			/* 포인트 색상 기본 */
	--color-point-effect: #FF6E6E;		/* 포인트 색상 효과 (호버) */
	--color-point-contrast: #fff;		/* 포인트 색상 콘트라스트 색상 */

	--color-disabled: #bbb;			/* 비활성화 색상 */

	--color-font-basic: #222;			/* 기본 글자 색상 */
	--color-font-sub: #888;			/* 보조 글자 색상 */
	--color-font-placeholder: #ccc;	/* 플레이스홀더 글자 색상 */

	--color-border-light: #eee;		/* 라인 밝은 색상 */
	--color-border-mideum: #ddd;		/* 라인 중간 색상 */
	--color-border-dark: #222;			/* 라인 어두운 색상 */

	--color-border-input: #ddd;

	--color-bg-highlight : #fafafa;	/* 배경 색상 */
	--color-bg-light : #f5f5f5;		/* 배경 색상 */


	/* 사이즈 */
	--size-border: 0.1rem;				/* 라인 굵기 */

	--size-radius-small: .6rem;			/* 레디우스 크기 조정 (소) */
	--size-radius-mid: 1rem;			/* 레디우스 크기 조정 (중) */
	--size-radius-large: 2rem;			/* 레디우스 크기 조정 (대) */
	--size-radius-full: 100rem;			/* 레디우스 크기 조정 (100%) */


	/* 폰트 */
	--font-size-xx-small: 1.5rem;
	--font-size-x-small: 1.6rem;
	--font-size-small: 1.9rem;
	--font-size-mid: 2.1rem;
	--font-size-large: 2.5rem;
	--font-size-x-large: 3.2rem;
	--font-size-xx-large: 4rem;
	--font-size-xxx-large: 5rem;

	--font-w-thin: 100;
	--font-w-light: 300;
	--font-w-regular: 400;
	--font-w-mid: 500;
	--font-w-bold: 700;
	--font-w-black: 900;


	/* 여백 */
	--space-short: 1rem;
	--space-mid: 2rem;
	--space-big: 4rem;
	--space-section: 4rem 0 10rem;		/* 페이지내 섹션 여백 */


	/* 기타 */
	--line-height: 1.7;

	/* 1차 변수 END */


	/* 계산 목적 변수 목록 START */
    --header-height : 8rem;
    --min-width : 270px;
	/* 계산 목적 변수 목록 END */
}

/* 폰트 반응형 START */
html {
	font-size: 10px;
	font-family: 'Roboto', 'Noto Sans KR', sans-serif;
	font-weight: 400;
	letter-spacing: -0.1rem;
}
/* 폰트 반응형 END */

body {
	background: var(--color-bg-highlight);
}
body, input {
	font-size: 1.6rem;
	font-family: 'Roboto', 'Noto Sans KR', 'KCC-Dodamdodam', sans-serif;
	line-height: var(--line-height);
}
select, input, textarea, button {
	font-family: 'Roboto', 'Noto Sans KR', sans-serif;
}
img {
	max-width: 100%;
}
select {
	width:27rem;
    height:4rem;
    box-sizing:border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background:url("../images/common/icon_select.svg") center right 1rem / 1.4rem no-repeat;
}
input {
	width:-webkit-fill-available;
    height:4rem;
	font-family: 'Roboto', 'Noto Sans KR', sans-serif;
}
select, input, textarea {
	padding: 0 1rem;
	width: calc(100% - 2rem);
	font-size: var(--font-size-xx-small);
	border: none;
	border-radius: var(--size-radius-small);
	background-color: var(--color-bg-light);
	box-sizing: content-box;
}
textarea {
	padding: 1rem;
}
input:focus {
	outline: none;
}
input[type=text]:disabled {
	color: var(--color-disabled);
}
input[type=checkbox],
input[type=radio] {
	width: 2rem;
	height: 2rem;
	display: none;
}
input[type=checkbox] + label,
input[type=radio] + label {
    display: inline-block;
    cursor: pointer;
    line-height: 1;
    padding: 0.6rem 0 0.6rem 3rem;
	background: url("../images/common/icon_check_off.svg") left/2.4rem no-repeat;
	-webkit-user-drag: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
input[type=checkbox]:checked + label,
input[type=radio]:checked + label {
	background: url("../images/common/icon_check_on.svg") left/2.4rem no-repeat;
}
a:link, a:visited, a:hover {
	color: #222;
	text-decoration:none;
}
button {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: unset;
	background: none;
	outline: none;
	border: none;
	cursor: pointer;
	border-radius: var(--size-radius-small);
	letter-spacing: -0.1rem;
	line-height: 1;
}


/* 버튼 스타일 START */
.btn_disabled {
	opacity: 0.5;
}
.btn_disabled:hover {
	background-color: unset;
}
.btn_primary_fill {
	color: #fff;
	background-color: var(--color-primary);
}
.btn_primary_fill:hover {
	background-color: var(--color-primary-effect);
}
.btn_second_fill {
	color: #fff;
	background-color: var(--color-second);
}
.btn_second_fill:hover {
	background-color: var(--color-second-effect);
}
.btn_point_fill {
	color: #fff;
	background-color: var(--color-point);
}
.btn_point_fill:hover {
	background-color: var(--color-point-effect);
}
.btn_gray_fill {
	color: #fff;
	background-color: #999;
}
.btn_gray_fill:hover {
	background-color: #888;
}
.btn_light_gray_fill {
	color: #fff;
	background-color: #bbb;
}
.btn_light_gray_fill:hover {
	background-color: #aaa;
}

.btn_auto {
	padding: 0 1rem;
    height: 3rem;
    font-size: var(--font-size-x-small);
}
.btn_small {
    width: 8rem;
    height: 3rem;
    font-size: var(--font-size-x-small);
}
.btn_back {
	width: 20rem;
	height: 5rem;
    font-size: var(--font-size-mid);
    font-weight: var(--font-w-mid);
}
/* 버튼 스타일 END */


.lock {
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: fixed;
}
.layer_bg {
	display: none;
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 90;
	background: rgba(0, 0, 0, 0.7);
}
.title_box {
	margin-bottom: 3rem;
}
h2 {
	margin-bottom: 1rem;
	font-size: var(--font-size-large);
	font-weight: var(--font-w-mid);
}
h2 span {
	margin-left: 0.6rem;
	font-size: var(--font-size-x-small);
	font-weight: var(--font-w-regular);
	color: var(--color-font-sub);
}
h4 {
	color: var(--color-font-basic);
	font-size: var(--font-size-mid);
	font-weight: var(--font-w-mid);
}
h6 {
	color: var(--color-font-basic);
	font-size: var(--font-size-small);
	font-weight: var(--font-w-light);
}


/* 헤더 START */
.header_container {
	background-color: #fff;
//	border-bottom: 1px solid var(--color-border-mideum);
	box-sizing: border-box;
}
header {
	padding: 0 10%;
	margin: 0 auto;
	height: var(--header-height);
	display: flex;
	align-items: center;
	justify-content: space-between;
}
header .logo {
    display: flex;
    align-items: center;
}
header .logo a {
    display: flex;
    align-items: center;
}
header .logo img {
    width: 18rem;
}
header .btn_menu {
	display: none;
	align-items: center;
	width: 3rem;
	height: 3rem;
}
header .gnb {
    display: flex;
    gap: 4rem;
}
header .gnb li {
    display: flex;
    font-size: var(--font-size-small);
    font-weight: var(--font-w-regular);

}
header .gnb li a {
	padding: 0.8rem 0;
	position: relative;
	transition: all ease 0.5s;
	overflow: hidden;
}
header .gnb li a::before {
	width: 100%;
	height: 2px;
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: var(--color-primary);
	transform: translateX(-100%);
	transition: all ease 0.3s;
}
header .gnb li a:hover {
	color: var(--color-primary);
}
header .gnb li a:hover::before {
	transform: translateX(0);
}
header .mobile_menu_container {
	display: none;
}
@media screen and (max-width: 960px) {
	header {
		padding: 0 var(--space-mid);
		max-width: 100%;
	}
	header .gnb {
		display: none;
	}
	header .btn_menu {
		display: flex;
	}
	header .mobile_menu_container {
		width: 100vw;
		height: 100vh;
		background: #fff;;
		position: fixed;
		top: 0;
		right: -120%;
		z-index: 100;
		display: block;
	}
	header .mobile_menu_container .wrapper {
		padding: 0 var(--space-mid);
		height: var(--header-height);
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 0.1rem solid var(--color-border-mideum);
	}
	header .mobile_menu_container .wrapper button {
		align-items: center;
		width: 3rem;
		height: 3rem;
	}
	header .mobile_gnb {
		padding: 3rem var(--space-mid);
		display: flex;
		flex-direction: column;
		gap: 4rem;
		overflow: scroll;
		height: 100%;
	}
	header .mobile_gnb li {
		font-size: var(--font-size-large);
		font-weight: var(--font-w-regular);

	}
	header .mobile_gnb li a {
		padding: 0.6rem 0;
		position: relative;
		transition: all ease 0.5s;
		overflow: hidden;
	}
}
/* 헤더 END */

/* 푸터 START */
.footer_container {
	width: 100%;
//	border-top: 0.1rem solid var(--color-border-mideum);
//	background: var(--color-bg-highlight);
	background-color: #fff;
}
.footer_container footer {
	margin: 0 auto;
	padding: 2rem 10%;
	display: block;
}
.footer_container footer .footer_top {
	padding-bottom: 2rem;
	display: flex;
	justify-content: space-between;
	border-bottom: 0.1rem solid var(--color-border-mideum);
}
.footer_container footer .logo {
	height: 100%;
}
.footer_container footer .logo img {
	width: 10rem;
	vertical-align: middle;
}
.footer_container footer .footer_menu {
	height: 100%;
	font-size: 1.5rem;
}
.footer_container footer .footer_menu ul li {
	display: inline-block;
}
.footer_container footer .footer_menu ul li + li {
	margin-left: 1.4rem;
	padding-left: 1.4rem;
	border-left: 0.1rem solid var(--color-border-mideum);
}
.footer_container footer .footer_menu ul li a {
	padding: 1rem 0;
	color: var(--color-font-sub);
	font-weight: var(--font-w-mid);
	line-height: 1;
}
.footer_container footer .info_detail {
	margin-top: 1.6rem;
	clear: both;
}
.footer_container footer .info_detail p {
	display: flex;
	gap: 3rem;
}
.footer_container footer .info_detail p,
.footer_container footer .info_detail span {
	color: var(--color-font-sub);
	font-size: 1.5rem;
	font-weight: var(--font-w-regular);
	line-height: 2;
}
@media screen and (max-width: 960px) {
	.footer_container footer {
		padding: 4rem var(--space-mid);
	}
}
@media screen and (max-width: 768px) {
	.footer_container footer .footer_top {
		padding-bottom: unset;
		flex-direction: column;
	}
	.footer_container footer .logo {
		margin-bottom: 1rem;
	}
	.footer_container footer .footer_menu {
		margin: 1.6rem 0;
		float: left;
		clear: both;
	}
	.footer_container footer .footer_menu ul {
		margin-top: 0;
	}
	.footer_container footer .footer_menu ul li {
		display: block;
		line-height: 2;
	}
	.footer_container footer .footer_menu ul li + li {
		margin-left: 0;
		padding-left: 0;
		border-left: none;
	}
	.footer_container footer .info_detail p {
		flex-direction: column;
		gap: unset;
	}
	.footer_container footer .info_detail p + p {
		margin-top: 1.6rem;
	}
	.footer_container footer .info_detail p span {
		line-height: 2;
		display: block;
	}
}
/* 푸터 END */

/* 컨텐츠 START */
.content_container {
	padding: 4rem 0 4rem 0;
	width: 100%;
	background-color: #fff;
}
.content_container .content_wrapper.full {
    margin: 0 auto;
	padding:0;
	max-width: 100%;
}
.content_inner {
	padding: 0 var(--space-mid);
	margin: 0 auto;
	max-width: 1100px;
	position: relative;
}
.flex_content_container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
/* 컨텐츠 END */


/* tab (텍스트타입) START */
.tab {
    margin: 0rem 0 3rem 0;
    padding-bottom: 1.6rem;
    border-bottom: 0.1rem solid var(--color-border-mideum);
    display: flex;

    gap: 3rem;
}
.tab li a {
	color: #BBB;
	font-size: var(--font-size-small);
}
.tab li.on a {
	color: var(--color-font-basic);
	font-weight: var(--font-w-mid);
}
/* tab (텍스트타입) END */


/* tab (버튼타입) START */
.tab_btn_type {
	width: 100%;
    display: flex;
}
.tab_btn_type li {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.4;
	border-top: 1px solid var(--color-border-mideum);
    border-bottom: 1px solid var(--color-border-mideum);
}
.tab_btn_type li:first-child {
    border-left: 1px solid var(--color-border-mideum);
}
.tab_btn_type li:last-child {
    border-right: 1px solid var(--color-border-mideum);
}
.tab_btn_type li + li {
	border-left: 1px solid var(--color-border-mideum);
}
.tab_btn_type li a {
	padding: 1rem 0;
	width: 100%;
	display: flex;
    align-items: center;
    justify-content: center;
	color: #BBB;
	font-size: var(--font-size-x-small);
}
.tab_btn_type li.on {
	border-color: var(--color-primary);
	background-color: var(--color-primary);
}
.tab_btn_type li.on a {
	color: #fff;
}
/* tab (버튼타입) END */

/* tab 2 (버튼타입) START */
.tab_btn_2_type {
	width: 100%;
    display: flex;
}
.tab_btn_2_type li {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.0;
	border-top: 1px solid var(--color-border-mideum);
    border-bottom: 1px solid var(--color-border-mideum);
}
.tab_btn_2_type li:first-child {
    border-left: 1px solid var(--color-border-mideum);
}
.tab_btn_2_type li:last-child {
    border-right: 1px solid var(--color-border-mideum);
}
.tab_btn_2_type li + li {
	border-left: 1px solid var(--color-border-mideum);
}
.tab_btn_2_type li a {
	padding: 1rem 0;
	width: 8rem;
	display: flex;
    align-items: center;
    justify-content: center;
	color: #BBB;
	font-size: var(--font-size-xx-small);
}
.tab_btn_2_type li.on {
	border-color: var(--color-primary);
	background-color: var(--color-primary);
}
.tab_btn_2_type li.on a {
	color: #fff;
}
/* tab 2 (버튼타입) END */


/* 기본폼 START */
.form_container {
	/* margin: 3rem 0; */
	display: flex;
	flex-direction: column;
	gap: 2rem;
}
.form_container .form_wrapper {
	display: flex;
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
}
.form_container .form_wrapper label {
	flex-basis: 10rem;
	font-weight: var(--font-w-regular);
	color: var(--color-font-sub);
}
.form_container .form_wrapper .input_wrapper {
	width: calc(100% - 10rem);
	position: relative;
	display: flex;
	align-items: center;
	gap: 1rem;
}
@media screen and (max-width: 599px) {
	.form_container {
		gap: 4rem;
	}
	.form_container .form_wrapper label {
		margin-bottom: 0.6rem;
		flex-basis: 100%;
	}
	.form_container .form_wrapper .input_wrapper {
		flex-basis: 100%;
	}
}
/* 기본폼 END */


.type_price strong {
	font-weight: var(--font-w-bold);
    color: var(--color-primary);
}
.type_price_02 {
	color: var(--color-font-sub);
}
.type_price_02 strong {
	color: var(--color-font-basic);
}
.label_type {
	font-weight: var(--font-w-regular);
    color: var(--color-font-sub);
}


/* 파일 업로드 START */
.fileUpload input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip:rect(0,0,0,0);
    border: 0;
}
.form_container .fileUpload .btn_search {
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: #fff;
	border-radius: var(--size-radius-small);
}
@media screen and (max-width: 599px) {
	.form_container .fileUpload .btn_search {
		margin-bottom: unset;
		flex-basis: unset;
	}
}
/* 파일 업로드 END */


/* tip START*/
.tip {
    position: relative;
    height: 100%;
}
.tip .icon {
    width: 2.4rem;
    height: 2.4rem;
    color: #fff;
    font-weight: var(--font-w-mid);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--size-radius-full);
    background-color: var(--color-second);

}
.tip .tip_text_box {
    display: none;
    padding: 1.6rem;
    width: max-content;
    max-width: 400px;
	font-size: var(--font-size-xx-small);
    position: absolute;
/*    top: -1rem;*/
/*    left: 3rem;*/
    top: 3rem;
    left: -20rem;
	background-color: #fff;
    border: 1px solid var(--color-border-mideum);
    border-radius: var(--size-radius-small);
}
.tip .tip_text_box.on {
    display: unset;
}
/* tip END*/


/* 대기 아이콘 활성화 START */
.icon_waiting {
    display: none;
}
.activity_waiting .icon_waiting {
    margin: 0 0.6rem;
    width: 1.8rem;
    display: inline-block;
}
/* 대기 아이콘 활성화 END */


/* 디자인의뢰 박스 START */
.guide_text_box {
    padding: 2rem 3rem;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
    border-radius: var(--size-radius-mid);
    background-color: var(--color-bg-light);
}
.guide_text_box .title {
	margin-bottom: 2rem;
	color: var(--color-font-basic);
	font-size: var(--font-size-small);
	font-weight: var(--font-w-mid);
}
.guide_text_box p {
	color: #666;
}
.guide_text_box span {
	color: #666;
}
.guide_text_box .content_number {
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
}
.guide_text_box .content_number li {
	display: flex;
	align-items: baseline;
	flex-direction: row;
	gap: 1rem;
}
.guide_text_box .content_number li .num {
	width: 2.4rem;
	height: 2.4rem;
	color: #fff;
	font-weight: var(--font-w-mid);
	border-radius: var(--size-radius-full);
	background: #bbb;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-basis: 2.4rem;
}
.guide_text_box .content_number span {
	flex-basis: calc(100% - 3rem);
	display: flex;
	align-items: center;
	gap: 1rem;
}
.guide_text_box .content_number button {
	min-width: 10rem;
	max-width: 10rem;
}
.guide_text_box .btn_wrapper button {
    flex-basis: 16rem;
    height: 4rem;
    color: var(--color-disabled);
    font-size: var(--font-size-x-small);
    background-color: #fff;
    box-sizing: border-box;
}
.guide_text_box .btn_wrapper button.focus {
    color: var(--color-primary);
    font-weight: var(--font-w-mid);
    border: 2px solid var(--color-primary);
}
@media screen and (max-width: 599px) {
	.guide_text_box .content_number span {
		flex-direction: column;
		align-items: flex-start;
	}
}
/* 디자인의뢰 박스 END */


/* 총 금액 */
.total_bg {
	margin: 3rem 0;
	padding: 2rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: var(--size-radius-mid);
	background-color: var(--color-bg-light);
}
.total_bg .order_date {
	width: 100%;
	display: flex;
	align-items: baseline;
	justify-content: flex-start;
}
.total_price {
	width: 100%;
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: 1rem;
	font-size: 1.8rem;
	font-weight: var(--font-w-regular);
}
.total_price span {
	line-height: 1;
}
.total_price strong {
	font-size: 3.4rem;
	font-weight: var(--font-w-bold);
	color: var(--color-primary);
}
@media screen and (max-width: 599px) {
	.total_bg {
		flex-direction: column;
		gap: 1rem;
	}
	.total_bg .order_date {
		justify-content: center;
	}
	.total_bg .total_price {
		justify-content: center;
	}
}


/* 서브밋 타입 버튼 START */
.bottom_btn_wrapper {
    margin: 2rem 0;
	width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.bottom_btn_wrapper>div {
    display: flex;
	gap: 1rem;
}
.bottom_btn_wrapper button {
	min-width: 20rem;
    height: 5rem;
    font-size: var(--font-size-mid);
    font-weight: var(--font-w-mid);
}
@media screen and (max-width: 768px) {
	.bottom_btn_wrapper button {
		min-width: unset;
		flex-basis: calc((100% - 1rem)/2);
	}
	.bottom_fix {
		margin-left: -2rem;
		padding: 2rem;
		width: calc(100% - 4rem);
		position: fixed;
		bottom: 0;
		border-top: 1px solid var(--color-border-mideum);
		background-color: #fff;
	}
	.bottom_fix .bottom_btn_wrapper {
		margin: unset;
	}
}
/* 서브밋 타입 버튼 END */


/* 기간검색 START */
.date_search_container {
	margin: 2rem 0;
    display: flex;
	gap: 2rem;
}
.date_search_container .input_wrapper {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.date_search_container .input_wrapper span {
    display: flex;
    align-items: center;
    justify-content: center;
}
.date_search_container .input_wrapper span.span_date {
    flex-basis: 12rem;
}
.date_search_container .input_wrapper span input {
    text-align: center;
}
.date_search_container .date_btn_wrapper {
	width: 100%;
	display: flex;
	gap: 1rem;
}
.date_search_container .date_btn_wrapper button {
    flex-basis: 100%;
	min-width: 6rem;
    height: 4rem;
    color: #fff;
    font-size: 1.8rem;
    font-weight: var(--font-w-mid);
}
.date_search_container .date_btn_wrapper button.on {
    background-color: var(--color-second);
}
.date_search_container .date_btn_wrapper button.btn_light_gray_fill:hover {
    background-color: var(--color-second);
}
@media screen and (max-width: 768px) {
    .date_search_container {
        flex-direction: column;
    }
	.date_search_container .input_wrapper span.span_date {
		flex-basis: 100%;
	}
}
@media screen and (max-width: 479px) {
	.date_search_container .date_btn_wrapper {
		flex-wrap: wrap;
		justify-content: space-between;
	}
    .date_search_container .date_btn_wrapper button:not(:last-child) {
		min-width: unset;
		flex-basis: calc((100% - 2rem)/2);
	}
}
/* 기간검색 END */


/* 가로 스크롤 START */
.row_scroll {
	overflow: hidden;
}
.row_scroll .row_scroll_inner {
	width: max-content;
	min-width: 100%;
}
@media screen and (max-width: 768px) {
	.row_scroll {
		overflow-x: scroll;
		-ms-overflow-style: none;
		/* IE and Edge */
		scrollbar-width: none;
		/* Firefox */
	}
	.row_scroll::-webkit-scrollbar {
		display: none;
		/* Chrome, Safari, Opera*/
	}
}
/* 가로 스크롤 END */


/* 이미지 세로선 START */
.image_container_with_vline {
	position: relative;
	display: inline-block;
}
.image_container_with_vline::after {
	content: '';
	position: absolute;
	top: 25%;
    bottom: 25%;
    left: 50%;
    width: 1px;
	background-color: #888;
	transform: translateX(-50%);
}
/* 이미지 세로선 END */


/* 이미지 COVER START */
.img_container {
    position: relative;
	width: 100%;
}
.img_container::before {
    content: '';
    display: block;
    padding-bottom: 100%;
}
.img_container .img_wrapper {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: flex;
    align-items: center;
    justify-content: center;
	overflow: hidden;
//	background: var(--color-bg-light);
}
.img_container .img_wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.img_container .img_wrapper.scale-down img {
	width: 80%;
	height: 80%;
    object-fit: scale-down;
}
/* 이미지 COVER END */


/* 이미지 비율 보정 START */
.scale_img_container {
    /* margin: 2rem; */
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
}
.scale_img_container .scale_img_wrapper {
    position: relative;
    width: 50%; /* 원하는 너비 */
    max-width: 320px;
    max-height: 320px;
}
.scale_img_container .scale_img_wrapper::before {
    content: "";
    display: block;
    padding-top: 100%; /* 1:1 비율 */
}
.scale_img_container .scale_img_wrapper .scale_img  {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background:var(--color-bg-highlight);
    overflow: hidden;
    max-width: 320px;
    max-height: 320px;
}
/* 이미지 비율 보정 END */


/* 서브 공통 버튼 START */
.content .btn_bottom_wrapper{
    margin-top: 8rem;
}
.btn_wrapper {
    margin:1.2rem auto;
	width: 100%;
	display: flex;
	justify-content: center;
    flex-direction: row;
	gap: 1rem;
}
/* 서브 공통 버튼 END */


/* 장바구니/1:1문의 내용 없을 시 노출 START */
.not_list {
    padding: 4rem 0;
    text-align: center;
    border-top: 1px solid var(--color-border-mideum);
    border-bottom: 1px solid var(--color-border-mideum);
}
/* 장바구니/1:1문의 내용 없을 시 노출 END */


/* 슬라이드 페이지 네비 텍스트 START */
.page_navi_text {
    color: #bbb;
    font-weight: var(--font-w-mid);
}
.page_navi_text span:first-child {
    color: var(--color-font-basic);
}
/* 슬라이드 페이지 네비 텍스트 END */


/* 팝업 이미지 분할 레이아웃 START */
.container_divide {
	width: 100%;
    display: flex;
    justify-content: center;
    gap: 2rem;
}
/* 팝업 이미지 분할 레이아웃 END */


/* 팝업 이미지 가로 고정 START */
.mx-width-320 {
    max-width: 320px;
}
/* 팝업 이미지 가로 고정 END */


/* 팝업 파일업로드 (공통) START */
.file_wrapper {
	display: flex;
    flex-direction: row;
    gap: 1rem;
}
.file_wrapper .btn_file_box_wrapper {
    width: calc(100% - 9rem);
    position: relative;
}
.file_wrapper .btn_file_box_wrapper input[type=text]:disabled {
	color: var(--color-font-basic);
}
.file_wrapper .btn_close_gray {
    width: 1.6rem;
    height: 1.6rem;
    position: absolute;
    top: 0;
    right: 0;
    top: 50%;
    right: 0%;
    transform: translate(-1rem,-50%);
}
.file_wrapper .btn_search {
    width: 8rem;
    height: 4rem;
    font-size: var(--font-size-x-small);
}
/* 팝업 파일업로드 (공통) END */


/* 적립금 색상 START */
.text_plus {
	color: var(--color-primary);
	font-weight: var(--font-w-mid);
}
.text_minus {
	color: var(--color-point);
	font-weight: var(--font-w-mid);
}
/* 적립금 색상 END */