@charset "utf-8";
/* --------------------------------------------------------------------------- */
/* [통합] root */
:root{
	/* 컨텐츠사이즈 */
	--cont-width:1440px;
	--cont-width-proc:990px;
	--root-font-size:62.5%; 
	--form-height:5.6rem; /* 인풋류 */
	--form-height-sm:4rem;

	/* Gray 색상단계 (표준그레이스케일) */
	--gray-0:  #ffffff;
	--gray-5:  #F7F7F7;
	--gray-10: #F2F2F2;
	--gray-20: #EEEEEE;
	--gray-25: #E9E9E9;
	--gray-30: #DDDDDD;
	--gray-45: #CCCCCC;
	--gray-40: #999999;
	--gray-50: #666666;
	--gray-60: #5C5C5C;
	--gray-70: #4B4B4B;
	--gray-80: #222222; 
	--gray-90: #1C1C1C;
	--gray-95: #0C0D0D;
	--gray-100: #000000;
	/* Primary 색상(#006241 기반) */
	--primary-5:  #e1f2ed;
	--primary-10: #b3dfd0;
	--primary-20: #80ccb1;
	--primary-30: #4db994;
	--primary-40: #26a87f;
	--primary-50: #006241;  /* 기본값 */
	--primary-60: #005739;
	--primary-70: #004D33;
	--primary-80: #003d26;
	--primary-90: #002e1c;
	/* Secondary 색상(#D1CCBD 기반) */
	--secondary-5:  #F9F6F1;
	--secondary-10: #F5EFE5; /* F2EEE8 >> F5EFE5 */
	--secondary-20: #EBE4D8;
	--secondary-30: #F0E5D2;
	--secondary-40: #E2DDD0;
	--secondary-50: #D1CCBD;  /* 기본값 */
	--secondary-60: #CAC3AC;
	--secondary-70: #B9B5A8;
	--secondary-80: #8B887D;
	--secondary-90: #726F64;
	/* 기타서브컬러 */
	--color-sub-1: #c8b784; /* 샌드브라운  */
	--color-sub-2: #382f2d; /* 딥브라운 */
	--color-sub-3: #f4f1ec; /* 소프트화이트 */
	--color-sub-4: #f4f9f6; /* 화이트 */
	--color-sub-5: #212322; /* 블랙 */
	--color-sub-6: #cddce0; /* 페일블루 */
	--color-sub-7: #e6e5cb; /* 엘로그레이 */
	--color-sub-8: #8c9d82; /* 카키그레이 */
	--color-sub-9: #ccd9b9; /* 소프트그린 */
	--color-sub-10: #EEE7DC; /* EEE7DC */
	--color-red: #FF0C0C; /* 레드 */
	/* 색상사용 */
	--normal:var(--gray-50); /* gray */
	--normal-default:var(--gray-0);
	--normal-hover:var(--gray-20);
	--normal-active:var(--gray-20);
	--normal-selected:var(--gray-20);
	--normal-disabled:var(--gray-30);	
	--primary:var(--primary-50);
	--primary-default:var(--primary-50);
	--primary-hover:var(--primary-50);
	--primary-active:var(--primary-50);
	--primary-selected:var(--primary-70);
	--primary-disabled:var(--primary-50);
	--secondary:var(--secondary-50);
	--secondary-default:var(--secondary-50);
	--secondary-hover:var(--secondary-50);
	--secondary-active:var(--secondary-50);
	--secondary-selected:var(--secondary-50);
	--secondary-disabled:var(--secondary-50);
	--white:var(--gray-0);
	--black:var(--gray-100);
	/* background-color */
	--bg-color-light:var(--gray-0);
	--bg-color-low:var(--gray-5); /* #F7F7F7 */
	--bg-color:var(--gray-10); /* :#F2F2F2 */
	--bg-color-deep:var(--gray-30); /* #DDDDDD */
	--bg-color-dark:var(--gray-100);
	--bg-color-selected:var(--gray-20); /* #EEEEEE */
	--bg-color-disabled:var(--gray-30); /* #DDDDDD */
	/* border */
	--border-radius-sm:3px;
	--border-radius:5px;
	--border-radius-lg:10px;
	--border-radius-xl:15px; 
	--border-radius-2xl:40px; 
	--border-radius-3xl:6rem; 
	--border-radius-4xl:12rem; 
	--border-radius-max:50%; /* 999 */
	--border-width-sm:0.5px;
	--border-width:1px;
	--border-color-light:var(--gray-0);
	--border-color:var(--gray-30); /* #DDDDDD */
	--border-color-dark:var(--gray-100);
	--border-color-selected:var(--gray-20); /* #EEEEEE */
	--border-color-disabled:var(--gray-40); /* #999999 */
	--border:1px solid var(--border-color);
	/* padding */
	--padding-xs:0.3rem;
	--padding-sm:0.5rem;
	--padding:1rem;
	--padding-lg:1.5rem;
	--padding-xl:2rem;	
	--padding-2xl:2.5rem;
	--padding-3xl:3rem;
	--padding-4xl:5rem;
	--padding-5xl:7rem;
	--padding-6xl:9rem;
	--padding-between:10rem;
	--padding-section:10rem;
	/* z-index */
	--z-index-low:-1;
	--z-index:1;
	--z-index-middle:10;
	--z-index-top:100; /* 높음 */
	--z-index-high:999;	/* 헤더급 */
	--z-index-max:9999; /* 팝업급 */
	/* icon */
	--icon-size-xs:1.6rem;
	--icon-size-sm:1.8rem;
	--icon-size:2.4rem;
	--icon-size-lg:3.2rem;
	--icon-size-xl:4rem;
	--icon-size-2xl:4.8rem;
	--icon-size-3xl:5.6rem;
	/* font */
	--font-family: "Pretendard", "Noto Sans KR", "돋음", "Dotum","Apple SD Gothic","sans-serif";
	--font-family-sub1: "NanumBarunpenOTF", sans-serif; /* 나눔바른펜 - 사용중지20251020 */
	--font-family-sub2: "InkLipquid", sans-serif; /* 더페이스샵 잉크립퀴드 - 사용중지20251020 */
	--font-family-sub3: "Sansita", sans-serif; /* 구글 산시타 */
	--font-family-sub4: "Bodoni Moda", serif; /* 구글 보도니 모다 */
	--font-family-sub5: "iceJaramRg" , serif; /* 인천교육자람 */
	--font-family-sub6: "Noto Serif KR", serif; /* 구글 노토세리프  */
	/* 글자_크기 */
	--font-size-xs:1.3rem; 
	--font-size-sm:1.4rem;
	--font-size:1.6rem;
	--font-size-lg:1.8rem;
	--font-size-xl:2rem;
	--font-size-2xl:2.4rem;
	--font-size-3xl:2.8rem;
	--font-size-4xl:3.2rem; /* 3.6rem>>3.2rem */
	--font-size-5xl:5rem; /* 요청사항 : line-height는 130%로(--font-size-xs) 사용 20251020 */
	/* 이후사이즈는 별도시술상세에서 사용 */
	--font-size-6xl:6rem;
	--font-size-7xl:7rem;
	/* 글자_굵기 : 100 Thin / 200 ExtraLight / 300 Light / 400 Regular / 500 Medium / 600 SemiBold / 700 Bold / 800 ExtraBold / 900 Black */
	--font-weight-light:200;
	--font-weight:300; 
	--font-weight-medium:500;
	--font-weight-semibold:600;
	--font-weight-bold:700;
	/* 글자_줄간격 */
	--line-height-2xs:1.2em;
	--line-height-xs:1.3em; /* --font-size-5xl와 세트값 수정금지 */
	--line-height-sm:1.4em;
	--line-height:1.6em;
	--line-height-cont:1.6em; 
	/* 글자_색상 */
	--font-color-light:var(--gray-0); /* #ffffff */
	--font-color-lowlow:var(--gray-40); /* 999999 */
	--font-color-low:var(--gray-50); /* #666666 */
	--font-color:var(--gray-80); /* #222222 */
	--font-color-dark:var(--gray-100); /* #000000 */
	--font-color-selected:var(--primary-selected); /* 메인컬러 */
	--font-color-disabled:var(--gray-40); /* #999999 */
	--font-color-none:var(--gray-30); /* #DDDDDD */
	/* style */
	--box-shadow-in:inset 0px 0px 5px 0px rgba(0, 0, 0, 0.15);
	--box-shadow-sm:0px 0px 6px 0px rgba(0, 0, 0, 0.1);
	--box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.15);
	--box-shadow-focus:0 0 0 0.1rem var(--primary), 0px 0px 5px 3px rgba(38, 168, 127, 0.3); 
	--box-shadow-light:0px 0px 10px 0px rgba(255, 255, 255, 255.15);
	--overlay-light: rgba(255, 255, 255, 0.5);
	--overlay-dark: rgba(0, 0, 0, 0.4);	
	--overlay-bg:rgba(0, 0, 0, 0.6);  /* 팝업 */
	--transition: all 1s ease;
	--transition-view: opacity 240ms ease, visibility 240ms ease; /* opacity 필요!! */
	--transition-tiem: 400ms;
	--transition-motion: transform 0.5s ease, opacity 0.5s ease;
	/* 이미지비율 */
	--image-ratio-square: 1/1; 				/* 정사각 */
	--image-ratio-movie: 16/9;				/* 영상 */
	--image-ratio-shorts: 9/16; 			/* 숏츠 */
	--image-ratio-drimg: 404/380;			/* 의료진사진 */
	--image-ratio-board: 1080/1350;  		/* 썸네일기본(공지사항기준) */
	--image-ratio-event: 342/400; 			/* 이벤트썸네일 */
	--image-ratio-bnf: 378 /218; 			/* 시술전후 */
	--image-ratio-device: 400 /400; 		/* 제품장비 */
	/* 컨텐츠별용별도지정 */
	--stepbody-padding:var(--padding-3xl);
}


