@charset "utf-8";
/* 모바일 기본 상단 레이아웃 */
.mobile_hd_bx		{position:relative; top:0; left:0; width:100%; height:80px; transition:all .3s; z-index:2;}
.mobile_hd_bx.mb_bg1		{background:#fff;}
.mobile_hd_bx.mb_bg2		{background:#fff;}
.mobile_hd_bx .mb_menu		{position:absolute; top:0; left:0; width:80px; height:100%; z-index:2; cursor:pointer;}
.mobile_hd_bx .mb_menu i	{position:absolute; top:0; left:0; font-size:35px; line-height:80px; width:100%; height:100%; text-align:center; color:#000;}
.mobile_hd_bx .mb_center		{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); height:100%; z-index:2; transition:all .3s;}
.mobile_hd_bx .mb_center img		{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); height:43%; transition:all .3s;}
.mobile_hd_bx .mb_center span		{position:absolute; top:54%; left:50%; transform:translate(-50%, -50%); font-family: 'GmSansB'; color:#000; font-size:20px; line-height:100%; white-space:nowrap; transition:all .3s; letter-spacing:-0.05em;}



.mobile_hd_bx .mb_right			{position:absolute; top:0; right:0; width:80px; height:100%; z-index:2; }
.mobile_hd_bx .mb_right > i	{position:absolute; top:0; left:0; font-size:35px; line-height:80px; display:block; width:100%; height:100%; text-align:center; color:#000;}
.mobile_search		{position:absolute; top:0; left:0; width:100%; height:auto; padding:50px; background:#1a356c; z-index:3; transition:all .5s;transform:translateY(-100%);}
.mobile_search.show		{ width:100%;  transition:all .5s;transform:translateY(0);}
.mobile_search > i		{position:absolute; top:25px; right:25px; font-size:18px; z-index:1; color:rgba(255,255,255,0.8);}
/*.mobile_search > i:hover	{transform:rotate(270deg); transition:all .3s;}*/
.mobile_search .shd_bx			{display:inline-block; width:100%; position:relative; padding:0 0 15px 5px; text-align:left;}
.mobile_search .shd_bx h3,
.mobile_search .shd_bx p	{display:inline-block; width:100%; position:relative; line-height:100%;}

.mobile_search .shd_bx h3			{font-weight:normal; /*font-family: 'GmSansM';*/ font-size:18px; color:#fff;}
.mobile_search .shd_bx p			{font-size:13px; padding-top:10px; color:rgba(255,255,255,0.7);}


.mobile_search .main_src		{display:inline-block; width:100%; height:50px; position:relative;}
.mobile_search .main_src input	{background:white; width:100%; font-size:13px; height:100%; padding:0 65px 0 10px; border:0px solid #eee; color:#771b00; border-radius:5px; transition:all .3s; background:#fafafa;}
.mobile_search .main_src input:focus {outline:none; border:0px solid #999; background:#fff; transition:all .3s;}
.mobile_search .main_src input::placeholder {color:rgba(0,0,0,0.4); font-size:12px;}
.mobile_search .main_src a		{position:absolute; top:50%; right:0; transform:translateY(-50%); width:50px; height:100%; text-align:center; font-size:20px; padding-top:15px; cursor:pointer; color:#000;}
/*
ul.hot_icon	{position:absolute; top:50%; right:0; transform:translateY(-50%); height:100%; font-size:0; white-space: nowrap;}
ul.hot_icon li	{display:inline-block; vertical-align:middle; position:relative; width:80px; text-align:center;}
ul.hot_icon li i	{display:inline-block; vertical-align:middle; line-height:80px; position:relative; font-size:35px;}
ul.hot_icon li span		{position:absolute; top:10px; left:50%; transform:translateX(-50%); font-size:11px; color:red;}
*/
@media screen and (max-width: 900px){
	.mobile_hd_bx		{height:65px;}
	.mobile_hd_bx .mb_menu		{width:65px;}
	.mobile_hd_bx .mb_menu i	{font-size:25px; line-height:65px;}

	.mobile_hd_bx .mb_right		{width:65px;}
	.mobile_hd_bx .mb_right > i	{font-size:25px; line-height:65px;}
	/*ul.hot_icon li	{width:65px;}
	ul.hot_icon li i	{line-height:65px; font-size:25px;}*/
}

@media screen and (max-width: 650px){
	.mobile_hd_bx		{height:55px;}
	.mobile_hd_bx .mb_center span		{font-size:17px;}
	/*
	.mobile_hd_bx.mb_bg1		{background:#fafafa; border-bottom:1px solid #eee;}
	.mobile_hd_bx.mb_bg2		{background:#fafafa;border-bottom:1px solid #eee;}
	*/
	.mobile_hd_bx .mb_menu		{width:55px;}
	.mobile_hd_bx .mb_menu i	{font-size:22px; line-height:55px; }

	.mobile_hd_bx .mb_right		{width:55px;}
	.mobile_hd_bx .mb_right > i	{font-size:20px; line-height:55px;}
	.mobile_search		{ padding:30px 25px;}
	.mobile_search .shd_bx			{padding:0 0 15px 5px;}
	.mobile_search .shd_bx h3			{font-size:15px;}
	.mobile_search .shd_bx p			{font-size:11px; padding-top:8px;}
	/*
	.mobile_search .main_src		{height:45px;}
	.mobile_search .main_src a		{width:45px; padding-top:13px;}
	*/
	/*ul.hot_icon	{right:10px;}
	ul.hot_icon li	{width:30px;}
	ul.hot_icon li i	{line-height:55px; font-size:20px;}
	ul.hot_icon li span		{top:5px;font-size:10px;}*/
}

/* 모바일 사이드 영역 */
.nav_slide_box	{position:fixed; top:0; height:100%; background:#fff;  z-index:1000001; transition:all .3s;}
.nav_slide_box.side_pc			{width:300px; right:0; transform: translateX(100%); transition:all .3s;}
.nav_slide_box.side_mobile	{width:250px; left:0; transform: translateX(-100%); transition:all .3s;}
.nav_slide_box.side_pc.show,
.nav_slide_box.side_mobile.show		{transform: translateX(0%); transition:all .3s;}
.nav_slide_box.side_pc.show > i		{left:-35px;transition:all .3s;}
.nav_slide_box.side_mobile.show > i	{right:-35px;transition:all .3s;}
.nav_slide_mask	{position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; transition:all .3s;}
.nav_slide_mask.show	{z-index:1000000; background:rgba(0,0,0,0.8); transition:all .3s;}
.nav_slide_mask > i	{position:fixed; top:25px; font-size:25px; opacity:0; color:#fff;transition:all .3s;transform: rotate(0deg); cursor:pointer;}
.nav_slide_mask.show > i	{opacity:1; transition:all .3s;}
.nav_slide_mask.bg_pc > i			{right:0;}
.nav_slide_mask.bg_mobile > i	{left:0;}
.nav_slide_mask.bg_pc.show > i			{right:315px;}
.nav_slide_mask.bg_mobile.show > i	{left:265px;}
.nav_slide_mask:hover > i	{transform: rotate(270deg);}

@-webkit-keyframes loading_wrap {
	0% {opacity: .0;} 
	25% {opacity: 0;}
	50% {opacity: 1;}
	75% {opacity: 1;}
	100% {opacity: 1;}
}

/* 사이드영역 사이트메뉴 출력 */
ul.navi_mb		{display:inline-block; width:100%;margin:0; padding:0; background:white; margin:30px 0;}
ul.navi_mb li				{position:relative;  width:100%;}
ul.navi_mb li > a			{display:block; width:100%; font-size:0 ;padding:15px 0px 15px 35px; border-bottom:0px solid #f6f6f6;   background:#fff; position:relative;}
ul.navi_mb li a .icon,
ul.navi_mb li a .b_mn		{display:inline-block; vertical-align:middle;}
ul.navi_mb li a .icon			{padding-right:0px; font-size:0; color:rgba(0,0,0,0.3); opacity:0;}
ul.navi_mb li a .b_mn			{font-size:13px; color:#555; line-height:100%;}
ul.navi_mb li a .plus			{position:absolute; top:50%; right:20px; transform:translateY(-50%); color:rgba(0,0,0,0.8); font-size:10px; transition:all .3s;}
ul.navi_mb li > a.on			{color:black;}
ul.navi_mb li > a.on .icon	{color:red;}
ul.navi_mb li > a.on .b_mn	{color:black;/* font-weight:bold;*/}
ul.navi_mb li > a.on .plus	{color:black; font-size:10px;}

ul.navi_mb li ul.sub2			{display:inline-block; padding:0; font-size:0; width:100%;  padding:0px 30px 20px 30px;border-bottom:0px solid #f6f6f6; }
ul.navi_mb li ul.sub2 li		{display:inline-block; vertical-align:middle; width:100%;}
ul.navi_mb li ul.sub2 li a	{padding:5px 5px; font-size:11px; color:rgba(0,0,0,0.45); line-height:100%; display:block; border:0;}
ul.navi_mb li ul.sub2 li a:before	{content:"ㆍ "; color:rgba(0,0,0,1); display:inline-block; padding-right:3px;}
ul.navi_mb li ul.sub2 li a:hover	{background:#ffffff; color:black; }
ul.navi_mb li ul.sub2 li a.on2		{color:black;}

ul.navi_mb li ul.sub3			{display:inline-block; padding:10px 0 15px 0; font-size:0; width:100%; border-bottom:1px dashed #f6f6f6;}
ul.navi_mb li ul.sub3 li		{display:inline-block; vertical-align:middle; width:100%; }
ul.navi_mb li ul.sub3 li a	{padding:5px 15px 5px 40px; font-size:11px; width:100%; color:rgba(0,0,0,0.7); display:block;background:white; border-bottom:0; }
ul.navi_mb li ul.sub3 li:last-child a	{border-bottom:0; }
ul.navi_mb li ul.sub3 li a:before	{content:"- ";}
ul.navi_mb li ul.sub3 li a:hover	{background:#ffffff; color:black; }
ul.navi_mb li ul.sub3 li a.on3		{color:orange;}

ul.navi_mb li ul.sub4			{display:inline-block; padding:5px 0 10px 0; font-size:0; width:100%; }
ul.navi_mb li:last-child ul.sub4			{padding-bottom:0;}
ul.navi_mb li ul.sub4 li		{display:inline-block; vertical-align:middle; width:100%; }
ul.navi_mb li ul.sub4 li a	{padding:5px 15px 5px 45px; font-size:11px; width:100%; color:rgba(0,0,0,0.7); display:block;background:white; border-bottom:0; }
ul.navi_mb li ul.sub4 li:last-child a	{border-bottom:0; }
ul.navi_mb li ul.sub4 li a:before	{content:"";}
ul.navi_mb li ul.sub4 li a:hover	{background:#ffffff; color:black; }
ul.navi_mb li ul.sub4 li a.on4		{color:yellow;}

@media screen and (max-width: 650px){
	ul.navi_mb li > a			{padding:13px 0px 13px 35px;}
	ul.navi_mb li a .icon			{font-size:0;}
	ul.navi_mb li a .b_mn			{font-size:12px;}
}


.side_head {position:relative; height:150px; background:#fafafa; border-bottom:1px dashed #eee;}
.side_head .sd_logo {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:calc(100% - 70px);}
.side_head .sd_logo img {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100px;}
.side_head .sd_logo h2,
.side_head .sd_logo ul.cmp_info {display:inline-block; width:100%; margin-top:12px;}
.side_head .sd_logo ul.cmp_info li {display:inline-block; width:100%; font-size:0; line-height:100%; padding:2px 2px;}
.side_head .sd_logo ul.cmp_info li i,
.side_head .sd_logo ul.cmp_info li em,
.side_head .sd_logo ul.cmp_info li span {display:inline-block; vertical-align:middle; line-height:100%; font-style:normal;}
.side_head .sd_logo ul.cmp_info li i {width:15px; height:15px; line-height:15px; margin-right:10px; background:#555; font-size:8px; text-align:center; color:#fff; border-radius:3px; display:none;}
.side_head .sd_logo ul.cmp_info li em {width:45px; font-size:10px; color:#777; font-family:tahoma; display:none;}
.side_head .sd_logo ul.cmp_info li span {width:calc(100% - 35px); font-size:10px; font-family:tahoma; color:#333;}


.side_head .sd_logo .tag {display:inline-block; width:100%; line-height:100%; display:none;}
.side_head .sd_logo h2 {font-family: 'GmSansB'; color:#000; font-size:22px; line-height:100%; font-weight:normal; letter-spacing:-0.05em;}
.side_head .sd_logo .tag {font-size:0; padding-top:8px;}
.side_head .sd_logo .tag span {display:inline-block; vertical-align:top; font-size:10px; color:#999; line-height:100%; margin:3px 5px 0 0;}
.side_head .sd_logo .tag span:before {content:"# "; color:rgba(0,0,0,0.2);}

.side_content {position:relative; height:calc(100% - 150px);}

.side_content ul.sns_icon		{display:inline-block; vertical-align:middle; position:relative; font-size:0; border-top:1px dashed #eee;}
.side_content ul.sns_icon li		{display:inline-block; vertical-align:middle; width:100%; cursor:pointer; font-size:0; line-height:100%; position:relative; background:#fafafa; padding:20px 35px; border-bottom:1px dashed #eee;}
.side_content ul.sns_icon li i,
.side_content ul.sns_icon li span		{display:inline-block; vertical-align:middle; line-height:100%;}

.side_content ul.sns_icon li i		{width:35px; font-size:25px;}
.side_content ul.sns_icon li.kakao i		{color:#690b01;}
.side_content ul.sns_icon li.youtube i		{color:red;}
.side_content ul.sns_icon li span		{width:calc(100% - 35px); font-size:12px; color:#000;}
.side_content ul.sns_icon li .kakao_chat_btn {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.side_content ul.sns_icon li .kakao_chat_btn a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid blue; opacity: 0;}
.side_content ul.sns_icon li .kakao_chat_btn a img {}

.side_content ul.sns_icon li iframe		{position:absolute; top:0; left:0; width:100%; height:100%; opacity:0;border:2px solid red;}

.side_content .kakao_plus_area		{width:calc(100% - 20px); position:relative; background: #ffe501; margin:0 10px; border-radius:10px; }
.side_content .kakao_plus_area .kakao_channel		{width:100%; height:100%; position:absolute; z-index:1; opacity:0;}
.side_content .kakao_plus_area .kakao_channel a	{position: absolute; top:0; left: 0; width: 100%; height: 100%;}
.side_content .kakao_plus_area .kakao_channel a img	{max-width:90px; width:100%; border-radius:35px;}

.side_content .kakao_plus_area .real_btn	{position:relative; top:0; left:0; font-size:0; padding:20px 20px 20px 30px;}

.side_content .kakao_plus_area .real_btn img,
.side_content .kakao_plus_area .real_btn .box	{display:inline-block; vertical-align: middle; }

.side_content .kakao_plus_area .real_btn img  {width:32px; margin-right: 3px;}
.side_content .kakao_plus_area .real_btn .box	{width:calc(100% - 35px); position: relative; border-radius: 7px;}
.side_content .kakao_plus_area .real_btn .box span,
.side_content .kakao_plus_area .real_btn .box i	{display:inline-block; vertical-align: middle;}
.side_content .kakao_plus_area .real_btn .box span {font-size:15px; line-height:100%; font-family:Noto Sans KR, sans-serif; padding: 0 0 0 0px; font-weight:700; letter-spacing:-0.05em;}
.side_content .kakao_plus_area .real_btn .box i	{position: absolute; top:50%; right:10px; transform: translateY(-50%); font-size:13px;}