@import "reset.css";
@import "animate.css";
@import "../lib/swiper/swiper-bundle.min.css";
/* @import "../lib/calendar/jquery.calendar.css";
@import "../lib/scrollbar/jquery.mCustomScrollbar.min.css";
@import "../lib/chart/Chart.min.css";
@import "../lib/sweetalert/sweetalert2.min.css"; */
/* @import "sample.css"; */

/* font */
@font-face {
	font-family: 'NotoSans';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url("../assets/fonts/NotoSansKR-Regular.woff2") format("woff2"), 
		url("../assets/fonts/NotoSansKR-Regular.woff") format("woff"), 
		url("../assets/fonts/NotoSansKR-Regular.otf") format("truetype");
}
@font-face {
	font-family: 'NotoSans';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url("../assets/fonts/NotoSansKR-Medium.woff2") format("woff2"), 
		url("../assets/fonts/NotoSansKR-Medium.woff") format("woff"), 
		url("../assets/fonts/NotoSansKR-Medium.otf") format("truetype");
}
@font-face {
	font-family: 'NotoSans';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url("../assets/fonts/NotoSansKR-Bold.woff2") format("woff2"), 
		url("../assets/fonts/NotoSansKR-Bold.woff") format("woff"), 
		url("../assets/fonts/NotoSansKR-Bold.otf") format("truetype");
}
@font-face {
	font-family: 'NotoSans';
	font-style: normal;
	font-weight: bold;
	font-display: auto;
	src: url("../assets/fonts/NotoSansKR-Bold.woff2") format("woff2"), 
		url("../assets/fonts/NotoSansKR-Bold.woff") format("woff"), 
		url("../assets/fonts/NotoSansKR-Bold.otf") format("truetype");
}

/* colors */
:root {
	--blue: #258fff;
	--white: #fff;
	--light-gray: #dbdbdb;
	--gray: #cecece;
	--red: #ff5252;
	--yellow: #ffb800;
	--green: #63f3bf;
}

.color-blue {
	color: var(--blue);
}
.bg-blue {
	background-color: var(--blue);
}

/* radio custom */
.radio-button input[type="radio"] {/* 기존 라디오 버튼 삭제 */
    position: absolute;
    opacity: 0;
    height: 0;
    width: 0;
}
.radio-buttons {
    display: flex;
    align-items: center;
    gap: 4rem;
}
.radio-buttons .radio-button {
    cursor: pointer;
    position: relative;
    padding-left: 3rem;
}
.radio-buttons .radio-button .custom-radio {/* 외부 라인 */
    position: absolute;
    top: 50%;
    left: 0;
    border-radius: 50%;
	transform: translateY(-50%);
    background-color: #fff;
    border: 1px solid #C9CED9;
}
.radio-buttons .radio-button input[type="radio"]:checked ~ .custom-radio {/* 외부 라인 선택 */
    border: 0.6rem solid var(--blue);
}
.radio-buttons .custom-radio:after {/* 내부 원 */
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: 50%;
    border-radius: 50%;
    background-color: #C9CED9;
}
.radio-buttons .radio-button input[type="radio"]:checked ~ .custom-radio:after {
	/* 내부 원 선택 */
    background-color: #fff;
}

.radio-buttons {
	gap: 1rem;
}
.radio-buttons .radio-button {
	padding-left: 3rem;
}
.radio-buttons .radio-button .custom-radio {
	width: 2rem;
	height: 2rem;
}

/* button */
.btn-basic {
	display: inline-block;
	font-weight: 700;
	line-height: 1.375;
	border: 1px solid transparent;
	border-radius: 0.8rem;
	padding: 1rem 3.6rem;
	font-size: 1.4rem;
	text-align: center;
}
.btn-primary {
	color: #fff !important;
	background-color: var(--blue);
	border-color:  var(--blue);
}


/* quick button */
.quick-bar {
    position: absolute;
}
.quick-bar ul li {
    background: var(--white);
    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.20);
}
.quick-bar ul li:first-child {
    margin-top: 0;
}
.quick-bar ul li .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: #000;
    text-align: center;
    font-weight: 700;
    cursor: pointer;
}
.quick-bar ul li svg {
    width: 100%;
    height: 100%;
}
.quick-bar ul li.double-btn,
.quick-bar .btn-my-position {
    display: none;
}
.type-map .quick-bar ul li.double-btn,
.type-map .quick-bar .btn-my-position {
    display: block;
}

