@font-face{
 font-family:NanumGothic;
 font-style:normal; 
 src: url('./NanumGothic.eot');src: url('./NanumGothic.eot?') format('eot');src:url('./NanumGothic.woff') format('woff'), url('./NanumGothic.ttf') format('truetype');
}
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); 

* { -webkit-tap-highlight-color:rgba(0, 0, 0, 0);font-family:'apple sd gothic neo', 'NanumGothic','Nanum Gothic', sans-serif}
a {
	selector-dummy: expression(this.hideFocus=true);
	outline:0;
	font-size:18px;
}
a:link, a:visited, a:active {
	line-height: 20pt;
	font-family: 'NanumGothic';
	text-decoration: none;
	color:#17a2a9;
}
a:hover{
	color:#F05200;
}

img[usemap], map area{
    outline: none;
}

ul{padding-left:20px;margin-top:0}
ol{margin-bottom:0;padding-bottom:0;padding-left:22px}

input, textarea, select{-webkit-appearance:none;-webkit-border-radius:0}

html, body{margin:0;padding:0;-webkit-text-size-adjust:100%;background-color:#f0f0f0;}

.bold{font-weight:bold}
.normal{font-weight:normal}
.left{text-align:left}
.center{text-align:center}
.right{text-align:right}
.block{display:block}
.inblock{display:inline-block}
.inline{display:inline}
.fl{float:left}
.fr{float:right}
.w80p{width:80%}
.w50p{width:50%}
.margin_t20{margin-top:20px;}
.margin_l20{margin-left:20px;}
.margin_r20{margin-right:20px;}
.txt_primary{color:#FF7E00}

#container{margin:auto;width:480px;height:100%;position:relative;overflow:hidden;/*background:#B6236A;*/outline:0px solid #f1f1f1;}
#container img{max-width:100%;border:0}
#container .header{background:#ffffff;height:147px;position:relative;}
#container .header .header_top{width:100%;height:7px;background:#ffffff}
#container .main_top{width:100%;height:7px;background:#ffffff}
#container .header .topLogo{width:480px;margin-top:0px;margin-left:0px}
#container .header .main_category{width:100%;height:54px;text-align:center;font-size:23px;color:#fff;font-weight:bold;background:#e4753e;position:absolute;left:0;bottom:0;border-top:0px solid #0e7661;border-bottom:1px solid #db9700;}
#container .header .main_category h3 {line-height:0;*line-height:52px;font-size:27px}
#container .content{background:#fff}
#container .content .mainImg{display:block}
#container .content .main_visual a{display:block;line-height:0;}
#container .content .main_nav{overflow:hidden;margin-top:4px;}
#container .content .main_nav .nav{float:left;width:240px;}
#container .content .main_nav .nav_2{float:left;width:482px;}
#container .content .main_nav .nav a {display:block; width:100%;height:129px;padding:0 0px}
#container .content .main_nav .nav_2 a {display:block; width:100%;margin-top:4px;height:129px;padding:0 0px}


#container .content .article{padding:0 27px;line-height:1.6;font-size:18px;overflow:hidden;padding-top:25px;}
#container .content .article .title{font-weight:bold;font-size:28px;margin:0;line-height:120%;padding-bottom:10px}
#container .content .article .mark_top img{width:200px;display:inline-block; vertical-align:middle;}
#container .content .article .mark_top .mark_url{display:inline-block;vertical-align:middle;margin-left:5px;margin-top:8px;line-height:130%;padding:2px 10px}
#container .content .article .mark_top{font-size:13px;margin-bottom:10px;}
#container .content .article .mark_end{display:inline;width:75px;vertical-align:middle;}
#container .content .article .mark_url{display: inline-block;padding: 0 12px;color: #fff;font-weight: bold;border-radius: 15px;background:#BEBEBE;vertical-align:middle;}

#container .content .article .section{margin-bottom:25px;font-size:20px;color:#00b8f1;font-weight:bold;}
#container .content .article .section:before{content:"";display:block;width:40px;height:5px;margin:0;padding:0;overflow:hidden;background:#00b8f1;margin-bottom:5px;margin-top:30px;}
#container .content .article .section_line{width:100%;height:7px;background:#00b8f1}

#container .content .article .section1{margin-bottom:25px;font-size:20px;color:#24bd85;font-weight:bold;}
#container .content .article .section1:before{content:"";display:block;width:20px;height:5px;margin:0;padding:0;overflow:hidden;background:#24bd85;margin-bottom:5px;margin-top:30px;}
#container .content .article .section1_line{width:100%;height:7px;background:#24bd85}

#container .content .article .section2{margin-bottom:25px;font-size:20px;color:#EE1A3D;font-weight:bold;}
#container .content .article .section2:before{content:"";display:block;width:20px;height:5px;margin:0;padding:0;overflow:hidden;background:#EE1A3D;margin-bottom:5px;margin-top:30px;}
#container .content .article .section2_line{width:100%;height:7px;background:#EE1A3D}

#container .content .article .section3{margin-bottom:25px;font-size:20px;color:#f03e25;font-weight:bold;}
#container .content .article .section3:before{content:"";display:block;width:40px;height:5px;margin:0;padding:0;overflow:hidden;background:#f03e25;margin-bottom:5px;margin-top:30px;}
#container .content .article .section3_line{width:100%;height:7px;background:#f03e25}

#container .content .article .section4{margin-bottom:25px;font-size:20px;color:#4EABB5;font-weight:bold;}
#container .content .article .section4:before{content:"";display:block;width:40px;height:5px;margin:0;padding:0;overflow:hidden;background:#4EABB5;margin-bottom:5px;margin-top:30px;}
#container .content .article .section4_line{width:100%;height:7px;background:#4EABB5}

#container .content .article .stitle{font-size:20px;color:#00a650;margin:0;padding-bottom:10px}
#container .content .article .ltitle{margin-bottom:0}
#container .content .article .mid_title{margin-top:30px;font-weight:bold;font-size:22px;}
#container .content .article .origin{display:inline-block;color:#858585;margin-left:15px;}
#container .content .article .img_area{margin:20px 0px;}
#container .content .article .img_left{width:40%;margin:5px 20px 10px 0;}
#container .content .article .img_caption{font-size:16px;color:#858585;line-height:1.3}
#container .content .article .author{margin-top:10px;text-align:right;font-size:16px;}
#container .content .article .box_desc{margin-top:25px;background-color:#f1f1f1;padding:15px;font-size:16px;}
#container .content .article .box_desc.small{padding:0;font-size:14px}
#container .content .article .box_desc_title{font-weight:bold;color:#fff;background:#A1C5C3;text-align:center;font-size:16px}
#container .content .article .box_desc_content{padding:10px}
#container .content .article .txt_desc_title{font-weight:bold;font-size:16px;color:#F99D62;}
#container .content .article .txt_desc_content{font-size:16px;color:#6D6E70;}
#container .content .article p{margin:13px 0;line-height:1.6;color:#222;overflow:hidden}
#container .content .article .small{font-size:15px}
#container .content .article table{clear:both;display:block}
#container .content .article table.no-border td{border:0px}
#container .content .article table td{border-bottom:1px solid #719D98}
#container .content .article .tbl_title{text-align:center;font-weight:bold;color:#4D716C}
#container .content .article .tbl_desc{text-align:center;font-size:16px;color:#6D6E70}
#container .content .article .box_title{font-size:22px;padding:5px;font-weight:bold;margin-top:40px}
#container .content .article .bg_box{overflow:hidden;padding:10px}
#container .content .article .bg_box .title{font-size:18px}

#container .content .article .quiz ul, #container .content .article .quiz2 ul{list-style:none;padding-left:10px;} 
#container .content .article .quiz ul li{position:relative;margin:5px 0;}
#container .content .article .quiz ul li span{position:absolute;top:0;left:0;}
#container .content .article .quiz ul li p{padding-left:25px;margin:0 0;}

#container .content .article dt {padding-left:15px;background-color:#f1f1f1;font-weight:bold;border-bottom:1px solid #dfdfdf;}
#container .content .article dd {margin:0 25px;font-size:16px;padding:10px 0;}

#container .content .share{padding:50px 0;width:426px;margin:auto;overflow:hidden;border-bottom:1px solid #C1C1C1}
#container .content .share>div{width:350px;margin-left:39px;overflow:hidden}
#container .content .share .snsBtn{float:left;width:67px;height:67px;margin-right:3px;cursor:pointer}
#container .content .share .bandShare{position:relative;overflow:hidden}
#container .content .share .bandShare img{width:67px;height:67px;opacity:0;filter:alpha(opacity=0);top:0 !important;left:0 !important;margin:0;padding:0}
#container .content .share .bandShare .band{width:67px;height:67px;position:absolute;z-index:0;left:0 !important;top:0 !important;opacity:1 !important;filter:alpha(opacity=100)}

#container .content .paging{/*padding:10px 27px 60px 27px;*/overflow:hidden}
#container .content .paging{position:relative;height:55px;margin-top:10px;}
#container .content .paging .btn_link_prev, 
#container .content .paging .btn_link_next{position:absolute;width:80px;}
#container .content .paging .btn_link_prev{top:0; left:27px;}
#container .content .paging .btn_link_next{top:0; right:27px;}
#container .content .paging .btn_page div{float:left;display:none;padding-left:9px}

/*	JIN sub_02  */
.btn_sub_02, .btn_sub_10{display: block; border: 1px #333 solid; padding: 15px 30px; margin-bottom: 20px; text-align: center; background-color: #f4f4f4;}





#container .footer{background:#ffffff;overflow:hidden;}
#container .footer .footer_info{margin-top:-1px;padding:23px;font-size:12px;color:#7F7F7F;background:#E3E3E3;font-weight:bold;line-height:150%}
#container .footer .footer_info .info_line{padding:0;margin:0}
#container .footer .footer_info .info_title{color:#3C3C3C}
#container .footer .footer_btn{padding:13px;overflow:hidden}
#container .footer .link_sns a{display:inline-block;float:left;}
#container .footer .link_sns img{width:30px;margin:10px 5px 0 5px;}
#container .footer .link_sns.first img{margin-left:0;}

#container .footer .link_sns2 {float:right;width:200px;}
#container .footer .link_sns2 a{display:inline-block;}
#container .footer .link_sns2 img{width:45px;margin:5px 5px 0 5px; float:right;}


#container .footer .copyright{background:#e4753e;color:#fff;font-weight:bold;padding:13px 22px;font-size:13px;}

#container .footer .footer_btn .view_webzine{float:right;width:179px;height:43px;margin-top:5px;overflow:hidden}
#container .footer .footer_btn .view_webzine select{font-size:14px;padding:10px;width:179px;height:43px;background:#fff;border:1px solid #787878;border-radius:5px;}

@media all and (max-width:767px) {
	#container .footer .footer_btn .view_webzine{background:url(../image/footer/img_select.jpg) no-repeat;background-size:179px 43px}
	#container .footer .footer_btn .view_webzine select{opacity:0}
}

/* »çÀ̵å¸Þ´º ¹öÆ° */
.menuBtn{width:52px;position:absolute;top:28px;right:17px;z-index:9;cursor:pointer}
.header .menuBtn{top:20px}
/* »çÀ̵å¸Þ´º ¹öÆ° ³¡ */

/* ½ºÇÇÄ¿¹öÆ° */
.menuBtn_play{width:52px;position:absolute;top:175px;right:8px;z-index:9;cursor:pointer}
/* ½ºÇÇÄ¿¹öÆ° ³¡ */

/* »çÀ̵å¸Þ´º */
#sidebarCover{width:457px;height:100%;position:fixed;background:#fff;overflow:hidden;right:50%;margin-right:-698px;z-index:1001;top:0px;background-color:#f0f0f0;}
#sidebar{width:415px;height:100%;position:fixed;background:#e4753e;overflow:hidden;right:50%;margin-right:-698px;z-index:1000;top:0px;box-shadow:-12px -2px 17px rgba(0,0,0,0.3)}
#sidebarEdge{width:5px;height:100%;float:left;background:#e4753e}
#sidebarDiv{width:410px;height:100%;float:left}
#scroller{width:410px;left:5px !important;background:#e4753e;}
#sidebarContent{width:100%;position:relative;text-align:left;overflow:hidden;}
#sidebarHeader{width:100%;height:90px;border-bottom:1px solid #e4753e;overflow:hidden;background:#e4753e}
#sidebarHeader #sidebarLogo{width:180px;display:block;margin-top:14px;margin-left:15px;}
#sidebarHeader .menuBtn{top:20px;}
#menuArea{background:#e4753e;padding:20px 0px;border-top:1px solid #e4753e;border-bottom:1px solid #e4753e;}
.menu{padding-left:35px;color:#e4753e;font-size:22px;font-weight:bold;height:55px;line-height:55px;cursor:pointer;color:#fff;opacity:0.5;
transform:translateX(-457px);-webkit-transform:translateX(-457px);-moz-transform:translateX(-457px);-o-transform:translateX(-457px);transition:all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
-webkit-transition:all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);-moz-transition:all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);-o-transition:all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
background:#e4753e;}
.menu.category{color:#e4753e;font-size:15px;line-height:53px}
.showMenu{transform:translateX(0px);-webkit-transform:translateX(0px);-moz-transform:translateX(0px);-o-transform:translateX(0px);opacity:1}
.active{color:#dddddd}
.menu1{transition-delay:0ms;-webkit-transition-delay:0ms;-moz-transition-delay:0ms;-o-transition-delay:0ms;}
.menu2{transition-delay:35ms;-webkit-transition-delay:35ms;-moz-transition-delay:35ms;-o-transition-delay:35ms;}
.menu3{transition-delay:70ms;-webkit-transition-delay:70ms;-moz-transition-delay:70ms;-o-transition-delay:70ms;}
.menu4{transition-delay:105ms;-webkit-transition-delay:105ms;-moz-transition-delay:105ms;-o-transition-delay:105ms;}
.menu5{transition-delay:140ms;-webkit-transition-delay:140ms;-moz-transition-delay:140ms;-o-transition-delay:140ms;}
.menu6{transition-delay:175ms;-webkit-transition-delay:175ms;-moz-transition-delay:175ms;-o-transition-delay:175ms;}
.menu7{transition-delay:210ms;-webkit-transition-delay:210ms;-moz-transition-delay:210ms;-o-transition-delay:210ms;}
.menu8{transition-delay:245ms;-webkit-transition-delay:245ms;-moz-transition-delay:245ms;-o-transition-delay:245ms;}
.menu9{transition-delay:280ms;-webkit-transition-delay:280ms;-moz-transition-delay:280ms;-o-transition-delay:280ms;}
#snsBox{padding:30px 35px 30px 20px;width:410px;overflow:hidden;background:#e4753e;border-top:1px solid #e4753e;}
.shareBtn{width:67px;float:left;margin-left:7px;display:block;cursor:pointer;border:0;opacity:0;transform:translateY(-10px);-webkit-transform:translateY(-10px);-moz-transform:translateY(-10px);-o-transform:translateY(-10px);;transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);-webkit-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);-moz-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);-o-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);}
.showBtn{opacity:1;transform:translateY(0);-webkit-transform:translateY(0);-moz-transform:translateY(0);-o-transform:translateY(0);}
.btn1{transition-delay:210ms;-webkit-transition-delay:210ms;-moz-transition-delay:210ms;-o-transition-delay:210ms;}
.btn2{transition-delay:270ms;-webkit-transition-delay:270ms;-moz-transition-delay:270ms;-o-transition-delay:270ms;}
.btn3{transition-delay:330ms;-webkit-transition-delay:330ms;-moz-transition-delay:330ms;-o-transition-delay:330ms;}
.btn4{transition-delay:390ms;-webkit-transition-delay:390ms;-moz-transition-delay:390ms;-o-transition-delay:390ms;}
.btn5{transition-delay:450ms;-webkit-transition-delay:450ms;-moz-transition-delay:450ms;-o-transition-delay:450ms;}
.btn6{transition-delay:510ms;-webkit-transition-delay:510ms;-moz-transition-delay:510ms;-o-transition-delay:510ms;}


