/* ==========================================================================
	파일명: index.css
	설명: 사이트 전체에 공통적으로 적용되는 기본 스타일을 정의한 파일입니다.
	      Reset, 폰트, 기본 레이아웃, 색상, 버튼 등 공통 요소를 포함하며,
	      반응형 스타일 파일(tablet.css, mobile.css 등)보다 먼저 로드됩니다.
	작성자: [작성자 이름]
	최종 수정일: [YYYY-MM-DD]
========================================================================== */

* {
	font-family: "SamyangNeo-Regular", sans-serif;
	word-break: keep-all;
}
	
body { margin: 0 auto; padding: 0; }

a:link { text-decoration: none; font-family: 'SamyangNeo-Regular'; }
a:visited { color: black; text-decoration: none; }

.line-space { margin-top: 50px; margin-bottom: 50px; }
.line-space-100 { margin-top: 100px; margin-bottom: 100px; }
.line-space-150 { margin-top: 150px; margin-bottom: 150px; }
.page-top-empty { width: 1500px; height: 150px; }


/*************************************************************************************************
 * 컨테이너 영역
 */
.container-main { max-width: 1500px; justify-content: center; margin: auto; height: 100%; overflow: hidden; }
.container-page { max-width: 1300px; justify-content: center; margin: auto; height: 100%; overflow: hidden; }
/************************************************************************************************/


.product-overview {
	position: relative;
	width: 100%;
	padding: 120px 30px;
	background-color: #26247b;
	color: #ffffff;
	text-align: center;
	overflow: hidden;
}

/* 배경 로고 이미지 삽입 */
.product-overview::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 300px;
	height: 300px;
	background-image: url('/resources/img/logo/PEOPLEez.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	opacity: 0.1;
	transform: translate(-50%, -50%);
	pointer-events: none;
	z-index: 0;
}

.product-overview h1, .product-overview p {
	position: relative;
	z-index: 1;
	font-family: 'SamyangNeo-Regular';
}

.product-overview h1 {
	font-size: 2.5rem;
	margin-bottom: 40px;
	font-weight: 700;
}

.product-overview p {
	font-size: 1.1rem;
	line-height: 2;
	max-width: 900px;
	margin: 0 auto;
	color: #f1f1f1;
}

.product-overview strong {
	color: #a9a7ff;
	font-weight: 600;
}


/*************************************************************************************************
 * 캐러셀 영역 (메인 상단 배너)
 */
.carousel .carousel-inner {
	width: 100%;
	height: 950px;
	background-image: url("../img/home_banner_001.jpg");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}

.carousel-text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.carousel-text .small {
	font-family: 'SamyangNeo-Regular';
	font-size: 24px;
	line-height: 156%;
	letter-spacing: -0.002em;
	color: #FFFFFF;
	opacity: 0.7;
}

.carousel-text .large {
	font-family: 'SamyangNeo-Regular';
	font-weight: 400;
	font-size: 72px;
	line-height: 100%;
	letter-spacing: -0.01em;
	color: #FFFFFF;
}

.carousel-text .btn-hover {
	font-family: 'SamyangNeo-Regular';
	gap: 8px;
	padding: 20px 28px 20px 40px;

	background: #1A286D;
	border-radius: 999px;
	color: #FFFFFF;
	font-size: 20px;
}

.btn-syds {
	font-family: 'SamyangNeo-Regular';
	gap: 8px;
	padding: 10px 20px 10px 20px;

	background: #1A286D;
	border-radius: 999px;
	color: #FFFFFF;
	font-size: 15px;
	transition: color 0.15s ease-in-out, background-color 0.25s ease, box-shadow 0.15s ease-in-out, transform 0.2s ease;
	border: none;
}
.btn-syds:hover {
	transform: translateY(-2px);
}

.container-page > form {
	text-align: center;
}
/************************************************************************************************/



/*************************************************************************************************
 * 메인화면 기능별 특성정보 영역
 *************************************************************************************************/
.feature-infoBox {
	height: 800px;
	padding: 30px;
	align-content: center;
}

.feature-infoBox > div {
	display: none;
	border: none;
}

/* 왼쪽 영역 (col-sm-4) */
.feature-infoBox .row .col-sm-4 {
	display: flex;
	justify-content: center;  /* 수평 정렬 */
	align-items: center;      /* 수직 정렬 */
}