.type-map .quick-bar {
    position: fixed;
    top: 12rem;
    right: 2rem;
    width: 10.6vw;
    min-width: 4rem;
    max-width: 5.4rem;
}
.type-map .quick-bar ul li {
    margin-top: 0.8rem;
    width: 10.6vw;
    min-width: 4rem;
    max-width: 5.4rem;
    height: 10.6vw;
    min-height: 4rem;
    max-height: 5.4rem;
    border-radius: 1.2rem;
}
.type-map .quick-bar ul li .btn {
    height: 10.6vw;
    min-height: 4rem;
    max-height: 5.4rem;
    line-height: 1.6rem;
    border-radius: 0.8rem;
}
.type-map .quick-bar ul li.double-btn {
    height: 10.8rem;
    min-height: 8rem;
    max-height: 21.2vw;
}
.type-map .quick-bar ul li.double-btn .btn {
    position: relative;
}
.type-map .quick-bar ul li.double-btn .btn:after {
    content:'';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 32%;
    height: 2px;
    background-color: black;
}
.type-map .quick-bar ul li.double-btn .btn.plus:before {
    content:'';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2px;
    height: 32%;
    background-color: black;
}
.type-map .quick-bar ul li.double-btn .btn.minus:before {
    content:'';
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 40%;
    height: 1px;
    background-color: #DFDFDF;
}
.type-map .quick-bar ul li.double-btn .btn i {
    font-size: 0;
}


/* sample */
.layer-buttons {
	margin: 0 auto;
	width: 80vw;
}
.layer-buttons li {
	font-size: 16px;
}


/* layout */
html,
body {
	font-size: 10px;
	font-family: "NotoSans", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,'Open Sans', sans-serif;
}


/* All Device */
.wrapper {
	position: relative; 
	display: flex;
	flex-direction: row;
	flex-wrap: wrap; 
	width: 100%; 
	height: 100%; 
	-webkit-overflow-scrolling: touch;
}
.contents {
	margin-top: 11.2rem; /* header height */
	width: 100%;
	min-height: calc(100vh - 11.2rem);
	height: max-content;
}
.contents.bg {
	background-color: #F6FAFF;
}
.container {
	position: relative;
	height: 100%;
	margin: 0 auto !important;
}
.contents main {
	min-height: 100vh;
}

/* layer */
.layer-popup-wrap {
	position: fixed; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 0; 
	z-index: 100;
}
.layer-popup-wrap .back-panel {
	display: none; 
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100vh;
	background-color: #000; 
	transition: 0.3s; 
	opacity: 0.75;
}
.layer-popup-wrap.active .back-panel {
	display: block;
	animation: fadein75 0.3s;
}
.layer-popup {
	display: none; 
	position: absolute;
	top: 50vh;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 56.6%; /* TODO : 분기 */
	background: #fff;
	border-radius: 2rem;
}
.layer-popup.active {
	display:block;
}
.layer-popup .inner {
	position: relative;
}
.layer-popup .img svg,
.layer-popup .img img {
	width: 100%;
}
/* layer-main */
.layer-popup.layer-main .inner {
	padding: 4.17%; /* TODO : 분기 */
}
.layer-popup.layer-main .link-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 2.22%; /* TODO : 분기 */
}
/* layer-facility */
.layer-popup.layer-facility .link-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 6rem 4rem;
	padding: 5rem 7.8rem;
	text-align: center;
}
.layer-popup.layer-facility .link-wrap .tit {
	display: block;
	margin-top: 2.4rem;
	font-size: 2rem;
	font-weight: 700;
}
.layer-popup.layer-facility .link-wrap .text {
	margin-top: 1.4rem;
	font-size: 1.4rem;
}


