@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css");
@font-face {
	font-family: 'aritadm';
	src: url('/resource/fonts/AritaDotumMedium_subset.eot');
	src: local(※), url('/resource/fonts/AritaDotumMedium_subset.eot?#iefix') format('embedded-opentype'),
	url('/resource/fonts/AritaDotumMedium_subset.woff') format('woff'),
	url('/resource/fonts/AritaDotumMedium_subset.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
:root {
	--point-main: rgba(224, 72, 60, 1);
}

/*
* {
	margin: 0; padding: 0;
	font-family: "Pretendard"; font-size: 16px; color: #333;
	-webkit-text-size-adjust: none;
}
*/

body * :not(i):not(code):not(.fa):not(.fas) {
	font-family: 'aritadm'; letter-spacing: -0.04em;
}

* {
	margin: 0; padding: 0;
	font-size: 16px; color: #333;
	-webkit-text-size-adjust: none;
}

a:link, a:visited, a:hover, a:active {
	text-decoration: none; color: #333;
}

body > h1 {
	text-indent: -10000px;
	position: absolute;
	font-size: 1px;
}

body {
	overflow-x: hidden;
}
header {
	background-color: #e6e1e1;

	background-image: url('/resource/images/guest/banner1.png?v=2');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.container {
	width: 1189px; margin: 0 auto;
}
.container:after {
	content: ''; display: block; clear: both;
}

header .container {
	height: 760px; padding-top: 25px;
	/*background-image: url('/resource/images/guest/banner1.png?v=2');
	background-repeat: no-repeat;
	background-position: bottom right;
	background-size: 800px 566px;*/
}
header .container h1 {
	font-size: 26px; font-weight: 700; cursor: default;
}
header .container h2 {
	font-size: 48px;
    font-weight: 700;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.27;
    letter-spacing: -.4px;
    margin-top: 217px;
}
header .container h3 {
	margin-top: 32px;
    font-size: 30px;
    line-height: .8;
    letter-spacing: -.4px;
}

header .container h1,
header .container h2,
header .container h3,
header .container h3 b {
	color: #fff;
}

.article .container {
	padding: 50px 0;
}
.article .container h2 {
	float: left;
	font-size: 30px; font-weight: 700; letter-spacing: -.4px;
}
.article .container .site-info {
	float: right;
	font-size: 30px; font-weight: 700; letter-spacing: -.4px;
}

aside {
	position: fixed; bottom: 0; left: 50%;
	-webkit-transform:	translate(-50%, 0);
	transform:			translate(-50%, 0);
}
aside .container {
	background-color: #fff; padding: 30px 40px;
	border-radius: 8px 8px 0 0;
    box-shadow: 0 0 7px 0 rgb(0 0 0 / 11%);
}
aside .container h2 {
	float: left; margin: 10px 15px 0 0;
	font-size: 22px; font-weight: 500; color: var(--point-main);
}
aside .container p {
	float: left; position: relative; top: 14px;
}
aside .container .btn-group {
	float: right;
}
aside .container .btn-group a {
	display: inline-block; border-radius: 50px;
	padding: 10px 30px;
	background-color: var(--point-main); color: #fff;
}
aside .container .btn-group a.kakao {
	display: inline-block; border-radius: 50px;
	padding: 10px 30px; margin-right: 10px;
	background-color: #fee500; color: #000;
}
aside .container .btn-group a.community {
	margin-right: 10px;
}

@media screen and (min-width: 950px) and (max-width: 1280px) {
	header .container {
		width: calc(100% - 20px); padding: 25px 10px 0;
	}

	.article .container {
		width: calc(100% - 20px); padding: 50px 10px;
	}

	aside { width: 100%; }
	aside .container {
		width: calc(100% - 80px);
	}
}
@media screen and (min-width: 500px) and (max-width: 950px) {
	header .container {
		width: calc(100% - 20px); padding: 25px 10px 0;
		background-image: url('/resource/images/guest/banner1.png?v=2');
		background-position: bottom center;
		background-size: cover;
	}
	header .container h1,
	header .container h2,
	header .container h3,
	header .container h3 b {
		color: #fff;
	}

	.article .container {
		width: calc(100% - 20px); padding: 50px 10px;
	}

	aside { width: 100%; }
	aside .container {
		width: calc(100% - 80px);
	}
}
@media screen and (max-width: 500px) {
	header .container {
		width: calc(100% - 20px); padding: 25px 10px 0;
		background-image: url('/resource/images/guest/banner1.png?v=2');
		background-position: bottom center;
		background-size: cover;
	}
	header .container h1,
	header .container h2,
	header .container h3,
	header .container h3 b {
		color: #fff;
	}

	.article .container {
		width: calc(100% - 20px); padding: 50px 10px;
	}
	.article .container h2, .article .container .site-info {
		font-size: 22px;
	}

	aside { width: 100%; }
	aside .container {
		width: calc(100% - 40px); padding: 30px 20px;
	}
}
@media screen and (max-width: 560px) {
	aside .container p { display: none; }
}
.bottom-space {
	display: block; clear: both; height: 100px;
}