@import url('https://webfontworld.github.io/GmarketSans/GmarketSans.css'); 
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSansLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSansBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* html5 필수요소*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp, a,
small, strong, sub, sup, var, input, ::placeholder, button,
b, i, p,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
 aside, canvas, details, figcaption, figure, 
footer, hgroup, menu, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-family: 'GmarketSansMedium','arial';
	color:#222;
	letter-spacing:-1px;
	line-height:22px;
}


/* **************************************** *
 *body
 * **************************************** */












/* **************************************** *
 *공통넓이
 * **************************************** */

.logoarea,
.tit,
.width_area,
.quiz_wrap
{box-sizing:border-box;  max-width:1100px; width:96%; margin-left:auto; margin-right:auto; }





/* **************************************** *
 *logoarea
 * **************************************** */
.logoarea  {position:relative; z-index:2; display:none;}
.logoarea { text-align:right;}



/* web*/
	@media (min-width: 1024px) {
	.logoarea { padding-top:30px; padding-bottom:30px;}
	.logoarea img {height:40px;}
.mobile_show {display:none}
.quiztxtnew {font-size:30px;  text-align:Center;line-height:50px; padding:50px 0px;}


	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
	.logoarea { padding-top:30px; padding-bottom:30px;}
	.logoarea img {height:30px;}
.mobile_show {display:none}
.quiztxtnew {font-size:25px;  text-align:Center;line-height:50px; padding:40px 0px;}

	 	}

/* 	mobile */
	@media (max-width:640px) {
	.logoarea { padding-top:30px; padding-bottom:30px;}
	.logoarea img {height:20px;}
.quiztxtnew {font-size:18px;  text-align:Center;line-height:30px; padding:30px 0px;}

	 	}


/* **************************************** *
 *btnarea
 * **************************************** */



.btnarea {display:block; margin-left:auto;  text-align:center; margin-right:auto;
	background:#2573d9; color:#fff;      /* font-family: 'InfinitySans-RegularA1'; */
}