/* btn-close */
.layer-popup .btn-close {
	z-index: 100;
	position: absolute;
	top: -5rem;
	right: 0;
	width: 3.6rem;
	height: 3.6rem;
	background-color: transparent;
}
.layer-popup .btn-close span {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}
.layer-popup .btn-close span:before,
.layer-popup .btn-close span:after {
	content: '';
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 0;
	background-color: #fff;
	width: 3.6rem;
	height: 2px;
}
.layer-popup .btn-close span:before {
	transform:rotate(45deg);
}
.layer-popup .btn-close span:after {
	transform:rotate(135deg);
}
/* 메인 진입 시 팝업 */
.layer-popup.layer-main .link-wrap .link {
	width: calc(50% - 1.6rem);
}
.layer-popup.layer-main .link-wrap.type-s {
	margin-top: 2.22%;
}
.layer-popup.layer-main .link-wrap.type-s .link {
	display: flex;
	align-items: center;
	gap: 3rem;
	padding: 1.7rem 3.4rem;
	border: 1px solid #DCDCDC;
	border-radius: 20px;
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 1.375;
}
.layer-popup.layer-main .link-wrap.type-s .link .img {
	width: 8rem;
	height: 8rem;
	object-fit: cover;
}
.layer-popup.layer-main .link-wrap.type-b .link .img {
	margin: 0 auto;
	width: 28rem;
}
.layer-popup.layer-main .link-wrap.type-b .link p {
	margin-top: 2.1rem;
}
.layer-popup.layer-main .link-wrap.type-b .link {
	padding: 3rem;
	border-radius: 20px;
	background-color: #F6FAFF;
	font-size: 2rem;
	font-weight: 700;
	height: 33.5rem /* 임시값 */
}
.layer-popup.layer-main .link-wrap.type-b .link i {
	font-style: normal;
	color: var(--blue);
}
.layer-popup.layer-help {
	width: 348px;
}
.layer-popup.layer-help .inner {
	padding: 2.4rem;
}
.layer-popup.layer-help .text-area {
	padding: 5.6rem 0 8rem 0;
	text-align: center;
}
.layer-popup.layer-help .text-area .title {
	display: block;
	font-size: 2rem;
	line-height: 2.7rem;
	font-weight: 700;
}
.layer-popup.layer-help .text-area .text {
	margin-top: 1.6rem;
	font-weight: 500;
	font-size: 1.4rem;
	line-height: 1.9rem;
}
.layer-popup.layer-help .btn-area button {
	width: 100%;
	margin-top: 1.6rem;
	padding: 2.4rem 0;
	border-radius: 1.2rem;
	font-size: 1.6rem;
	line-height: 2.2rem;
	font-weight: 700;
}
.layer-popup.layer-help .btn-area button:first-child {
	margin: 0 ;
}
.layer-popup.layer-help .btn-area button.btn-yellow {
	background-color: #FFDA55;
}
.layer-popup.layer-help .btn-area button.btn-green {
	background-color: #25E88A;
}
.layer-popup.layer-help .btn-area button.btn-blue {
	color: #fff;
	background-color: #258FFF;
}




/* Mobile Device */
/* 768px 미만 해상도의 모바일 기기를 위한 코드를 작성한다. 
모든 해상도에서 이 코드가 실행됨. 미디어 쿼리를 지원하지 않는 모바일 기기를 위해 미디어 쿼리 구문을 사용하지 않는다. */

/* Mobile Device */
@media all and (max-width:767px) {
	.only-pc {
		display: none !important;
	}
	.only-mo {
		display: block !important;
	}
}

/* Tablet Device */
@media all and (min-width:768px) and (max-width:1023px) {
	.only-pc {
		display: none !important;
	}
}

