@import url('./font-NanumBarunGothic.css');

@font-face {
	font-family: 'GMARKET';
	font-style: normal;
	font-weight: 100;
	font-display: auto;
	src: url('./gmarket/GmarketSansTTFLight.ttf') format('truetype');
}
@font-face {
	font-family: 'GMARKET';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('./gmarket/GmarketSansTTFMedium.ttf') format('truetype');
}
@font-face {
	font-family: 'GMARKET';
	font-style: normal;
	font-weight: bold;
	font-display: auto;
	src: url('./gmarket/GmarketSansTTFBold.ttf') format('truetype');
}

html, body {
	font-family: 'Nanum Barun Gothic', 'NanumGothic', '나눔고딕', 'Malgun Gothic', "Open Sans", Arial, sans-serif !important;
}

/* 목록의 텍스트 링크 */
.list_link:link, .list__link:visited, .list__link:active { text-decoration:none; color:#5c5c5c; }
.list_link:hover { text-decoration:underline; color:#cc3366; }

/* 배경색상 */
.custom-bg-color-light-1 {
	background-color: #eff1f3 !important; }

.custom-bg-color-light-2 {
	background-color: #eff1f3 !important; }

.custom-bg-color-grey-1 {
	background-color: #b9b9b9 !important; }

.custom-bg-color-grey-2 {
	background-color: #e4e4e4 !important; }

/* 화살표 */
.custom-read-more > svg {
	transition: ease transform 300ms; }

.custom-read-more:hover > svg {
	transform: translate3d(6px, 0, 0); }

.btn-link {
	color: #d80d07;
}

.btn-link:hover {
	color: #f10e08;
}

.btn-link:active {
	color: #bf0c06;
}


/* 섹션 Top & Bottom */
.custom-section-curved-top-1 {
	position: absolute;
	top: -590px;
	left: 0; }

.custom-section-curved-top-2 {
	position: absolute;
	top: -255px;
	left: 0; }

.custom-section-curved-top-3 {
	position: absolute;
	top: -210px;
	left: 0; }

.custom-section-curved-top-4 {
	position: absolute;
	top: -260px;
	left: 0;
	transform: rotateY(180deg); }

.custom-section-curved-top-5 {
	position: absolute;
	top: -236px;
	left: -60px;
	width: 115%; }

.custom-section-curved-top-6 {
	position: absolute;
	top: -560px;
	left: 0;
	transform: rotateY(180deg); }

.custom-section-curved-top-7 {
	position: absolute;
	top: -269px;
	left: 0; }

.custom-page-header-curved-top-1 {
	position: absolute;
	top: -575px;
	left: 0; }

/* 내용 circle */
.custom-circles-group-1 {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%; }
	.custom-circles-group-1 .circle-1 {
		width: 250px;
		height: 250px;
		border-radius: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 96px;
		margin-bottom: 6rem; }
	.custom-circles-group-1 .circle-2,
	.custom-circles-group-1 .circle-3 {
		position: absolute;
		display: flex;
		align-items: center;
		justify-content: center;
		top: 50%;
		left: 50%;
		border-radius: 100%;
		transform: translate3d(-50%, -50%, 0); }
	.custom-circles-group-1 .circle-2 {
		top: 56%;
		left: 76%;
		width: 190px;
		height: 190px; }
	.custom-circles-group-1 .circle-3 {
		top: 75%;
		left: 53%;
		width: 170px;
		height: 170px; }

@media (max-width: 767px) {
	.custom-circles-group-1 .circle-2 {
		left: 84%; }
	.custom-circles-group-1 .circle-3 {
		left: 40%; } }


/* 내용에 쓰인 circle 칼라 */
html .bg-color-quaternary,
html .bg-quaternary {
	background-color: #383f48 !important;
}

html .bg-color-secondary,
html .bg-secondary {
	background-color: #a33188 !important;
}

html .bg-color-tertiary,
html .bg-tertiary {
	background-color: #4046b3 !important;
}

/* 짙은 배경에 쓰인 칼라 */
html .bg-color-quaternary,
html .bg-quaternary {
	background-color: #383f48 !important;
}

/* 배경 circle */
.custom-circle {
	position: absolute;
	border-radius: 100%; }
	.custom-circle.custom-circle-big {
		width: 52px;
		height: 52px; }
	.custom-circle.custom-circle-medium {
		width: 23px;
		height: 23px; }
	.custom-circle.custom-circle-small {
		width: 15px;
		height: 15px; }
	.custom-circle.custom-circle-extra-small {
		width: 10px;
		height: 10px; }
	.custom-circle.custom-circle-pos-1 {
		top: 25%;
		left: -13%; }
		.custom-circle.custom-circle-pos-1.custom-circle-pos-1-1 {
			top: 50%; }
	.custom-circle.custom-circle-pos-2 {
		top: 43%;
		left: -4%; }
		.custom-circle.custom-circle-pos-2.custom-circle-pos-2-2 {
			top: 80%;
			left: -1%; }
	.custom-circle.custom-circle-pos-3 {
		top: 9%;
		left: 17%; }
		.custom-circle.custom-circle-pos-3.custom-circle-pos-3-3 {
			top: 35%; }
	.custom-circle.custom-circle-pos-4 {
		top: 53%;
		left: 20%; }
		.custom-circle.custom-circle-pos-4.custom-circle-pos-4-4 {
			left: 107%; }
	.custom-circle.custom-circle-pos-5 {
		top: 61%;
		left: 39%; }
		.custom-circle.custom-circle-pos-5.custom-circle-pos-5-5 {
			top: 21%;
			left: 96%; }
	.custom-circle.custom-circle-pos-6 {
		top: 41%;
		left: 46%; }
		.custom-circle.custom-circle-pos-6.custom-circle-pos-6-6 {
			top: 28%;
			left: 119%; }
	.custom-circle.custom-circle-pos-7 {
		top: 30%;
		left: 104%; }
	.custom-circle.custom-circle-pos-8 {
		top: 7%;
		left: 114%; }
	.custom-circle.custom-circle-pos-9 {
		top: 76%;
		left: 27%; }
	.custom-circle.custom-circle-pos-10 {
		top: 10%;
		left: 114%; }
	.custom-circle.custom-circle-pos-11 {
		top: 6%;
		left: 117%; }
	.custom-circle.custom-circle-pos-12 {
		top: 9%;
		left: 119.3%; }
	.custom-circle.custom-circle-pos-13 {
		top: 6%;
		left: 120%; }
	.custom-circle.custom-circle-pos-14 {
		left: 60%;
		top: -15%; }
	.custom-circle.custom-circle-pos-15 {
		top: -11%;
		left: 60.7%; }
	.custom-circle.custom-circle-pos-16 {
		top: -13.9%;
		left: 62%; }
	.custom-circle.custom-circle-pos-17 {
		top: 6%;
		left: 105%; }
	.custom-circle.custom-circle-pos-18 {
		top: 8%;
		left: 106.9%; }
	.custom-circle.custom-circle-pos-19 {
		top: 9.5%;
		left: 108.4%; }
	.custom-circle.custom-circle-pos-20 {
		bottom: 5.5%;
		left: -7%; }
	.custom-circle.custom-circle-pos-21 {
		bottom: 4.5%;
		left: -8.6%; }
	.custom-circle.custom-circle-pos-22 {
		bottom: 2.7%;
		left: -6.8%; }
	.custom-circle.custom-circle-pos-23 {
		bottom: 2.5%;
		left: -8.5%; }
	.custom-circle.custom-circle-pos-24 {
		top: 38%;
		left: -14.5%; }
	.custom-circle.custom-circle-pos-25 {
		top: 12.5%;
		left: -8.5%; }
	.custom-circle.custom-circle-pos-26 {
		top: 25.5%;
		left: 0.5%; }
	.custom-circle.custom-circle-pos-27 {
		top: 46%;
		left: 44.5%; }
	.custom-circle.custom-circle-pos-28 {
		top: 26%;
		left: 107%; }
	.custom-circle.custom-circle-pos-29 {
		top: 6.5%;
		left: 110%; }
	.custom-circle.custom-circle-pos-30 {
		top: 36.5%;
		left: 119.5%; }
	.custom-circle.custom-circle-pos-31 {
		top: 66.5%;
		left: 23.7%; }
	.custom-circle.custom-circle-pos-32 {
		top: 79%;
		left: 20%; }
	.custom-circle.custom-circle-pos-33 {
		top: 82%;
		left: 24.2%; }
	.custom-circle.custom-circle-pos-34 {
		top: 86%;
		left: 20.2%; }
	.custom-circle.custom-circle-pos-35 {
		top: 84%;
		left: 69.5%; }
	.custom-circle.custom-circle-pos-36 {
		top: 89.3%;
		left: 74.3%; }
	.custom-circle.custom-circle-pos-37 {
		top: 13.1%;
		left: 69.5%; }
	.custom-circle.custom-circle-pos-38 {
		top: 11.5%;
		left: 80.7%; }
	.custom-circle.custom-circle-pos-39 {
		top: 5.4%;
		left: 75.7%; }
	.custom-circle.custom-circle-pos-40 {
		top: 5.4%;
		left: 82.7%; }
	.custom-circle.custom-circle-pos-41 {
		top: 86%;
		left: 103%; }
	.custom-circle.custom-circle-pos-42 {
		top: 88.8%;
		left: 104.6%; }
	.custom-circle.custom-circle-pos-43 {
		top: 91%;
		left: 105.8%; }
	.custom-circle.custom-circle-pos-44 {
		left: 103%;
		top: 10%; }
	.custom-circle.custom-circle-pos-45 {
		left: 104.7%;
		top: 14.1%; }
	.custom-circle.custom-circle-pos-46 {
		left: 106.2%;
		top: 10.4%; }
	.custom-circle.custom-circle-pos-47 {
		top: 86%;
		left: -3%; }
	.custom-circle.custom-circle-pos-48 {
		top: 95%;
		left: -2.5%; }
	.custom-circle.custom-circle-pos-49 {
		top: 93%;
		left: -4.5%; }
	.custom-circle.custom-circle-pos-50 {
		top: 97%;
		left: -4.3%; }

.custom-dots-rect-1 {
	width: 103px;
	height: 138px;
	position: absolute;
	bottom: 50px;
	left: -104px;
	z-index: 0; }

.custom-dots-rect-2 {
	width: 79px;
	height: 75px;
	position: absolute;
	bottom: -43px;
	right: -39px;
	z-index: 0; }

.custom-dots-rect-3 {
	width: 99px;
	height: 119px;
	position: absolute;
	top: -77px;
	left: -71px;
	z-index: 0; }

.custom-dots-rect-4 {
	position: absolute;
	top: -50px;
	right: -388px;
	width: 144px;
	height: 100px;
	transform: rotateX(180deg); }

.custom-dots-rect-5 {
	position: absolute;
	bottom: -80px;
	left: -38px;
	width: 144px;
	height: 100px;
	transform: rotateX(180deg); }

/* 메인 비쥬얼 */
.custom-bg-color-1 {
	background-color: #f5fbff !important; }

.custom-background-style-1 {
	padding-top: 190px !important;
	padding-bottom: 0 !important;
	overflow: hidden; }
	@media (max-width: 1199px) {
		.custom-background-style-1 {
			min-height: 520px; } }
	@media (max-width: 991px) {
		.custom-background-style-1 {
			padding-top: 120px !important;
			min-height: 480px; } }
	.custom-background-style-1:after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		/* background: url("../../img/");
		background-size: cover; */
		opacity: 0.1;
		z-index: 0; }
	.custom-background-style-1 > div {
		position: relative;
		z-index: 1; }

.custom-text-align-right {
	text-align: right; }

@media (max-width: 767px) {
	.custom-xs-image-center {
		margin: 0 auto;
		margin-bottom: 25px; } }

.custom-icon-fix-pos {
	margin-left: 3px; }

.custom-btn-style-1, .custom-btn-style-1:active {
	background: #f4645a;
	background: linear-gradient(to right, #f4645a 0%, #ff857c 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4645a', endColorstr='#ff857c', GradientType=1 );
	border: none;
	border-radius: 50px !important;
	padding: 13px 30px;
	font-size: 12px;
	font-weight: 600;
	transition: ease all 300ms; }

.custom-btn-style-1:hover {
	opacity: 0.9; }

.custom-btn-style-1._borders {
	background: transparent;
	border: 1px solid #ff8880; }
	.custom-btn-style-1._borders:hover, .custom-btn-style-1._borders:active, .custom-btn-style-1._borders:focus {
		border-color: #ff8880;
		background: linear-gradient(to right, #f4645a 0%, #ff857c 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4645a', endColorstr='#ff857c', GradientType=1 ); }

.custom-btn-style-1._size-1 {
	padding: 13px 42px !important;
	font-size: 12px !important;
	letter-spacing: 0.5px !important; }

.custom-btn-style-2 {
	border-radius: 50px;
	border-width: 2px;
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.5px;
	padding: 8px 24px;
	background: transparent !important;
	border-color: rgba(244, 100, 90, 0.5) !important; }
	.custom-btn-style-2:hover, .custom-btn-style-2:hover:active, .custom-btn-style-2.active, .custom-btn-style-2:focus {
		border-color: #f4645a !important; }

/* 메인이미지 Owl Carousel */
.owl-carousel.custom-background-1 {
	bottom: -15px;
	padding: 31.8% 6.8% 0; }
	.owl-carousel.custom-background-1:before {
		content: '';
		position: absolute;
		display: block;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background: url("../img/smartphone.png");
		background-size: 100%;
		background-repeat: no-repeat; }
	.owl-carousel.custom-background-1 .owl-stage {
		overflow: hidden;
		max-height: 365px; }

@media (max-width: 767px) {
	.owl-carousel.custom-left-pos-1 {
		margin-top: 50px !important; } }

@media (min-width: 768px) {
	.owl-carousel.custom-left-pos-1 {
		left: -50px;
		margin-top: 70px !important; } }

@media (min-width: 992px) {
	.owl-carousel.custom-left-pos-1 {
		left: -85px;
		margin-top: -50px !important; } }

.owl-carousel.custom-arrows-style-1 .owl-nav {
	left: 0;
	transform: translate3d(0, 0, 0); }
	.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-prev, .owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next {
		background: transparent !important; }
		.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-prev:before, .owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next:before {
			content: '';
			display: block;
			position: absolute;
			width: 30px;
			height: 30px;
			border-top: 2px solid #c5c5c5;
			border-right: 2px solid #c5c5c5;
			transform: rotate(-135deg); }
		.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-prev:after, .owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next:after {
			content: "";
			display: block;
			height: 60px;
			left: -28px;
			position: absolute;
			top: -13px;
			width: 74px;
			z-index: 0; }
	.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-prev {
		left: -60px; }
	.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next {
		left: initial;
		right: -60px; }
		.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next:before {
			transform: rotate(45deg); }
		.owl-carousel.custom-arrows-style-1 .owl-nav button.owl-next:after {
			left: -20px; }
	.owl-carousel.custom-arrows-style-1 .owl-nav button[class*="owl-"]:hover:active:before, .owl-carousel.custom-arrows-style-1 .owl-nav button[class*="owl-"]:focus:before {
		border-color: #FFF; }

@media (max-width: 767px) {
	.owl-carousel.custom-arrows-style-1._custom-nav-bottom {
		margin-bottom: 60px; }
		.owl-carousel.custom-arrows-style-1._custom-nav-bottom .owl-nav {
			width: 0%;
			top: auto;
			bottom: -10px;
			left: 50%;
			transform: translateX(-50%); } }
