@charset "utf-8";
/* CSS Document */
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

html, body	{height: 100%; width: 100%;}

body{
	margin: 0;
	font:12px 'Nanum Gothic', NanumGothic, "나눔고딕", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", Gulim, "굴림", Verdana, Arial, "Trebuchet MS";
	text-align: center;
}
a	{outline: none;}
a:link	{text-decoration:none;}
a:hover	{text-decoration:none;}
a:visited	{text-decoration:none;}
a:active	{text-decoration:none;}
ul, ol, dl, dd, dt	{margin:0; padding:0; list-style:none;}
h1, h2, h3, h4, h5, p	{margin:0; padding:0;}
img	{border:none;}
input, textarea, button, select	{font:12px 'Nanum Gothic', NanumGothic, "나눔고딕", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", Gulim, "굴림", Verdana, Arial, "Trebuchet MS";outline: none;}
table	{font:12px 'Nanum Gothic', NanumGothic, "나눔고딕", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", Gulim, "굴림", Verdana, Arial, "Trebuchet MS";}
button:active	{margin: 0;}


/* layout */
#container	{min-width: 1000px; min-height: 100%; position: relative;}
#headerWrap	{min-width: 1000px;} 
#header	{margin: 0 auto; width: 1000px;}
#wrapper	{position: relative; margin: 0 auto; padding: 30px 0; width: 1000px; text-align: left;} *+ html #wrapper	{padding-bottom: 30px !important;}
#content	{ overflow: hidden;}
.twoColL #sidebar,	
.twoColR #sidebar	{width: 200px;}
.twoColL #content,
.twoColR #content	{width: 743px;}
.twoColR #sidebar,
.twoColL #content	{float: right;}
.twoColR #content,
.twoColL #sidebar	{float: left;}
#footer	{padding: 30px 0; position: absolute; bottom: 0; width: 100%;} *+ html #footer	{position: static; width: auto;}

/* topMenu */
#topMenu	{margin: 0 auto; width: 1000px; text-align: left; position: relative; font-size: 11px;
}
#topMenu .search	{float: left; padding: 8px 0 0;}
#topMenu .searchinput	{padding-left: 19px; height: 17px; width: 1px; border: none;}
#topMenu .memberArea	{float: right; padding: 10px 0; height: 14px;}
#topMenu .memberArea li	{display: inline; padding: 0 10px;}
#topMenu .memberArea li.last	{padding-right: 0;}
#topMenu .memberArea li button	{padding:0; margin: 0; background: none; border: none; cursor: pointer; overflow: visible;} *+ html #topMenu .memberArea li button	{height: 13px;}
#topMenu .memberArea li button img	{vertical-align: middle}
#topMenu .memberArea li ul.selectLang	{display: none; position: absolute; right: 0; top: 34px; z-index: 100;}
#topMenu .memberArea li ul.selectLang	{}
#topMenu .memberArea li ul.selectLang li	{display: block; padding: 5px 10px;}

/* header */
#header	{padding: 40px 0;}
#header h1	{font-size: 0;}
#header h1 a	{ margin: 0 auto; font-size: 20px;}
#header.headerTypeVer h1	{padding-bottom: 30px;}
#header.headerTypeVer #mainNav	{left: 50%;}
#header.headerTypeHor	{text-align: left;}
#header.headerTypeHor h1	{float: left;}
#header.headerTypeHor #mainNav	{float: right;}
#header.headerTypeHor #mainNav ul	{margin-right: -18px;}

#mainNav	{font-size: 0;}
#mainNav li	{display: inline; position: relative; margin: 0 18px;} /* */*+ html #mainNav li	{display: inline; font-size: 0;} /* */* html #mainNav li	{display:inline;}
*+ html #mainNav li img 	{margin-left: -1px;}
#mainNav li a	{font: 12px "Verdana", "나눔고딕", "NanumGothic", "맑은 고딕", "Malgun Gothic", "돋움", "dotum"; letter-spacing: 0.1em}
#mainNav li ul	{position: absolute; display: none; box-shadow: none !important; min-width: 120px;}
#mainNav li ul li	{display: block; float: none; margin: 0; white-space: nowrap;}
#mainNav li ul li a	{display: block; padding: 10px 12px; text-align: left; font: normal 11px NanumGothic, "나눔고딕", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", Gulim, "굴림", Verdana, Arial, "Trebuchet MS"; text-transform: none; letter-spacing: 0;}
.ddshadow	{display: none;}



/* topImage */
#imageArea{position: relative; padding-bottom: 25px; margin-bottom: 30px;}
#topImage	{width: 1000px; position: relative; overflow: hidden;}
#topImage li	{position: relative;}
#topImage li .title	{display: block; position: absolute; top: 40px; left: 0;}

ol#controls	{position: absolute; left: 0; bottom: 0; padding:0; width: 1000px; text-align: center;}
.boxWrap ol#controls	{width: 920px;}
ol#controls li	{display: inline; list-style:none; }


#topImage li	{width: 1000px; height: 480px; overflow: hidden;}
#prevBtn	{display:block; width:30px;	height:30px; position:absolute; right:30px;	bottom:0; z-index:51;}
#nextBtn	{display:block; width:30px; height:30px; position:absolute; right:0; bottom:0; z-index:51;}	
#prevBtn a	{display:block; position:relative; width:30px; height:30px; background:url(../images/btPrev.png) no-repeat 0 0;}
#nextBtn a	{display:block; position:relative; width:30px; height:30px; background:url(../images/btNext.png) no-repeat 0 0;}
#prevBtn a:hover, 
#nextBtn a:hover	{background-position: 0 -30px;}
#prevBtn, #nextBtn	{margin:0;padding:0;display:block;overflow:hidden;text-indent:-8000px;}


/* main search page set */
.searchPage	{display: none;}

/* footer */
#footer .bottomMenu	{padding-bottom: 30px;}
#footer .bottomMenu .btEx	{position: relative; margin: 0 10px; cursor: pointer;}
#footer .bottomMenu .ex	{display: none; position: absolute; top: -43px; left: 2px;}
*+ html #footer .bottomMenu .ex	{top: -13px;}
/** search **/
.bottomMenu .search	{margin: 20px auto 0; width: 163px; height: 26px; display: none;}
.search form,
.search fieldset,
.search legend	{padding: 0; margin: 0; border: none;}
.search legend	{display: none;}
/* */
#footer .copyright	{line-height: 180%;}
#footer .address,
#footer .tel	{line-height: 180%; padding-left: 5px;}
.bgNormalStyle #extraInfo	{color: #aaa;}
.bgColorStyle #extraInfo	{opacity:.5; filter:alpha(opacity:50);}

/**** global sidebar style ****/
.sidebar .category h3	{font: bold 12px "Trebuchet MS", "Nanum Gothic";}
.sidebar .category li a	{font-size: 11px;}
.sidebar .category li ul li a	{background: none;}
/* lineType */
.sideLine h3	{padding-bottom: 10px;}
.sideLine .category li	{padding: 9px 0 10px;}
.sideLine .category li a	{padding-left: 14px;}

.sideLine .category li ul	{margin-top: 9px; padding-left: 16px;}
.sideLine .category li ul li	{padding: 10px 0 0; background: none;}
/* boxType */
.sideBox .category	{-moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; behavior: url(../border-radius.htc);}
.sideBox .category h3	{padding: 8px 15px; -moz-border-radius: 7px 7px 0 0; -webkit-border-radius: 7px 7px 0 0; border-radius: 7px 7px 0 0; behavior: url(../border-radius.htc);}
.sideBox .category li	{padding: 12px 0 11px;}
.sideBox .category li a	{display: block; padding: 0 15px 0 29px;}
.sideBox .category li ul	{margin-top: 9px; padding-left: 12px;}
.sideBox .category li ul li	{padding: 10px 0 0; background: none;}


/* mainWedgetStyle - photoCommunity
--------------------------------------------------------------------------*/
/* pcWebzine */
.pcWebzine .noImage	{display: block; width: 229px; height: 290px; background: url(../images/noImage.png) no-repeat center center; text-indent: -9999px; position: relative; top: 50%; margin-top: -145px;}


/* mainWedgetStyle - gallery 
--------------------------------------------------------------------------*/
#grid-content,
.grid-content	{width: 1070px !important; font-size: 0;}
.twoColL #grid-content,
.twoColR #grid-content,
.rightBody #grid-content,
.leftBody #grid-content	{width: 773px !important;}

/** gridEl **/
.gridEl	{display: inline-block; width: 229px; margin: 0 28px 28px 0; vertical-align: top;} *+ html .gridEl	{display: inline;} * html .gridEl	{display: inline;}
.james .gridEl	{position: relative;}
.mini .gridEl	{float: none; margin: 0; width: 207px; position: relative;}
.john .gridEl {width: 250px; position: relative;}
.john .gridEl	{margin: 0;}
.tom .gridEl,
.jane .gridEl	{height: auto;}
/** thumb **/
.gridEl .thumbArea	{margin: 0; font-size: 0px;}
.hide .thumb	{display: block;}
.gridEl .noImage	{display: block; min-height: 62px; background: url(../images/noImage.png) no-repeat center center;}
/** infoArea **/
.hide .infoArea	{display: none; position: absolute; bottom: 0; left: 0; padding: 0 0 10px; text-align: center;}
.james .infoArea	{width: 229px;}
.john .infoArea	{width: 250px;} 
.mini .infoArea	{width: 207px;}
/** titleArea **/
.hide .titleArea	{display: block; text-align: center; margin-top: 0; padding: 10px 0 8px;}
.paul .titleArea,
.grace .titleArea,
.james .titleArea	{float: none; text-align: center;}
/** listTitle **/
.gridEl .listTitle	{padding: 15px 0 8px;}
/** imgDate **/
.imgDate	{clear: both;}
.gridEl p	{margin-top: 10px;}
.hide .imgDate,
.paul .imgDate,
.grace .imgDate	{background: none; padding: 0;line-height: 140%;}
/** extraInfo **/
.gridEl .author	{padding-left: 10px; margin-left: 10px; font-size: 12px;}
.anne .gridEl .author	{margin-left: 7px; border-left: none;}

/** boxing **/
.mini .boxing	{display: inline-block; width: 207px; padding: 0; margin: 0 28px 28px 0; font-size: 0;} *+ html .mini .boxing	{display: inline;} * html .mini .boxing	{display: inline;}
.hide .gridEl	{font-size: 0;}
.hide .gridEl .titleArea	{font-size: 12px;}
/** listSummary **/
.tom .gridEl p.listSummary	{padding: 0 14px;}
/** backgroundColor **/
.anne .infoArea,
.paul .infoArea	{padding: 0 14px;}
.anne .gridEl .infoArea	p.listSummary,
.paul .gridEl .infoArea	p.listSummary	{padding-bottom: 10px;}
.paul .gridEl .infoArea	p.listSummary	{text-align: center;}


/* (g)list */
.list form,
.list fieldset	{padding: 0; margin: 0; border: none;}
.list legend	{display: none;}

.grace .listSummary	{display: none;}

.list .john,
.list .viki	{margin-bottom: 30px;}

.listNo	{text-align: center; padding: 50px 0; background-color: #FFF; border: 3px dashed #DDD; font-size: 18px; font-weight: bold;}
.itWorksGallery .listNo a	{color: #3a75a7; border-bottom: 1px solid #3a75a7;}
.itWorksGallery .listNo a:hover	{border-bottom: none;}




/* (g)list notice */
.itWorksGallery .notice	{width: 1000px; margin-bottom: 30px;}
.twoColL .itWorksGallery .notice,
.twoColR .itWorksGallery .notice,
.itWorksGallery .rightBody .notice,
.itWorksGallery .leftBody .notice	{width: 743px;}

.itWorksGallery .notice li	{padding-top: 10px; padding-bottom: 10px;}
.itWorksGallery .notice a	{float: left;}
.itWorksGallery .notice .noticeDate	{display: block; float: right; padding-right: 5px;}

/* (b)list */
.boardList table	{border-collapse: collapse;}
.boardList th	{padding: 7px 5px; font-size: 11px; text-align: center; font-weight: normal; white-space: nowrap;}
.boardList td	{padding: 10px 5px 9px;}

.boardList td.no	{width: 38px;}
.boardList td.readNum,
.boardList td.voteNum,
.boardList td.check	{width: 30px;}
.boardList td.author	{width: 110px;}
.boardList td.time	{width: 80px;}
.boardList td.time,
.boardList td.readNum,
.boardList td.voteNum,
.boardList td.check,
.boardList td.no	{text-align: center}
.boardList td.title .replyNum	{padding-left: 5px;}
.boardList td.title img	{vertical-align: middle; margin-left: 5px;}


/* +listFooter+ */
.pagination	{padding-top: 5px; font-size: 11px;}
.listFooter .pagination	{float: left;}
.listFooter .btArea	{float: right;}
.listFooter .btArea .bt	{display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline;}
.listFooter .btArea .bt a	{line-height: normal;}
.listFooter .listSearch	{float: right; padding-right: 5px;}
.listFooter .listSearch form	{display: none; float: left; padding-left: 5px;}
.listFooter .listSearch .toggleSearch	{display: block; float: left; height: 24px; width: 32px; border: none; cursor: pointer;}
.listFooter .listSearch .toggleSearch span	{display: none;}
.listFooter .listSearch .select	{float: left; margin-right: 5px; padding: 4px 0 0 5px; width: 68px; height: 20px; overflow: hidden; }
.listFooter .listSearch select	{width: 92px; border: none; font-size: 10px; -webkit-appearance: none; outline: none; background: transparent;}
.listFooter .listSearch .searchInput	{float: left; padding: 0 5px; width: 110px; font-size: 11px;}

.pagination .pageNum,
.pagination .pageNumOn	{padding: 5px 8px;line-height: 22px;}


/* (b)listFooter */
.itWorksBoard .listFooter	{padding-top: 30px;}


/* +header+ */
.topTab	{padding: 10px 15px; margin-bottom: 30px; font-size: 11px; line-height: 160%;}
.topTab li	{padding: 0 15px;}
.topTab li,
.topTabSub,
.topTabSub ul	{display: inline;}
.topTabSub	{padding-left: 15px; }
.topTab li ul li	{padding: 0 10px;}


.board_header	{margin-bottom: 30px;}

.rightBody,
.leftBody	{width: 743px;}
.boxWrap .rightBody,
.boxWrap .leftBody	{width: 683px;}
.sidebar	{width: 200px; padding: 0;}
.boxWrap .sidebar	{width: 180px;}
.rightBody,
.sidebar.right	{float: right;}
.leftBody,
.sidebar.left	{float: left;}

.sideTabSearch	{margin-bottom: 30px;}
.sideTabSearch .select	{padding: 4px 0 0 5px; width: 193px; margin-bottom: 3px; height: 22px; overflow: hidden;} *+ html .sideTabSearch .select	{padding: 0; width: 200px;}
.sideTabSearch select	{width: 215px; border: none; font-size: 11px; -webkit-appearance: none; outline: none;} *+ html .sideTabSearch select	{width: 198px;}
.sideTabSearch .iText	{margin: 0; padding: 0 5px 0 28px; width: 165px; font-size: 11px;}


/* +read+ */
.readBody	{margin-bottom: 30px;}
.readBody .xe_content,
.readBody .xe_content span,
.readBody .xe_content p	{font:12px/160% 'Nanum Gothic', NanumGothic, "나눔고딕", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", Gulim, "굴림", Verdana, Arial, "Trebuchet MS";}
.articleControl	{text-align: right; padding-bottom: 20px; font-size: 11px;}
.sign	{float: right; padding: 10px 0 30px; width: 300px; }
.sign .pf	{float: right; margin-left: 15px;}
.sign p	{text-align: right; line-height: 180% !important; font-size: 12px !important;}

.readInfo	{clear: both;}
.hideInfo	{display: none;}
.readTitle.readTitleTop	{margin-bottom: 30px; padding-top: 15px;}
.readTitle.readTitleBottom	{padding: 20px 0;}
.readTitle	{padding: 0 0 12px;}
.readTitle h1,
.readTitle h3	{margin-bottom: 15px;font-size: 16px;}
.underTitle li	{display: inline; padding: 0 15px 0 14px; font-size: 11px;}
.readTag,
.readFile	{padding: 12px 0;}
.readTag span,
.readFile span	{padding-right: 13px;}
.readFile	{display: none; line-height: 160%;}

.readBtArea li	{float: left; padding: 5px 12px; margin-right: 1px; height: 13px; line-height: 12px;}

.readControl	{float: right;}
.readAction	{float: left;}
.readAction li button	{border: none; cursor: pointer; padding: 0; margin: 0; line-height: 11px; overflow:visible}
.readAction li button span	{line-height: 11px;}
 
.readControlSide {position: fixed; left: 50%; width: 50px; font-size: 11px;}
.readControlSide a	{display: block; padding: 32px 0 6px; width: 50px; text-align: center;}
.readControlSide.right	{margin-left: 530px;}
.readControlSide.left	{margin-left: -584px}


/* +comment+ */
#comment	{}
.hideComment	{display: none;}
.cList	{padding-top: 15px; }
.cList .commentBody	{padding: 0 0 0 55px;}

.commentInfo .pfWrap	{float: left; overflow: hidden; behavior: url(../border-radius.htc); -moz-border-radius: 50em; -webkit-border-radius: 50em; border-radius: 50em; background: transparent url(../images/basicBlogIcon.png) no-repeat;}
.commentInfo .pfWrap,
.commentInfo .pfWrap img	{width: 40px; height: 40px;} 
.commentInfo .author	{float: left; padding: 5px 0 0 15px; font-size: 14px;}
.commentInfo .imgDate,
.commentInfo .imgVote	{display: block; ;float: right; clear: none; margin-top: 5px;}
.commentInfo .imgDate	{margin-left: 15px;}
.commentInfo .imgVote	{padding-right: 15px; border-right: 1px solid #DDD;}
.indent .commentInfo	{padding-left: 20px;}

.cList .commentBody	{padding: 0 0 0 55px; margin-top: -10px;}
.indent .commentBody	{padding: 0 0 0 75px;}
.secretCon p	{padding-bottom: 7px;}

.commentFile	{display: none; margin: 10px 0 0 55px; padding: 12px 0 5px; line-height: 160%;}
.commentList li.indent .commentFile	{margin-top: 0;}
.commentFile span	{padding-right: 13px;}

.commentControl	{padding: 5px 0 10px; margin-left: 55px; height: 11px;}
.commentControl ul	{display: none;}
.commentControl li	{display: inline; padding: 0 10px;}
.commentControl button	{border: none; cursor: pointer; padding-right: 0;}
.indent .commentControl	{margin-left: 75px;}

.commentWrite	{padding: 25px 0;}
.commentWrite textarea	{resize: vertical; line-height: 160%; overflow: auto; border: none;}
.commentWrite .author,
.commentWrite .btArea	{margin-top: 10px;}
.commentWrite .author input	{margin-top: 0;}

.commentList li.indent1	{margin-left: 40px;}
.commentList li.indent2	{margin-left: 80px;}
.commentList li.indent3	{margin-left: 120px;}
.commentList li.indent4	{margin-left: 160px;}
.commentList li.indent5	{margin-left: 200px;}
.commentList li.indent6	{margin-left: 240px;}
.commentList li.indent7	{margin-left: 280px;}
.commentList li.indent8	{margin-left: 320px;}
.commentList li.indent9	{margin-left: 360px;}
.commentList li.indent10	{margin-left: 400px;}
.commentList li.indent11	{margin-left: 440px;}
.commentList li.indent12	{margin-left: 480px;}

#comment .pagination	{padding-top: 25px;}


/* +deleteForm+ */
.context_message2,
.context_message2_1	{padding: 42px 0 45px; text-align: center;}
.context_message2 h1,
.context_message2_1 h1	{font-size: 14px;}
.context_message2 .btArea,
.context_message2_1 .btArea	{padding-top: 25px;}
.context_message2.inputPassword	{background: none;}


/* +writeForm+ */
.writeHeader	{padding-bottom: 10px;}
.writeHeader .iText	{width: 400px;}
.write_form .writeAuthor	{padding-top: 10px;}
.write_form .btArea	{padding-top: 10px; height: 24px; text-align: right;}



/* moduleStyle - member 
--------------------------------------------------------------------------*/
#itWorksMember .btArea,
#itWorksMember .pagination	{padding-top: 30px;}
.context_message4,
.context_message3	{padding: 0 0 60px; margin-top: 45px;}
.context_message3 p	{line-height: 160%;}
.context_message3 .btArea	{padding-top: 25px;}
.context_message3 input[type=email]	{width: 200px;}

.iwMemberTable,
.iwScrapTable	{width: 100%; border-collapse: collapse;}
.iwMemberTable td,
.iwScrapTable td	{padding: 10px 15px;}
.iwMemberTable td.title	{width: 150px;}
.iwMemberTable em	{font: normal 14px "verdana"; vertical-align: middle;}
.iwMemberTable textarea	{padding: 10px; border: none; resize: vertical; overflow: auto;}
.iwMemberTable label	{margin-right: 10px;}

.iwScrapTable caption	{text-align: right; padding-bottom: 10px;}
.iwScrapTable .pull-right	{margin-left: 5px;}
.iwScrapTable th	{padding: 7px 15px; font-size: 11px; text-align: left;}
.iwScrapTable button.text	{text-decoration: none;}

.iwMemberTable select	{margin-bottom: 3px;}

.modifyPass div	{padding-bottom: 5px;}
.modifyPass .iText	{width: 200px;}

.agreement	{margin-bottom: 20px;}
.agreement .text	{padding: 15px; height: 150px; overflow: auto;  line-height: 180%;}
.agreement .confirm	{margin-top: 10px;}
.help-inline	{display: inline; padding-left: 10px;}


/* moduleStyle - communication 
--------------------------------------------------------------------------*/
.messageControl	{float: right;}
.messageControl form	{float: left;}
.messageControl .select,
.friendBtArea .select	{float: left; padding: 4px 0 0 4px; width: 78px; height: 20px; overflow: hidden; margin-right: 5px; }
.messageControl select,
.friendBtArea select	{width: 102px; border: none; font-size: 10px; -webkit-appearance: none; outline: none;}
.messageControl .bt,
.friendBtArea .bt	{float: left; margin-right: 5px;}

.messageTable	{clear: both; width: 100%;}
.messageTable .imgAuthor	{padding-right: 10px; margin-right: 10px;}
.messageTable th	{padding: 20px 20px 10px; font-size: 14px; text-align: left;}
.messageTable td.messageInfo	{padding: 0 20px 20px;}
.messageTable td.messageCon	{padding: 30px 20px;}




/* global style */
.listSummary	{font-size: 12px; line-height: 1.6em;}
.listTitle	{font-size: 12px; font-weight: bold;}
.sidebar .module	{margin-bottom: 30px;}
.sidebar .sb	{margin-bottom: 10px; font-size: 0;}
.eng11	{font: 11px "Trebuchet MS";}
.eng10	{font: 11px "Trebuchet MS";}

.bt	{padding: 5px 8px; }
.bt a	{line-height: 24px;}
.bt a,
.bt input,
.bt button	{font-size: 11px; font-weight: normal;}
.bt button,
.bt input	{border: none; background: none; cursor: pointer; padding: 0; margin: 0; overflow: visible;}

.fl	{float: left;}
.fr	{float: right;}

.mt15	{margin-top: 15px;}

.iText	{ padding: 0 0 0 5px; height: 24px;border: none; line-height: 24px; }
.iLabel	{padding: 5px 0 0 7px;}
.iCheck	{margin: 0; vertical-align: middle;}




/* full clearfix */
/* add to floating elements which shall clear floating after themselves */ 
* html .clearfix {
    height: 1%; /* IE5-6 */
}
*+html .clearfix {
	display: inline-block; /* IE7not8 */
}
.clearfix:after { /* FF, IE8, O, S, etc. */
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}