/* Under Tablet */
@media all and (max-width:1023px) {
	.noshow-mo {
		display: none !important;
	}
	html, 
	body {
		font-size: 10px;
	}
	.header {
		-webkit-box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.1);
		-moz-box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.1);
		box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.1);
	}
	.header .container {
		margin: 0 auto;
		/*width: 390px;*/
	}
	.contents {
		/*margin-top: 11.2rem;*/
		/*min-height: calc(100vh - 11.2rem);*/
		margin-top: 13.2rem;
		min-height: calc(100vh - 13.2rem);
		height: max-content;
		padding: 0px 10px;
	}
	.container {
		max-width: 760px;
		width: 100%;
		margin-top: -10.9rem;
	}
	
	.contents main {
		min-height: calc(100vh - 9.4rem - 57.5rem);
	}

	/* button */
	.btn-basic {
		padding: 1.7rem 0;
		width: 100%;
	}

	/* quick button */
    .quick-bar {
        position: fixed;
        top: 12rem;
        right: 2rem;
        width: 10.6vw;
        min-width: 4rem;
        max-width: 5.4rem;
    }
    .quick-bar ul li {
        margin-top: 0.8rem;
        width: 10.6vw;
        min-width: 4rem;
        max-width: 5.4rem;
        height: 10.6vw;
        min-height: 4rem;
        max-height: 5.4rem;
        border-radius: 1.2rem;
    }
    .quick-bar ul li .btn {
        height: 10.6vw;
        min-height: 4rem;
        max-height: 5.4rem;
        line-height: 1.6rem;
        font-size: 1.4vw;
        border-radius: 0.8rem;
    }
    .type-map .quick-bar ul li .btn {
        font-size: 1.4vw;
    }

	/* layer */
	.layer-popup {
		width: 315px;
	}
	.layer-popup .inner {
		padding: 2rem;
	}
	/* layer-main */
	.layer-popup.layer-main .link-wrap {
		flex-wrap: wrap;
		gap: 1rem;
	}
	.layer-popup.layer-main .link-wrap.link-wrap.type-s {
		display: flex;
		margin-top: 1rem;
		font-size: 1.4rem;
	}
	.layer-popup.layer-main .link-wrap .link {
		width: 100%;
	}
	.layer-popup.layer-main .link-wrap.link-wrap.type-b .link {
		height: 14rem; /* 임시값 */
	}
	.layer-popup.layer-main .link-wrap.link-wrap.type-s .link {
		flex-direction: column;
		gap: 0.6rem;
		width: calc(50% - 0.5rem);
		padding: 0.8rem 0.4rem 2rem 0.4rem;
		text-align: center;
	}
	.layer-popup.layer-main .link-wrap.type-s .link .img {
		width: 7rem;
		height: 7rem;
	}
	.layer-popup.layer-main .link-wrap.type-b .link {
		display: flex;
		align-items: center;
		gap: 1rem;
		padding: 3.2rem 1.4rem;
	}
	.layer-popup.layer-main .link-wrap.type-b .link .img {
		width: 9.8rem;
		height: auto;
	}
	.layer-popup.layer-main .link-wrap.type-b .link p {
		margin-top: 0;
		font-size: 1.6rem;
	}
	/* layer-facility */
	.layer-popup.layer-facility .link-wrap {
		padding: 1rem;
		gap: 3rem;
	}
	.layer-popup.layer-facility .link-wrap a {
		display: flex;
		gap: 0.6rem;
		text-align: left;
	}
	.layer-popup.layer-facility .link-wrap a .img {
		width: 7rem;
	}
	.layer-popup.layer-facility .link-wrap a .tit {
		margin-top: 0;
		font-size: 1.6rem;
	}
	.layer-popup.layer-facility .link-wrap a .text {
		margin-top: 1rem;
	}
	/* layer-picture */
	.layer-all-picture .layer-picture {
		position: absolute;
		top: 6rem;
		transform: translate(-50%, 0%);
		width: calc(100% - 4rem);
	}
	.layer-all-picture .back-panel {
		background-color: #fff;
		opacity: 100;
	}
	.layer-popup.layer-picture .btn-close {
		top: -5rem;
		width: 2rem;
		height: 2rem;
	}
	.layer-popup.layer-picture .btn-close span:before, 
	.layer-popup.layer-picture .btn-close span:after{
		width: 2rem;
		background-color: #000;
	}
	.layer-popup.layer-picture .inner {
		padding: 0;
		width: 100%;
		background: #fff;
	}
	.layer-popup.layer-picture .picture-list {
		display: flex;
		flex-direction: column;
		gap: 3.2rem;
		padding-bottom: 4rem;
		height: calc(100vh - 6rem);
		overflow-y: auto;
	}
	.layer-popup.layer-picture .picture-list li img {
		width: 100%;
		border-radius: 2rem;
	}
	/* layer-help */
	.layer-popup.layer-help {
		position: fixed;
		top: auto;
		bottom: 0;
		left: 50%;
		transform: translate(-50%, 0%);
		width: 100%;
		height: 0;
		border-radius: 20px 20px 0 0;
		-webkit-overflow-scrolling: touch;
	}
	.layer-popup.layer-help.active {
		height: auto;
		transition: height 1s ease-out;
	}
	.layer-popup.layer-help .btn-close {
		display: none;
	}
	.layer-popup.layer-help .inner {
		padding: 1rem 2rem 4.8rem 2rem;
	}
	.layer-popup.layer-help .text-area {
		padding: 5.6rem 0 8rem 0;
		text-align: center;
	}
	.layer-popup.layer-help .text-area .title {
		font-size: 2rem;
		line-height: 2.7rem;
	}
	.layer-popup.layer-help .text-area .text {
		margin-top: 1.6rem;
		font-size: 1.4rem;
		line-height: 1.9rem;
	}
	.layer-popup.layer-help .btn-area button {
		margin-top: 1.6rem;
		padding: 2.4rem 0;
		font-size: 1.6rem;
		line-height: 2.2rem;
	}
	.layer-popup.layer-help .btn-control-pannel {
		width: 100%;
		height: 20px;
		border-radius: 20px 20px 0 0;
	}
	.layer-popup.layer-help .btn-control-pannel:before {
		content:'';
		display: inline-block;
		width: 40px;
		height: 4px;
		border-radius: 2px;
		background-color: var(--gray);
	}

	#layer_facility_type {