@media (min-width: 768px) and (max-width: 991.98px) {
:root{
	/* 컨텐츠사이즈 */
	--cont-width:100%;
	--cont-width-proc:100%;
	--root-font-size:58.5939%; /* 58.5939%=15px */
}
} 



@media (max-width: 767.98px) {/* 모바일 only: ~767.98px 스마트폰 전용 스타일 */
:root{
	/* 컨텐츠사이즈 */
	--cont-width:100%;
	--cont-width-proc:100%;
	--root-font-size:54.6874%;; /* 54.6874%=13px */
	/* 컨텐츠별용별도지정 */
	--stepbody-padding:var(--padding-lg);

	/* 글자_크기 */
	--font-size-4xl:3.2rem;
	--font-size-5xl:3.8rem;
	--font-size-6xl:4rem;
}
}


/* 폰트페밀리(일부시술페이지에서사용) */
@font-face{font-family:'iceJaramRg';src:url('/assets/font/icejaramRg.ttf') format('truetype'); font-weight:normal; font-style:normal;}


/* --------------------------------------------------------------------------- */
/* 통합기본세팅 color:inherit; */
*{box-sizing:border-box; outline:none; -webkit-tap-highlight-color:transparent;  line-height:var(--line-height); font-weight:inherit;}
html, body{margin:0; padding:0;}
html{width:100%; height:100%; scroll-behavior:smooth; font-size:var(--root-font-size); font-family:var(--font-family);}
body{width:100%; min-width:var(--cont-width); min-height:100%; color:var(--font-color); font-size:var(--font-size); font-weight:var(--font-weight); line-height:inherit; word-break:keep-all;} 
div, a, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, q, blockquote, caption, th, td, abbr, acronym, address, cite, code, ins, small, big, em, sub, sup{font-size:inherit; color:inherit; font-weight:inherit; padding:0; margin:0;}
ul,ol{list-style:none; list-style-position:inside;}
a{cursor:pointer; transform:var(--transition);}
a, a:hover, a:active, a:focus{color:inherit; text-decoration:none; outline:none;}
h1,h2,h3,h4,h5,h6{margin:0; padding:0;}
img, fieldset, iframe, form{border:0 none;}
img{width:auto; max-width:100%; border:none;} /* width:100%; max-width:fit-content; */
hr{border:0px; border-top:var(--border);}
input, textarea, select, img{vertical-align:middle;}
address, abbr, address, cite, code, ins, sub, sup,  i, small, big, em{font-weight:var(--font-weight); font-style:normal;}
small, big, em{font-size:inherit;}
time, progress, mark, output{}
article, aside, figure, figure img, figcaption, hgroup, footer, header, main, nav, section, label, video, object {}
abbr,acronym{border:0;}
q:before,
q:after{content:'';}
table{table-layout:fixed; border-collapse:collapse; border-spacing:0;}
button{border:none; cursor:pointer; margin:0; padding:0; background:none;}
label{cursor:pointer;}
input{vertical-align:middle; background:none; border:none; border-radius:0; padding:0px; margin:0px; } 
input:-webkit-autofill{-webkit-box-shadow: 0 0 0 1000px white inset;} /* 자동완성배경색제거  */
input::placeholder,
textarea::placeholder{color:var(--font-color-low);} /* 비활성화상태 */
select{background:none; vertical-align:middle; background:none; border:none; border-radius:0; padding:0px; margin:0px;}
textarea{}
fieldset{}
fieldset legend{}
[role="button"]{cursor:pointer;}
pre{font-family:inherit;} 
pre img{height:auto !important;} /* 에디터에서 이미지에 입력된 사이즈값 초기화 */
@media (max-width: 767.98px) { 
pre img{width:100% !important; height:auto !important;} 
}

.Hr{display:block; position:relative; margin:5rem auto !important;}
.hide{display:none !important;} 
@media (max-width: 767.98px) { /* 모바일 only: ~767.98px 스마트폰 전용 스타일 */
body{min-width:var(--cont-width);}
	.Hr{margin:var(--padding-xl) auto !important;}
}



/*

div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, main, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, textarea, select, button{}
 */


/* 컨테츠(스크롤바) : 최소높이별도지정  max-height:50dvh; */
.scrollBox{display:block; position:relative; width:100%; overflow-y:auto;}
.scrollBox::-webkit-scrollbar{width:1rem; /* 세로 스크롤바 너비 */ background:var(--gray-20); /* 트랙 배경색 */ border-radius:var(--border-radius-lg);}
.scrollBox::-webkit-scrollbar-thumb{background:var(--gray-45); /* 스크롤바 색 */ border-radius:var(--border-radius-lg); /* 둥근 모서리 */ border:var(--bg-color); /* 트랙과 구분선 */ }
.scrollBox::-webkit-scrollbar-thumb:hover{background:var(--primary-selected);}

/* --------------------------------------------------------------------------- */	
/* PC에만 표기 */
.onlyPC{display:inline;}
@media screen and (max-width:768px) {
.onlyPC{display:none !important;}
}

@media (min-width: 768px) and (max-width: 991.98px) { 
.onlyMO{display:none !important;}
}

/* MO에만 표기 */
.onlyMO{display:none !important;}
@media (max-width: 767.98px) {
.onlyMO{display:inline-block !important;}
}




/* --------------------------------------------------------------------------- */	
 /* 아이콘(스크립트삽입필수) */
 .icon{display:inline-block; height:var(--icon-size); max-height:6.4rem; max-width:6.4rem; aspect-ratio:1/1; fill:currentColor; vertical-align:middle; transform-origin:center center; transition:var(--transition-motion); mask-repeat:no-repeat; mask-position:center; mask-size:contain; -webkit-mask-repeat:no-repeat; -webkit-mask-position:center; -webkit-mask-size: contain; }
.icon.icon-youtube{aspect-ratio: 7 / 5; width:auto;} /* 비율다름 */
/*

$(function(){
	$('.icon').each(function(){
		var $svg = $(this);
		if($svg.find('use').length) return;
		
		var iconClass = $svg.attr('class').split(' ').find(c => c.startsWith('icon-') && c !== 'icon');
		if(!iconClass) return;
		
		var iconName = iconClass.replace('icon-', '');
		$svg.html(`<use href="/assets/images/icon.svg#icon-${iconName}" />`);
	});
});
*/

/* --------------------------------------------------------------------------- */	
/* 영상 */
.iframeMovie{position:relative; width:100%; padding-bottom:56.25%; height:0; aspect-ratio:var(--image-ratio-movie); overflow:hidden;}
.iframeMovie iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}
.iframeMovie video{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}
.iframeShorts{position:relative; width:100%; padding-top:177.77%;  height:0; aspect-ratio:var(--image-ratio-shorts); overflow:hidden;}
.iframeShorts iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}
.iframeShorts video{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}

/* --------------------------------------------------------------------------- */	
/* 선택입력류 */
label{display:inline-flex; justify-content:stretch; align-items:center; gap:0.5rem;}
label span{text-align:left;}
label + label{margin-left:var(--padding);}
label input:disabled ~ span{color:var(--font-color-low);}

/* [인풋] 텍스트 */
.input[type=text]{position:relative; display:inline-block; min-height:var(--form-height); justify-content:center; align-items:center; background-color:var(--bg-color-light); border:var(--border); transition:var(--transition); border-radius:var(--border-radius-sm); padding:var(--padding) var(--padding);}
.input[type=text]:focus{border-color:var(--primary); box-shadow:var(--box-shadow-focus);}
.input[type=text]:disabled{color:var(--font-color-low); background-color: var(--bg-color-deep); cursor:not-allowed;}
.input[type=text]:disabled:focus{}

