@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');
}

* { -webkit-tap-highlight-color:rgba(0, 0, 0, 0);font-family:apple sd gothic neo,NanumGothic, sans-serif}
a {
	selector-dummy: expression(this.hideFocus=true);
	outline:0;
}

a:link, a:visited, a:active {
	line-height: 20pt;
	font-family: "NanumGothic";
	text-decoration: none;
	color:#17a2a9;
}
a:hover{
	color:#9c2968;
}

img[usemap], map area{
    outline: none;
}

ul{padding-left:20px;margin-top:0}

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}
.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%}
.txt_primary{color:#FF7E00}

#container{margin:auto;width:480px;height:100%;position:relative;overflow:hidden;/*background:#B6236A;*/outline:1px solid #f1f1f1;}
#container img{max-width:100%;border:0}
#container .header{background:#fff;height:153px;position:relative;}
#container .header .header_top{width:100%;height:7px;background:#b6226a}
#container .main_top{width:100%;height:7px;background:#b6226a}
#container .header .topLogo{width:255px;margin-top:17px;margin-left:13px}
#container .header .main_category{width:100%;height:60px;text-align:center;font-size:23px;color:#fff;font-weight:bold;background:#3f707d;position:absolute;bottom:0}
#container .header .main_category img{height:27px;display:block;margin:auto;margin-top:16px}
#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:1px;}
#container .content .main_nav .nav{float:left;width:154px;padding:0 2px;}
#container .content .main_nav .nav a {display:block; width:100%;height:98px;padding:0 3px}

#container .content .sub_category_list{width:100%;overflow:hidden}
#container .content .sub_category_list>div{padding:27px;overflow:hidden;line-height:140%;cursor:pointer;border-bottom:1px solid #DCDCDC}
#container .content .sub_category_list .sub_category{display:inline-block;padding:4px 10px;margin-bottom:8px;font-size:15px;color:#fff;font-weight:bold;border-radius:14px}
#container .content .sub_category_list .sub_category.c2{background:#5CA9DD;}
#container .content .sub_category_list .sub_category.c3, #container .content.c3 .article .sub_category{background:#74A633;}
#container .content .sub_category_list .sub_category.c4, #container .content.c4 .article .sub_category{background:#B6236A;}
#container .content .sub_category_list .sub_category.c5, #container .content.c5 .article .sub_category{background:#5CA9DD;}
#container .content .sub_category_list .sub_category.c6, #container .content.c6 .article .sub_category{background:#FF7E00;background:#EA80BC;}
#container .content .sub_category_list .sub_category.c7, #container .content.c7 .article .sub_category{background:#8C5D31;}
#container .content .sub_category_list .origin{display:inline-block;margin-left:7px;font-size:17px;color:#858585;font-weight:bold}
#container .content .sub_category_list .title{position:relative;font-size:22px;color:#3B3B3B;font-weight:bold;line-height:1.4;}
#container .content .sub_category_list.c02 .title, #container .content .sub_category_list.c07 .title{padding-left:15px;}
#container .content .sub_category_list.c02 .title:before{content: '';position: Absolute;width:6px;height:6px;top:50%;margin-top:-3px;left:0;background:#b6226a;border-radius:50%}
#container .content .sub_category_list.c07 .title:before{content: '';position: Absolute;width:6px;height:6px;top:50%;margin-top:-3px;left:0;background:#8C5D31;border-radius:50%}
#container .content .category_img{display:block;width:100%}


#container .content .article{padding:0 27px;line-height:160%;font-size:18px;overflow:hidden;display:none;padding-top:40px;}
#container .content .article .title{font-weight:bold;font-size:28px;margin:0;line-height:120%;padding-bottom:10px}
#container .content .article .section{margin-bottom:25px;font-size:20px;color:#006473;font-weight:bold;}
#container .content .article .section:before{content:"";display:block;width:40px;height:5px;margin:0;padding:0;overflow:hidden;background:#006473;margin-top:60px;margin-bottom:5px}
#container .content .article .section2:before{content:"";display:block;width:40px;height:5px;margin:0;padding:0;overflow:hidden;background:#006473;margin-bottom:5px}
#container .content .article .stitle{font-size:20px;color:#006473;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 .sub_category{display: inline-block;padding: 0 15px;color: #fff;font-weight: bold;margin: 0 0 15px;border-radius: 15px;}
#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 p{margin:13px 0;font-size:18px;line-height:1.6;color:#222;}

#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 .btn_list{float:left;}
#container .content .paging .btn_list img{width:80px;display:block}
#container .content .paging .btn_page{float:right;overflow:hidden;}
#container .content .paging .btn_page img{width:80px;display:block}
#container .content .paging .btn_page div{float:left;display:none;padding-left:9px}

#container .footer{background:#b6226a;overflow:hidden;}
#container .footer .footer_info{margin-top:-1px;padding:20px;font-size:12px;color:#7F7F7F;background:#E3E3E3;font-weight:bold;line-height:150%;letter-spacing:0px !important}
#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 .footer_btn img{float:left;margin-right:13px;width:115px}
#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:0px;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:79px;position:absolute;top:26px;right:15px;z-index:9;cursor:pointer}
.header .menuBtn{top:29px}
/* »çÀÌµå¸Þ´º ¹öÆ° ³¡ */

/* »çÀÌµå¸Þ´º */
#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:457px;height:100%;position:fixed;background:#F4F4F4;overflow:hidden;right:50%;margin-right:-698px;z-index:1000;top:0px;}
#sidebarEdge{width:7px;height:100%;float:left;background:#B52269}
#sidebarDiv{width:450px;height:100%;float:left}
#scroller{width:450px;left:7px !important;background:#F4F4F4;}
#sidebarContent{width:100%;position:relative;text-align:left;overflow:hidden;}
#sidebarHeader{width:100%;height:92px;border-bottom:1px solid #C1C1C1;overflow:hidden;background:#fff}
#sidebarHeader #sidebarLogo{width:255px;display:block;margin-top:19px;margin-left:15px}
.menu{padding-left:40px;color:#444444;font-size:22px;font-weight:bold;height:55px;line-height:55px;cursor:pointer;/*color:#747474;*/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);}
.menu.category{color:#9c2968;font-size:15px;line-height:75px}
.menu.odd{background:#FAFAFA}
.menu.even{background:#F4F4F4}
.showMenu{transform:translateX(0px);-webkit-transform:translateX(0px);-moz-transform:translateX(0px);-o-transform:translateX(0px);opacity:1}
.active{color:#9c2968}
.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:63px 0;width:401px;margin-left:18px;overflow:hidden}
.shareBtn{width:67px;float:left;margin-left:13px;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:#B5B5B5;font-size:11px;right:15px;position:absolute;bottom:15px;}

#bgLayer{width:100%;height:100%;position:absolute;top:0;left:0;background:#000;opacity:0.7;filter:alpha(opacity=70);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)}
}
/* »çÀÌµå¸Þ´º ³¡ */