/*		max-height: 60vh;
		height : 65vh;*/
		/*overflow-y: auto;
		-ms-overflow-style: none;
		scrollbar-width: none;*/
	}

	#layer_facility_type .link-wrap {
		height : 65vh;
		max-height : 70vh;
		overflow-y: auto;
		-ms-overflow-style: none;
		scrollbar-width: none;
	}

}

/* Tablet Device */
@media all and (min-width:1024px) and (max-width:1439px) {
	html, 
	body {
		font-size: 10px;
	}
	.container {
		margin: 0 auto;
		/*width: 816px;*/
		width:908px;
	}
	.contents main {
		min-height: calc(100vh - 11.2rem - 19.7rem);
	}
	.only-pc {
		display: none !important;
	}
	.only-mo {
		display: none !important;
	}

	/* quick-bar */
	.quick-bar {
		display: none;
	}

	/* layer */
	.layer-popup {
		width: 816px;
	}
	.layer-popup .inner {
		padding: 4rem;
	}
	/* layer-main */
	.layer-popup.layer-main .link-wrap {
		gap: 2rem 2rem;
	}
	.layer-popup.layer-main .link-wrap.type-s {
		margin-top: 2rem;
	}
	.layer-popup.layer-main .link-wrap .link {
		width: calc(50% - 1rem);
	}
	.layer-popup.layer-main .link-wrap.type-b .link p {
		margin-top: 1.7rem;
	}
	/* layer-picture */
	.layer-all-picture .layer-picture {
		top: 8rem;
		transform: translate(-50%, 0%);
	}
	.layer-all-picture .back-panel {
		background-color: #fff;
		opacity: 100;
	}
	.layer-popup.layer-picture .btn-close {
		top: -6.1rem;
		width: 3.2rem;
		height: 3.2rem;
	}
	.layer-popup.layer-picture .btn-close span:before, 
	.layer-popup.layer-picture .btn-close span:after{
		width: 3.2rem;
		background-color: #000;
	}
	.layer-popup.layer-picture .inner {
		padding: 0;
		width: 100%;
		background: #fff;
	}
	.layer-popup.layer-picture .picture-list {
		display: flex;
		flex-direction: column;
		gap: 3.2rem;
		padding-bottom: 4rem;
		height: calc(100vh - 8rem);
		overflow-y: auto;
	}
	.layer-popup.layer-picture .picture-list li img {
		width: 100%;
		border-radius: 2rem;
	}
}