/* web*/
	@media (min-width: 1024px) {
		.btnarea {margin-top:30px; margin-bottom:30px;}
.btnarea {font-size:30px; line-height:80px;  border-radius:80px; /* width:200px;  */ box-shadow:10px 10px 0px #103e79}

	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
		.btnarea {margin-top:30px; margin-bottom:30px;}
.btnarea {font-size:22px; line-height:70px;  border-radius:80px; width:200px;   padding:0px 30px;  box-shadow:10px 10px 0px #103e79}
	 	}

/* 	mobile */
	@media (max-width:640px) {
		.btnarea {margin-top:20px; margin-bottom:20px;}
.btnarea{font-size:19px; line-height:60px;  border-radius:80px;
width:120px;  /* padding:0px 30px; */  box-shadow:10px 10px 0px #103e79}
	 	}



/* **************************************** *
 *body
 * **************************************** */
/* body {position:relative; background:#86b56d url('/event/apsan/img/bg2.gif') no-repeat;  */
}


/* web*/
	@media (min-width: 1024px) {
	body {background-position:center -440px; background-size: 2000px auto}
	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
	body {background-position:center -140px; background-size: 1000px auto}

	 	}

/* 	mobile */
	@media (max-width:640px) {
	body {background-position:center 0px; background-size: 740px auto}

	 	}

/* **************************************** *
 *tit
 * **************************************** */
.tit  {position:relative; z-index:2; }

.tit dt { color:#f4329f; word-break:keep-all;     font-family: 'GmarketSansBold';
padding-right:50px;}


.tit dd {color:#48534c; text-align:Center; }
.tit dd strong {color:#fff; background:#f96d94; display:inline-block;}
.tit dd.desc { color:#5b8ff2;   padding-bottom:20px;}

h4.stit_new01 {  font-weight:500; display:block; 
background:rgba(107, 112, 238, 0.8); overflow:hidden; color:#fff; text-align:Center; }










/* web*/
	@media (min-width: 1024px) {
		.tit{padding-bottom:300px; padding-top:100px;}
		.tit dt {font-size:60px; text-align:center; line-height:80px; letter-spacing:-3px; padding-bottom:10px;}
		.tit dd.desc { font-size:40px; line-height:50px; padding-bottom:20px;}
		.tit .desc { color:#fff; font-size:40px; line-height:50px; padding-bottom:20px;}
		.tit dd,
		.tit dd strong {font-size:23px; line-height:34px;}
		.tit dd strong  {padding:0px 10px;}

		h4.stit_new01 {border-radius:50px; width:570px; font-size:25px; line-height:70px; margin-top:30px; }




	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
		.tit{padding-bottom:140px; padding-top:100px;}
		.tit dt {font-size:40px;  line-height:55px; text-align:center; letter-spacing:-2px; padding-bottom:10px;}
		.tit dd.desc { font-size:35px; line-height:40px; padding-bottom:20px;}
		.tit dd,
		.tit dd strong {font-size:19px; line-height:30px;}
		.tit dd strong  {padding:0px 10px;}
		h4.stit_new01 {border-radius:50px; width:500px; font-size:22px; line-height:50px; margin-top:30px; }


	 	}

/* 	mobile */
	@media (max-width:640px) {
		.tit{padding:40px 30px 120px 30px; text-align:Center;}
		.tit dt {font-size:29px; line-height:35px; 
		width:100%; letter-spacing:-2px; padding-bottom:10px;}
.tit dd.desc { font-size:19px; line-height:27px; padding-bottom:60px;}
		.tit dd,
		.tit dd strong {font-size:15px; line-height:25px; word-break:keep-all;}
		.tit dd br {display:none;}

		.tit dd strong  {padding:0px 10px;}
		h4.stit_new01 {border-radius:50px; padding-left:20px;
		padding-right:20px;  font-size:17px; line-height:40px; margin-top:20px; }


	 	}

/* **************************************** *
 *newdetailin
 * **************************************** */

p.indet {color:#e66c99}
.newdetailin {overflow:hidden;}
.newdetailin dl {overflow:hidden; }
.newdetailin dl dt { color:#4b3fd9; box-sizing:border-box; padding-right:0;}
.newdetailin dl dd { border-left:1px solid rgba(0,0,0,0.2);}

.newdetailin dl dd {color:#000}


/* web*/
	@media (min-width: 1024px) {
			p.indet {font-size:19px; line-height:30px; padding-top:20px; }
			.newdetailin { padding:40px 0px;}
		.newdetailin dl { padding:10px 0px;}
		.newdetailin dl dt {width:120px;}
		.newdetailin dl dd {   padding-left:30px;}
		.newdetailin  p {padding-top:30px; font-size:18px; line-height:37px;}
		.newdetailin dl dt,
		.newdetailin dl dd {font-size:20px; line-height:20px; float:left; }

	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
			p.indet {font-size:17px; line-height:26px; padding-top:20px; }
			.newdetailin { padding:40px 0px;}
		.newdetailin dl { padding:10px 0px;}
		.newdetailin dl dt {width:120px;}
		.newdetailin dl dd {   padding-left:30px;}
		.newdetailin  p {padding-top:30px; font-size:18px; line-height:37px;}
		.newdetailin dl dt,
		.newdetailin dl dd {font-size:20px; line-height:20px; float:left; }
	 	}

/* 	mobile */
	@media (max-width:640px) {
			p.indet {font-size:16px; line-height:24px; padding-top:10px; }
			.newdetailin { padding:40px 0px;}
		.newdetailin dl { padding:10px 0px;}
		.newdetailin dl dt {width:84px;}
		.newdetailin dl dd {   padding-left:20px;}
		.newdetailin  p {padding-top:30px; font-size:17px; line-height:37px;}
		.newdetailin dl dt,
		.newdetailin dl dd {font-size:17px; line-height:20px; float:left; }

	 	}






/* **************************************** *
 *giftarea
 * **************************************** */
.giftnew{box-sizing:border-box;  overflow:hidden; position:relative; width:100%; border-style:solid;border-color:#fc5299; background:#fff;}
.giftnew dl {display:inline-block; vertical-align:middle; text-align:center; overflow:hidden;}
.giftnew dl dt {text-align:center;}
.giftnew dl dd{color:#fc5299; text-align:center; font-weight:600;}
			.giftnew h3 {color:#fff; background:#f864a1; font-weight:normal;text-align:center; }
.giftnew dl dt,
.giftnew dl dd {padding:0px;}

.giftnotice {position:relative; padding:10px 0px 10px 30px; text-align:right; font-size:14px; }
.giftnotice:before {content:'!' ;border-radius: 50%; width:20px; height:20px;  display:inline-block; text-align:Center; font-weight:600;
color:#fff; background:#444; margin-right:5px;}



/* web*/
	@media (min-width: 1024px) {
			.giftnew{border-radius:50px; border-width:5px; padding-left:260px; }
			.giftnew h3 {width:210px; position:Absolute; top:0px; left:0px; font-size:27px; line-height:40px; padding:90px 0px;}
		.giftnew dl  {padding:20px 30px;}
			.giftnew dl dt img{height:160px;}
			.giftnew dl dd{font-size:19px; line-height:23px;}
	 	}


/* samll web*/
	@media (min-width:1024px) and (max-width:1200px) {
			.giftnew dl dt img{height:150px; }
	 	}



/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
			.giftnew{border-radius:50px; border-width:5px;  text-align:center;}
			.giftnew h3 { text-align:center;  font-size:24px; line-height:40px; padding:20px 0px;}
			.giftnew h3  br {display:none;}
		.giftnew dl  {padding:20px 10px;}
			.giftnew dl dt img{height:120px;}
			.giftnew dl dd{font-size:18px; line-height:23px;}
	 	}

/* 	mobile */
	@media (max-width:640px) {
			.giftnew{border-radius:50px; border-width:5px;  text-align:center;}
			.giftnew h3 { text-align:center;  font-size:21px; line-height:30px; padding:20px 0px;}
			.giftnew h3  br {display:none;}
		.giftnew dl  {padding:20px 10px; width:100%;}
			.giftnew dl dt img{height:120px;}
			.giftnew dl dd{font-size:18px; line-height:23px;}

.giftnotice {position:relative; padding:10px 0px 10px 30px; text-align:right; font-size:12px; }
.giftnotice:before {width:20px; height:20px;  margin-right:3px; }



	 	}





/* **************************************** *
 *quiz_wrap
 * **************************************** */

.quiz_wrap {box-sizing:border-box;  position:relative; z-index:2;  margin-bottom:50px; max-width:1200px; width:90%; margin-left:auto; margin-right:auto; background:#fff;}


/* web*/
	@media (min-width: 1024px) {
		.quiz_wrap {padding:50px 50px; border-radius:50px;}


	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
		.quiz_wrap {padding:30px 30px; border-radius:30px;}
	 	}

/* 	mobile */
	@media (max-width:640px) {
		.quiz_wrap {padding:20px 20px; border-radius:20px;}
	 	}



 







/* **************************************** *
 *quiz_wrap
 * **************************************** */


.quiz_wrap { background:#fff;}


/* **************************************** *
 *qarea
 * **************************************** */


.qarea { width:100%; box-sizing:border-box; position:relative;background:#eee;}
.qarea dt{position:absolute; color:#ef48ac;}
.qarea dt, .qarea dd, .qarea dd strong {    font-weight:normal; font-family: 'GmarketSansBold';}
.qarea dd {color:#000; word-break:keep-all;}
.qarea dd strong{background:rgba(88, 214, 227, 0.3); display:inline-block; color:#1c69cc;}





/* web*/
	@media (min-width: 1024px) {
	.qarea {padding:60px 40px 60px 170px; border-radius:20px;  }
	.qarea dt{top:30px; left:30px; font-size:100px; line-height:110px; }
	.qarea dd,
	.qarea dd strong {font-size:25px; line-height:39px; }
	.qarea dd strong { padding:0px 10px; margin:3px; }


.check {box-sizing:border-box; padding:40px 70px;; border-radius:30px; 
width:100%; background:rgba(0,0,0,0.3); margin-top:50px;}

.check h3 {font-size:30px; line-height:37px; padding-bottom:10px; color:#fff;}
.check li {font-size:17px; padding:6px 10px 6px 15px;  color:#fff; line-height:22px; position:relative;}
.check li:before {content:'.'; position:Absolute; color:#fff; top:0px; left:0px;font-size:20px; }



	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
	.qarea {padding:30px 20px 30px 110px; border-radius:10px;  }
	.qarea dt{top:20px; left:20px; font-size:60px; line-height:60px; }
	.qarea dd{font-size:20px; line-height:34px; }
	.qarea dd strong {margin:3px; padding:0px 10px;}
.check {box-sizing:border-box; padding:40px 40px;  border-radius:30px; 
overflow:Hidden;
width:100%; background:rgba(0,0,0,0.3); margin-top:50px;}
.check h3 {font-size:32px; line-height:37px; padding-bottom:10px; color:#fff;}
.check li {font-size:16px; padding:6px 10px 6px 15px;  color:#fff; line-height:22px; position:relative;}
.check li:before {content:'.'; position:Absolute; color:#fff; top:0px; left:0px;font-size:20px; }

	 	}

/* 	mobile */
	@media (max-width:640px) {
	.qarea {padding:20px 20px 20px 70px; border-radius:10px;  }
	.qarea dt{top:20px; left:20px; font-size:34px; line-height:40px; }
	.qarea dd,
	.qarea dd strong {font-size:17px; line-height:23px;}
	.qarea dd strong {margin:2px; padding:0px 6px;}

.check {box-sizing:border-box; padding:20px 20px;  border-radius:30px; 
overflow:Hidden;
width:100%; background:rgba(0,0,0,0.3); margin-top:50px;}
.check h3 {font-size:21px; line-height:30px; padding-bottom:10px; color:#fff;}
.check li {font-size:15px; padding:6px 10px 6px 15px;  color:#fff; line-height:22px; position:relative;}
.check li:before {content:'.'; position:Absolute; color:#fff; top:0px; left:0px;font-size:20px; }

	 	}


/* **************************************** *
 *hint
 * **************************************** */

.hint {color:#4381d0; box-sizing:border-box; width:100%;/*  transform:rotate(0.5turn) */}

/* web*/
	@media (min-width: 1024px) {
	.hint {font-size:20px; line-height:70px;  padding-left:10px;}
	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
	.hint {font-size:17px; line-height:50px;  padding-left:20px;}
	 	}

/* 	mobile */
	@media (max-width:640px) {
	.hint {font-size:15px; line-height:50px;  padding-left:20px;}
	 	}



/* **************************************** *
answer
 * **************************************** */

.answer input{ width:100%; box-sizing:border-box; border:none;}

.answer input::-webkit-input-placeholder { /* Edge */
  color: #5da5e6;  
}

.answer input:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #5da5e6;  
}

.answer input{  color: #5da5e6;  }


/* web*/
	@media (min-width: 1024px) {
		.answer {padding-top:20px;}
		.answer input {line-height:80px; height:80px;  border-bottom:5px  solid #5da5e6;
			padding-left:30px; font-size:30px;  }
	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
		.answer {padding-top:20px;}
		.answer input {line-height:70px; height:70px;  border-bottom:5px  solid #5da5e6;
padding-left:30px; font-size:30px; width:100% !important;  }

	 	}

/* 	mobile */
	@media (max-width:640px) {
		.answer {padding-top:20px;}
		.answer input {line-height:50px; height:50px;  border-bottom:5px  solid #5da5e6;
padding-left:20px; font-size:18px; width:100% !important;  }
	 	}






/* **************************************** *
ness
 * **************************************** */

.ness {text-align:right;}
.ness:before {content:'*'; display:inline-block; color:#ee8426;}

/* web*/
	@media (min-width: 1024px) {
	.ness {text-align:right; font-size:16px; line-height:30px; padding-top:40px;}
	.ness:before {padding-right:10px; vertical-align:middle;}

	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
	.ness {text-align:right; font-size:16px; line-height:30px; padding-top:40px;}
	.ness:before {padding-right:10px; vertical-align:middle;}
	 	}

/* 	mobile */
	@media (max-width:640px) {
	.ness {text-align:right; font-size:14px; line-height:20px; padding-top:30px;}
	.ness:before {padding-right:10px; vertical-align:middle}
	 	}



/* **************************************** *
privacy
 * **************************************** */

.privacy dt{border:1px solid #ddd; box-sizing:border-box; overflow:hidden;}
.privacy dd {text-align:right; padding-top:10px; font-size:14px;}
.privacy dd  input {vertical-align:middle;}


/* web*/
	@media (min-width: 1024px) {
	.privacy  {margin-top:30px;}
	.privacy dt{font-size:15px;  border-radius:20px; line-height:33px; padding:30px 30px}
	.privacy <dd>font-size:16px; line-height:60px;</dd>
	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
	.privacy  {margin-top:30px;}
	.privacy dt{font-size:15px;  border-radius:20px; line-height:33px; padding:30px 30px}
	.privacy dd{font-size:16px; line-height:60px;}
	 	}

/* 	mobile */
	@media (max-width:640px) {
	.privacy  {margin-top:30px;}
	.privacy dt{font-size:13px;  border-radius:10px; line-height:22px;  overflow:hidden; padding:10px 10px}
	.privacy dd{font-size:14px; line-height:40px;}
	 	}






/* **************************************** *
 *inputarea
 * **************************************** */

.inputarea {width:100%; border-top:1px solid #ddd; box-sizing:border-box; overflow:hidden;}
.inputarea  dt {font-weight:600;}

.inputarea  dl,
.inputarea  dd,
.inputarea  dt {box-sizing:border-box; overflow:hidden;}
		.inputarea  dd p:nth-child(2) { padding-top:10px;}

		.inputarea  dd input[type='button']{display:inline-block; border:none; width:auto !important; 
		background:#5c5e7b; vertical-align:middle; color:#fff; 
   }
.btn-primary {
    background-color: #ba79db !important;
    border-color: #ba79db !important; line-height:50px; height:50px;
}
#du_address {clear:both;}

input.type-text1 {margin-bottom:5px !important;}

/* web*/
	@media (min-width: 1024px) {
		.inputarea   {padding:20px 10px;}
		.inputarea  dt {float:left; width:200px;}
		.inputarea  dd {float:left; width:calc(100% - 200px);}
		.inputarea  dt {font-size:16px; line-height:50px; padding-left:20px;}
		.inputarea  dd input{ box-sizing:border-box; max-width:500px; width:60%; line-height:50px; height:50px; padding:0px 10px; margin:3px 10px;}
		.inputarea  dd.input3wd input{width:130px;}
		.inputarea  dd input[type='button'] {line-height:30px; margin-left:10px; padding:0px 10px; font-size:15px;}




	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
		.inputarea   {padding:15px 10px;}
		.inputarea  dt {float:left; width:80px;}
		.inputarea  dd {float:left; width:calc(100% - 100px);}
		.inputarea  dt {font-size:15px; line-height:26px; padding-left:10px;}
		.inputarea  dd input{ box-sizing:border-box; width:200px; line-height:40px; height:40px; padding:0px 10px; margin:0px 10px;}
		
		.inputarea  dd.input3wd input{width:100px;}
.btn-primary {
    line-height: 40px;
    height: 40px;
}


		.inputarea  dd input[type='button'] {line-height:30px;  padding:0px 10px; font-size:15px;}




	 	}

/* 	mobile */
	@media (max-width:640px) {
		.inputarea   {padding:10px 10px 10px 10px;}
		.inputarea  dt {font-size:13px; line-height:25px; margin-left:10px;}

		.inputarea  dd input{ box-sizing:border-box; width:200px; line-height:40px; height:40px; padding:0px 10px; margin: 0px 10px 3px 10px;}
		.inputarea  dd.input3wd input{width:50px;}
.btn-primary {
    line-height: 40px;
    height: 40px;
}



		.inputarea  dd input[type='button'] {line-height:30px;  padding:0px 10px; font-size:12px;}
	 	}

/* **************************************** *
 *btnarea
 * **************************************** */



.btnarea {display:block; margin-left:auto;  text-align:center; margin-right:auto;
background:#f26298; color:#fff;   font-weight:700;  }



/* web*/
	@media (min-width: 1024px) {
		.btnarea {margin-top:30px; margin-bottom:30px;}
.btnarea {font-size:30px; line-height:80px;  border-radius:80px; width:200px; 
box-shadow:10px 10px 0px #14248b}

	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
		.btnarea {margin-top:30px; margin-bottom:30px;}
.btnarea {font-size:22px; line-height:70px;  border-radius:80px;
width:200px;   padding:0px 30px;  box-shadow:10px 10px 0px  #14248b}
	 	}

/* 	mobile */
	@media (max-width:640px) {
		.btnarea {margin-top:20px; margin-bottom:20px;}
.btnarea{font-size:19px; line-height:60px;  border-radius:80px;
width:120px;  padding:0px 30px;  box-shadow:10px 10px 0px  #14248b}
	 	}






























/* html5 필수요소*/
.mb20 {margin-bottom:20px;}
.pt10 {padding-top:10px;}
.pb10 {padding-bottom:10px}
button {    font-family: 'GmarketSansBold' !important;  border:none !important;}
.normal {font-family:'GmarketSansMedium';}


/* **************************************** *
 *.quiz_start
 * **************************************** */
.quiz_start {text-align:center; padding:20px 0px; margin-top:60px;}
.quiz_start  a {display:inline-block; background:#3a4fd2; color:#fff; font-family: 'GmarketSansBold';}
.quiz_start  a {width:70%; max-width:400px; font-size:clamp(30px, 2.5vw, 40px);  
   padding-inline:30px; border:2px solid  #14248b;}
line-height:2; border-radius:50px; box-shadow:7px 15px 0px #14248b;}







/* web*/
	@media (min-width: 1024px) {
		.btnarea {margin-top:20px; margin-bottom:20px;}
.btnarea {font-size:30px; line-height:80px;  border-radius:80px; /* width:200px;  */ box-shadow:10px 10px 0px #103e79}
	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
		.btnarea {margin-top:20px; margin-bottom:20px;}
.btnarea {font-size:22px; line-height:70px;  border-radius:80px; width:200px;   padding:0px 30px;  box-shadow:10px 10px 0px #103e79}
	 	}

/* 	mobile */
	@media (max-width:640px) {
		.btnarea {margin-top:15px; margin-bottom:15px;}
.btnarea{font-size:19px; line-height:60px;  border-radius:80px;
width:120px;  /* padding:0px 30px; */  box-shadow:10px 10px 0px #103e79}
	 	}





/* **************************************** *
 *body
 * **************************************** */
		.modal-body .privacy {background:#eee; box-sizing:Border-box;}

	button.textnew, a.textnew {
		display:inline-block;
		text-align: center;
		background: #3a4fd2;
		border-radius:2px solid ##3a4fd2;
		color: #fff;
		 /* font-family: 'SangjuGotgam'; */
	}

.newcheck   {text-align:center;}
.newcheck  label,
.newcheck  input{ vertical-align:middle;}
.newcheck  label,
.newcheck  input{  margin-right:10px; margin:0px !important;}

.newsteparea {text-align:center;}
.newsteparea dl {border:3px solid #eee; position:relative; display:inline-block; border-radius:50%;  vertical-align:middle;}
.newsteparea dl:before {content:'>'; position:absolute;  color:rgba(0,0,0,0.2)}

.newsteparea dl dt,
.newsteparea dl dd {color:#666; text-align:center; font-weight:700;}
.newsteparea dl dt {opacity:0.7}
.newsteparea dl.on {background:#f864a1;  border:3px solid #f864a1 }
.newsteparea dl.on  dt,
.newsteparea dl.on  dd {color:#fff }
.newsteparea dl:last-child:before {color:#fff}

h4.newt {font-weight:500; margin-bottom:10px; margin-top:20px;}
				.filter-option ,
				.dropdown-toggle,
				.modal-body select,
				.dropdown-menu .label,
				.dropdown-menu a,
				.modal-body input[type='text']  {box-sizing:border-box; max-width:100%;}
				.modal-body select,
				.modal-body input[type='text']  {width:100%;}
.selectpicker,
.btn-group {margin-top:0px !important; margin-bottom:0px !important;}


.logonewlog {vertical-align:middle;  display:inline-block;}
.logonewlog img {vertical-align:middle; padding-right:10px;  display:inline-block;}


/* web*/
	@media (min-width: 1024px) {
		.modal-header {font-size:30px; line-height:50px;}
		.modal-dialog { width:800px !important;}
		.modal-body .privacy {background:#eee; font-size:16px !important; line-height:24px !important; padding:20px 20px !important;}
							.close {font-size:40px !important; margin-top:30px;}
				.newcheck {font-size:17px; line-height:50px; }
						button.textnew, a.textnew { margin-top:30px;
				  font-size: 20px;  margin-bottom:30px;
				  line-height: 50px;
				  border-radius: 50px;
				  width: 200px;
				  box-shadow: 5px 5px 0px #103e79;
				}

			.newsteparea dl {margin:20px 40px; width:120px; height:120px;}
			.newsteparea dl dt {font-size:14px; line-height:30px; padding-top:15px; }
			.newsteparea dl dd {font-size:17px; line-height:22px;}
			.newsteparea dl:before {font-size:30px; line-height:30px; top:50px; right:-50px; transform:scale(1,1.3)}

				h4.newt {font-size:22px; line-height:33px;  }
				.filter-option ,
				.dropdown-toggle,
				.modal-body select,
				.dropdown-menu .label,
				.dropdown-menu a,
				.modal-body input[type='text'] {font-size:16px !important; line-height:40px !important; height:40px !important; padding:0px 20px !important;}
				.dropdown-toggle,
				.dropdown-menu .label,
				.filter-option {padding:0px 0px !important;}
				.dropdown-menu .label {padding:10px 20px !important;}

.logonewlog img {width:26px;}


 	}



/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {

		.modal-header {font-size:25px; line-height:50px;}
		.modal-dialog { width:80% !important; left:10%;}
		.modal-body .privacy {background:#eee; font-size:16px !important; line-height:24px !important; padding:20px 20px !important;}
							.close {font-size:40px !important; margin-top:30px;}
				.newcheck {font-size:17px; line-height:50px; margin-bottom:30px;}
						button.textnew, a.textnew {
				  font-size: 20px;  margin-bottom:30px;
				  line-height: 50px;
				  border-radius: 50px;
				  width: 200px;
				  box-shadow: 5px 5px 0px #103e79;
				}
			.newsteparea dl {margin:20px 20px; width:110px; height:110px;}
			.newsteparea dl dt {font-size:13px; line-height:30px; padding-top:15px; }
			.newsteparea dl dd {font-size:17px; line-height:22px;}
			.newsteparea dl:before {font-size:25px; line-height:30px; top:40px; right:-40px; transform:scale(1,1.3)}

				h4.newt {font-size:22px; line-height:33px;  }
				.filter-option ,
				.dropdown-toggle,
				.modal-body select,
				.dropdown-menu .label,
				.dropdown-menu a,
				.modal-body input[type='text'] {font-size:16px !important; line-height:40px !important; height:40px !important; padding:0px 20px !important;}
				.dropdown-toggle,
				.dropdown-menu .label,
				.filter-option {padding:0px 0px !important;}
				.dropdown-menu .label {padding:10px 20px !important;}

.logonewlog img {width:24px;}
	 	}

/* 	mobile */
	@media (max-width:640px) {
		.modal-header {font-size:20px; line-height:40px;}
		.modal-body .privacy {background:#eee; font-size:15px !important; line-height:24px !important; padding:20px 20px !important;}
							.close {font-size:40px !important; margin-top:30px;}
				.newcheck {font-size:17px; line-height:50px; margin-bottom:30px;}
						button.textnew, a.textnew {
				  font-size: 20px;  margin-bottom:30px;
				  line-height: 50px;
				  border-radius: 50px;
				  width: 200px;
				  box-shadow: 5px 5px 0px #103e79;
				}
			.newsteparea dl {margin:10px 10px; width:70px; height:70px;}
			.newsteparea dl dt {font-size:11px; line-height:22px; padding-top:4px; }
			.newsteparea dl dd {font-size:13px; line-height:17px;}
			.newsteparea dl:before {font-size:14px; line-height:20px; top:30px; right:-16px; transform:scale(1,1.3)}

		h4.newt {font-size:19px; line-height:25px;  }
						.dropdown-toggle,
				.filter-option ,
				.dropdown-toggle,
				.modal-body select,
				.dropdown-menu .label,
				.dropdown-menu a,
				.modal-body input[type='text'] {font-size:16px !important; line-height:35px !important; height:35px !important; padding:0px 10px !important;}
				.dropdown-toggle,
				.dropdown-menu .label,
				.filter-option {padding:0px 0px !important; margin:0px !importnat}
				.dropdown-menu .label {padding:10px 20px !important;}

.logonewlog img {width:24px;}



	 	}


/* **************************************** *
 *
 * **************************************** */


.quiz_start {color:#111; margin-left:auto; 
margin-right:auto; width:90%; border-radius: clamp(30px, 6.5vw, 60px);
padding:clamp(30px, 2.5vw, 60px) 30px;
}
.quiz_start  label,
.quiz_start  p {font-size:clamp(20px, 2.5vw, 30px); line-height:1.8;    line-height:1.3; padding-top:10px;}


/* 동의 체크박스 */
#agree_chk {
  width:clamp(36px, 6vw, 60px);
  height:clamp(36px, 6vw, 60px);
  aspect-ratio:1 / 1;
  margin:0;
  flex:0 0 auto;
  border:3px solid #ddd;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  box-sizing:border-box;
  appearance:none;
  -webkit-appearance:none;
  transition:all .2s ease;
}

/* 체크됐을 때 */
#agree_chk:checked {
  border-color:#ff2e2e;
  background:#ffa42e;
  position:relative;
}

/* 체크 표시 */
#agree_chk:checked::after {
  content:"";
  position:absolute;
  left:50%;
  top:45%;
  width:28%;
  height:48%;
  border:solid #fff;
  border-width:0 4px 4px 0;
  transform:translate(-50%, -50%) rotate(45deg);
  box-sizing:border-box;
}

/* 포커스 */
#agree_chk:focus-visible {
  outline:3px solid rgba(0, 115, 217, .25);
  outline-offset:4px;
}

/* 모바일에서 더 안정적으로 */
@media (max-width:640px) {
  #agree_chk {
    width:clamp(32px, 9vw, 46px);
    height:clamp(32px, 9vw, 46px);
    border-width:2px;
    border-radius:8px;
  }

  #agree_chk:checked::after {
    border-width:0 3px 3px 0;
  }
}

/* **************************************** *
 *newcheck
 **************************************** */
.newcheck {margin-top:30px;  position:relative;}
.newcheck label, .newcheck input { border:1px solid #ddd;}

.newcheck label{ ;position:relative;}
.snsimg {padding:10px; margin-bottom:20px; width:100%; overflow:hidden; margin-top:20px;
box-sizing:border-box; border:1px solid #ddd !important; text-align:center;}
.snsimg img {width:100%; max-width:500px;}

.stepin {overflow:hidden; padding-bottom:10px;}
.stepin li {overflow:hidden; position:relative; }
.stepin li:before  {position:absolute; border-radius:50%;   text-align:center; color:#fff; background:#000;}
.stepin li:nth-child(1):before {content:'1' }
.stepin li:nth-child(2):before {content:'2' }
.stepin li:nth-child(3):before {content:'3' }
.stepin li:nth-child(4):before {content:'4' }
.size14 {font-size:14px;}
/* web*/
	@media (min-width: 1024px) {
.newcheck label{ padding:10px 10px 10px 40px;}
.newcheck svg { position:absolute; height:18px; width:18px; top:9px; left:17px;}
.stepin li {font-size:15px; float:left; width:50%; box-sizing:border-box;
line-height:22px; padding-left:25px; padding-bottom:8px;}
.stepin li:before  {font-size:11px; width:19px; line-height:19px;  height:19px; top:0; left:0;}



	 	}

/* 	pad */
	@media (min-width:641px) and (max-width:1023px) {
.newcheck svg { position:absolute; height:18px; width:18px; top:9px; left:17px;}
.newcheck label{ padding:10px 10px 10px 40px;}

.stepin li {font-size:15px; float:left; width:50%; box-sizing:border-box;
line-height:22px; padding-left:25px; padding-bottom:8px;}
.stepin li:before  {font-size:11px; width:19px; line-height:19px;  height:19px; top:0; left:0;}

	 	}


/* 	mobile */
	@media (max-width:640px) {
.newcheck svg { position:absolute; height:18px; width:18px; top:9px; left:17px;}
.newcheck label{ padding:10px 10px 10px 40px;}

.stepin li {font-size:15px; f box-sizing:border-box;
line-height:22px; padding-left:25px; padding-bottom:8px;}
.stepin li:before  {font-size:11px; width:19px; line-height:19px;  height:19px; top:0; left:0;}

	 	}