prod_areafdb813fdb813fdb813fdb813@charset "utf-8"; /* reset */

@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, strong, sub, sup, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, embed, input, select, textarea, button {margin:0;padding:0;}
body {font-size:14px;line-height:1.428;font-family: 'Noto Sans KR', sans-serif;color:#333; position: relative; background-color: #E9E9E9; padding: 0; margin: 0; }
h1, h2, h3, h4, h5, h6 {font-size:1.3em;font-weight:normal;}
input, button, textarea {font-size:1.3em;font-family: 'Noto Sans KR', sans-serif;}
select {font-size:1.3em;}
code, pre {font-size:1.3em;font-family: 'Noto Sans KR', sans-serif;}
address, em, cite {font-style:normal;}
img {border:0 none;}
hr {display:none;}
table {border-collapse:separate;border-spacing:0;}
caption, .hd {width:0;height:0;overflow:hidden;visibility:hidden;font-size:0;line-height:0;}
th, td {vertical-align:top;text-align:left;font-weight:normal;}
li {list-style-type:none;}
form {margin:0;padding:0;}
fieldset {border:0 none;}
legend, .hd {position: absolute;border:0px;width: 1px;height: 1px;clip: rect(1px, 1px, 1px ,1px);clip-path:inset(50%);overflow: hidden;}
label, button {cursor:pointer;}
button {overflow:visible;border:none;background:none;background:transparent;font-family:inherit;white-space:nowrap;vertical-align:top;text-decoration:none;*margin-left:4px;}
button::-moz-focus-inner {border:0;padding:0;}
a:link {/* color:#565d6d; */ text-decoration:none;*cursor:pointer;}
img{vertical-align: top}
div, input { box-sizing:border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }


/* 플레이스홀더숨김 */
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder { color:transparent; }
input:focus:-ms-input-placeholder { color:transparent; }

/* Wrap */
.wrap { max-width: 750px; width: 100%; margin:0 auto; position: relative; background-color: #f4f4f4; }
.wrap:after{display:block; clear:both; content:'';}

/* Flex */
.flexwrap {
display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox;      /* TWEENER - IE 10 */
display: -webkit-flex;     /* NEW - Chrome */
display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
}
.jc_cen { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.jc_r { -webkit-box-pack: right; -ms-flex-pack: right; justify-content: right; }
.jc_sb { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.ai_cen { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

/* 우측 고정 전화 버튼 */
.fix_btn { display: inline-block; background-color: #fdd138; background-color: #d21776; border-radius: 500px; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3); position: fixed; width: 16%; max-width: 120px; bottom: 0;
  right: 0; left: 50; transition: all 0.3s ease 0s;  z-index:999; margin: 3%; }
.bounce { animation: bounce 2s ease infinite; }
@keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	60% {transform: translateY(-15px);}
}

/* 좌측 고정 전화 버튼 */
.fix_btn_left { display: inline-block; background-color: #fdd138; background-color: #fd6e05; border-radius: 500px; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3); position: fixed; width: 16%; max-width: 120px; bottom: 0;
	right: 50; left: 0; transition: all 0.3s ease 0s;  z-index:999; margin: 3%; }


/* 결과페이지 */
html, body { width: 100%; height: 100%; }

.result_page > div { position: absolute; text-align: center; left: 50%; transform: translateX(-50%); width: 100%; height: 100%; background-color: #f4f4f4; }
.result_page > div > div > img { display: inline-block; }
.result_page > div > div > strong { display: inline-block; font-size: 2em; margin-top: 20px; }
.result_page > div > div > p { font-size: 1.3em; margin-bottom: 30px; }
.result_page > div > div > .flexwrap { text-align: center; }
.result_page > div > div > .flexwrap > a { display: inline-block; background-color: #333; color: #fff; padding: 15px 25px; border-radius: 200px; display: inline-block; font-size: 1.1em; font-weight: bold; margin-left: 8px; }
.result_page > div > div > .flexwrap > a:first-of-type { margin-right: 0%; }

/* 메인 버튼 */
.main_btn { background-color: #f0f0f0; padding: 2% 3%; }
.main_btn > a {width: 19%;}

/* 버튼 */
.buttons { background-color: #f4f4f4; padding: 12% 0; }
.buttons > div { margin-top: 7%; padding: 0 10%; }
.buttons > div > a { width: 30.5%; }

/* 상품 */
.fc_point_01 { color: #fdb813; }
.fc_point_02 { color: #00904b; }
.fc_point_03 { color: #0084ff; }
.fc_point_04 { color: #d21776; }
.fc_point_05 { color: #008dab; }
.fc_gray { color: #d21776; }
.bc_point_01 { background-color: #fdb813; }
.bc_point_02 { background-color: #00904b; }
.bc_point_03 { background-color: #0084ff; }
.bc_point_04 { background-color: #d21776; }
.bc_point_05 { background-color: #008dab; }
.border_box { border-radius: 10px; background-color: #fff; }
.border_box > table { margin-top: 0px; }
.prod_area > a { display: inline-block; width: 100%; margin: 12% 0 7%; }
	#prod_03 > a, #prod_04 > a, #prod_05 > a { margin: 13% 0 0; }
.prod_area > div { text-align: center; width: 100%; padding: 7% 0; }
.prod_area > div > .flexwrap { padding: 0 3%; margin-bottom: 3%; }
.prod_area > div > .flexwrap > .border_box { width: 48.5%; text-align: center; }
.prod_area > div > .border_box { display: inline-block; width: 94%; padding: 0 3%; }
.prod_area > div > .border_box > table { text-align: center; margin: 5% 0; border: none; border: solid 1px #ddd; border-collapse: collapse; }
.prod_area > div > .border_box > table > tbody { width: 100%; }
.prod_area > div > .border_box > table > tbody > tr > th { background-color: #f4f4f4; color: #333; width: 25%; border: solid 1px #ddd; vertical-align: middle; text-align: center; padding: 2%; font-weight: bold; }
.prod_area > div > .border_box > table > tbody > tr > td { width: 100%; padding: 2%; border: solid 1px #ddd; }

/* 신청 폼 */
form { display: block; width: 100%; background-color: #263965; text-align: center; }
.contain { display: inline-block; width: 94%; background-color: #fff; padding: 5% 3%; border-radius: 10px; margin: 0 0 7%; }
form > img { margin: 12% 0 7%; }

form > .contain > .innerwrap { width: 100%; }
form > .contain > label, form > .contain > input { display: inline-block; width: 100%; }
form > .contain > label { text-align: left; font-size: 1.2em; font-weight: bold; color: #263965; margin: 2% 0 2%;}
	form > .contain > label:first-of-type { margin: 0% 0 1%; }
form > .contain > label > sup { color: #f65164; font-weight: 500; }
input { padding: 1%; }
form > .contain > input, form > .contain > .innerwrap > input, form > .contain > .innerwrap > select { display: inline; height: 35px; border: solid 1px #e6e6e6; background-color: #f6f6f6; color: #888888; border-radius: 4px; }
form > .contain > .innerwrap > select, form > .contain > .innerwrap > input { width: 32.5%; }
.agree { padding: 0 6% 0 0; font-size: 1em; margin: 3% 0 0%; }
	.agree > input { margin-right: 1%; }
	.agree > a { margin: 1%; color: #263965; }
.form_btn { color: #fff; font-weight: 700; padding: 3% 0; border-radius: 500px; width: 50%; transition: all 0.3s ease 0s; font-size: 1.5em; margin-bottom: 12%; }
	.form_btn:hover { background-color: #fc6a56; }

/* 푸터 */
footer { background: #474554; color: #bab9c0; padding: 8% 6% 8%; font-size: 0.9em; }
footer > strong > a { color: #bab9c0; }
footer > .footer_nav { margin-bottom: 2rem; display: flex; align-items: center; justify-content: flex-start; }
footer > .footer_nav > a { display: inline-block; color: #fff; font-size: 1.2em; margin-right: 1rem; padding-right: 1rem; border-right: solid 1px rgba(255,255,255,0.3); }
	footer > .footer_nav > a:last-of-type { border-right: none; margin-right: 0; padding-right: 0; }

@media only screen and (min-width: 300px) and (max-width: 750px) { 
	body { font-size: 12px; }
	.gap { display: block; margin-top: 7%; }
	footer { background: #474554; color: #bab9c0; padding: 8% 6% 21%; }
}