/* Desktop Device */
@media all and (min-width:1440px) {
	.only-pc {
		display: block !important;
	}
	.noshow-pc {
		display: none !important;
	}
	.only-mo {
		display: none !important;
	}

	html, 
	body {
		font-size: 10px;
	}
	.container {
		width: 1240px;
	}
	.contents main {
		min-height: calc(100vh - 11.2rem - 14.9rem);
	}

	/* quick button */
    .quick-bar {
        position: fixed;
        top: 14rem;
        left: 50%;
        width: 5.4rem;
		transform: translateX(65rem);
    }
    .quick-bar ul li {
        margin-top: 0.8rem;
        width: 5.4rem;
        height: 5.4rem;
        border-radius: 1rem;
    }
    .quick-bar ul li .btn {
        font-size: 1.4rem;
        line-height: 1.6rem;
        border-radius: 1rem;
    }
    .type-map .quick-bar {
        top: 13.3rem;
        left: auto;
        right: 55rem;
		transform: translateX(0);
    }
    .type-map .quick-bar .only-pc {
        display: none !important;
    }
    .type-map .quick-bar .only-mo {
        display: block !important;
    }

	/* layer */
	.layer-popup {
		width: 900px;
	}

	.layer-popup-mid {
		width: 500px !important;
	}

	.layer-popup .inner {
		padding: 6rem;
	}

	.layer-popup-mid .inner {
		padding: 4rem !important;
	}

	/* layer-main */
	.layer-popup.layer-main .link-wrap {
		gap: 3.2rem 3.2rem;
	}
	.layer-popup.layer-main .link-wrap.type-s {
		margin-top: 3.2rem;
	}
	.layer-popup.layer-main .link-wrap .link {
		width: calc(50% - 1.6rem);
	}

	/* layer-picture */
	.layer-popup.layer-picture {
		padding: 0 8rem;
		width: 1060px;
		height: 640px;
		background: none;
	}	
	.layer-popup.layer-picture .inner {
		padding: 0;
	}
	.swiper-picture {
		width: 900px;
		height: 600px;
		overflow: visible;
	}
	.swiper-picture .swiper-container {
		width: 100%;
		height: 100%;
	}
	.swiper-picture .swiper-slide {
		width: 900px;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 2rem;
		background: #fff; 
		/* 이미지 없을 때 공통 이미지 사용을 원한다면 여기에 background-image 사용 */
	}
	.swiper-picture .swiper-slide > img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		border-radius: 2rem;
	}
	.swiper-picture .swiper-button-prev,
	.swiper-picture .swiper-button-next {
		z-index: 200;
		width: 3.4rem;
		height: 3.4rem;
	}
	.swiper-picture .swiper-button-prev:after,
	.swiper-picture .swiper-button-next:after {
		font-size: 3.4rem;
		color: #fff;
	}
	.swiper-picture .swiper-button-prev {
		left: -7.6rem;
	}
	.swiper-picture .swiper-button-next {
		right: -7.6rem;
	}
	.swiper-picture .swiper-pagination {
		position: absolute;
		bottom: -4.5rem;
		left: 50%;
		transform: translateX(-50%);
		display: inline-block;
		padding: 0 2rem;
		width: auto;
		font-size: 1.8rem;
		font-weight: 500;
		color: #fff;
		background: rgba(255, 255, 255, 0.20);
		border-radius: 3rem;
	}
	.swiper-picture .swiper-pagination span {
		color: #fff;
	}
}
@media all and (min-width:1440px) and (max-width:1920px) {
	
}

/* Desktop Large Device */
@media all and (min-width:1921px) {

}
 

/* frequently used */
.hide-text {
	display: block;
	position: absolute;
	width: 1px; 
	height: 1px; 
	white-space: nowrap;
	font-size: 1px;
	text-overflow: ellipsis;
	overflow: hidden;
	color: transparent;
	clip: rect(1px, 1px, 1px, 1px);
}
.txt-left {
	text-align: left !important;
}
.txt-center {
	text-align: center !important;
}
.pos-relative {
	position: relative;
}