.bandLinkWrapper{position:relative;height:67px;overflow:hidden}
.bandLinkWrapper img{width:67px;height:67px;opacity:0;filter:alpha(opacity=0);top:0 !important;left:0 !important;margin:0;padding:0}
.bandLinkWrapper .bandBtn{width:67px;height:67px;position:absolute;z-index:0;left:0 !important;top:0 !important;opacity:1 !important;filter:alpha(opacity=100)}

#sideCopyright{text-align:right;color:#99d8cb;font-size:11px;right:15px;position:absolute;bottom:45px;}

#bgLayer{width:100%;height:100%;position:absolute;top:0;left:0;background:#000;opacity:0.5;filter:alpha(opacity=50);z-index:10;display:none}
/* »çÀ̵å¸Þ´º ³¡ */

/* »çÀ̵å¸Þ´º ¾Ö´Ï¸ÞÀÌ¼Ç */
.menuShow { 
	-moz-animation-duration: 0.5s;
	-o-animation-duration: 0.5s;
	-webkit-animation-duration: 0.5s; 
	animation-duration: 0.5s; 
	-moz-animation-fill-mode: both; 
	-o-animation-fill-mode: both; 
	-webkit-animation-fill-mode: both; 
	animation-fill-mode: both; 
	-moz-animation-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	-o-animation-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	-webkit-animation-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	animation-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-webkit-animation-name: menuShow;
	-moz-animation-name: menuShow;
	-o-animation-name: menuShow;
	animation-name: menuShow;
}