/* [인풋] 체크기본 */
input[type=checkbox]{position:relative; display:inline-block; width:2rem; height:2rem; aspect-ratio:1/1; justify-content:center; align-items:center; appearance:none; -webkit-appearance:none; -moz-appearance:none; background-color:var(--bg-color-deep); accent-color:var(--primary); transition:var(--transition); cursor:pointer; overflow:hidden; border-radius:var(--border-radius-max);}
input[type="checkbox"]::after{content:""; position:absolute; top:10%; left:30%; width:30%; height:55%; border-width:0 0.18em 0.18em 0; border-style:solid;  border-color:var(--bg-color-light); transform:rotate(45deg);}
input[type="checkbox"]:checked{border-color:var(--primary); background-color:var(--primary);}
input[type="checkbox"]:checked:disabled,
input[type="checkbox"]:checked:disabled ~ span{cursor:not-allowed;}
input[type="checkbox"]:disabled,
input[type="checkbox"]:disabled ~ span{cursor:not-allowed;}
input[type="checkbox"]:disabled:hover{box-shadow:none;}
input[type="checkbox"]:not(:disabled):hover{box-shadow:var(--box-shadow);}
/* [인풋] 라디오기본 */
input[type=radio]{position:relative; display:inline-block; width:2rem; height:2rem; aspect-ratio:1/1; justify-content:center; align-items:center; appearance:none; -webkit-appearance:none; -moz-appearance:none; accent-color:var(--primary); border:1px solid var(--gray-30); transition:var(--transition); cursor:pointer; overflow:hidden; border-radius:50%;}
input[type="radio"]::after{content:""; position:absolute; border:0.2em solid var(--border-color-light); top:0px; right:0px; bottom:0px; left:0px; border-radius:50%; background-color:var(--bg-color-light);} 
input[type="radio"]:checked{border-color:var(--primary);}
input[type="radio"]:checked::after{background-color:var(--primary);}
input[type="radio"]:checked:disabled,
input[type="radio"]:checked:disabled ~ span{cursor:not-allowed;}
input[type="radio"]:disabled,
input[type="radio"]:disabled ~ span{cursor:not-allowed;}
input[type="radio"]:disabled:hover{box-shadow:none;}
input[type="radio"]:not(:disabled):hover{box-shadow:var(--box-shadow);}
/* [인풋] 라디오를 체크처럼보이게  */
.likeCheck{}
.likeCheck input{position:relative; display:inline-block; width:2rem; height:2rem; aspect-ratio:1/1; justify-content:center; align-items:center; appearance:none; -webkit-appearance:none; -moz-appearance:none; background-color:var(--bg-color-deep); accent-color:var(--primary); transition:var(--transition); cursor:pointer; overflow:hidden; border-radius:var(--border-radius-max);				border:none;} /* 겹치는사항 조정함 */
.likeCheck input::after{content:""; position:absolute; top:10%; left:30%; width:30%; height:55%; border-width:0 0.18em 0.18em 0;  border-style:solid; border-color:var(--bg-color-light); transform:rotate(45deg); 			border-radius:0px; background-color:transparent !important;} /* 겹치는사항 조정함 */
.likeCheck input:checked{border-color:var(--primary); background-color:var(--primary);}
.likeCheck input:checked:disabled,
.likeCheck input:checked:disabled ~ span{cursor:not-allowed;}
.likeCheck input:disabled,
.likeCheck input:disabled ~ span{cursor:not-allowed;}
.likeCheck input:disabled:hover{box-shadow:none;}
.likeCheck input:not(:disabled):hover{box-shadow:var(--box-shadow);}



/* ------------------------- */	
/* [체크박스] 드레그체크박스 */
.dragcheckListArea{display:block; position:relative;} 
	.dragcheckItem{display:inline-flex; text-align:center; transition:var(--transition);}
	.dragcheckItem input{}
	.dragcheckItem input ~ span{}
	.dragcheckItem + .dragcheckItem{}


/* 스위치(체크형기본) */
.switchCheck{display:inline-block; position:relative; }
.switchCheck input{display:none;} /* 일단숨김 */
.switchCheck label{display:block; position:relative; width:4rem; height:2.4rem; border-radius:var(--border-radius-2xl); background-color:var(--bg-color-selected); transition:var(--transition); overflow:hidden; cursor:pointer;}
.switchCheck .button{position:absolute; top:4px; left:3px; display:block; width:1.6rem; height:1.6rem; border-radius:50%; background-color:var(--bg-color-light); transition:all 0.3s cubic-bezier(0.275, -0.45, 0.725, 1.45); z-index:1;} /* 진짜button을 사용하면 원형클릭시 on/off 작동되지 않음 */
.switchCheck input:active + label,
.switchCheck input:checked + label{background-color:var(--primary);}
.switchCheck input:active + label .button,
.switchCheck input:checked + label .button{left:48%;} /* calc(100% - 1.6rem - 3px) */
.switchCheck label + label{margin-left:0px;}
.switchCheck label:hover{box-shadow:var(--box-shadow);}
	/* 스위치(체크형기본_문구) */
	.switchCheck label::before,
	.switchCheck label::after{z-index:2;} 
	.switchCheck label::before{content:attr(data-expose-left); display:inline-block; position:absolute; top:15%; left:11%;} 
	.switchCheck label::after{content:attr(data-expose-right); display:inline-block; position:absolute; top:15%; right:15%;} 
	.withText{}
	.withText label{min-width:8rem;}
	.withText .button{width:50%; border-radius:3rem;}
	.withText input:not(:checked) ~ label::after{}
	.withText input:checked ~ label::before{color:var(--font-color-light);}
	.withText label[data-width="8"]{min-width:8rem;}
	.withText label[data-width="9"]{min-width:9rem;}
	.withText label[data-width="10"]{min-width:10rem;}
	.withText label[data-width="11"]{min-width:11rem;}
	.withText label[data-width="12"]{min-width:12rem;}
	.withText label[data-width="13"]{min-width:13rem;}

	/* .switchCheck button{position:absolute; top:4px; left:3px; display:block; width:1.6rem; height:1.6rem; border-radius:50%; background-color:var(--bg-color-light); transition:all 0.3s cubic-bezier(0.275, -0.45, 0.725, 1.45); z-index:1;}
	.switchCheck input:active + label button,
	.switchCheck input:checked + label button{left:48%;}
	.withText button{width:50%; border-radius:3rem;} */


