@charset "utf-8"; /* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,img {margin:0;padding:0}
*, *:before, *:after { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; }
fieldset,img {border:0 none}
dl,ul,ol,menu,li {list-style:none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}
body,th,td,input,select,textarea,button { font-size:12px; line-height:1.5; font-family:'Malgun Gothic','맑은 고딕',sans-serif; color: #333}
body{ background-color:#fff; padding:0; margin:0; width:100%; height:100%; }

img {margin:0; padding:0; display:inline-block; }
div {box-sizing:border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
/*인풋용*/
label { width:100%; }
input[type=text],input[type=tel],select,textarea {width: 100%; border:1px solid #ddd; border-radius:3px; box-sizing:border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; vertical-align:middle; background:#fff; }
input,select { padding-left:5px; height:30px; /*높이*/}
textarea { padding:0 5px; }
/*input[type=radio],input[type=checkbox] { width:14px; height:14px; padding: 0; margin:-7px 0 0 0; vertical-align:middle; }*/ /* 모바일용 */
input[type=radio],input[type=checkbox] { width:14px; height:14px; padding: 0; vertical-align:middle; } /* PC용 */

a { color:inherit; text-decoration:none; border:0 none; }
a:active,a:hover { text-decoration:none}

/* 플레이스홀더숨김 */
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; }

/** width **/
.auto {width:auto; }
.tw_5 {width:3%; margin: 0 1%; float:left; display: inline; }
.tw_10 {width:8%; margin: 0 1%; float:left; display: inline; }
.tw_15 {width:13%; margin: 0 1%; float:left; display: inline; }
.tw_20 {width:18%; margin: 0 1%; float:left; display: inline; }
.tw_25 {width:23%; margin: 0 1%; float:left; display: inline; }
.tw_30 {width:28%; margin: 0 1%; float:left; display: inline; }
.tw_35 {width:33%; margin: 0 1%; float:left; display: inline; }
.tw_40 {width:38%; margin: 0 1%;float:left; display: inline; }
.tw_45 {width:43%; margin: 0 1%;float:left; display: inline; }
.tw_50 {width:48%; margin: 0 1%;float:left; display: inline; }
.tw_55 {width:53%; margin: 0 1%;float:left; display: inline; }
.tw_60 {width:58%; margin: 0 1%;float:left; display: inline; }
.tw_65 {width:63%; margin: 0 1%;float:left; display: inline; }
.tw_70 {width:68%; margin: 0 1%;float:left; display: inline; }
.tw_75 {width:73%; margin: 0 1%;float:left; display: inline; }
.tw_80 {width:78%; margin: 0 1%;float:left; display: inline; }
.tw_85 {width:83%; margin: 0 1%;float:left; display: inline; }
.tw_90 {width:88%; margin: 0 1%;float:left; display: inline; }
.tw_95 {width:93%; margin: 0 1%;float:left; display: inline; }
.tw_100 {width:98%; margin: 0 1%;float:left; display: inline; }


