@charset "UTF-8";
@import url(../font/font.css);

html, body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, span, form, fieldset, input, select, label, textarea, table, caption, thead, tfoot, tbody, tr, th, td
{margin:0;padding:0;font:16px/1.5 'NotoKr-Regular','맑은고딕','Malgun Gothic','나눔고딕','nanumgothic',굴림,Gulim,돋움,Dotum,Sans-serif;color:#333;letter-spacing:-0.5px;word-break:keep-all}
b, span, strong, input, a, button{font-size:inherit;font-family:inherit;color:inherit}
article, aside, dialog, footer, header, section, footer, nav, figure, hgroup, details, summary, figure, figcaption {display: block;}
cite{display:inline}
html, body {height:100%;} 
body {margin:0px;}
a:link {text-decoration:none;} 
a:visited {text-decoration:none;}
img{border:0;max-width:100%}
label, input, textarea, select{vertical-align:middle}
ol, ul{list-style:none;} 
table{border-collapse:collapse;table-layout:fixed;}
table th,
table td{word-break:break-all}
fieldset{border:none}
.skip, hr, legend{position:absolute;left:-1000%;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden;}
button{margin:0;padding:0;border:none;background:none;outline:none;cursor:pointer;display:inline-block;}
/*

html{overflow-x: hidden}
a, button, input, option, select, textarea,
[type=checkbox] + label, [type=radio] + label {
	box-sizing: border-box;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}
*/
body {
    overflow-x: hidden; 
}
select, textarea {
	overflow: auto;
}
select::-ms-expand {
	display: none;
}
button, select {
	text-transform: none;
}
button, input, select, textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}
/* content start */
.container {
    position: relative;
    min-width: 1200px;
    min-height: 100%;
    width: 100%;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.container > .content {
    background-color: #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.container .content .section_sub {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	position: relative;
    top: 52px;
}
.container .content .section_sub2 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	position: relative;
    /* top: 342px; */
}
.container .content .section .section-inner {
    width: 1040px;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

/* content end */
/* ****************** 공통클래스 ********************** */
.area{ max-width:1200px; margin:0px auto;}

/* ****************** HEADER ********************** */
#header{position:absolute; width:100%; height:118px; -webkit-transition:top 0.4s;-moz-transition:top 0.4s;-o-transition:top 0.4s;-ms-transition:top 0.4s;transition:top 0.4s;z-index:9999;}
#headerInnerWrap_main{background:rgba(0,0,0,0.4);position:relative; height:83px; width:100%; z-index:99; border-top:1px solid transparent; border-bottom:1px solid transparent; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}
#headerInnerWrap{position:relative; height:83px; width:100%; z-index:99; border-top:1px solid transparent; border-bottom:1px solid transparent; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}

#headerInner{position:relative; height:100%;}
#header .logo{position:relative; z-index:100; float:left; padding:26px 0 0 }		/* padding값 적절히 바꿔주세요 */
#header .logo a{display:block; width:280px; height:64px; background:url(../img/logo.png) no-repeat;}
#header .logo img{display:block;/* vertical-align: top;*/}

/* -------- Header :: UTIL BOX -------- */
.header-util-box{position:absolute; top:23px; right:0; z-index:100;background:#52b6b3;border-radius: 20px;}
div#quick {position:absolute;z-index:2;top:0;right:0;}
div.quick {transform: translateX(0); transition:.3s}
div.quick.off {transform: translateX(171px); transition:.3s}

/*
#quick .clearfix li:first-child:after {
    content: "";
    background: #fff;
    width: 52px;
    height: 1px;
    display: block;
    position: absolute;
    top: 100px;
    left: 20px;
}
*/

#quick .clearfix li a {
    color: #fff;
    font-size: 14px;
    position: relative;
    background: #52b6b3 url(../img/top_2.png)no-repeat center 21px;
    padding: 46px 10px 15px;
    display: inline-block;
    width: 150px;
    text-align: center;
}

#quick .clearfix li:last-child a {
    padding: 8px 10px 0;
    line-height: 1.8;
	    height: 71px;
}

#quick .clearfix li.add a{background: #fff url(../img/top_3.png)no-repeat center 16px;background-size: 25px;color:#000;
border-left:1px solid #dbdbdb;border-bottom: 1px solid #dbdbdb;
}

