*,body,html {margin:0;padding:0;box-sizing:border-box; line-height:1.2}
* {font-family:'Pretendard-Regular','sans-serif' !important}
ul {list-style:none}
a {text-decoration:none}
img {vertical-align:top; max-width:100%}

:root{
	--color-1:#A45FFF;
	--fs-1:58px;
	--fs-2:44px;
	--fs-3:16px;
	--fs-4:20px;
	--sz-1:10px;
	--sz-2:20px;
	--sz-3:30px;
	--sz-4:46px;
	--sz-5:50px;
	--sz-6:64px;
	--sz-9:90px;
	--sz-ipt:260px;
}
body {font-size:var(--fs-3:16px);color:#222}
#wrap {min-height: 100vh; background:url(/images/back.jpg) no-repeat 0% 50%; background-size: cover; display:flex; justify-content:center; align-items:center}
.am-section {background:#fff; border-radius: var(--sz-2); box-shadow:4px 4px 16px rgba(0,0,0,0.4); display:flex; overflow:hidden; width:1200px;}
.am-header {width:490px;
	background: url(/images/icon_top.png) no-repeat 50% 26px,
            url(/images/icon_bottom.png) no-repeat 50% 97%;
            background-color: var(--color-1);
	color:#fff; display:flex; flex-direction: column;justify-content: center;align-items:flex-start;padding:var(--sz-6);}
#wrap h1 {font-size:var(--fs-1); font-weight:100; word-break: keep-all;}
#wrap h2 {font-size:var(--fs-2);font-weight:600; word-break: keep-all;}
.am-header p {padding-top:var(--sz-3); line-height:1.6}
.am-contents {padding:var(--sz-4) var(--sz-9); max-width:710px;}
.flex {display:flex;gap:10px}
.am-form .label {font-size:var(--fs-4);font-weight:600}
.am-form input[type=text],
.am-form input[type=tel],
.am-form input[type=email],
.am-form textarea {display:block;padding:14px; border-radius: 14px;border:1px solid #ccc; font-size:var(--fs-3);}

.am-form input[type=text],
.am-form input[type=tel],
.am-form input[type=email] {width:var(--sz-ipt);  margin:10px 0 26px}
.am-form textarea {width:100%; resize: none; min-height:140px; margin-bottom:18px}

.am-form textarea:focus,
.am-form input[type=text]:focus,
.am-form input[type=tel]:focus,
.am-form input[type=email]:focus {border:1px solid var(--color-1);outline:1px solid var(--color-1); color:#000; font-weight: 600;}

.checkbox {display:flex; flex-wrap:wrap; padding:10px 0 8px;}
.checkbox li {position:relative; padding-left: 24px; margin:0 16px 8px 0}
.checkbox li input[type=checkbox] {opacity:0; width:0;height: 0; overflow:hidden;border:0;background: none; transform: scale(0);display:block}
.checkbox li input[type=checkbox] + label:before,
.checkbox li input[type=checkbox] + label:after {content:''; display:block; width:18px; height:18px; position:absolute;border-radius: 6px;left:0; top:0; transform:translateY(0%)}
.checkbox li input[type=checkbox] + label:before {border:1px solid #ccc; background:#fff;}
.checkbox li input[type=checkbox] + label:after {border:1px solid var(--color-1); background:var(--color-1) url(/images/check.png) no-repeat 50% 50%; transition:opacity 0.1s linear;opacity:0;}
.checkbox li input[type=checkbox]:checked + label:after {opacity:1}
.checkbox li label {cursor:pointer}

.am-agree {background:#ededed; border-radius: 14px; padding:8px 16px 18px; margin-top:10px;}
.am-agree .checkbox {padding-bottom: 0}
.am-agree p {padding-left:24px;}

.am-btnarea {padding-top:23px; text-align:center}
.am-btn {width:320px; height:56px; background: #000; color:#fff; text-align: center; border:0; font-size: 22px; border-radius: 14px; cursor:pointer; transition:all 0.3s ease}
.am-btn:hover {background:var(--color-1)}

.popup-bg {position:fixed; top:0;left:0;bottom:0;right: 0;background: rgba(0,0,0,0.7); backdrop-filter: blur(10px); z-index: 900; display:flex; justify-content:center; align-items:center}
.popup-content {background:#fff; border-radius: 10px; overflow:hidden; box-shadow:var(--rbb-box-shadow1); z-index: 999;width:100%; max-width:420px; padding:40px; margin:10px}
.popup-content > h3 {padding-bottom: 10px;}
.popup-content * {max-width:100%;}
.privacy-content { max-height: 60vh; min-height: 200px; overflow-y:auto}
.popup-content .btnArea {padding-top: 16px;}
.popupLayer {display:none}

.divalert {position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); background:#000; color:#fff; display:inline-block; z-index:999; border-radius:10px; padding:10px 20px 10px 46px; box-shadow:0 0 8px rgba(0,0,0,.1); animation:divalert 2s ease forwards; line-height: 1.3}
.divalert i {display:inline-block;vertical-align:-1px; width:18px; height:18px; border-radius:50%; background:#fff; color:#000; font-weight:bold; text-align:center; font-style:normal; margin-right:8px; line-height:18px; font-size:1em; position:absolute; top:50%; transform: translateY(-50%) ;left:20px}

@media screen and (max-width:1279px){
	:root{
		--fs-1:40px;
		--fs-2:32px;
		--sz-4:36px;
		--sz-6:40px;
		--sz-9:90px;
	}
	.am-section {max-width:1060px}
	.am-header {width:420px;background-size: 90% auto}
}

@media screen and (max-width:1059px){
	:root{
		--fs-3:14px;
		--sz-4:36px;
		--sz-6:30px;
		--sz-9:90px;
	}
	.mo-hidden {display:none}
	.am-section {max-width:100%; width:auto; margin:10px; flex-direction:column}
	.am-header {width:100%; background:var(--color-1) url(/images/icon.png) no-repeat 50% 26px;background-size:92% auto; text-align:center; display:block; padding-top:70px}
	.am-header h1,
	.am-header h2 {text-align:center}
	* {word-break:keep-all;}
	.am-contents {padding: 24px 24px 40px;}
	.am-contents .flex {flex-direction:column; gap:0}
	.mo-flex {padding-bottom:8px}
	.mo-flex > label {display:flex; align-items:center; justify-content:space-between;}
	.am-form input[type=text], .am-form input[type=tel], .am-form input[type=email] {margin:0; width:100%}
	.am-form .label {font-size:16px; width:100px}

	.mo-line {border-top:1px solid #ccc; margin-top:16px; padding-top:16px;}
	.am-form textarea {min-height:105px;}
	.am-agree {font-size:12px;padding:8px 10px 18px;}
	.am-btn {width:240px; height:42px; font-size: 18px;}
}