/* border */
.bor_right{ border-right: solid 1px #ddd; }
.bor_left{ border-left: solid 1px #ddd; }
.bor_bottom{ border-bottom: solid 1px #ddd; }
.bor_top{ border-top: solid 1px #ddd; }

/* font-align */
.fwB { font-weight:bold; }
.tCenter { text-align:center; }
.tRight { text-align:right; }
.tLeft { text-align:left; }

/* basic */
.side_fix{ width:100px; position:fixed; top:0; left:0; bottom:0; background-color:#2d2d2d; z-index:50; padding-top:105px; }
	.side_fix a{ display:block; color:#ccc; text-align:center; padding:20px 0; border-bottom:1px solid #515151; font-size:11px; }
	.side_fix a:first-child{ border-top:1px solid #515151; }
	.side_fix a:hover{ color:#fff; }
	.side_fix a > i { color:#263965; margin-bottom:3px; }
	.side_fix a:hover > i {color:#51b3ff}
	.side_fix .go_top{ display:block; width:100%; color:#eee; font-size:10px; text-align:center; padding:5px 0 8px; background-color:#1d1d1d; border-bottom:1px solid #515151; }
	.side_nav{ font-size:10px; line-height:150%; }
		.side_nav a{ color:#263965; }
		
.flexwrap{display: flex;}		
.wrap {width: 1200px; margin:0 auto; }
.wrap:after { content:""; clear:both; display:block; }
.centerauto, .centerclear {margin:0 auto; }
.blockclear, .jayClear { content:''; display:block; clear:both; z-index: 1; }


/* 헤더 */
.top_number { width:100%; height:25px; font-size:16px; line-height:120%; float:left; color:#666; letter-spacing:-1px; background-color:#f8f8f8}
header{background-color:#fff; /*box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important*/}
.header { width:1200px; color:#333; margin:0 auto; height:90px; padding:15px 0;  }
	.top_logo { display:flex; float:left; width: 280px; height: 60px; align-items: center; } 
	/* 네비 */
	nav#top_nav {width:auto; float:right; height:60px; margin-left:40px; }
	nav#top_nav:after{ content:''; display:block; clear:both; z-index:1; }
		nav#top_nav > ul{ z-index:1; float:right; list-style-type: none; margin: 0; padding: 0; overflow: hidden; height:100%; }
			nav#top_nav > ul > li{ display:inline-block; float:left; font-weight:bold; height:100%; }
			nav#top_nav > ul > li.dropdown:hover > div.dropdown-content {display: block; }
				nav#top_nav > ul > li > a{display:block; float:left; text-align:center; color:#333; font-size:14px; padding:0 20px; /*width:150px; */height:100%; line-height:60px; border-left:1px solid #efefef; }
				nav#top_nav > ul > li > a.dropbtn{ }
				nav#top_nav > ul > li > a:hover{ background-color:#EC008B; color:#fff; transition: all 0.25s ease-in-out;}
				/*2단메뉴노출시*/
				nav#top_nav > ul > li > div.dropdown-content {display: none; max-width:170px; position:absolute; top:75px!important; background-color:#fff; z-index:2222; box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.25);}
				nav#top_nav > ul > li > div.dropdown-content a { display:block; width:150px; color:#333; padding:15px 10px; text-align: left; border-top:1px solid #eee; font-size:12px; font-weight:normal; }
				nav#top_nav > ul > li > div.dropdown-content a:hover {background-color:#EC008B; color:#fff;}
				nav#top_nav > ul > li > div.dropdown-content a:last-child{ border-bottom:none; }
				nav#top_nav > ul > li > div.dropdown-content a > i { width:20%; text-align:center; }
				nav#top_nav > ul > li > div.dropdown-content a.part{ border-bottom:1px dotted #bbb; }


/* 슬라이드박스 */
.slide_wide{ width:100%; height:440px; background-color:#f1f5f9; /*background-image:url(../images/slide_bg.png); background-size:100% 100%; */ border-top:1px solid #eee; border-bottom:1px solid #eee;}
	.slide_box_wrap{ width:1200px; height:440px; margin:0 auto 24px; z-index:2; }

		.slideArea {width:1200px; height:440px; /*margin:0 auto;*/ position:relative; float:right;}
		.slideArea .slideContents {position:relative; z-index:1;}
		.slideArea .slideContents div a img {width:100%;}

		.slideArea .bx-pager {position:absolute; bottom:20px; width:100%; height:13px; z-index:2; text-align:left; margin-left:50px;}
		.slideArea .bx-pager-item {display:inline-block; margin:0 3px;}
		.slideArea .bx-pager-item .bx-pager-link {background:#000; opacity:0.3; display:block; width:13px; height:13px; border-radius:50px; text-indent:-9999px;}
		.slideArea .bx-pager-item .bx-pager-link.active {background:#EC008B; width:30px; opacity:1;}
/*슬라이드/컨텐츠타이틀--------------------------*/
.image_title_box{text-align: right; padding:50px 0px 0; margin-bottom: 30px; letter-spacing: -1px;   /* background-repeat: no-repeat; */ background-color: #fafafa; height: 440px}
	div[class*='title_bg_']{  background-size:cover; background-repeat: no-repeat;}	
	.title_bg_1{ background-image: url("../images/sub_bg_01.jpg");}
	.title_bg_2{ background-image: url("../images/sub_bg_02.jpg");}
	.title_bg_3{ background-image: url("../images/sub_bg_03.jpg");}
	.title_bg_w{ background-image: url("../images/sub_bg_w.jpg");}
	.title_bg_h{ background-image: url("../images/sub_bg_h.jpg");}
	.title_bg_f{ background-image: url("../images/sub_bg_f.jpg");}
	.title_bg_r{ background-image: url("../images/sub_bg_r.jpg");}
		.image_title_txt > .prod_title {line-height: 1.2;}
		.image_title_txt > .prod_title:after{content: ''; display: block; clear: both;}
		.image_title_txt > .prod_title > p { font-size: 1.7em; font-style: italic; padding-right: 5px;}
		.image_title_txt > .prod_title > h1{ font-size: 4.6em; letter-spacing: -3px; padding-right: 10px;}

	.image_title_txt > .title_tbl {font-size: 1.25em; margin-top: 40px; letter-spacing: 0px; font-weight: bold;}
	.image_title_txt > .title_tbl > div { display:flex; justify-content: flex-end; flex-wrap: wrap; }
	.image_title_txt > .title_tbl > div > p {padding: 3px; margin:4px 0px; }
	.image_title_txt > .title_tbl > div > p:first-child{text-align: right; padding-right: 15px;}
	.image_title_txt > .title_tbl > div > p:last-child{background-color: #EC008B; color: #fff; text-align: center; width: 90px;}
	.title_tbl_btn { background: #263965; color: #fff; font-size: 1.2em; font-weight: bold; padding: 10px 30px; float: right; margin-top: 20px;}/*메인 슬라이드에만 적용*/
	.content_in > .image_title_box{padding:60px 70px; height: 400px;}/*상품 페이지에만 적용*/



/* pc메인 상품배너+폼 */
.m_left_banner{ /*background-color:#0C9; */ width:auto; float:left; }
.m_left_banner { width:74%; }
	.m_left_banner > .innerwrap { display: flex; width: 100%; height: 50%; justify-content: space-between; }
	.m_left_banner > .innerwrap:first-of-type { margin-bottom: 1%; }
	.m_left_banner > .innerwrap > a { display: flex; justify-content: space-between;  width:49.5%; height:180px; background-color:#fff; border:1px solid #e5e5e5; float:left; cursor:pointer}
	.form_page_btn { color: #fff; text-align: center; padding: 15px; align-items: center; justify-content: center; }
	.form_page_btn > div { width: 100%; }
	.form_page_btn > div > h2 { margin-bottom: 10px; }
	.m_left_banner > .innerwrap > a > header { width:100%; height:170px; background-position:top center; background-repeat:no-repeat;}
	.m_left_banner > .innerwrap > a > header.pro_01{ background-image:url(../images/m_pro_top01.jpg); }
	.m_left_banner > .innerwrap > a > header.pro_02{ background-image:url(../images/m_pro_top02.jpg); }
	.m_left_banner > .innerwrap > a > header.pro_03{ background-image:url(../images/m_pro_top03.jpg); }
	.m_left_banner > .innerwrap > a > section:first-of-type { width: 40%; }
		.m_left_banner > .innerwrap > a > section:first-of-type:hover { opacity:0.7; }
	.m_left_banner > .innerwrap > a > section:last-of-type { width: 60%; padding:15px ; color:#666; }
	.m_left_banner > .innerwrap > a > section > h2, .m_left_banner > .innerwrap > a > section > strong { color:#263965; }
	.m_left_banner > .innerwrap > a > section > h4 { margin:5px 0; }
	.m_left_banner > .innerwrap > a.pro_bnr{ background-color:#f1f5f9; cursor:inherit; color:#333; text-align:center; padding-top:10px; }
	.m_left_banner > .innerwrap > a.pro_bnr > h1 { font-size:42px; line-height:42px; margin-bottom:15px; }


	/*메인상품버튼5종*/
	.mainP_btn_pack { justify-content: space-between; }
	.mainP_btn_pack > a { height: 180px; width: 19.5%; padding:25px 20px; text-align: center; background-color:#d4dde4; word-break: keep-all; transition:all ease 0.15s; }
	.mainP_btn_pack > a > i {margin-bottom: 10px;}
	.mainP_btn_pack > a > h2 {font-size: 1.25em}
	.mainP_btn_pack > a > p {margin-top: 10px;}
	.mainP_btn_pack > a > span {display: none; }
	.mainP_btn_pack > a.po01{background-color:#ec008b; color: #fff; }
	.mainP_btn_pack > a.po02{background-color:#263965; color: #fff; }
	.mainP_btn_pack > a.po03{background-color:#2a437b; color: #fff; }
		.mainP_btn_pack > a:hover{ background-color:#ec008b; color: #fff;}
		.mainP_btn_pack > a:hover > i, 
		.mainP_btn_pack > a:hover > h2, 
		.mainP_btn_pack > a:hover > p{ display: none; }
		.mainP_btn_pack > a:hover > span{ display: block; border: 1px solid #fff; padding: 10px; margin-top: 35%; }

/* 폼박스 */
.cs_box_wrap { width:25%; height:369px; background-color:#263965; left:0px; float:right; z-index:2;}  
	/* 폼박스100% */
	.form_box { width: 90%; margin:0 auto; padding:10px 0; overflow: hidden; }
	.form_box .form_inner_box { float: left; width: 100%; margin-top: 12px; display: block; }
	.form_inner_box a { font-weight: bold; }
	.form_inner_box a:hover { color: #F63; }
	.form_top{ text-align:center; font-weight:bold; color: #FFF; font-size: 20px; padding-bottom:15px; margin-bottom:7px; border-bottom:1px dotted rgba(0,0,0,0.5); }
	.form_top_txt{ width:100%; display:block; /*background:rgba(0,0,0,0.5); */color:#fff; font-size: 12px; letter-spacing:-1px; padding:5px; border-radius:30px; }
	.form_agree { color:#FFF; font-size:11px; font-family:dotum; letter-spacing:-1px; height:12px; line-height:12px; text-align:center; margin:20px 0 10px 3px; }
	.m_form_btn{ background-color:rgba(0,0,0,0.5); color:#fff; border-radius:3px; padding:3px 6px 3px; }
	.form_btn{ background-color:#2a437b; color:#fff; border-radius:3px; padding:2px 6px 3px; }	
	.form_btn:hover{ background-color:#ec008b; }
	.form_info{ text-align:center; font-size:10px; color:#777; padding:5px 0; margin-bottom:5px; background-color:#fff; }
	.f_label{ width:23%; display: inline; margin: 0 1%; float:left; font-weight: bold; color: #fff; font-size: 12px; line-height: 27px; height: 30px; vertical-align:middle; text-align:left; }


/* pc메인 배너 */
.m_banner_01 {width:1200px; margin:0 auto; display:flex; justify-content: space-between; align-items: center; margin-bottom:24px; padding:20px 150px 20px 30px; background-color:#f1f5f9; background-image:url(../images/m_banner_01.png); background-position:right bottom; background-repeat:no-repeat; border:1px solid #ddd;}
.m_banner_01:after { content:""; clear:both; display:block; }
	.m_banner_01 > article{ display: block; float: left;}
	.m_banner_01 > article > a { width:110px; height:110px; line-height:150%; padding-top:20px; background-color:#2a437b; color:#fff; border:1px solid #fff; display:block; float:left; margin-right:10px; border-radius:0 20px; text-align:center; cursor:pointer; transition:all ease 0.2s; }
	.m_banner_01 > article > a:hover{ background-color:#263965; border-radius:20px 0; }
	.m_banner_01 > article > a > i {margin-bottom: 10px;}
	.m_banner_01 > article > h1 { font-size:26px; color:#333;  padding-right:25px; margin-top:10px;}
	.m_banner_01 > article > h2 { font-size:20px; color:#333;  padding-right:25px; }


/* 서브네비*/
.sub_nav { background-color:#2a437b; border-top:2px solid #2a437b; }
.navigation { width:1200px; margin:0 auto; }
.navigation a{ float:left; display:inline-block; font-size:13px; font-weight:bold; }
	.navigation a.naviA { color:#fff; background-color:#2a437b; padding:9px 15px 11px; font-weight:bold; }
	.navigation a.naviON{ color:#ec008b; background-color:#fff; padding:9px 15px 11px; display:inline-block; border-radius: 7px 7px 0 0; }
	.navigation a.naviA:hover{color:#fff; background-color:#EC008B;padding:9px 15px 11px; display:inline-block; transition: all 0.1s ease; border-radius: 7px 7px 0 0;}	
/* pc컨텐트 */
.content {width:1200px;margin:0 auto; position:relative; border-left:#eee solid 1px; border-right:#eee solid 1px; border-bottom:#eee solid 1px; background-color:#fff; padding-bottom:1px; margin-bottom:24px; }
	.content_in { width:1078px !important; margin:0px auto; }




/* 테이블 */
table { width:100%; }
table, th, td { border-collapse: collapse; color:#333; font-size:12px; line-height:180%; }
th, td { padding:10px; border:1px solid #eee;}	
	.f_100 > h3 { color:#263965; }
	table.pro_tbl{ width:100%; border-bottom:3px solid #263965; margin:10px 0 50px;}
	table.pro_tbl > tbody > tr > td:first-child{ background-color:#fafafa; font-family:'malgun gothic'; font-size:12px; font-weight:bold; width:16%; text-align:center;}		

/* 컨텐츠 */
.sr_tit {font-size:20px;line-height:24px;color:#333;float:left;height:24px;margin-top:27px;margin-bottom:29px;display:block; }
	.sr_tit span {font-size:14px;color:#999; }
.right_tit { font-size:18px; line-height:40px; font-weight:bold; height:40px; color:#263965; padding-left:10px; } 

/* 결과 페이지 */
.result_page { text-align: center; padding: 100px 0; }
.result_page > strong { display: inline-block; font-size: 2em; margin-top: 20px; }
.result_page > p { font-size: 1.3em; margin-bottom: 40px; }
.result_page > .flexwrap > a{ background-color: #333; color: #fff; padding: 15px 25px; border-radius: 200px; display: inline-block; font-size: 1.3em; font-weight: bold; }
hr { background-color: #efefef; border: none; height: 1px; padding: 0; margin: 0; }

/* footer */
.footer { color:#333; width:1200px; margin:0 auto; text-align:left; padding-bottom: 40px; }
	/* pc푸터 배너 */
	.footer_bnr{ width:100%; background-color:#f4f4f4; border:1px solid #ddd; padding:10px 0 10px 83px; }
		.footer_bnr li { float:left; margin-right:39px; }
		.footer_bnr li:last-child{float:right; margin-right:0; }
	/* pc푸터 메뉴 */
	.footer_nav { width:1200px; margin:20px auto 0; padding:10px 0 0 10px; border-top:2px solid #2d2d2d; }
		.footer_nav a { font-weight:bold}
			.footer_nav a:hover { color:#06c; }
			.footer_nav a:after { color:#ddd; content:"|"; padding:0 7px 0 12px; }
			.footer_nav a:last-child:after { content:""; display:block; clear: both; }
	/* pc푸터 정보 */		
	.foot_info_01 { font-size:18px; display:flex; justify-content: space-between; flex-wrap: wrap; line-height:normal; padding-left:10px; text-align: left; margin-top:10px; letter-spacing:-1px; }
	.foot_info_01 > div{ width: 100%; margin-bottom: 10px; text-align: justify;}
	.foot_info_02 { font-size:14px; olor:#666; line-height:140%; text-align: left; padding-left:10px; margin-top:8px; }
		.fbold { font-weight:bold; color: #333; }

/*컨텍트버튼1*/
.con_btn { color:#263965; font-size: 20px; font-weight: bold; background-color:#fff; text-align: center; display: block; width: 100%; padding-top:3px; padding-bottom:4px; margin:5px 0 10px 0; border-radius:30px;  }
.con_btn:hover{ background-color: #ec008b; color:#fff; }
/*컨텍트버튼2*/
.con_btn2 { color:#fff; font-size: 20px; font-weight: bold; background-color:#263965; text-align: center; width: 30%; margin:0 auto; padding:15px 30px; margin-bottom:50px; border-radius:6px;}
.con_btn2:hover{ background-color: #EC008B; }