#quick .clearfix li.add a p{color:#52b6b3;margin-bottom:5px;font-weight: bold}
#quick .clearfix li:last-child a {
    background: #52b6b3;
    position: relative;
    top: -1px;
}
#quick .clearfix li a:after{content: "" ;width:100%;height:50%;background:rgba(0,0,0,0.1);display: block;opacity: 0;position: absolute;top:0;left:0}
#quick .clearfix li a:hover:after{opacity: 1;display: block;height:100%}
.toggle_btn {
    width: 30px;
    height: 30px;
    background: #52b6b3 url(../img/btn_close_w.png)no-repeat center;
    background-size: 12px;
    font-size: 0;
    position: relative;
    top: 30px;
    left: -30px;
}
.toggle_btn.off{
	background: #52b6b3 url(../img/back_w.png)no-repeat center;
     background-size: 10px;
}
/* -------- Header :: GNB(PC) -------- */
.gnb-overlay-bg{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:97;}	/* gnb overlay BG */
#gnbBg{display:block; position:absolute; left:0; top:117px; width:100%; height:267px; background-color:#fff; background-color:rgba(255,255,255,0.85); z-index:98;}
#gnbBg.show{height:267px;}
#gnb{position:absolute; text-align:center; top:-33px; left:0px; width:100%; height:100%; z-index:99; }
#gnb > ul{display:inline-block; min-width:1210px; text-align:right; margin-top:81px; *display:inline;*zoom:1;}
#gnb > ul > li{/*float:left;*/display:inline-block; vertical-align:top; margin-left:89px;}
/*#gnb > ul > li > a{position:relative; z-index:100; display:block; text-align:center; color:#fff; font-size:17.5px; line-height:30px; letter-spacing:2px; font-weight:500; -webkit-transition:font-size 0.4s;-moz-transition:font-size 0.4s;-o-transition:font-size 0.4s;-ms-transition:font-size 0.4s;transition:font-size 0.4s }따로일때*/
#gnb > ul > li > a{position:relative; z-index:100; text-align:center; color:#fff; font-size:17.5px; line-height:30px; letter-spacing:2px; font-weight:500; -webkit-transition:font-size 0.4s;-moz-transition:font-size 0.4s;-o-transition:font-size 0.4s;-ms-transition:font-size 0.4s;transition:font-size 0.4s;margin: 0 42px }
#gnb > ul > li > a:hover, #gnb > ul > li.on > a{color:#52b6b3;}

/* -------- Header :: GNB(PC) :: 2DEPTH -------- */
/* GNB :: 2차메뉴 공통 */
.gnb-2dep-container{visibility:hidden; opacity:0;filter:Alpha(opacity=0); position:absolute; top:0px; left:0px; width:100%; height:267px; padding-top:118px;  z-index:98; text-align:left; -webkit-transition:all 0s 0s; -moz-transition:all 0s 0s; -o-transition:all 0s 0s; -ms-transition:all 0s 0s;transition:all 0s 0s} 
.gnb-2dep-container.show{
	visibility:visible; 
	opacity:1.0;filter:Alpha(opacity=100); 
	-webkit-transition:all 0.3s 0.2s;
	-moz-transition:all 0.3s 0.2s;
	-o-transition:all 0.3s 0.2s;
	-ms-transition:all 0.3s 0.2s;
	transition:all 0.3s 0.2s
}
.gnb-2dep-container .gnb-2dep-inner{position:relative; height:100%; visibility:hidden;}
.gnb-2dep-container.show .gnb-2dep-inner{visibility:visible;}
/* GNB :: 2차메뉴 공통 :: 텍스트 */
.gnb-2dep-container .gnb-2dep-txt-con{height:100%;}
/* GNB :: 2차메뉴 공통 :: 메뉴 */
.gnb-2dep-container .gnb-2dep-menu-con {height:100%; }