/* 스위치(라디오) */
.switchRadio{}
.switchRadio{display:inline-flex; position:relative; flex-direction:row; flex-wrap:nowrap; justify-content:center; align-items:center; border:var(--border); border-radius:var(--border-radius-2xl); background-color:var(--bg-color); overflow:hidden;}
.switchRadio label{display:inline-block; position:relative; flex:0 1 auto;  align-self:center; height:inherit; text-align:center;}
.switchRadio label+ label{border-left:1px solid #e5e5e5;}
.switchRadio input{display:none;} /* 일단숨김 */
.switchRadio input:checked + span{color:#fff; background-color:var(--primary);}
.switchRadio span{display:block; width:100%; height:inherit; font-style:normal; padding:0.3rem 1rem; transition:var(--transition); overflow:hidden; cursor:pointer;}
.switchRadio label + label{margin-left:0px;}
.switchRadio:hover{box-shadow:var(--box-shadow);}

/* 스위치(라디오-무빙) */
.switchRadio_move{display:inline-flex; position:relative; flex-direction:row; flex-wrap:nowrap; justify-content:center; align-items:center; background-color:#f8f9fa; border:var(--border); border-radius:var(--border-radius-2xl); transition:var(--transition); overflow:hidden;}
.switchRadio_move input{display:none;}
.switchRadio_move label{display:inline-block; position:relative; flex:0 1 auto; align-self:center; height:inherit; text-align:center; padding:0.3rem 1rem; cursor:pointer; z-index:2; }
.switchRadio_move button{display:block; position:absolute; top:2px; left:2px; bottom:2px; width:50%; border:var(--border); border-radius:var(--border-radius-2xl); transition:var(--transition); background-color:var(--bg-color-light); z-index:1;}
.switchRadio_move input:checked{z-index:1;}
.switchRadio_move input.radio-a:checked ~ button{left:2px;} /* off */
.switchRadio_move input.radio-b:checked + label{color:var(--font-color-light);} /* on */
.switchRadio_move input.radio-b:checked ~ button{left:48%; border-color:var(--primary); background-color:var(--primary);}
.switchRadio_move:hover{box-shadow:var(--box-shadow);}


/* ------------------------- */	
/* 셀렉트 */
.select{display:inline-block; min-height:var(--form-height); border:var(--border); border-radius:var(--border-radius-sm); padding:1rem 4rem 1rem 1rem; transition:var(--transition);
	appearance:none; -webkit-appearance:none; -moz-appearance:none; background:url("data:image/svg+xml;utf8,<svg fill='none' height='1.4rem' viewBox='0 0 24 24' width='1.4rem' xmlns='http://www.w3.org/2000/svg'><path d='M6 9l6 6 6-6' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 0.75rem center;  background-color:var(--bg-color-light);}
.select option{appearance:none; -webkit-appearance:none; -moz-appearance:none;}
.select[multiple]{height:auto; background:none; padding-right:0.5rem;}
.select[multiple] option{padding:var(--padding-sm);}
.select:valid{}
.select:focus{border-color:var(--primary); box-shadow:var(--box-shadow-focus);}

/* 텍스트영역 */
textarea{display:block; width:100%; border:var(--border); border-radius:var(--border-radius-lg); resize:none; padding:var(--padding-lg); transition:var(--transition);}
textarea:focus{border-color:var(--primary); box-shadow:var(--box-shadow-focus); }
textarea[readonly]{transition:none; pointer-events:none; background-color:light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));}
textarea:disabled{}

/* 텍스트표기 */
 pre{display:block; position:relative; width:100%; white-space:normal;}
 pre:focus{border-color:var(--primary); box-shadow:var(--box-shadow-focus); transition:var(--transition);}
 pre.Box{border-radius:var(--border-radius-sm); background-color:var(--bg-color); padding:var(--padding) var(--padding);}


/* 커스텀셀렉트 */
.customSelect{display:block; position:relative; width:100%;}
.customSelect .select-header{display:flex; position:relative; flex-direction:column;}
	/* 셀렉트박스 */
	.customSelect .selectBar{display:flex; position:relative; width:100%; height:var(--form-height); flex-direction:row; justify-content:flex-start; align-items:center; gap:var(--padding-sm) var(--padding); border:var(--border); border-radius:var(--border-radius);  background-color:var(--bg-color-light); padding:var(--padding); cursor:pointer;}
	.customSelect .selectBar .label{flex:1; display:flex; position:relative; align-items:center;}
	.customSelect .selectBar .button{display:flex; position:relative; align-items:center;}
	.customSelect .selectBar .toggleIcon{display:inline-flex; align-items:center; transition:var(--transition-time);}
	.customSelect .selectBar:focus{box-shadow:var(--box-shadow-focus);}
	/* 옵션박스 */
	.customSelect .select-options{position:absolute; left:0; top:100%; margin-top:-1px; width:100%; max-height:26dvh; border:var(--border); border-radius:0px 0px var(--border-radius) var(--border-radius); background-color:var(--bg-color-light); z-index:var(--z-index-top); box-shadow:var(--box-shadow);  display:none;} /*  일단숨김 , 옵션3개보이게 */
	.customSelect .select-options .options{display:flex; position:relative; justify-content:space-between; align-items:center;  border-top:var(--border); padding:var(--padding); cursor:pointer;}
	.customSelect .select-options .options:first-child{border-top:none;}
	.customSelect .select-options .options:hover{background-color:var(--bg-color-low);}
	.customSelect .select-option.scrollBox{}
	/* 별도상태 */
	.customSelect.open .selectBar{border-bottom-left-radius:0px; border-bottom-right-radius:0px;}
	.customSelect.open .selectBar .toggleIcon{}
	.customSelect.closed .selectBar .toggleIcon{transform:rotate(180deg);}



/* ------------------------- */	
/* 버튼 */
.Btn{display:inline-flex; position:relative; min-height:var(--form-height); justify-content:center; align-items:center; gap:var(--padding-sm); font-size:var(--font-size); font-weight:var(--font-weight-semibold); text-align:center; border:var(--border); border-radius:var(--border-radius); background-color:var(--bg-color-light); padding:var(--padding) var(--padding-lg); transition:var(--transition); cursor:pointer; }
.Btn + .Btn{margin-left:var(--padding);}
.Btn.Active{color:var(--font-color-selected); background-color:var(--bg-color-selected);}
.Btn.Disabled, .Btn.Disabled:hover,
.Btn:disabled, .Btn:disabled:hover{color:var(--font-color-disabled) !important; border-color:var(--border-color-disabled); background-color:var(--bg-color-disabled) !important; cursor:not-allowed;}
.Btn:not(.Disabled):not(:disabled){}
.Btn:not(.Disabled):not(:disabled):hover{box-shadow:var(--box-shadow);}
	/* 크기 */
	.btn-sm{min-height:var(--form-height-sm); padding:var(--padding-xs) var(--padding-lg);}
	.btn-md{}
	.btn-lg{font-size:var(--font-size-lg); font-weight:var(--font-weight-semibold);}
	/* 모양 */
	.btn-radius{border-radius:var(--border-radius-2xl);} /* 탕원형 */
	/* 스타일 */
	.btn-primary{color:var(--primary); border-color:var(--primary);}
	.btn-primary.full{color:var(--font-color-light); background-color:var(--primary);}
	.btn-primary.full.Active{background-color: var(--primary-selected);}
	.btn-primary.full.Disabled,
	.btn-primary.full:disabled{border-color:transparent !important;}
	.btn-transparent{border-color:transparent !important;}
	.btn-transparent:disabled,
	.btn-transparent.Disabled{border-color:transparent !important;}
	.btn-transparent:not(.Disabled):not(:disabled):hover{color:var(--primary); }
	.btn-transparent.Active{}
	.btn-ghost{border-color:transparent !important; background-color:transparent !important;;}
	.btn-ghost:disabled,
	.btn-ghost.Disabled{border-color:transparent !important; background-color:transparent !important;}
	.btn-ghost:not(.Disabled):not(:disabled):hover{color:var(--primary); }
	.btn-ghost.Active{background-color:transparent;}
	/* 배지 */
	.Btn .badge{display:inline-flex; position:absolute; right:0px; top:0px; color:var(--font-color-light); font-size:var(--font-size-xs); border-bottom-left-radius:var(--border-radius); background-color:var(--primary); padding:0px var(--padding);}
	/* 더보기효과(선을그림자로줘야틈이안생김) */
	.motionBtn{min-width:15rem;	box-shadow:inset 0 0 0 1px var(--primary); background-color:transparent; transition:color 0.4s ease; overflow:hidden;}
	.motionBtn span{display:inline-flex; z-index:var(--z-index);}
	.motionBtn .icon{height:var(--icon-size-sm); transition:width 0.5s ease; z-index:var(--z-index);}
	.motionBtn::before{content:""; position:absolute; top:0px; left:0px; bottom:0px; width:0%; height:100%; background-color:var(--primary); border-radius:var(--border-radius-2xl); transition:width 0.5s ease; z-index:0;}
	.motionBtn:hover::before{width:100%;}
	.motionBtn:hover{color:var(--font-color-light); animation:motionBtn-changeBg 3s forwards;}
	.motionBtn:hover .icon{}
		/* 애니메이션 좀더부드러운느낌위해 */
		@keyframes motionBtn-changeBg{
			20% { background-color:var(--primary); } 
			100% { background-color:var(--primary); }
		}


@media (max-width: 767.98px) { /* 모바일 only: ~767.98px 스마트폰 전용 스타일 */
/* 버튼 */
.Btn{padding:var(--padding-xs) var(--padding);}
}







/* ------------------------- */
/* 체크라디오버튼형 */
.labelBtn{display:inline-flex; position:relative; justify-content:center; align-items:center;}
.labelBtn input{display:none;}
.labelBtn span{display:inline-flex; position:relative; width:100%; min-height:var(--form-height); justify-content:center; align-items:center; font-size:var(--font-size); font-weight:var(--font-weight-semibold); border:var(--border); border-radius:var(--border-radius-sm); background-color:var(--bg-color-light); padding:var(--padding) var(--padding-lg); transition:var(--transition); cursor:pointer; }
.labelBtn input:checked ~ span{color:var(--bg-color-light); background-color:var(--primary);}
.labelBtn input:checked:disabled ~ span{color:var(--bg-color-light); background-color:var(--primary-selected) !important;}
.labelBtn input:disabled ~ span{color:var(--font-color-disabled); border-color:transparent !important; background-color:var(--bg-color-disabled) !important; cursor:not-allowed;}
.labelBtn input:disabled ~ span:hover{box-shadow:none;}
.labelBtn:hover input:not([disabled]) ~ span{box-shadow:var(--box-shadow);}


/* ------------------------- */
/* 탭영역 */
.tabWrap{}
.tab-container{display:flex; position:relative; flex-direction:column; gap:var(--padding-xl);}
.tab-header{display:flex; position:relative; flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center; gap:var(--padding);}
.tab-header .tab-button{transition:var(--transition);}
.tab-header .tab-button.Active{}
.tab-body{display:block; position:relative;}
.tab-content{}
	/* 제이쿼리ui일때 */
	.ui-tabs-nav.tab-header{}
	/* 애니메이션 */
	@keyframes tabFadein{from{opacity:0; }to{opacity:1; }}

/* 탭메뉴 */
.tabMenuList{display:flex; position:relative; flex-direction:row; width:100%; flex-wrap:wrap; justify-content:flex-start; align-items:center; gap:var(--padding-lg);}
.tabMenuList > *,
.tabMenuList li{display:inline-flex; position:relative;}
	/* 탭버튼(기본 버튼 스타일을 적용한 타입) */
	.tabBtn{display:inline-flex; position:relative; flex-direction:row; justify-content:center; align-items:center; color:var(--font-color-low); font-size:var(--font-size); font-weight:var(--font-weight-semibold); border-radius:var(--border-radius); background-color:var(--bg-color-selected); padding:var(--padding) var(--padding-xl); transition:var(--transition); cursor:pointer;}
	.tabBtn span{display:inline-block; position:relative;}
	.tabBtn span::after{content:''; display:inline-block; position:absolute; width:0.4rem; height:0.4rem; right:-0.8rem; top:-0rem; border-radius:var(--border-radius-max); background-color:var(--font-color-light); display:none;} /* 일단숨김 */
	.tabBtn.Active{color:var(--font-color-light); background-color:var(--primary);}
	.tabBtn.Active span::after{display:inline-block;}
	.tabBtn.btn-lg{font-size:var(--font-size-lg); padding:var(--padding-xl) var(--padding-xl);}
	.tabBtn:hover{box-shadow:var(--box-shadow);}
		/* 제이쿼리탭메뉴에삽입된상태일때 */
		.ui-tabs-active{}
		.ui-tabs-active .tabBtn{color:var(--font-color-light); background-color:var(--primary);}
		.ui-tabs-active .tabBtn span::after{display:inline-block;}
	/* 탭메뉴(일반 메뉴 타입) */
	.tabMenu{display:inline-flex; position:relative; flex-direction:row; justify-content:flex-start; align-items:center; color:var(--font-color-lowlow); font-size:var(--font-size-xl); font-weight:var(--font-weight-semibold); padding-right:var(--padding); transition:var(--transition);}
	.tabMenu span{display:inline-block; position:relative;}
	.tabMenu span::after{content:''; display:inline-block; position:absolute; width:0.6rem; height:0.6rem; right:-0.8rem; top:0.5rem; border-radius:var(--border-radius-max); background-color:var(--font-color-light); display:none;} /* 일단숨김 */
	.tabMenu:hover{color:var(--primary);}
	.tabMenu.Active{color:var(--primary);}
	.tabMenu.Active span::after{display:block; background-color:var(--primary);}


@media (max-width: 767.98px) { /* 모바일 only: ~767.98px 스마트폰 전용 스타일 */
/* 탭영역 */
.tabWrap{}
.tab-container{}
.tab-header .tab-button{flex:1;}

/* 탭메뉴 */
.tabMenuList{gap:var(--padding);}


}




 /* ------------------------- */
/* 메뉴튤팁 */
.tooltip{position:relative; display:inline-flex;}
.tooltip::after{content:attr(data-title); display:inline-flex; position:absolute; top:110%; left:50%; transform:translateX(-50%); color:var(--font-color-light); font-size:var(--font-size-sm); font-weight:var(--font-weight); line-height:1.4em; white-space:nowrap; background:rgba(0,0,0,0.8); border-radius:var(--border-radius); padding:var(--padding); z-index:var(--z-index-top); cursor:default; opacity:0;}
.tooltip:hover::after {opacity:1; visibility:visible;}



 /* ------------------------- */
 /* 인풋그룹 */
.inputGroup{display:inline-flex; position:relative; min-height:var(--form-height); justify-content:center; align-items:stretch; border:var(--border); border-radius:var(--border-radius-sm); background-color:var(--bg-color-light); border-radius:var(--border-radius-sm); transition:var(--transition); }
.inputGroup input[type="text"]{flex:1; display:inline-block; position:relative; padding:var(--padding-sm) var(--padding-lg);}
.inputGroup [type="button"]{display:inline-block; position:relative; padding:var(--padding-sm) var(--padding-lg); cursor:pointer; background-color:var(--primary);}
.inputGroup [type="button"] .icon{color: var(--font-color-light);}
.inputGroup:hover{border-color:var(--primary); box-shadow:var(--box-shadow-focus);}
.inputGroup .item{height:inherit;}
.inputGroup .item:first-child{}
.inputGroup .item:last-child{border-top-right-radius:var(--border-radius-ty); border-bottom-right-radius:var(--border-radius-ty);}
.inputGroup:hover{border-color:var(--primary); box-shadow:var(--box-shadow-focus);}
	/* 검색 */
	.inputGroup.Search{border-color:var(--primary);}

/* ------------------------- */
/* 폼관련 */
.link-btn{display:inline-flex; position:relative; flex-direction:row; align-items:center; justify-content:center; flex-shrink:0; color:var(--primary); font-weight:var(--font-weight-semibold); text-decoration:underline; text-decoration-color:var(--primary); text-underline-offset:0.4rem;}
.link-btn2{display:inline-flex; position:relative; flex-direction:row; align-items:center; justify-content:center; flex-shrink:0; color:var(--font-color-lowlow); text-decoration:underline; text-decoration-color:var(--font-color-lowlow); text-underline-offset:0.4rem; }
/* 약관동의 */
.agreebar{display:inline-flex; position:relative; width:100%; flex-direction:row; justify-content:space-between; align-items:center; gap:var(--padding-lg); }
.agreebar label{} /* flex:1; */
.agreebar input[type="checkbox"]{flex-shrink:0;}
.agreebar input[type="radio"]{flex-shrink:0;}
.agreebar .link-btn{}
.agreebar label:hover{color:var(--primary);}
.agreebar + .agreebar{margin-top:var(--padding);}


/* 폼셋트 */
.formsetList{display:flex; position:relative; flex-direction:column; gap:var(--padding-xl);}
.formsetList li{display:block; position:relative;}
.formset{display:flex; position:relative; width:100%; flex-direction:row; justify-content:flex-start; align-items:center; gap:var(--padding-lg);}
.formset .Entry{display:block; position:relative; min-width:10rem; padding:var(--padding);}
.formset .Entry span{display:block; position:relative; font-size:var(--font-size-lg); font-weight: var(--font-weight-semibold);}
.formset .Field{display:flex; position:relative; flex-direction:column; align-items:flex-start; justify-content:flex-start; flex:1; gap:var(--padding); padding:var(--padding);}
.formset .Field.row{flex-direction:row;}
	.formset .item{display:flex; position:relative; flex-direction:row; align-items:center; justify-content:flex-start; align-self:stretch; flex-shrink:0; gap:var(--padding,10px); min-height:var(--form-height); }
	.formset .item::after{content:""; position:absolute; left:0px; right:0px; bottom:-1px; border-bottom:var(--border);}
	.formset input{flex:1;}
	.formset select{flex:1;}
	.formset textarea{}
	.formset .link-btn{}
	.formset .time{display:inline-flex; position:relative; flex-direction:row; justify-content:center; align-items:center; justify-content:center; flex-shrink:0; gap:var(--padding-sm,5px);  color:var(--font-color-low);}
	.formset .time .count{}
	.formset .time .link-btn{}
	.formset .info-text{display:block; position:relative; width:100%; color:var(--primary); font-size: var(--font-size-sm);}
	.formset .warning{color:var(--color-red);}
	.formset .Btns{display:inline-flex; position:relative; gap:1rem;}
	.formset .Btn{flex:1 0 0;}
	.formset .Btn + .Btn{margin-left:0px;}
	.formset .labelBtn{flex:1 0 0;}
	.formset .labelBtn + .labelBtn{margin-left:0px;}
	/* 별도타입  */
	.formset.type-label{}
	.formset.type-textarea{flex-direction:column;  align-items:stretch;}
@media (max-width: 767.98px) { /* 모바일 only: ~767.98px 스마트폰 전용 스타일 */
/* 폼셋트 */
.formset{flex-direction:column; align-items:stretch;}
.formset .Entry{}

}



/* =========================================================================== */
/* =========================================================================== */
/* =========================================================================== */
/* 
[부트스트랩] 모달팝업
https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css
https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js
- 기본 가로&세로 가운데로 오게 설정됨
*/

/* [부트스트랩]모달기본설정(필요한css만가져오기)  */
.modalPopup{}
.modal{position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; flex-flow:column; justify-content:center; align-items:center; background-color:var(--overlay-bg);  z-index:var(--z-index-max); display:none;} /* 일단숨김 */
.modal-dialog{display:inline-flex; position:relative; min-width:60rem; max-width:60rem; flex-flow:column; justify-content:center; align-items:center; gap:var(--padding); }
	/* 모달 콘텐츠 */
	.modal-content{display:flex; position:relative; width:100%; max-height:100%; flex-flow:column; gap:1rem; background-color:var(--bg-color-light); border-radius:var(--border-radius-lg); box-shadow:var(--box-shadow); transition:var(--transition-view), height 0.3s ease; padding:4rem; animation:fadeIn .3s;}
		/* 헤더바디푸터 */
		.modal-header{display:flex; justify-content:space-between; align-items:center;}
		.modal-header .modal-title{font-size:var(--font-size-2xl); font-weight:var(--font-weight-bold); }
		.modal-header .Btn{display:block; min-height:auto; border:none; border-radius:var(--border-radius-lg); padding:var(--padding) var(--padding); cursor:pointer;} 
		.modal-header .btn-close{}
		.modal-body{display:block; max-height:60dvh; overflow-y:auto; }
		.modal-container.Alert{text-align:center;}
		.modal-footer{display:flex; justify-content:space-between; align-items:center; gap:var(--padding);}
		.modal-footer > *{flex:1; }
		/* modal꼬리 하루동안열지않기 */
		.modal-tail{display:flex; position:relative; width:100%; justify-content:space-between; align-items:center; color:var(--font-color-light);}
		.modal-tail .Left{}
		.modal-tail .Right{}
		.modal-tail .close{cursor:pointer;}
	/* 닫기버튼을넣고싶은경우 */
	.modal.getCloseBtn .modal-header{display:flex}
	.modal.getCloseBtn .modal-title{display:none;}
	.modal.getCloseBtn .modal-header .btn-close{position:absolute; top:2.4rem; right:2rem; z-index:var(--z-index-high);}
	/* 전체조정 - 상태 */
	.modal.show{display:flex !important;}
	.modal.fade{transition:opacity .15s linear;}
	.modal.fade .modal-dialog{opacity:0; transform:translateY(-50px);}
	.modal.show .modal-dialog{opacity:1; transform:translateY(0);}
		/* 전체조정 모달크기 */
		.modal-sm{}
		.modal-lg{}
		.modal-lg .modal-dialog{width:50%; max-width:100%;}
		.modal-xl{}
		.modal-xl .modal-dialog{width:var(--cont-width); max-width:100%;}
		/* 전체조정 - 풀스크린 */
		.modal-fullscreen{width:100%; max-width:100%; height:100%; margin:0; padding:0;}
		.modal-fullscreen .modal-content{height:100%; border-radius:0px;}
		/* 전체조정 - 오른쪽사이드메뉴 */
		.modal-side{justify-content:center; align-items:end !important;}
		.modal-side .modal-dialog{min-width:auto; padding:0px; width:55rem; max-width:85%; height:100%;}
		.modal-side .modal-content{height:100%; border-radius:0px;}
		.modal-side .modal-header{}
		.modal-side .modal-body{flex: 1; max-height:100%;}
		.modal-side .modal-body > *{height:100%;}
		/* 전체조정 - 메세지형 */
		.modal-alert{}
		.modal-alert{}
		.modal-alert .modal-content{padding:6rem 4rem;}
		.modalAlert-msg{display:flex; position:relative; flex-flow:column; gap:3rem; text-align:center;}
		.modalAlert-msg .msgbox{display:flex; position:relative; flex-flow:column; gap:1rem;}
		.modalAlert-msg .title{display:block; position:relative; font-size:var(--font-size-2xl); font-weight: var(--font-weight-semibold);}
		.modalAlert-msg .summary{display:block; position:relative; color:var(--font-color-low);}
		.modalAlert-msg .submit{display:flex; position:relative;}
		.modalAlert-msg .Btn{width:100%;}
		/* 전체조정 - 영상용  */
		.modalMovie{}
		.modalMovie .modal-dialog{max-width:none; min-width:auto; min-height:auto;}
		.modalMovie .modal-content{padding:0px;} 
		.modalMovie .modal-body.iframeMovie{}
		.modalVideo{} /* 일반영상  */
		.modalVideo .modal-dialog{width:100rem; }
		.modalVideo .modal-content{}
		.modalVideo .modal-body{width:100%; aspect-ratio:var(--transition-motion); position:relative; padding-bottom:56.25%; overflow:hidden;}
		.modalVideo .modal-body.iframeMovie{}
		.modalVideo .modal-body iframe{}
		.modalShorts{} /* 숏츠 */
		.modalShorts .modal-dialog{width:40rem; }
		.modalShorts .modal-content{padding:0px;}
		.modalShorts .modal-body{width:100%; aspect-ratio:var(--image-ratio-shorts);  position:relative; padding-top: 177.77%;  overflow:hidden;}
		.modalShorts .modal-body.iframeMovie{}
		.modalShorts .modal-body iframe{}

@media (min-width: 768px) and (max-width: 991.98px) {
/* [부트스트랩]모달설정  */
.modal{}
.modal-dialog{min-width:auto; max-width:96% !important;}
}

@media (max-width: 767.98px) { 
/* [부트스트랩]모달설정  */
.modal{}
.modal-dialog{max-width:100%; min-width:100%; padding:var(--padding-xl);}
	/* 모달 콘텐츠 */
	.modal-content{padding:var(--padding-xl);}
	/* 닫기버튼을넣고싶은경우 */
	.modal.getCloseBtn .modal-header{}
	.modal.getCloseBtn .modal-title{}
	.modal.getCloseBtn .modal-header .btn-close{top:4rem; right:3rem;}
	/* 전체조정 - 상태 */
	.modal.show{}
	.modal.fade{}
		/* 전체조정 - 영상용  */
		.modalMovie{}
		.modalVideo{} /* 일반영상  */
		.modalVideo .modal-dialog{width:100%;}
		.modalShorts{} /* 숏츠 */
		.modalShorts .modal-dialog{width:100%;}
		.modalShorts .modal-content{width:80%;}
}

/* 약관팝업 */
.modalpact{}
.modalpact pre{height:100%;}
	/* 약관팝업용외부css - 개인정보취급방침 */
	.policy-wrapper{color:#333; font-size:15px; line-height:1.7;}
	.policy-wrapper .policy-title{display:block; color:#222; font-size:22px; font-weight:700; margin:0 0 20px 0;}
	.policy-wrapper .policy-content h2{display:block; margin:24px 0 0 0; padding:0 0 0 8px; font-size:18px; font-weight:600; border-left:4px solid #0072ce;}
	.policy-wrapper .policy-content h3{display:block; color:#0072ce; font-size:16px; font-weight:600; margin:18px 0 0 0;}
	.policy-wrapper .policy-content ul{margin:8px 0 8px 18px; list-style:disc;}
	.policy-wrapper .policy-table{width:100%; border-collapse:collapse; margin:12px 0; font-size:14px;}
	.policy-wrapper .policy-table th,
	.policy-wrapper .policy-table td{border:1px solid #ddd; padding:10px 12px; text-align:left; vertical-align:top;}
	.policy-wrapper .policy-table th{background:#f8f8f8; text-align:center;}
	.policy-wrapper .policy-index{background:#f7f9fc; border:1px solid #e3e7ed; border-radius:6px; margin:16px 0; padding:12px 16px;}
	.policy-wrapper .policy-index ol{margin:8px 0 0 20px;}
	.policy-wrapper hr{border:0; margin:20px 0; border-top:1px dashed #ccc;}
	/* 약관팝업용외부css - 마케팅동의 */
	.privacy-section .privacyTable{display:block;width:100%;border-collapse:collapse;margin:10px 0;font-size:14px;}
	.privacy-section .privacyTable th,.privacyTable td{display:table-cell;border:1px solid #ddd;padding:10px 12px;vertical-align:top;text-align:left;line-height:1.5;}
	.privacy-section .privacyTable th{display:table-cell;background:#f8f8f8;font-weight:600;text-align:center;}
	.privacy-section .privacyTable tr:hover{display:table-row;background:#fafafa;}
	.privacy-section h3,
	.privacy-section .ad-section h3{display:block;font-size:16px;font-weight:600;margin:0 0 8px;}
	.privacy-section .ad-info h4{display:block;font-size:15px;font-weight:600;margin:15px 0 6px;}
	.privacy-section .ad-info ol{display:block;margin:0 0 0 18px;}
	.privacy-section .ad-info ol li{display:list-item;margin:0 0 4px;line-height:1.6;}
	.privacy-section .desc{display:block;font-size:13px;color:#555;margin:8px 0 0;}
	/* 약관팝업용외부css -전자결제대행 이용 동의 */
	.modalpact .modal-content {border-radius:12px;overflow:hidden;border:1px solid #e3e3e3;box-shadow:0 8px 24px rgba(0,0,0,0.15);}
	.modalpact .modal-header {border-bottom:1px solid #ddd;padding:14px 18px;}
	.modalpact .modal-title {color:#222;font-size:18px;font-weight:600;}
	.modalpact .modal-body {background:#fff;padding:18px 20px;}
	.modalpact hr {border:0;border-top:1px dashed #ccc;margin:16px 0;}
	.Pact.scrollBox {max-height:420px;overflow-y:auto;padding-right:6px;}
	.Pact .pactList {list-style:disc;padding-left:18px;margin-bottom:12px;}
	.Pact .pactList li {color:#333;font-size:14px;line-height:1.6;margin-bottom:6px;}
	.Pact .refund-info h3, .refund-deposit h3 {color:#333;font-size:16px;font-weight:600;margin-bottom:8px;border-left:3px solid #0072ce;padding-left:8px;}
	.Pact .refund-info ul {list-style:none;font-size:14px;padding-left:0;}
	.Pact .refund-info ul li {line-height:1.6;margin-bottom:4px;}
	/* 표 스타일 */
	.Pact .refundTable {width:100%;border-collapse:collapse;font-size:14px;margin-top:10px;}
	.Pact .refundTable th, .refundTable td {border:1px solid #ddd;padding:10px 12px;text-align:center;}
	.Pact .refundTable th {background-color:#f8f8f8;font-weight:600;}
	.Pact .refundTable tr:nth-child(even) {background-color:#fafafa;}
	.Pact .refundTable td.text-danger {color:#d9534f;font-weight:600;}
	.Pact .small {color:#555;font-size:13px;}
	.Pact .highlight {color:#0072ce;font-size:14px;font-weight:600;margin-top:6px;}
	.Pact .Btn.btn-close svg {width:16px;height:16px;fill:#666;}
	.Pact .Btn.btn-close:hover svg {fill:#000;}



/* ------------------------- */
/* [부트스트랩]모달팝업-기본스타일  */
.modalpopArea{position:fixed; left:0; right:0; top:0; bottom:0; flex-flow:column; justify-content:center; align-items:center; background-color:var(--overlay-bg);  padding:3rem; z-index:var(--z-index-max); display:none;} /* 일단숨김 */
.modalpopArea.Active{display:flex;} /* 활성화 */
.modalpop-container{display:flex; position:relative; flex-flow:column; width:60rem; max-height:100%; gap:1rem; background-color:var(--bg-color-light); border-radius:var(--border-radius-lg); box-shadow:var(--box-shadow); transition:var(--transition-view), height 0.3s ease; padding:4rem;}
.modal-content{transition:opacity 0.3s ease;}
.modal-content.Loaded{}
	/* modal헤드 */
	.modalpop-head{display:flex; justify-content:space-between; align-items:center;}
	.modalpop-head .modal-title{font-size:var(--font-size-2xl); font-weight:var(--font-weight-bold); }
	.modalpop-head .Btn{display:block; min-height:auto; border:none; border-radius:var(--border-radius-lg); padding:var(--padding) var(--padding);  cursor:pointer;}
	/* modal바디 */
	.modalpop-body{display:block; max-height:60dvh; overflow-y:auto; }
	.modalpop-container.Alert{text-align:center;}
	.modal-loading{min-height:15rem;}
	/* modal푸터 */
	.modalpop-footer{display:flex; justify-content:space-between; align-items:center; gap:var(--padding) }
	.modalpop-footer > *{flex:1; }
	/* modal꼬리 열지않기 */
	.modal-tail{display:flex; position:relative; justify-content:space-between; color:var(--font-color-light);}
	/* [모달]안내문구타입 */
	.modalAlert{}
	.modalAlert .modalpop-container{width:60rem; padding:6rem 4rem;}
	.modalAlert-msg{display:flex; position:relative; flex-flow:column; gap:3rem; text-align:center;}
	.modalAlert-msg .msgbox{display:flex; position:relative; flex-flow:column; gap:1rem;}
	.modalAlert-msg .title{display:block; position:relative; font-size:var(--font-size-2xl); font-weight: var(--font-weight-semibold);}
	.modalAlert-msg .summary{display:block; position:relative; color:var(--font-color-low);}
	.modalAlert-msg .submit{display:flex; position:relative;}
	.modalAlert-msg .Btn{width:100%;}
	/* [모달]영상타입 */
	.modalVideo{}
	.modalVideo .modalpop-container{}
	.modalVideo .modalpop-container{padding:0px;}
	.modalVideo .modalpop-head{display:none;}

@media (max-width: 767.98px) { /* 모바일 only: ~767.98px 스마트폰 전용 스타일 */
/* 모달팝업  */
.modalpopArea{} 
.modalpopArea.Active{}
.modalpop-container{width:100% !important; padding:3rem;}
}



/* ------------------------- */
/* [부트스트랩]모달팝업-배경없이사용하는경우  */
.blockmodalPopup{position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width:fit-content; height:fit-content; max-width:100dvh; max-height:100dvh; flex-flow:column; justify-content:center; align-items:center; background:none; box-shadow:var(--box-shadow-light); z-index:calc(var(--z-index-max) + 1); overflow:hidden; display:none;} /*  일단숨김 */
.blockmodalPopup .modal-dialog{display:inline-flex; position:relative; min-width:auto; max-width:100% !important; max-width:100%; width:fit-content; height:fit-content; flex-flow:column; justify-content:center; align-items:center; gap:var(--padding);}
.speciallMainPopup .btn-close{display:inline-flex; position:absolute; right:1rem; top:1rem; color:var(--font-color-light);}
.speciallMainPopup .btn-close .icon{height:var(--icon-size-lg);}

@media (max-width: 767.98px) {
/* [부트스트랩]모달팝업-배경없이사용하는경우  */
.blockmodalPopup{}
.blockmodalPopup .modal-dialog{padding:0px;}
}





/* =========================================================================== */
 /* ------------------------- */
/* 아코디언메뉴 */
.accordion-list{display:flex; position:relative; width:100%; flex-direction:column; gap:var(--padding);}
.accordion-list .accordion-item{display:block; position:relative; width:100%;}
.accordion-list [data-accordion-button]{display:flex; position:relative; align-items:center; cursor:pointer;}
.accordion-list [data-accordion-target]{display:none; position:relative;} /* 일단숨김 */
.accordion-list .toggleIcon{display:inline-block; transition:var(--transition-time);}
.accordion-list .is-close .toggleIcon{}
.accordion-list .is-open .toggleIcon{transform:rotate(180deg);}


 /* ------------------------- */
 /* 롤링배너 touch-action:auto;  */
.swiperArea{display:block; position:relative; }
.swiper{display:block; position:relative; width:100%; height:100%; }
.swiper-slide{display:flex; justify-content:center; align-items:center;  touch-action:auto;}
.swiper-slide a{display:block; position:relative;}
	/* 기본버튼 */
	.swiperArea .swiper-button-prev,
	.swiperArea .swiper-button-next{display:inline-flex; justify-content:center; align-items:center; width:6rem; height:6rem; aspect-ratio:1; color:var(--font-color); border:var(--border); background-color:var(--bg-color-light); border-radius:50%;}
	.swiperArea .swiper-button-prev:after,
	.swiperArea .swiper-button-next:after{font-size:var(--font-size-xl); font-weight:var(--font-weight-bold);}
	.swiperArea .swiper-button-prev{margin-left:-3rem;}
	.swiperArea .swiper-button-next{margin-right:-3rem;}
	.swiperArea .swiper-button-disabled{background-color:var(--normal-disabled);}
	
	/* 도트네비 */
	.swiperArea .swiper-pagination{display:inline-flex; justify-content:center; align-items:center; gap:var(--padding-lg); z-index:10;}
	.swiperArea .swiper-pagination .swiper-pagination-bullet{display:inline-block; width:1rem; height:1rem; aspect-ratio:1 / 1; border-radius:var(--border-radius-max); background-color:var(--gray-40);  margin:0 !important; transition: var(--transition);}
	.swiperArea .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width:1rem; height:1rem;  background-color:var(--primary); box-shadow:var(--box-shadow);}
	
	/* 배너버튼(좌우버튼-원형두개나란히) >> 아래에배치하는용도*/
	.swiper-pagination-typeA{display:flex; position:relative; flex-direction:row; justify-content:flex-end; align-items:center; gap:var(--padding);}
	.swiper-pagination-typeA .swiper-btn{display:inline-flex; position:relative; justify-content:center; align-items:center; height:var(--icon-size-2xl); aspect-ratio:1; border-radius:var(--border-radius-max); background-color:var(--primary); padding:var(--padding-sm);}
	.swiper-pagination-typeA .swiper-btn .icon{color:var(--font-color-light); height:var(--icon-size);}
	.swiper-pagination-typeA .swiper-button-disabled{background-color:var(--bg-color-disabled);}
	.biasedInner .swiper-pagination-typeA{width:var(--cont-width);}

	/* 컨트롤러세트레이아웃  */
	.swiper-counterSet{display:flex;  position:absolute; height:auto; justify-content:space-between; align-items:center; left:0; right:0; bottom:0; gap:var(--padding); font-size:var(--font-size-sm); padding-left: var(--padding-lg); z-index:var(--z-index); }
		/* 배너버튼(좌우버튼-캡슐로두개나란히 >> 배너위에올리는용도) */
		.swiper-pagination-typeB{display:flex; position:relative; align-items:center; border-top-left-radius:var(--border-radius-lg); overflow:hidden;}
		.swiper-pagination-typeB .swiper-btn{display:inline-block; position:relative; font-size:var(--font-size-lg); background-color:var(--overlay-light); padding:var(--padding); cursor:pointer;}
		.swiper-pagination-typeB .swiper-btn .icon{}
		/* 전체숫자와현재카운트*/
		.swiper-pagination-count{display:flex; position:relative; width:auto !important; inset:unset !important; justify-content:space-between; align-items:center; gap:var(--padding-sm); color:var(--font-color-light) !important; letter-spacing:0.3rem; border-radius:var(--border-radius-xl); background-color:var(--overlay-bg) !important; padding:var(--padding-sm) var(--padding-lg);}
		.swiper-pagination-count .swiper-pagination-current,
		.swiper-pagination-count .swiper-pagination-total{display:inline-flex; position:relative; align-items:center; }
		.swiper-pagination-count .swiper-pagination-current{}
		.swiper-pagination-count .swiper-pagination-total{}

	/* 배너버튼(긴바형태) */
	.swiper-pagination-typeC{display:inline-flex; position:relative; width:auto !important; flex-direction:row; justify-content:center; align-items:center; gap:var(--padding-xs); border:var(--border); border-radius:var(--border-radius-lg); background-color:var(--bg-color-light); padding:0.2rem 0rem; margin:auto; box-shadow:var(--box-shadow-sm); cursor:pointer; z-index:var(--z-index); }
	.swiper-pagination-typeC .swiper-pagination-bullet{display:inline-block; width:var(--icon-size-2xl); height:1.2rem; border-radius:var(--border-radius-lg); background-color:var(--gray-40); transition:var(--transition);}
	.swiper-pagination-typeC .swiper-pagination-bullet-active{background-color:var(--gray-70);}



@media (max-width: 767.98px) {
 /* 롤링배너 */
 .swiperArea{}
	 /* 기본버튼 */
	 .swiperArea .swiper-button-prev,
	 .swiperArea .swiper-button-next{}

	 /* 도트네비 */
	 .swiperArea .swiper-pagination{}
	 
	 /* 배너버튼(좌우버튼-원형두개나란히) >> 아래에배치하는용도*/
	 .swiper-pagination-typeA{}
	 .biasedInner .swiper-pagination-typeA{padding-right:var(--padding-xl);}
	 /* 컨트롤러세트레이아웃  */
	 .swiper-counterSet{}
		/* 배너버튼(좌우버튼-캡슐로두개나란히 >> 배너위에올리는용도) */
		.swiper-pagination-typeB{}
		/* 전체숫자와현재카운트*/
		.swiper-pagination-count{}

}

	

 /* ------------------------- */
 /* 배너양쪽방향 */
.banner-wayButton{display:inline-flex; position:absolute; top:50%; transform:translateY(-50%); justify-content:center; align-items:center; width:6rem; height:6rem; color:var(--font-color); border:var(--border); background-color:var(--bg-color-light); border-radius:var(--border-radius-max); z-index:var(--z-index);}
.banner-wayButton .icon{}
.banner-wayButton:hover{box-shadow:var(--box-shadow);}
.button-prev{left:0%;  margin-left:-3rem;}
.button-next{right:0%; margin-right:-3rem;}


 /* ------------------------- */
/* jquery달력날짜 : 예약하기 */
.bookCalendar{display:block; position:relative; width:100%; color:var(--font-color-low); font-size:var(--font-size-lg);}
.ui-datepicker{display:inline-flex !important; position:relative; width:100%; flex-direction:column; gap:var(--padding-lg); font-size:var(--font-size); border:none; }
.ui-datepicker .ui-widget.ui-widget-content{border:none;}
/* 헤더 */
.ui-datepicker .ui-datepicker-header{display:inline-flex; position:relative; flex-direction:row; justify-content:center; align-items:center; gap:3rem; border-radius:0px; border:none;  background:none; padding:0px;}
.ui-datepicker .ui-datepicker-title{order:2; display:inline-block; position:relative; font-size:var(--font-size-xl); font-weight: var(--font-weight-bold);}
.ui-datepicker .ui-datepicker-header .ui-corner-all{display:inline-flex; position:relative; justify-content:center; align-items:center; top:auto; right:auto; left:auto; width:3rem; aspect-ratio:1 / 1; border-radius: var(--border-radius-max); background:transparent; border:none; cursor:pointer;}
.ui-datepicker .ui-datepicker-header .ui-corner-all:hover{box-shadow: var(--box-shadow);}
.ui-datepicker .ui-datepicker-header .ui-corner-all span{display:inline-block; width:2.4rem; aspect-ratio:1 / 1; background-repeat:no-repeat; background-position:center; background-size:contain; background-color:transparent; text-indent:-9999px; overflow:hidden; 
background-color:var(--font-color); mask-repeat:no-repeat; mask-position:center; mask-size:contain; -webkit-mask-repeat:no-repeat; -webkit-mask-position:center; -webkit-mask-size:contain;}
.ui-datepicker .ui-datepicker-header .ui-state-disabled span{background-color:var(--font-color-lowlow);}
.ui-datepicker .ui-datepicker-prev{order:1;}
.ui-datepicker .ui-datepicker-prev span{mask-image:url('/assets/images/icon-chervon-left.svg'); -webkit-mask-image:url('/assets/images/icon-chervon-left.svg');}
.ui-datepicker .ui-datepicker-next{order:3;}
.ui-datepicker .ui-datepicker-next span{mask-image:url('/assets/images/icon-chervon-right.svg'); -webkit-mask-image:url('/assets/images/icon-chervon-right.svg');}
/* 바디 */
.ui-datepicker table.ui-datepicker-calendar{font-size:var(--font-size-lg);}
.ui-datepicker table th,
.ui-datepicker table td{text-align:center; padding:var(--padding) 0;}
.ui-datepicker table .ui-state-default{display:flex; position:relative; justify-content:center; align-items:center; width:4.6rem; aspect-ratio:1 / 1; color:var(--font-color); border:1px solid transparent; border-radius:var(--border-radius-max); text-decoration:none; background:transparent; margin:auto; }
.ui-datepicker table a:hover{box-shadow: var(--box-shadow);}
.ui-datepicker table .ui-datepicker-today a{border-color:var(--border-color);}
.ui-datepicker table .ui-datepicker-other-month a{}
.ui-datepicker table .ui-state-active{color:var(--font-color-light) !important; background-color:var(--primary); border-color:var(--primary);}
.ui-datepicker table .ui-state-disabled .ui-state-default{color: var(--font-color-lowlow); cursor:no-drop;}
.ui-datepicker table .ui-datepicker-today{}  /* 오늘 */ 
.ui-datepicker table .ui-datepicker-today .ui-state-default{border-color:var(--border-color);}
.ui-datepicker table .ui-datepicker-week-end:first-child{} /* 일요일 */
.ui-datepicker table .ui-datepicker-week-end:first-child .ui-state-default{}
.ui-datepicker table .ui-datepicker-week-end:last-child{} /* 토요일 */
.ui-datepicker table .ui-datepicker-week-end:last-child .ui-state-default{}


/* =========================================================================== */
/* 마퀴무한롤링배너 */
.marqueeArea{display:block; position:relative; width:100%; overflow:hidden; white-space:nowrap;}
.marquee-wrapper{display:flex; position:relative; width:100%;}
.marquee-track{display:flex; position:relative; gap:var(--padding-2xl); will-change:transform; width:100%;}
.marquee-track .item{display:flex; position:relative; align-items:center; justify-content:center; flex-shrink: 0; user-select:none; min-width:20rem; width:auto; height:auto;}
.marquee-track .item .thum{display:flex; position:relative; flex-direction:column; justify-content:center; align-items:center; border-radius:var(--border-radius-xl); background:var(--bg-color); overflow:hidden;}
.marquee-track .item .thum img{display:block; position:relative; width:100%; height:100%; object-fit: cover; transition:var(--transition);}
.marquee-track .item:hover .thum img{transform:scale(1.05); }



/* =========================================================================== */
/* =========================================================================== */