/* flexbox */
.flex-row {
	display: flex;
	flex-direction: row;
}
.flex-column {
	display: flex;
	flex-direction: column;
}

/* component */
.scroll::-webkit-scrollbar { /* Chrome/Opera/Safari */
	display: none;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #acb8c1;
 }
 ::-moz-placeholder { /* Firefox 19+ */
	color: #acb8c1;
 }
 :-ms-input-placeholder { /* IE 10+ */
	color: #acb8c1;
 }
 :-moz-placeholder { /* Firefox 18- */
	color: #acb8c1;
 }
 

input[type=tel],
input[type=text],
input[type=search],
input[type=time],
input[type=email],
input[type=password] {
	padding: 1.7rem;
	border: solid 1px #d1d1d1; 
	border-radius: 12px; 
	background-color: var(--white); 
	width: 100%; 
	height: auto; 
	color: #0d0f11; 
	font-size: 1.6rem;
	line-height: 2.2rem;
	font-family:'NotoSans';
}
input[type=tel]:focus,
input[type=text]:focus,
input[type=search]:focus,
input[type=time]:focus,
input[type=email]:focus,
input[type=password]:focus {
	border-color: var(--blue);
	-webkit-transition: all 0.4s;
    transition: all 0.4s;
}

textarea {border: solid 1px #EAEBF0; border-radius: 8px; background-color: var(--white); width:100%; height:96px; line-height:22px; color:#0d0f11; font-size:14px; padding:13px 16px;}
textarea.big {height:192px;}
textarea.bigger {height:480px;}

.input-box {
	position: relative;
	padding: 1.5rem 1.6rem;
	border-radius: 6px;
	border: 1px solid #E1E3E5;
	background-color: var(--white); 
}
.input-box:focus {
	border-color: var(--blue);
	-webkit-transition: all 0.4s;
    transition: all 0.4s;
}
.input-box ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	text-align: right;
	color: #515961
 }
.input-box ::-moz-placeholder { /* Firefox 19+ */
	text-align: right;
	color: #515961
 }
.input-box :-ms-input-placeholder { /* IE 10+ */
	text-align: right;
	color: #515961
 }
.input-box :-moz-placeholder { /* Firefox 18- */
	text-align: right;
	color: #515961
 }
.input-box input[type=tel],
.input-box input[type=text],
.input-box input[type=search],
.input-box input[type=time],
.input-box input[type=email],
.input-box input[type=password] {
	padding: 0.4rem 0 0 0;
	width: 100%; 
	height: auto; 
	color: #0d0f11; 
	border-color: transparent;
	border-radius: 0;
}
.input-box textarea {
	margin-top: 1.2rem;
	padding: 0;
	color: #0d0f11;
	border: 0;
	border-color: transparent;
	background-color: var(--white); 
	width: 100%; 
	height: 96px; 
	font-size: 1.6rem;
	line-height: 2.2rem;
}
.input-box textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #515961;
	text-align: left;
 }
.input-box textarea::-moz-placeholder { /* Firefox 19+ */
	color: #515961;
	text-align: left;
 }
.input-box textarea:-ms-input-placeholder { /* IE 10+ */
	color: #515961;
	text-align: left;
 }
.input-box textarea:-moz-placeholder { /* Firefox 18- */
	color: #515961;
	text-align: left;
}
/* 활성화 시 */
.input-box:has(input[type=tel]:focus),
.input-box:has(input[type=text]:focus),
.input-box:has(input[type=search]:focus),
.input-box:has(input[type=time]:focus),
.input-box:has(input[type=email]:focus),
.input-box:has(input[type=password]:focus),
.input-box:has(textarea:focus) {
	border-color: var(--blue);
	-webkit-transition: all 0.4s;
    transition: all 0.4s;
}
/* 밸리데이션 체크 */
.input-box:has(input.error),
.input-box:has(input.error),
.input-box:has(textarea.error:focus),
.input-box:has(textarea.error:focus) {
	border-color: var(--red) !important;
	-webkit-transition: all 0.4s;
    transition: all 0.4s;
}
.input-box:has(input.error) .input-tit,
.input-box:has(textarea.error) .input-tit {
	color: var(--red);
}