/* -------- GNB 01 :: 2DEPTH -------- */
.gnb1 .gnb-2dep-container .gnb-2dep-inner{margin:0px auto;}
/* GNB 01 :: 2DEPTH :: 텍스트 */
.gnb-2dep-container .gnb-2dep-txt-con{float:left; width:485px;}
.gnb-2dep-txt-con h2{font-family: 'Poppins', sans-serif; font-size:30px; color:#535252; font-weight:600; letter-spacing:1px; padding-top:20px;}
/*.gnb-2dep-txt-con h2:after{display:block; content:""; width:39px; height:1px; background-color:#52b6b3; margin:27px 0 13px 0;}*/
.gnb-2dep-txt-con p{font-size:15.5px; line-height:23px; color:#535252; letter-spacing:-0.5px; font-weight:300; margin-bottom:40px;}
.gnb-2dep-txt-con a{/*display:block;*/display:inline-block; vertical-align:middle; position:relative; min-width:220px; max-width:220px; font-size:15.5px; color:#535252; font-weight:300; letter-spacing:-0.5px; border-bottom:1px solid #535353;}
.gnb-2dep-txt-con a span{float:left; padding-bottom:12px;}
.gnb-2dep-txt-con a span:after{display:block; content:""; position:absolute; bottom:0; left:0; width:98px; height:3px; background-color:#535353; -webkit-transition:width 0.4s; -moz-transition:width 0.4s; -o-transition:width 0.4s; -ms-transition:width 0.4s; transition:width 0.4s}
.gnb-2dep-txt-con a em{float:right; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; -o-transition:all 0.4s; -ms-transition:all 0.4s; transition:all 0.4s;}

.gnb-brand-btn-group{display:inline-block; vertical-align:middle; margin-left:35px;}
.gnb-brand-btn-group > button{display:inline-block; vertical-align:top; /*width:50px; height:50px;*/width:40px; height:40px;}
.gnb-brand-btn-group > button:first-child{background-color:#52b6b3;}
.gnb-brand-btn-group > button img{max-width:100%;}
/* GNB 01 :: 2DEPTH :: 메뉴 */
.gnb-2dep-container .gnb-2dep-menu-con{float:left; width:1080px; height:100%; position:absolute;left: 308px; top:-1px; background:#fff; background:rgba(255,255,255,0.7);overflow: hidden}
.gnb-2dep-menu-list{
	position:relative; 
	width:178px; 
	height:217px; 
	margin:25px 0;
	float:left
}
.gnb-2dep-menu-list:nth-child(2){width:202px}
/*.gnb-2dep-menu-list:first-child{margin-left:110px}*/
.gnb-2dep-menu-list:first-child li{padding-left: 15px}
.gnb-2dep-menu-list:before{position:absolute; top:0; left:27px; display:block; content:""; width:1px; height:217px; background-color:#e5e5e5;}
.gnb-2dep-menu-list:first-child:before{display: none}
.gnb-2dep-menu-tit{position:relative; float:left; width:286px; padding:0 37px 0 42px;}
.gnb-2dep-menu-tit > a{display:block; font-size:16.5px; line-height:40px; color:#333; letter-spacing:-0.5px; font-weight:300;color:#333 }
.gnb-2dep-menu-list li:hover .gnb-2dep-menu-tit > a{color:#f26521}

.double > a{display:block; font-size:16.5px; line-height:40px; color:#333; letter-spacing:-0.5px; font-weight:300; background:url(../img/gnb_2dep_arrow_off.png) no-repeat right center; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; -o-transition:all 0.4s; -ms-transition:all 0.4s; transition:all 0.4s;}


.gnb-2dep-menu-list li:hover .double > a{color:#52b6b3; background:url(../img/gnb_2dep_arrow_on.png) no-repeat right center;}




.gnb-3dep-menu-con{width:285px; height:217px; position:absolute; right:0; top:0; padding:0 37px; display:none;}
.gnb-3dep-menu-con.show{display:block;}
.gnb-3dep-menu-tit{font-size:20px; line-height:40px; color:#010101; font-weight:300; letter-spacing:-0.5px;}
.gnb-3dep-menu-list li a{display:inline-block; position:relative; padding-left:9px; font-size:16.5px; line-height:36px; color:#767676; font-weight:300; letter-spacing:-0.1px; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; -o-transition:all 0.4s; -ms-transition:all 0.4s; transition:all 0.4s;}
.gnb-3dep-menu-list li a:before{display:inline-block; content:""; width:5px; height:1px; position:absolute; top:20px; left:0; background-color:#767676; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; -o-transition:all 0.4s; -ms-transition:all 0.4s; transition:all 0.4s;}
.gnb-3dep-menu-list li a:hover{color:#52b6b3; padding-left:12px;}
.gnb-3dep-menu-list li a:hover:before{width:8px; background-color:#52b6b3;}
.gnb-2dep-menu-ready{position:absolute; top:9px; bottom:25px; right:0; width:318px; padding-left:41px;}
.gnb-2dep-menu-ready > p{font-size:15.5px; line-height:24px; color:#535252; font-weight:300; letter-spacing:-0.5px; max-width:238px; padding-top:10px;}
.gnb-2dep-menu-ready.hide{display:none;}
.gnb-2dep-menu-ready img{display:none;}
.gnb-2dep-menu-ready img.list01{display:block;}
.gnb-2dep-menu-ready img.list01.show{display:block;}
.gnb-2dep-menu-ready img.list02.show{display:block;}
.gnb-2dep-menu-ready img.list03.show{display:block;}

/* GNB 01 :: 2DEPTH :: 메뉴 :: BRAND */
.gnb-2dep-container .brand-2dep-menu-con{float:right; width:auto; position:static; background:none;}
.brand-2dep-menu-con li{float:left; position:relative; width:201px; height:201px; margin-top:34px; margin-left:39px; overflow:hidden;}
.brand-2dep-menu-con li:first-child{margin-left:0;}
.brand-2dep-menu-con li a{position:relative; display:block; width:100%; height:100%; overflow:hidden;}
.brand-2dep-menu-con li a p{width:100%; height:201px; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; -o-transition:all 0.4s; -ms-transition:all 0.4s; transition:all 0.4s;}
.brand-2dep-menu-con li a p.leave{background-color:#fff;}
.brand-2dep-menu-con li a p.enter{background-color:#52b6b3;}
.brand-2dep-menu-con li:hover a p.leave{margin-top:-201px;}


/* -------- Header :: 스타일변경 -------- */
/* Header :: 헤더가 비주얼 배경위에 있는 스타일 */
#header.fixed-header {position:fixed; top:0; left:0; width:100%; z-index:99;}
*#header.fixed-header #headerInnerWrap{}
#header.fixed-header .header-search-open-btn{color:#fff; border-color:rgba(255,255,255,0.2);}
#header.fixed-header .header-lang {border-color:rgba(255,255,255,0.2); }
#header.fixed-header .header-lang .lang-open-btn{color:#fff;}
#header.fixed-header .header-lang > ul {border-color:rgba(255,255,255,0.6);}
#header.fixed-header .sitemap-line-btn .line{background-color:#fff}
#header.fixed-header .sitemap-custom-btn{color:#fff; border-color:rgba(255,255,255,0.2); }



@media all and ( min-width: 1200px ){	
	/* -------- Header :: 스타일변경 -------- */	
	/* Header :: 마우스 OVER 스타일 (마우스 오버시 헤더의 배경색이 변경되는 경우에만 삽입) */
	#header.over #headerInnerWrap{border-top-color:#626362; border-bottom-color:#ccc; background-color:#fff; background-color:rgba(255,255,255,0.85);}
	#header.over #headerInnerWrap_main{border-top-color:#626362; border-bottom-color:#ccc; background-color:#fff; background-color:rgba(255,255,255,0.85);}
	/* GNB가 펼쳐질 때 */
	#header.over .logo a{background:url(../img/logo_on.png) no-repeat;}
	#header.over #gnb > ul > li > a{color:#333;}
	#header.over #gnb > ul > li:hover > a, #header.over #gnb > ul > li.on > a{color:#004727}
	/* Header :: FIXED 스타일 (PC스타일) */
	#header.fixed #headerInnerWrap{top:0; background-color:#52b6b3;}
	/* Header :: 언어선택 */
    #header.over .header-lang-list li a{color:#fff;}

    #header.over .header-lang-list li.return-top a{color:#000;}
    #header.over .header-lang-list li.add a{color:#000;}

	#header.over .header-lang-list li.selected a{color:#5c5c5c}
    #header.over .header-lang-list li.selected a:after{background-color:#5c5c5c;}
    #header.over .header-lang-list li.selected a:after{background-color:#5c5c5c;}
}

@media all and ( max-width: 1200px ){
	#header, #headerInnerWrap, #headerInner{height:80px;}
	#header .logo{padding:8px 0;}	/* padding값 적절히 바꿔주세요 */
	#header.fixed #headerInnerWrap{box-shadow: 1px 1px 3px rgba(0, 0, 0, .1)}
	#header.fixed-header.fixed #headerInnerWrap{top:0; background-color:#52b6b3;}
	
	
	/* -------- Header :: GNB( -------- */
/*
	#gnb{display:none;}
	.gnb-overlay-bg{display:none}
*/

	
	/* -------- Header :: 네비게이션 오픈 버튼 -------- */
	.nav-open-btn{
		display:block; /*position:fixed;*/position:absolute; top:24px;  right:15px; z-index:9998; 
		height:30px;
		transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  
		-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
	}
	.nav-open-btn .line{
		display:block; width:28px; height:3px; background-color:#fff; border-radius:5px; margin: 5px auto;
		-webkit-transition: all 0.3s ease-in-out;
	  -o-transition: all 0.3s ease-in-out;
	  transition: all 0.3s ease-in-out;
	}
	.nav-open-btn.active .line{background-color:#fff;}
	.nav-open-btn.active .line:nth-child(2), .nav-open-btn.active .line:nth-child(4){opacity: 0;}
	.nav-open-btn.active .line:nth-child(1){
		 -webkit-transform: translateY(8px) rotate(45deg);
		  -ms-transform: translateY(8px) rotate(45deg);
		  -o-transform: translateY(8px) rotate(45deg);
		  transform: translateY(8px) rotate(45deg);
	}
	.nav-open-btn.active .line:nth-child(3){
		 -webkit-transform: translateY(-8px) rotate(-45deg);
		  -ms-transform: translateY(-8px) rotate(-45deg);
		  -o-transform: translateY(-8px) rotate(-45deg);
		  transform: translateY(-8px) rotate(-45deg);
	}
	
	#header.fixed-header .nav-open-btn .line{background-color:#fff}
}
/*top*/

/*
.return-top{
    position: fixed;top:80%;right:2%;
text-align: center;
    cursor: pointer

}
*/
.return-top a {
    background: url(../img/top.png)no-repeat 5px 0;
    background: #ddd;
    padding:7px;
    display: inline-block;
    padding-top: 19px;
    color: #fff;
	position: absolute;right: 0;
	height:62px;
	line-height: 2.5;
	transition:.5s
		
    
}
.return-top a:after {
    content: "";
    background: #fff;
    width: 52px;
    height: 1px;
    display: block;
    position: relative;
    top: 1pdpx;
    left: 10px;
}
/*.return-top a:after{content: "＾";position:absolute;top:3px;right:0;left:0}*/



/* footer start */
div#footerCommon {
    margin-top: 150px;
}
.foot_customer{border:1px solid #e6e6e6; padding: 15px 0;}
.foot_inner{width:1037px;margin: 0 auto;position: relative}
.foot_inner address{font-style: normal}
.foot_customer ul{overflow: hidden}
.foot_customer ul li{float:left;color:#999;font-family: 'NotoKr-Regular'}
.foot_customer ul li:first-child{float:left;color: #52b6b3;font-size: 16px;position: relative;top:-3px;letter-spacing: -1px;}
.foot_customer ul li:last-child{color:#555}
.foot_customer ul li:after{content: "·";color: #999;padding:0 5px}
.foot_customer ul li:last-child:after{display: none}
.foot_inner address{color:#666;padding-top:20px}
.foot_inner p{color:#666;padding-bottom:20px}

.foot_inner select { 
	position:absolute;right:0;top:4px;padding:5px 20px 5px 12px;
	background:url(../img/family_site01.png)no-repeat;
	color:#fff;border:1px solid #52b6b3;background-size: cover;outline: none
} 
.foot_inner select option{color:#333;outline-color:#ddd}

/*move*/
@-webkit-keyframes slideInUp {
  from {opacity:0.5; 
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {opacity:1; 
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
   from {opacity:0; 
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {opacity:1; 
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
@keyframes fadeAni{
   0%{ 
		opacity:0; 
		-webkit-transform: translateY(35px);
       	-moz-transform: translateY(35px);
        -ms-transform: translateY(35px);
        -o-transform: translateY(35px);
        transform: translateY(35px);
	 }
    100%{ 
		opacity:1; 
	    -webkit-transform: translateY(-35px);
        -moz-transform: translateY(-35px);
        -ms-transform: translateY(-35px);
        -o-transform: translateY(-35px);
        transform: translateY(-35px);
	}
}
@-webkit-keyframes fadeAni{
	0%{ 
		opacity:0; 
		-webkit-transform: translateY(35px);
       	-moz-transform: translateY(35px);
        -ms-transform: translateY(35px);
        -o-transform: translateY(35px);
        transform: translateY(35px);
	 }
    100%{ 
		opacity:1; 
	    -webkit-transform: translateY(-35px);
        -moz-transform: translateY(-35px);
        -ms-transform: translateY(-35px);
        -o-transform: translateY(-35px);
        transform: translateY(-35px);
	}
}   

@-webkit-keyframes fadeIn {
  0%{ 
		opacity:0; 
		-webkit-transform: translateX(-30px);
       	-moz-transform: translateX(-30px);
        -ms-transform: translateX(-30px);
        -o-transform: translateX(-30px);
        transform: translateX(-30px);
	 }
    100%{ 
		opacity:1; 
	    -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        -o-transform: translateX(0px);
        transform: translateX(0px);
	}
}

@keyframes fadeIn {
 0%{ 
		opacity:0; 
		-webkit-transform: translateX(-30px);
       	-moz-transform: translateX(-30px);
        -ms-transform: translateX(-30px);
        -o-transform: translateX(-30px);
        transform: translateX(-30px);
	 }
    100%{ 
		opacity:1; 
	    -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        -o-transform: translateX(0px);
        transform: translateX(0px);
	}
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

/*layer*/
.pop_wrap{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.6);z-index: 999999;}
.pop_ct{
	position: absolute;
	top: 50%;left: 50%; 
	background: #fff;
	overflow: hidden;
	transform: translate(-50%, -50%);
	width: 587px;
	height: 294px
}
.pop_ct h3 {
    height: 60px;
    line-height: 60px;
    padding-left: 15px;
    background: #555;
    text-align: left;
    font-weight: 600;
    color: #fff;
    font-size: 20px;
    letter-spacing: 0.5px;
}
.pop_ct div{padding:60px;padding-top:47px}
.pop_ct div p{color: #000;font-size: 18px;font-family: 'NotoKr-Regular';line-height: 1.6}
.pop_ct div p span{font-family: 'NotoKr-Bold'; color: #5218b4;}
.pop_ct div input {
    width: 455px;
    height: 15px;
    margin-top: -5px;
    position: relative;
}
.pop_ct div p.send{position: relative;}
.pop_ct div p.send input{padding:10px 20px}
.pop_ct div a.btn_send {position: absolute;top: 25px;
    right: 0;display: inline-block;color: #fff;background: #451c8b url(../img/alert_ic.png) no-repeat 32px center;padding: 17px 31px 19px 64px;}
.pop_close{position:absolute;top:0;right:0;width:40px;height:35px;line-height:35px;font-size:0;text-align:center;}
.pop_ct .pop_close:before{content:'×';font-size:55px;font-weight:lighter;color:#fff;font-family: 'NotoKr-Thin';position: relative;top: 11px;right: 20px;}

.qna_pop >span{display: block; padding:10px;font-size:15px;color:#555}
.qna_pop input{padding:10px}
.qna_pop input::-webkit-input-placeholder { color:#CCC;font-size:16px;padding:10px }
.qna_pop input:-moz-placeholder { color:#CCC;font-size:16px;padding:10px}
.qna_pop input::-moz-placeholder { color:#CCC;font-size:16px;padding:10px }
.qna_pop input:-ms-input-placeholder { color:#CCC;font-size:18px;padding:10px }
.qna_pop > p.btn_c{
	margin: 23px 0;
	text-align: center;
}
/*메인팝업*/
.pop_ct.main_ct {
    
    height: auto;
    min-height: 93px;

}
.pop_ct div.main_pop {
    padding: 10px 10px 23px;
}

.pop_ct div.main_pop p {
    padding-bottom: 32px;
	text-align: center;
	height: 550px;
    overflow-y: auto;
	    
}
.pop_ct div.bottom_check {
    border-top: 1px solid #d9d9d9;
    padding: 0px;
    position: absolute;
    bottom: 0;
    padding: 10px;
    width: 565px;
	background: #fff;
}

label input+i {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: -3px 10px 0 0;
    border: 1px solid transparent;
    background: url(../img/checkbox.png) no-repeat;
    background-size: 20px;
    vertical-align: middle;
    z-index: 1;
}
label input[type="checkbox"]:checked+i {
    background-image: url(../img/checkbox_on.png);
}
.pop_ct.main_ct div input {
    width: auto;
    height: 15px;
    margin-top: -5px;
    position: relative;
}
.pop_ct div p.btn_r {
    color: #666;
	font-size: 16px;
	position: absolute;
	right:10px;top:7px;
    font-family: 'NotoKr-Regular';
    line-height: 1.6;
}

.pop_ct div p.btn_r a{border:1px solid #d9d9d9;display: inline-block;padding:3px 15px;text-align: center
}
.pop_ct div p.btn_r a:hover{background:#000;color: #fff}
a.red {
    font-style: normal;
    background: #52b6b3;
    color: #fff;
    font-size: 15px;
    display: inline-block;
    padding: 10px;
    border-radius: 5px;
}