@keyframes menuShow {
	from {transform: translateX(0px)}
	to {transform: translateX(-457px);}
}
@-webkit-keyframes menuShow {
	from {-webkit-transform: translateX(0px)}
	to {-webkit-transform: translateX(-457px)}
}
@-moz-keyframes menuShow {
	from {-moz-transform: translateX(0px)}
	to {-moz-transform: translateX(-457px)}
}
@-o-keyframes menuShow {
	from {-o-transform: translateX(0px)}
	to {-o-transform: translateX(-457px)}
}

.menuHide { 
	-moz-animation-duration: 0.5s;
	-o-animation-duration: 0.5s;
	-webkit-animation-duration: 0.5s; 
	animation-duration: 0.5s; 
	-moz-animation-fill-mode: both; 
	-o-animation-fill-mode: both; 
	-webkit-animation-fill-mode: both; 
	animation-fill-mode: both; 
	-moz-animation-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	-o-animation-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	-webkit-animation-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	animation-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
	-webkit-animation-name: menuHide;
	-moz-animation-name: menuHide;
	-o-animation-name: menuHide;
	animation-name: menuHide;
}

@keyframes menuHide {
	from {transform: translateX(-457px)}
	to {transform: translateX(0px)}
}
@-webkit-keyframes menuHide {
	from {-webkit-transform: translateX(-457px)}
	to {-webkit-transform: translateX(0px)}
}
@-moz-keyframes menuHide {
	from {-moz-transform: translateX(-457px)}
	to {-moz-transform: translateX(0px)}
}
@-o-keyframes menuHide {
	from {-o-transform: translateX(-457px)}
	to {-o-transform: translateX(0px)}
}
/* »çÀ̵å¸Þ´º ³¡ */