/* 오른쪽 영역 (col-sm-8) */
.feature-infoBox .row .col-sm-8 {
	display: flex;
	flex-direction: column;
	justify-content: center;  /* 수직 정렬 */
	align-items: center;      /* 가로 정렬 */
	padding: 0;
	gap: 10px;
}

/* 카드 컴포넌트 */
.feature-infoBox .row .col-sm-8 .card,
.feature .card {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	padding: 0 20px 30px 20px;
	background: linear-gradient(180deg, #F5F5F5 0%, #FFFFFF 100%);
	border: 1px solid #D4D4D4;
	box-shadow:
		0px 4px 4px rgba(0, 0, 0, 0.04),
		0px 4px 31px rgba(0, 0, 0, 0.16),
		inset -6px -4px 4px rgba(0, 0, 0, 0.08);
	border-radius: 38px;
}

/* 카드 내 스피커 영역 */
.feature-infoBox .row .col-sm-8 .card .speaker,
.feature .card .speaker {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	width: 100%;
	height: 25px;
}

/* 카드 내 브라우저 바 */
.feature-infoBox .row .col-sm-8 .card .browser-bar,
.feature .card .browser-bar {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	width: 100%;
	overflow: hidden;
	border-radius: 16px 16px 0 0;
	background: #ECECEC;
}

/* 카드 내 화면 영역 */
.feature-infoBox .row .col-sm-8 .card .screen,
.feature .card .screen {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	width: 100%;
	padding: 20px 0 0 0;
	background: #FFFFFF;
}
.feature-infoBox .row .col-sm-8 .card .screen > img {
	max-width: 700px;
}
.feature .card .screen {
	max-width: 1100px;
}
.feature-infoBox .feature-img { border: none; }
.feature-infoBox .feature-txt { border: none; font-weight: bold; }

.feature-infoBox .feature-txt .card-body > p { margin-bottom: 10px; }
.feature-infoBox .feature-txt .feature-badge { font-size: 21px; color: #26247b; font-family: "SamyangNeo-Regular"; word-break: keep-all;}
.feature-infoBox .feature-txt .feature-title { font-size: 27pt; font-family: "SamyangNeo-Regular"; word-break: keep-all; }
.feature-infoBox .feature-txt .feature-title-sub { font-size: 17px; color: #7A7A7A; font-family: "SamyangNeo-Light"; word-break: keep-all;}
.feature-infoBox .feature-txt .btn-hover {
	font-family: 'SamyangNeo-Regular';
	font-size: 12px;
	font-weight: 500;
	color: #FFFFFF;
	background-color: #1A286D;
	padding: 10px 10px 10px 20px;
	border-radius: 999px;
	
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}
/************************************************************************************************/


/*************************************************************************************************
 * 페이지 메뉴 상단 제목 영역
 */
.page-top-box {
	padding: 30px;
	width: 100%;
	border: none;
	align-items: center;
}
.page-top-box .page-top-visual > img {
	width: 130px;
	height: 130px;
}
.page-top-box .page-top-title > span {
	font-family: "SamyangNeo-Regular";
	font-size: 60px;
	font-weight: bold;
	color: #26247b;
}
.page-top-box .page-top-divider {
	width: 155.29px;
	border-top: 1px solid #CACCCE;
	margin: 20px 0 40px 0;
}
.page-top-box .page-top-title-sub {
	font-family: "SamyangNeo-Regular";
	font-size: 20px;
	color: #000000;
	text-align: center;
}

.additional-content {
	display: flex;
	justify-content: center;         /* 수평 가운데 */
	align-items: center;             /* 수직 가운데 (선택) */
	flex-direction: column;
	padding: 2rem;
	background-color: #f9fafa;
	border-radius: 12px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	max-width: 600px;
	margin: 2rem auto;  
}

.info-list {
	list-style: none; /* 기본 점 제거 */
	padding: 0;
	margin: 0;
}

.info-list li {
	position: relative;
	padding-left: 1.5rem; /* 마커 공간 */
	margin-bottom: 1rem;
	color: #222;
	font-size: 1rem;
	line-height: 1.6;
	font-weight: 500;
}

/* ✅ 왼쪽 커스텀 마커 (모던 체크) */
.info-list li::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 0;
	color: #0077cc; /* 포인트 컬러 */
	font-size: 1rem;
	line-height: 1.6;
	font-weight: bold;
}

.extra-info {
	font-family: "SamyangNeo-Regular", sans-serif;
	background-color: #26247b;
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	padding: 40px 15px;
	box-sizing: border-box;
	text-align: center;
	box-shadow:
		0 4px 6px rgba(0, 0, 0, 0.1),     /* 기본 그림자 */
		0 8px 20px rgba(0, 0, 0, 0.15);   /* 부드러운 외곽 그림자 */
}

.card-list-vertical {
	display: flex;
	gap: 25px;
	justify-content: center;
	padding: 0 20px; /* 좌우 약간 여백 */
	margin: 0 auto;
	list-style: none;
	overflow: auto;               /* 스크롤 기능은 활성화 */
	scrollbar-width: none;       /* Firefox */
	-ms-overflow-style: none;    /* IE 10+ */
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scroll-behavior: smooth;

	opacity: 0;
	transform: translateX(100px);
	animation: slideInLeft 1s ease-out 0.3s forwards;
}

.card-list-vertical li {
	font-size: 1rem;
	flex: 0 0 auto;
	width: auto;
	max-width: 320px;
	min-width: 260px;
	min-height: 220px;
	padding: 28px 24px;
	background: #ffffff;
	border-radius: 20px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	text-align: left;
	cursor: default;
	user-select: none;

	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
	transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;

	opacity: 0;
	transform: translateX(100px);
	animation-name: slideInLeft;
	animation-duration: 0.8s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-out;
	word-break: keep-all;
}

/*
.card-list-vertical li::after {
	content: "";
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 70px;
	height: 70px;
	background-image: url('/resources/img/logo/PEOPLEez.png');
	background-size: cover;
	opacity: 0.3;
	filter: blur(3px);
	pointer-events: none;
	z-index: 0;
}
*/

/* 등장 순서별 delay */
.card-list-vertical li:nth-child(1) { animation-delay: 0.2s; }
.card-list-vertical li:nth-child(2) { animation-delay: 0.5s; }
.card-list-vertical li:nth-child(3) { animation-delay: 0.8s; }
.card-list-vertical li:nth-child(4) { animation-delay: 1.1s; }
.card-list-vertical li:nth-child(5) { animation-delay: 1.4s; }
.card-list-vertical li:nth-child(6) { animation-delay: 1.7s; }
.card-list-vertical li:nth-child(7) { animation-delay: 2.0s; }
.card-list-vertical li:nth-child(8) { animation-delay: 2.3s; }
.card-list-vertical li:nth-child(9) { animation-delay: 2.6s; }
.card-list-vertical li:nth-child(10) { animation-delay: 2.9s; }

.card-list-vertical li strong {
	font-size: 1.05rem;
	color: #26247b;
	display: block;
	margin-bottom: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
}

@keyframes slideInLeft {
	from {
		opacity: 0;
		transform: translateX(100px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}
/************************************************************************************************/


/*************************************************************************************************
 * 페이지 기능별 특성정보 영역
 */
#feature-container-page {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

#feature-container-page .feature {
	width: 1100px;
}

#feature-container-page .feature > .page-feature-title {
	font-family: "SamyangNeo-Regular";
	font-weight: bold;
	font-size: 44px;
}

#feature-container-page .feature > .page-feature-title-sub {
	font-family: "SamyangNeo-Regular";
	font-size: 20px;
	color: #7A7A7A;
	word-break: keep-all;
}

.page-feature-title, .page-feature-title-sub {
	opacity: 0;
	animation-delay: 0.2s;
}

.page-feature-img {
	opacity: 0;
	animation-delay: 0.4s;
}
/************************************************************************************************/


/*************************************************************************************************
 * 활용사례 영역
 */
 .emphasis-text { font-style: italic; color:#26247b }
.usecase-list-box .accordion-button { font-size: 16pt; font-weight: bold; padding: 25px; border-top: 1px solid #CACCCE; color: #26247b; word-break: keep-all;}
.callout-box { padding:5px; margin-bottom:5px; background-color: #dee2e6; border-radius: 5px;}
.accordion-title { padding:15px; font-weight: bold; font-family: "SamyangNeo-Regular"; }
.accordion-img { font-size: 13pt; padding: 25px; width:100%;word-break: keep-all;}
.accordion-img-mid { font-size: 13pt; padding: 25px; width:1000px; margin: auto; word-break: keep-all;}
.accordion-img-big { font-size: 13pt; padding: 25px; width:600px;word-break: keep-all;margin: auto;}

.tab_search_box .tab .tab-btn.active { border-color: #26247b; background-color: #26247b; color: #ffffff;}
.tab-btn:not(.disabled).active { border-color: #26247b; color: #26247b;}
.tab-btn:hover { color: #26247b; }
.tab_search_box .tab .tab-btn { margin: 5px;}
.tab-btn.sm {
    min-width: 90px;
    height: 44px;
    font-size: 1.0625rem;
    letter-spacing: -0.02em;
    line-height: 2.4705882353;
    padding: 0 15px;
    border-color: #dddddd;
}
.tab-btn {
    display: inline-block;
    vertical-align: top;
    text-align: center;
    background-color: #fff;
    border: 1px solid #dddddd;
    box-sizing: border-box;
    position: relative;
    white-space: nowrap;
    margin-right: 20px;
    color: #000000;
}
/************************************************************************************************/


/*************************************************************************************************
 * hr 블로그 카드 영역
 */
.issue-box .issue-contents { display: none; }
.issue-box .card { border: none; }
.issue-box .card .card-body > form > button > div { overflow: hidden; border-radius: 20px; border: 1px solid #dee2e6; }
.issue-box .card .card-body > form > button > div > img:hover {
	transform: scale(1.1, 1.1); transition-duration: 0.5s;
}
.issue-box .card .card-body > form > button > p { font-family: "SamyangNeo-Regular"; text-align: left; }
.issue-box .card .card-body > form > button > p:nth-child(2) { font-size: 20px; font-weight: bold; margin-top: 20px; }
.issue-box .card .card-body > form > button > p:nth-child(3) { font-size: 13px; color: #7A7A7A; }

.issue-pageBox { padding: 80px; }
.issue-pageBox .card { border: none; }
/************************************************************************************************/

.autoCal-box { padding: 30px; }
.autoCal-box .card { margin-top: 20px; }
.autoCal-box .autoCal-txt > p { font-size: 15px; color: #7A7A7A; margin: 5px 0px 5px 0px; }
.autoCal-box .autoCal-txt > p:nth-child(1) { font-size: 20px; font-weight: bold; color: #212529 }
.autoCal-box .autoCal-contents .card .card-body > svg { width: 25px; height: 25px; float: right; }

.autoCal-box .autoCal-input .row > p { margin: 0px 0px 0px 0px; font-weight: bold; }
.autoCal-box .autoCal-input .form-select { text-align: center; }
.autoCal-box .autoCal-input .form-control { text-align: right; }
.autoCal-box .autoCal-result .row > p { margin: 0px 0px 0px 0px; font-weight: bold; }
.autoCal-box .autoCal-result .form-control { text-align: right; }

.tab-menu-container {
	display: flex;
	justify-content: center;
	align-items: center;      /* 수직 정렬 */
	text-align: center;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 30px;
	margin-bottom: 30px;
}

.tab-menu-box button {
	min-width: 100px;
	padding: 10px 15px;
	font-size: 14px;
	font-weight: bold;
	border-radius: 30px;
	border: 1px solid #26247b;
	background-color: #fff;
	color: #26247b;
	transition: all 0.2s ease-in-out;
}

.tab-menu-box button:hover,
.tab-menu-box button.active {
	background-color: #26247b;
	color: #fff;
}


/*************************************************************************************************
 * 질문사항 영역
 */
.faq-list-tab {
	padding: 20px;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	border: none;
}
.faq-list-tab > button {
	width: 125px;
	height: 50px;
	font-weight: bold;
	font-family: "SamyangNeo-Regular";
}
.faq-list-tab > button:hover { animation: slideUp 0.5s; }
.faq-list-box .accordion {
	border-top: 1px solid black;	
}
.faq-list-box { padding: 20px; }
.faq-list-box .accordion-item { border: none; }
.faq-list-box .accordion-item .accordion-header .accordion-button { font-size: 14pt; font-weight: bold; padding: 25px; border-bottom: 1px solid #CACCCE; }
.faq-list-box .accordion-item .accordion-collapse .accordion-body {
	font-size: 11pt;
	padding: 25px;
	border-bottom: 1px solid #CACCCE;
	background: #F6F8FB;
	padding: 25px 25px 25px 50px;
		font-family: "SamyangNeo-Regular";
}
.faq-list-box .accordion-item .accordion-collapse .accordion-body > img { margin-left: 20px; width: 20px; height: 20px; }

.page-bottom-box {
	text-align: center;
	height: 100px;
	align-content: center;
}
/************************************************************************************************/


/*************************************************************************************************
 * 문의사항 버튼 박스 영역
 */
 
.contact-container {
	display: flex;
	gap: 20px;
	justify-content: center;
	align-items: stretch;
	padding: 40px 20px;
	font-family: 'Segoe UI', sans-serif;
}

.contact-card {
	flex: 1;
	background-color: #f6f8fa;
	border-radius: 12px;
	padding: 30px;
	text-align: center;
}

.contact-card h3 {
	font-family: "SamyangNeo-Regular";
	font-weight: bold;
	margin: 10px 0;
	font-size: 1.1rem;
	color: #111;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
}

.contact-card p {
	font-family: "SamyangNeo-Regular";
	margin: 5px 0;
	font-size: 0.95rem;
	color: #333;
}

.contact-card small {
	font-family: "SamyangNeo-Regular";
	display: block;
	margin-top: 4px;
	color: #777;
	font-size: 0.8rem;
}

.contact-link {
	display: inline-block;
	margin-top: 8px;
	color: #1a2b6d;
	font-weight: 500;
	text-decoration: none;
	font-size: 0.9rem;
}

.contact-link:hover {
	text-decoration: underline;
}

.icon {
	font-size: 1.1rem;
}

strong, h4 > span, label {
	font-family: "SamyangNeo-Regular";
}

.div-valid { font-size: 10pt; color: #dc3545; margin-top: 5px; }
.div-valid-text-success {
	border-color: var(--bs-form-valid-border-color);
	padding-right: calc(1.5em + 0.75rem);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right calc(0.375em + 0.1875rem) center;
	background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.div-valid-text-success:focus {
	border-color: var(--bs-form-valid-border-color);
}
.div-valid-text-error {
	border-color: var(--bs-form-invalid-border-color);
	padding-right: calc(1.5em + 0.75rem);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right calc(0.375em + 0.1875rem) center;
	background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.div-valid-text-error:focus {
	border-color: var(--bs-form-invalid-border-color);
}
.div-valid-checkbox-success {
	border-color: var(--bs-form-valid-border-color);
}
.div-valid-checkbox-error {
	border-color: var(--bs-form-invalid-border-color);
}

.contract-success-box { border: none; }
.contract-success-box .card-body .card {
	border-radius: 20px;	
}
/************************************************************************************************/


/*************************************************************************************************
 * 애니메이션 처리
 */
.fade-in-top { animation: anime-in-up 1s; opacity: 1; }
@keyframes anime-in-up { 0% { opacity: 0; transform: translateY(20%); } to { opacity: 1; transform: translateY(0); } }

.fade-out-top { animation: anime-out-up 1s; opacity: 0; }
@keyframes anime-out-up { 0% { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(20%); } }

.fade-in-right { animation: anime-in-right 2s; opacity: 1; }
@keyframes anime-in-right { 0% { opacity: 0; transform: translateX(10%); } to { opacity: 1; transform: translateX(0); } }

.fade-out-right { animation: anime-out-right 2s; opacity: 0; }
@keyframes anime-out-right { 0% { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(10%); } }

.fade-in-left { animation: anime-in-left 2s; opacity: 1; }
@keyframes anime-in-left { 0% { opacity: 0; transform: translateX(-10%); } to { opacity: 1; transform: translateX(0); } }

.fade-out-left { animation: anime-out-left 2s; opacity: 0; }
@keyframes anime-out-left { 0% { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(-10%); } }

.fade-in-show {
	opacity: 0;
	animation: anime-show 3s 2s;
	animation-fill-mode: forwards;
	animation-delay: 0.1s;
}
@keyframes anime-show { from { opacity: 0; } to { opacity: 1; } }

.fade-out-show {
	opacity: 0;
	animation: anime-hide 3s 2s;
	animation-fill-mode: forwards;
	animation-delay: 0.1s;
}
@keyframes anime-hide { from { opacity: 1; } to { opacity: 0; } }

@keyframes slideRight {
	0% { transform-origin: 0 0; transform: translateX(0%); }
  100% { transform-origin: 0 0; transform: translateX(10%); }
}
@keyframes slideUp {
	0% { transform-origin: 0 0; transform: translateY(0%); }
  100% { transform-origin: 0 0; transform: translateY(-15%); }
}
/************************************************************************************************/

.horizon-divider {
	width: 100%;
	height: 3rem;
	background-color: rgba(0, 0, 0, .1);
	border: solid rgba(0, 0, 0, .15);
	border-width: 1px 0;
	box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}