@charset "UTF-8";
#page-group #timeline div.more a.ui-loading { background: #fff url('../images/common/loading_16.gif') no-repeat 50% 50%; }

#page-group #contents div.loading, div#page-group-list section#contents div.loading, #page-group-edit #contents div.loading { background: #fff url('../images/common/loading_32.gif') no-repeat 50% 50%; }

#page-group #contents, div#page-group-list section#contents, #page-group-edit #contents { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #fff; border: 1px solid #d6dee5; position: relative; float: none; /* TODO style.cssで.columnが宣言されている分の打ち消し */ margin: 0 0 10px; padding: 10px 0 0; }
#page-group #contents h1, div#page-group-list section#contents h1, #page-group-edit #contents h1 { margin: 0 20px; font-size: 16px; font-weight: bold; line-height: 30px; }
#page-group #contents section.articles, div#page-group-list section#contents section.articles, #page-group-edit #contents section.articles { margin-top: 30px; padding: 0; }
#page-group #contents section.articles ul.images li.image, div#page-group-list section#contents section.articles ul.images li.image, #page-group-edit #contents section.articles ul.images li.image { float: left; overflow: auto; width: 164px; /* (968 - 14 * 2) / 5 - 10 * 2 */ height: 250px; margin: 0 10px; text-align: center; }
#page-group #contents section.articles ul.images li.image a, div#page-group-list section#contents section.articles ul.images li.image a, #page-group-edit #contents section.articles ul.images li.image a { display: block; text-decoration: none; color: #555; }
#page-group #contents section.articles ul.images li.image a:visited, div#page-group-list section#contents section.articles ul.images li.image a:visited, #page-group-edit #contents section.articles ul.images li.image a:visited { color: #999; }
#page-group #contents section.articles ul.images li.image a:hover img, div#page-group-list section#contents section.articles ul.images li.image a:hover img, #page-group-edit #contents section.articles ul.images li.image a:hover img { border-color: #258fb8; }
#page-group #contents section.articles ul.images li.image a:hover h1, div#page-group-list section#contents section.articles ul.images li.image a:hover h1, #page-group-edit #contents section.articles ul.images li.image a:hover h1 { text-decoration: underline; }
#page-group #contents section.articles ul.images li.image a img, div#page-group-list section#contents section.articles ul.images li.image a img, #page-group-edit #contents section.articles ul.images li.image a img { padding: 2px; vertical-align: middle; border: 1px solid #ddd; }
#page-group #contents section.articles ul.images li.image a h1, div#page-group-list section#contents section.articles ul.images li.image a h1, #page-group-edit #contents section.articles ul.images li.image a h1 { font-size: 12px; font-weight: bold; line-height: normal; color: #555; }
#page-group #contents section.articles ul.images li.image p, div#page-group-list section#contents section.articles ul.images li.image p, #page-group-edit #contents section.articles ul.images li.image p { margin: 0; font-size: 11px; line-height: normal; }
#page-group #contents section.articles ul.images li.image p a, div#page-group-list section#contents section.articles ul.images li.image p a, #page-group-edit #contents section.articles ul.images li.image p a { color: #555; }
#page-group #contents div.status, div#page-group-list section#contents div.status, #page-group-edit #contents div.status { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; clear: both; width: auto; margin: 0 auto; text-align: center; line-height: 250px; background-color: #eee; margin: 0 30px; color: tomato; }
#page-group #contents div.loading, div#page-group-list section#contents div.loading, #page-group-edit #contents div.loading { clear: both; height: 250px; }
#page-group #contents div.more, div#page-group-list section#contents div.more, #page-group-edit #contents div.more { clear: both; padding: 15px 15px 10px; }
#page-group #contents div.more a, div#page-group-list section#contents div.more a, #page-group-edit #contents div.more a, #page-group #contents div.more p, div#page-group-list section#contents div.more p, #page-group-edit #contents div.more p { -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; margin: 0 auto; display: block; line-height: 34px; text-align: center; color: #258fb8; border: 2px solid #eee; cursor: pointer; }
#page-group #contents div.more a:hover, div#page-group-list section#contents div.more a:hover, #page-group-edit #contents div.more a:hover, #page-group #contents div.more p:hover, div#page-group-list section#contents div.more p:hover, #page-group-edit #contents div.more p:hover { border-color: #ddd; }

.restrict { position: absolute; z-index: 1; height: 22px; width: 22px; }
.restrict > div { display: inline-block; width: 18px; height: 18px; margin: 2px; overflow: hidden; }
.restrict > div.mypic { background-repeat: no-repeat; background-image: url("../images/sprite-2nd.png?20120528"); background-position: -600px -520px; background-color: transparent; }
.restrict > div.close { background-repeat: no-repeat; background-image: url("../images/sprite-2nd.png?20120528"); background-position: -640px -520px; background-color: transparent; }
.restrict > div.r-18 { background-repeat: no-repeat; background-image: url("../images/sprite-2nd.png?20120528"); background-position: -680px -520px; background-color: transparent; }
.restrict > div.r-18g { background-repeat: no-repeat; background-image: url("../images/sprite-2nd.png?20120528"); background-position: -720px -520px; background-color: transparent; }

.unselectable { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; user-select: none; }

ul.container-breadcrumbs { margin: 0 20px 10px; }
ul.container-breadcrumbs li { display: inline; }

.ui-selectbox { position: relative; padding: 0 10px; line-height: 26px; cursor: pointer; }
.ui-selectbox:hover span { text-decoration: underline; }
.ui-selectbox:hover ul { display: block; }
.ui-selectbox ul { display: none; position: absolute; z-index: 10000; left: 0; width: 118px; margin: -2px auto 0; text-align: left; background-color: #fff; border: 1px solid #becad7; outline: 1px solid #fff; }
.ui-selectbox ul.ceil { margin: 0 auto -2px; bottom: 0; }
.ui-selectbox ul li { display: block; margin: 0; padding: 0 9px; font-size: 14px; line-height: 2; color: #777; cursor: pointer; border-left: none !important; border-right: none !important; }
.ui-selectbox ul li a { display: block; margin: 0 -9px; padding: 0 9px; color: #777; }
.ui-selectbox ul li a:hover { text-decoration: none; }
.ui-selectbox ul li:hover { background-color: #eee; }
.ui-selectbox ul li.current { font-weight: normal; background-color: #eee; cursor: default; }

#image-modal.ui-modal-container .content { text-align: center; }
#image-modal.ui-modal-container .content > a { display: block; }
#image-modal.ui-modal-container .detail { position: absolute; bottom: 20px; left: 0; width: 100%; text-align: left; background-color: rgba(255, 255, 255, 0.8); }
#image-modal.ui-modal-container .detail h1, #image-modal.ui-modal-container .detail p { margin: 10px 40px; font-size: 12px; line-height: 1; }
#image-modal.ui-modal-container .detail h1 a, #image-modal.ui-modal-container .detail p a { color: #555; }
#image-modal.ui-modal-container .detail h1 { font-size: 24px; }
#image-modal.ui-modal-container .detail img { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; margin-right: 3px; }

#page-group .reply-to { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; display: inline-block; margin: 5px; padding: 0 0 0 5px; font-size: 12px; color: #555; border: 1px solid #d6dee5; background-color: #f2f4f6; }
#page-group .reply-to.hidden { display: none; }
#page-group .action-cancel-reply { display: inline-block; width: 8px; height: 18px; margin-left: 5px; padding: 0 8px; vertical-align: -5px; background: url('../images/inline/close.png') no-repeat 50% 50%; border-left: 1px dashed #d6dee5; cursor: pointer; }
#page-group .action-like, #page-group .action-add-comment, #page-group .action-reply { color: #3b5998; cursor: pointer; }
#page-group .action-like:hover, #page-group .action-add-comment:hover, #page-group .action-reply:hover { text-decoration: underline; }
#page-group #contents { width: 782px; }
#page-group header { padding: 0; margin-top: -10px; border-bottom: 1px solid #d6dee5; }
#page-group header .share-button { float: right; margin-top: 4px; }
#page-group header div.cover { -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px; border-radius: 5px 5px 0 0; position: relative; height: 55px; background-color: #f2f4f6; background-size: 100% auto; background-repeat: repeat-y; border-bottom: 1px solid #d6dee5; }
#page-group header div.cover.dragging { cursor: pointer; }
#page-group header div.cover.has-cover { height: 160px; }
#page-group header div.cover.has-cover ul { display: none; }
#page-group header div.cover.has-cover:hover ul { display: block; }
#page-group header div.cover ul { position: absolute; right: 20px; top: 15px; }
#page-group header div.cover li { color: #258fb8; cursor: pointer; display: inline-block; margin-left: 1px; padding: 5px 10px; line-height: 1; background-color: rgba(255, 255, 255, 0.7); }
#page-group header div.cover li:hover { text-decoration: underline; }
#page-group header div.cover li.reposition { -moz-border-radius: 11px 0 0 11px; -webkit-border-radius: 11px; border-radius: 11px 0 0 11px; padding-left: 15px; }
#page-group header div.cover li.reposition + .select { -moz-border-radius: 0 11px 11px 0; -webkit-border-radius: 0; border-radius: 0 11px 11px 0; }
#page-group header div.cover li.select { -moz-border-radius: 11px; -webkit-border-radius: 11px; border-radius: 11px; padding-right: 15px; }
#page-group header div.cover li:hover { text-decoration: none; background-color: rgba(255, 255, 255, 0.9); }
#page-group header div.cover form { display: inline; }
#page-group header div.cover .input-cover { position: absolute; top: 0; left: 0; visibility: hidden; width: 0; height: 0; }
#page-group header .edit-cover, #page-group header .edit-complete-cover { display: none; }
#page-group header .edit-cover div, #page-group header .edit-complete-cover div { -moz-border-radius: 11px; -webkit-border-radius: 11px; border-radius: 11px; position: absolute; left: 20px; top: 15px; padding: 5px 15px; }
#page-group header .edit-cover ul, #page-group header .edit-complete-cover ul { position: absolute; right: 20px; top: 15px; }
#page-group header .edit-cover li, #page-group header .edit-complete-cover li { color: #258fb8; cursor: pointer; display: inline-block; margin-left: 1px; padding: 5px 10px; }
#page-group header .edit-cover li:hover, #page-group header .edit-complete-cover li:hover { text-decoration: underline; }
#page-group header .edit-cover li.cancel, #page-group header .edit-complete-cover li.cancel { -moz-border-radius: 11px 0 0 11px; -webkit-border-radius: 11px; border-radius: 11px 0 0 11px; padding-left: 15px; }
#page-group header .edit-cover li.apply, #page-group header .edit-complete-cover li.apply { -moz-border-radius: 0 11px 11px 0; -webkit-border-radius: 0; border-radius: 0 11px 11px 0; padding-right: 15px; font-weight: bold; background-color: rgba(255, 255, 255, 0.8); }
#page-group header .edit-cover li.apply:hover, #page-group header .edit-complete-cover li.apply:hover { background-color: #fff; }
#page-group header .edit-cover li:hover, #page-group header .edit-complete-cover li:hover { text-decoration: none; background-color: rgba(255, 255, 255, 0.9); }
#page-group header .edit-cover div, #page-group header .edit-cover li, #page-group header .edit-complete-cover div, #page-group header .edit-complete-cover li { font-size: 12px; line-height: 1; background-color: rgba(255, 255, 255, 0.7); }
#page-group header .edit-complete-cover div { left: auto; right: 20px; color: #408000; }
#page-group header div.body { padding: 12px 20px 15px; position: relative; }
#page-group header div.body a.groupicon { -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3); display: block; position: absolute; overflow: hidden; top: -42px; width: 70px; height: 70px; padding: 5px; line-height: 70px; background: white; }
#page-group header div.body h1 { margin: 0 0 0 100px !important; font-size: 20px !important; }
#page-group header div.body h1 a { color: black; }
#page-group header div.body > form input[type="submit"], #page-group header div.body a.button { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); display: inline-block; padding: 0 10px; line-height: 25px; border: 1px solid #BECAD7; cursor: pointer; background: -moz-linear-gradient(top, white, #E9EDF2); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E9EDF2)); float: right; }
#page-group header div.body > form input[type="submit"]:hover, #page-group header div.body a.button:hover { border-color: #748BA3; text-decoration: none; }
#page-group header div.body .ui-selectbox { float: right; margin: 2px -10px 0 0; font-size: 14px; }
#page-group header div.body .info { margin: 10px 0 0 0; width: auto; background-color: #F2F4F6; padding: 10px 15px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#page-group header div.body .info .ui-expander-container { max-height: 120px; margin-top: 5px; line-height: 20px; }
#page-group header div.body .info .expand { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YyZjRmNiIgc3RvcC1vcGFjaXR5PSIwLjAiLz48c3RvcCBvZmZzZXQ9IjcyJSIgc3RvcC1jb2xvcj0iI2YyZjRmNiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2YyZjRmNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(242, 244, 246, 0)), color-stop(72%, #f2f4f6), color-stop(100%, #f2f4f6)); background-image: -moz-linear-gradient(top, rgba(242, 244, 246, 0) 0%, #f2f4f6 72%, #f2f4f6 100%); background-image: -webkit-linear-gradient(top, rgba(242, 244, 246, 0) 0%, #f2f4f6 72%, #f2f4f6 100%); background-image: linear-gradient(to bottom, rgba(242, 244, 246, 0) 0%, #f2f4f6 72%, #f2f4f6 100%); }
#page-group header div.body .info span + span:before { content: "|"; margin: 0 3px; color: #CCC; }
#page-group header div.body .info span.publish-status { color: #3B3B3B; }
#page-group header div.body .info span.publish-status.close:before, #page-group header div.body .info span.publish-status.secret:before { font-family: 'PixivIconsRegular'; content: "a"; display: inline-block; font-size: 16px; height: 15px; padding: 0 4px 0 0; color: #809DB8; line-height: 1.4em; }
#page-group header div.body .info .tags { margin: 0 0 0 7px; padding: 0 0 0 6px; border-left: 1px solid #CCC; display: inline; }
#page-group header div.body .info .tags:before { font-family: 'PixivIconsRegular'; content: "c"; display: inline-block; font-size: 16px; height: 15px; padding: 0 4px 0 0; color: #809DB8; }
#page-group header div.body .info .tags li { display: inline-block; }
#page-group header div.body .info .tags li:first-child:before { content: "タグ :"; padding: 0 4px 0 0; }
#page-group header div.body .info .tags li + li:before { content: '/'; margin-right: 5px; color: #ccc; margin: 0 3px; }
#page-group #contents > div { display: table; }
#page-group #contents > div.invited { padding: 100px 0; text-align: center; width: 100%; }
#page-group #contents > div.invited form input[type="submit"] { margin: 10px 0 0 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); display: inline-block; padding: 0 10px; line-height: 25px; border: 1px solid #BECAD7; cursor: pointer; background: -moz-linear-gradient(top, white, #E9EDF2); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E9EDF2)); }
#page-group #contents > div.invited form input[type="submit"]:hover { border-color: #748BA3; text-decoration: none; }
#page-group #timeline { width: 535px; display: table-cell; vertical-align: top; border-right: 1px solid #d6dee5; padding: 0 0 15px; }
#page-group #timeline .info { width: auto; margin: 0; background-color: #f2f4f6; }
#page-group #timeline .info a { display: block; line-height: 30px; text-align: center; }
#page-group #timeline div.inputbox { padding: 20px 23px 20px 25px; border-bottom: 1px solid #d6dee5; *zoom: 1; }
#page-group #timeline div.inputbox:after { content: ""; display: table; clear: both; }
#page-group #timeline div.inputbox ._user-icon { float: left; margin: 0 15px 0 0; }
#page-group #timeline div.inputbox form { float: left; width: 420px; border: 1px solid #BECAD7; padding: 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset; -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2) inset; }
#page-group #timeline div.inputbox form .work-detail-container { display: none; background-color: #f2f4f6; }
#page-group #timeline div.inputbox form .work-detail-container .work-detail { position: relative; height: 156px; padding: 5px 15px 5px 181px; color: #555; }
#page-group #timeline div.inputbox form .work-detail-container .work-detail .thumbnail { position: absolute; left: 15px; width: 156px; margin: 0; text-align: right; }
#page-group #timeline div.inputbox form .work-detail-container .work-detail .thumbnail img { display: inline; margin: 0; padding: 2px; background-color: #fff; border: 1px solid #ddd; }
#page-group #timeline div.inputbox form .work-detail-container .work-detail h1 { margin: 0; line-height: 1.5; }
#page-group #timeline div.inputbox form .work-detail-container .work-detail p img { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; margin-right: 2px; }
#page-group #timeline div.inputbox form .work-detail-container .recently-viewed-header { padding: 5px; font-size: 12px; }
#page-group #timeline div.inputbox form .work-detail-container .recently-viewed { padding: 5px; }
#page-group #timeline div.inputbox form .work-detail-container .recently-viewed-item { width: 50px; height: 50px; text-align: center; display: table-cell; vertical-align: middle; cursor: pointer; }
#page-group #timeline div.inputbox form .work-detail-container .recently-viewed-item img { border: solid #888 1px; max-height: 50px; max-width: 50px; }
#page-group #timeline div.inputbox form .work-detail-container .recently-viewed-item img:hover { border-color: green; }
#page-group #timeline div.inputbox form.focus { -moz-box-shadow: 0 0 8px 0 rgba(82, 168, 236, 0.6); -webkit-box-shadow: 0 0 8px 0 rgba(82, 168, 236, 0.6); box-shadow: 0 0 8px 0 rgba(82, 168, 236, 0.6); border: 1px solid #56b4ef; }
#page-group #timeline div.inputbox form.focus .inputtextarea textarea { resize: vertical; }
#page-group #timeline div.inputbox form.focus .inputtextarea .hint { display: block; }
#page-group #timeline div.inputbox form.focus .work-detail-container { display: block; }
#page-group #timeline div.inputbox .inputtextarea textarea { width: 410px; height: 38px; margin: 5px; padding: 0; font-size: 15px; resize: none; background-color: white; outline: none; border: none; }
#page-group #timeline div.inputbox .inputtextarea .hint { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; display: none; position: relative; margin: 0 5px 5px; padding: 5px 10px; font-size: 12px; color: #555; background-color: #f2f4f6; }
#page-group #timeline div.inputbox .inputtextarea .hint:before { display: block; position: absolute; top: -5px; left: 15px; width: 0; height: 0; margin-left: -5px; border-width: 5px; border-top-width: 0; border-color: #f2f4f6 transparent; border-style: solid; content: ''; }
#page-group #timeline div.inputbox .inputtextarea .hint .close { position: absolute; top: 3px; right: 3px; width: 14px; height: 14px; background: url("../images/common/icon_remove.png") no-repeat 0 -14px; cursor: pointer; }
#page-group #timeline div.inputbox .inputtextarea .hint ul { line-height: 20px; }
#page-group #timeline div.inputbox .inputtextarea .hint ul li { list-style-type: circle; margin-left: 16px; }
#page-group #timeline div.inputbox .attachmentbar { *zoom: 1; border-top: 1px dashed #BECAD7; display: none; padding: 5px; height: 27px; font-size: 12px; }
#page-group #timeline div.inputbox .attachmentbar:after { content: ""; display: table; clear: both; }
#page-group #timeline div.inputbox .attachmentbar div { cursor: pointer; }
#page-group #timeline div.inputbox .attachmentbar div.imgadd { display: inline-block; height: 25px; }
#page-group #timeline div.inputbox .attachmentbar div.imgadd:before { font-family: 'PixivIconsRegular'; content: "v"; color: #809DB8; font-size: 21px; vertical-align: -20%; margin: 0 5px; }
#page-group #timeline div.inputbox .attachmentbar div.imgadd.active { background-color: #4B7EAD; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; color: white; padding: 0 7px 0 5px; }
#page-group #timeline div.inputbox .attachmentbar div.imgadd.active:before { color: white; }
#page-group #timeline div.inputbox .attachmentbar div.imgpaint { display: inline-block; height: 25px; }
#page-group #timeline div.inputbox .attachmentbar div.imgpaint:before { font-family: 'PixivIconsRegular'; content: "w"; color: #809DB8; font-size: 19px; vertical-align: -16%; margin: 0 3px 0 0; }
#page-group #timeline div.inputbox .attachmentbar div.imgpaint.active { background-color: #4B7EAD; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; color: white; padding: 0 7px 0 5px; }
#page-group #timeline div.inputbox .attachmentbar div.imgpaint.active:before { color: white; }
#page-group #timeline div.inputbox .attachmentbar div + div { margin-left: 5px; }
#page-group #timeline div.inputbox .attachmentbar input[type="file"] { width: 30px; }
#page-group #timeline div.inputbox .attachmentbar input[type="submit"] { float: right; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); display: inline-block; padding: 0 10px; line-height: 25px; border: 1px solid #BECAD7; cursor: pointer; background: -moz-linear-gradient(top, white, #E9EDF2); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E9EDF2)); }
#page-group #timeline div.inputbox .attachmentbar input[type="submit"]:hover { border-color: #748BA3; text-decoration: none; }
#page-group #timeline div.inputbox .filecontainer { display: none; border-top: 1px dashed #BECAD7; background-color: #F2F4F6; z-index: 1; padding: 10px; }
#page-group #timeline div.inputbox .paintcontainer { border-top: 1px dashed #BECAD7; padding: 0; z-index: 1; display: none; background-color: #F2F4F6; }
#page-group #timeline div.inputbox .paintcontainer .drawr-paint { *zoom: 1; }
#page-group #timeline div.inputbox .paintcontainer .drawr-paint:after { content: ""; display: table; clear: both; }
#page-group #timeline div.inputbox .paintcontainer .drawr-tools { padding: 5px 5px 20px 5px; text-align: center; }
#page-group #timeline div.inputbox .paintcontainer .cursor { display: inline-block; vertical-align: middle; }
#page-group #timeline div.inputbox .paintcontainer .cursor > div { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.3) inset; -webkit-box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.3) inset; box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.3) inset; border: 1px solid #BECAD7; width: 30px; height: 30px; display: table-cell; vertical-align: middle; text-align: center; background-color: white; background-image: url("../images/checkers.gif"); }
#page-group #timeline div.inputbox .paintcontainer .cursor > div .drawr-tool-curcolor { vertical-align: middle; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; display: inline-block; width: 20px; height: 20px; }
#page-group #timeline div.inputbox .paintcontainer .drawr-tool-width { background-color: #809DB8; -moz-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.3) inset; -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.3) inset; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.3) inset; width: 45px; height: 4px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; display: inline-block; margin: 4px 0; border: 10px solid rgba(255, 255, 255, 0.75); vertical-align: middle; }
#page-group #timeline div.inputbox .paintcontainer .nob { position: relative; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5); background: -webkit-gradient(linear, left top, left bottom, from(#648EB5), color-stop(50%, #648EB5), color-stop(50%, #4B7EAD), to(#4B7EAD)); background: -moz-linear-gradient(top, #648EB5, #648EB5 50%, #4B7EAD 50%, #4B7EAD); width: 12px; height: 12px; margin-top: -7px; margin-left: -8px; border: 2px solid white; display: block; }
#page-group #timeline div.inputbox .paintcontainer .drawr-tool-width + div { display: inline-block; background-color: #E0E7EE; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; width: 24px; height: 24px; vertical-align: middle; }
#page-group #timeline div.inputbox .paintcontainer .drawr-tool-width + div input { margin: 2px 0 0 0; }
#page-group #timeline div.inputbox .paintcontainer .drawr-tool-color { display: inline-block; width: 14px; height: 21px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; vertical-align: middle; margin: 0 0 0 2px; }
#page-group #timeline div.inputbox .paintcontainer .drawr-canvases { overflow: auto; background-color: #F1F1F1; -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); }
#page-group #timeline div.inputbox .paintcontainer .drawr-functions { padding: 20px 0; text-align: center; }
#page-group #timeline div.inputbox .paintcontainer .drawr-functions input { text-shadow: 0 1px 0 #fff; width: 25px; height: 30px; padding: 0; font-family: 'PixivIconsRegular'; font-size: 22px; border: none; background: transparent; color: #809DB8; }
#page-group #timeline div.inputbox .paintcontainer .drawr-functions input:hover { color: #4B7EAD; }
#page-group #timeline li.post { padding: 20px; font-size: 15px; position: relative; width: auto; margin: 0; border-top: none; *zoom: 1; }
#page-group #timeline li.post:hover > .action { display: block; }
#page-group #timeline li.post + li.post { border-top: 1px solid #d6dee5; }
#page-group #timeline li.post:last-child { border-bottom: 1px solid #d6dee5; }
#page-group #timeline li.post.imgpost { color: black; }
#page-group #timeline li.post > div:nth-last-child(2) { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }
#page-group #timeline li.post.new:before { display: block; position: absolute; top: 0; left: 0; width: 0; height: 0; margin-left: 0; border-top-width: 30px; border-right-width: 30px; border-bottom-width: 0; border-left-width: 0; border-color: #FFEF8A transparent; border-style: solid; content: ''; }
#page-group #timeline li.post div.start { text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 5px solid #D6DEE5; padding: 13px 0 10px; }
#page-group #timeline li.post div.start p { font-weight: bold; font-size: 16px; }
#page-group #timeline li.post div.start span { color: #808080; font-size: 12px; }
#page-group #timeline li.post div.imagecontainer { float: right; margin: 0 0 20px 15px; padding: 0; position: relative; min-height: 100px; min-width: 178px; overflow: hidden; background: #F2F4F6; text-align: center; }
#page-group #timeline li.post div.imagecontainer ._work { margin-bottom: 0; }
#page-group #timeline li.post div.imagecontainer .action-open-image { cursor: pointer; }
#page-group #timeline li.post div.imagecontainer .detail { position: absolute; bottom: 0; left: 0; width: 100%; padding: 5px 0; background-color: rgba(255, 255, 255, 0.8); text-align: left; }
#page-group #timeline li.post div.imagecontainer .detail h1, #page-group #timeline li.post div.imagecontainer .detail .user-meta { margin: 0 5px; font-size: 12px; line-height: 16px; }
#page-group #timeline li.post div.imagecontainer .detail h1 a, #page-group #timeline li.post div.imagecontainer .detail .user-meta a { color: #555; }
#page-group #timeline li.post div.imagecontainer .detail ._user-icon { margin-right: 2px; }
#page-group #timeline li.post div.imagecontainer .restrict { bottom: 0; right: 0; }
#page-group #timeline li.post div.imagecontainer + div { *zoom: 1; }
#page-group #timeline li.post div.imagecontainer + div:after { content: ""; display: table; clear: both; }
#page-group #timeline li.post div.imagecontainer.paint { float: none; width: 420px; margin: 0 10px 0 0; }
#page-group #timeline li.post div.imagecontainer.paint + div.postbody { min-height: initial; }
#page-group #timeline li.post div.imagecontainer.paint + div.postbody > span span.aa { display: block; margin: 0; }
#page-group #timeline li.post div.imagecontainer.paint + div.postbody > span + div { display: inline; }
#page-group #timeline li.post > ._user-icon { margin: 0 15px 0 0; }
#page-group #timeline li.post ._user-icon { float: left; }
#page-group #timeline li.post div.postbody { padding: 0 0 0 65px; min-height: 50px; word-wrap: normal; width: 420px; }
#page-group #timeline li.post div.postbody + div.comment, #page-group #timeline li.post div.postbody + div.inputbox { margin: 20px 0 0; border-top-left-radius: 5px; border-top-right-radius: 5px; }
#page-group #timeline li.post div.postbody + div.comment:before, #page-group #timeline li.post div.postbody + div.inputbox:before { display: block; position: absolute; top: -6px; left: 245px; width: 0; height: 0; margin-left: -6px; border-top-width: 0; border-right-width: 6px; border-bottom-width: 6px; border-left-width: 6px; border-color: #E8F0F6 transparent; border-style: solid; content: ''; }
#page-group #timeline li.post div.postbody .ui-expander-container { max-height: 500px; }
#page-group #timeline li.post div.postbody .expand { padding: 20px 0 0; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjAiLz48c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(50%, #ffffff), color-stop(100%, #ffffff)); background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #ffffff 50%, #ffffff 100%); background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #ffffff 50%, #ffffff 100%); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 50%, #ffffff 100%); }
#page-group #timeline li.post div.postbody .expand div { padding: 15px 0 5px; }
#page-group #timeline li.post div.postbody .body { position: relative; overflow: hidden; word-break: break-all; word-wrap: break-word; }
#page-group #timeline li.post div.postbody .body pre.aa { width: 420px; white-space: pre; overflow-x: auto; overflow-y: hidden; word-wrap: normal; font-family: IPAMonaPGothic, "IPA モナー Pゴシック", Monapo, Mona, "MS PGothic", "ＭＳ Ｐゴシック", sans-serif; font-size: 12px; line-height: 12px; padding: 5px 0; }
#page-group #timeline li.post div.postbody .meta { margin-top: 5px; font-size: 11px; line-height: 18px; color: #999; }
#page-group #timeline li.post div.postbody .meta a { color: #999; }
#page-group #timeline li.post div.postbody .meta span { display: inline !important; }
#page-group #timeline li.post div.postbody .meta li { display: inline; margin-right: 8px; }
#page-group #timeline li.post div.postbody .meta li.date { margin: 0; }
#page-group #timeline li.post div.postbody .meta li.user:before { content: " by "; }
#page-group #timeline li.post div.postbody .meta li.like .count, #page-group #timeline li.post div.postbody .meta li.comment .count { display: inline; margin-right: 4px; color: #999; font-weight: bold; }
#page-group #timeline li.post div.postbody .meta li.like .count:before, #page-group #timeline li.post div.postbody .meta li.comment .count:before { font-family: 'PixivIconsRegular'; content: "C"; font-size: 14px; display: inline-block; margin: 0 2px 0 0; color: #ffa300; vertical-align: -2px; }
#page-group #timeline li.post div.postbody .meta li.like { position: relative; }
#page-group #timeline li.post div.postbody .meta li.like .count { cursor: pointer; }
#page-group #timeline li.post div.postbody .meta li.like .count:hover:before { color: #ff8a00; }
#page-group #timeline li.post div.postbody .meta li.like .likes { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; display: none; position: absolute; bottom: 22px; padding: 3px; color: #fff; background-color: rgba(153, 153, 153, 0.5); cursor: default; }
#page-group #timeline li.post div.postbody .meta li.like .likes:before { display: block; position: absolute; bottom: -8px; left: 50%; width: 0; height: 0; margin-left: -8px; border-width: 8px; border-bottom-width: 0; border-color: rgba(153, 153, 153, 0.5) transparent; border-style: solid; content: ''; }
#page-group #timeline li.post div.postbody .meta li.like .likes li { margin: 0; }
#page-group #timeline li.post div.postbody .meta li.like .likes li ._user-icon { margin: 2px; }
#page-group #timeline li.post div.postbody .meta li.comment .count:before { font-family: 'PixivIconsRegular'; content: "b"; font-size: 12px; vertical-align: 0; color: #69AFCA; }
#page-group #timeline li.post div.postbody .meta li.reply { display: inline-block; width: 150px; }
#page-group #timeline li.post div.comment { overflow: visible; position: relative; background-color: #F2F4F6; -moz-box-shadow: 0 3px 8px 0 rgba(0, 85, 171, 0.05) inset; -webkit-box-shadow: 0 3px 8px 0 rgba(0, 85, 171, 0.05) inset; box-shadow: 0 3px 8px 0 rgba(0, 85, 171, 0.05) inset; }
#page-group #timeline li.post div.comment .ui-expander-container { max-height: 250px; }
#page-group #timeline li.post div.comment .expand { padding: 30px 0 0; *zoom: 1; filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFF2F4F6', endColorstr='#FFF2F4F6'); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YyZjRmNiIgc3RvcC1vcGFjaXR5PSIwLjAiLz48c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2YyZjRmNiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2YyZjRmNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(242, 244, 246, 0)), color-stop(50%, #f2f4f6), color-stop(100%, #f2f4f6)); background-image: -moz-linear-gradient(top, rgba(242, 244, 246, 0) 0%, #f2f4f6 50%, #f2f4f6 100%); background-image: -webkit-linear-gradient(top, rgba(242, 244, 246, 0) 0%, #f2f4f6 50%, #f2f4f6 100%); background-image: linear-gradient(to bottom, rgba(242, 244, 246, 0) 0%, #f2f4f6 50%, #f2f4f6 100%); }
#page-group #timeline li.post div.comment .meta { margin-top: 5px; }
#page-group #timeline li.post div.comment a.more { font-size: 11px; display: block; padding: 5px; border-bottom: 1px dashed #D1E0E8; text-shadow: 0 1px 1px white; text-align: center; color: #3B5998; }
#page-group #timeline li.post div.comment a.more + div.post { border-top: 1px dashed white; }
#page-group #timeline li.post div.comment a.more span { font-weight: bold; }
#page-group #timeline li.post div.comment > * + div.new:before { top: -1px !important; }
#page-group #timeline li.post div.comment div.post { position: relative; padding: 10px 10px 10px 20px; border-bottom: 1px dashed #D1E0E8; border-top: none; width: auto; margin: 0; }
#page-group #timeline li.post div.comment div.post:hover > ul.action { display: block; }
#page-group #timeline li.post div.comment div.post + div.post { border-top: 1px dashed white; }
#page-group #timeline li.post div.comment div.post.new:before { display: block; position: absolute; top: 0; left: 0; width: 0; height: 0; margin-left: 0; border-top-width: 15px; border-right-width: 15px; border-bottom-width: 0; border-left-width: 0; border-color: #FFEF8A transparent; border-style: solid; content: ''; }
#page-group #timeline li.post div.comment div.post div.usericon { float: left; width: 30px; height: 30px; overflow: hidden; margin-bottom: 0; }
#page-group #timeline li.post div.comment div.post div.imagecontainer.paint { margin: 0; float: none; }
#page-group #timeline li.post div.comment div.post div.imagecontainer + div.postbody > div time { display: inline !important; }
#page-group #timeline li.post div.comment div.post div.postbody { padding: 0; font-size: 12px; margin: 0 0 0 45px; min-height: inherit; }
#page-group #timeline li.post div.comment div.post div.postbody div { line-height: 18px; max-width: 410px; }
#page-group #timeline li.post div.comment div.post div.postbody time { font-size: 11px; color: #999; }
#page-group #timeline li.post div.comment div.post div.postbody time:hover { text-decoration: none; }
#page-group #timeline li.post div.comment div.post ul.action { display: none; position: absolute; padding: 0; right: 10px; bottom: 10px; }
#page-group #timeline li.post div.comment div.post ul.action li { display: inline; margin-left: 8px; font-size: 11px; color: #becad7; line-height: 18px; cursor: pointer; }
#page-group #timeline li.post div.comment div.post ul.action li:hover { text-decoration: underline; }
#page-group #timeline li.post div.inputbox { display: none; border: none; padding: 5px 5px 5px 20px; margin: 1px 0 0; overflow: visible; background-color: #F2F4F6; position: relative; }
#page-group #timeline li.post div.inputbox div.usericon { float: left; width: 30px; height: 30px; overflow: hidden; background: transparent; margin-bottom: 0; }
#page-group #timeline li.post div.inputbox div.usericon img { display: none; }
#page-group #timeline li.post div.inputbox form { background-color: white; }
#page-group #timeline li.post div.inputbox form.focus textarea { min-height: 18px; height: auto; resize: vertical; }
#page-group #timeline li.post div.inputbox form.focus .hint, #page-group #timeline li.post div.inputbox form.focus .work-detail-container { display: block; }
#page-group #timeline li.post div.inputbox form textarea { width: 405px; font-size: 12px; height: 18px; margin: 5px; padding: 0; resize: none; background-color: white; outline: none; border: none; width: 410px; }
#page-group #timeline li.post div.inputbox form .hint { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; display: none; position: relative; margin: 0 5px 5px; padding: 5px 10px; font-size: 12px; color: #555; background-color: #f2f4f6; }
#page-group #timeline li.post div.inputbox form .hint:before { display: block; position: absolute; top: -5px; left: 15px; width: 0; height: 0; margin-left: -5px; border-width: 5px; border-top-width: 0; border-color: #f2f4f6 transparent; border-style: solid; content: ''; }
#page-group #timeline li.post div.inputbox form .hint .close { position: absolute; top: 3px; right: 3px; width: 14px; height: 14px; background: url("../images/common/icon_remove.png") no-repeat 0 -14px; cursor: pointer; }
#page-group #timeline li.post div.inputbox form .hint ul { line-height: 20px; }
#page-group #timeline li.post div.inputbox form .hint ul li { list-style-type: circle; margin-left: 16px; }
#page-group #timeline li.post div.inputbox form .work-detail-container { display: none; background-color: #f2f4f6; }
#page-group #timeline li.post div.inputbox form .work-detail-container .work-detail { position: relative; height: 156px; padding: 5px 15px 5px 181px; color: #555; }
#page-group #timeline li.post div.inputbox form .work-detail-container .work-detail .thumbnail { position: absolute; left: 15px; width: 156px; margin: 0; text-align: right; }
#page-group #timeline li.post div.inputbox form .work-detail-container .work-detail .thumbnail img { display: inline; margin: 0; padding: 2px; background-color: #fff; border: 1px solid #ddd; }
#page-group #timeline li.post div.inputbox form .work-detail-container .work-detail h1 { margin: 0; line-height: 1.5; }
#page-group #timeline li.post div.inputbox form .work-detail-container .work-detail p img { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; margin-right: 2px; }
#page-group #timeline li.post div.inputbox form .work-detail-container .recently-viewed-header { padding: 5px; font-size: 12px; }
#page-group #timeline li.post div.inputbox form .work-detail-container .recently-viewed { padding: 5px; }
#page-group #timeline li.post div.inputbox form .work-detail-container .recently-viewed-item { width: 50px; height: 50px; text-align: center; display: table-cell; vertical-align: middle; cursor: pointer; }
#page-group #timeline li.post div.inputbox form .work-detail-container .recently-viewed-item img { border: solid #888 1px; max-height: 50px; max-width: 50px; }
#page-group #timeline li.post div.inputbox form .work-detail-container .recently-viewed-item img:hover { border-color: green; }
#page-group #timeline li.post div.action { display: none; padding: 0; position: absolute; top: -2px; right: 5px; text-align: right; }
#page-group #timeline li.post div.action span { background-repeat: no-repeat; background-image: url("../images/sprite-2nd.png?20120528"); background-position: -596px -430px; background-color: white; display: inline-block; width: 21px; height: 30px; -moz-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3); *zoom: 1; }
#page-group #timeline li.post div.action span:hover { -moz-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.7); box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.7); }
#page-group #timeline li.post div.action span:after { content: ""; display: table; clear: both; }
#page-group #timeline li.post div.action .action-box { -moz-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3); float: left; display: none; text-align: center; background-color: white; padding: 3px; }
#page-group #timeline li.post div.action .action-box li { border: none; background: transparent; font-size: 12px; padding: 3px 5px; cursor: pointer; }
#page-group #timeline li.post div.action .action-box li:hover { background: #EEEEEE; }
#page-group #timeline li.post:after { content: ""; display: table; clear: both; }
#page-group #timeline section.welcome { padding: 20px; }
#page-group #timeline section.welcome > section { padding: 0 0 0 170px; }
#page-group #timeline section.welcome > section h1 { color: #1A3E61; margin: 0; font-size: 18px; padding: 10px 0 0 0; line-height: 20px; }
#page-group #timeline section.welcome > section p { font-size: 13px; line-height: 20px; margin: 15px 0 0 0; }
#page-group #timeline section.welcome > section.first { background: url("../images/group/start_01.png") no-repeat; }
#page-group #timeline section.welcome > section.second { background: url("../images/group/start_02.png") no-repeat; }
#page-group #timeline section.welcome > section.third { background: url("../images/group/start_03.png") no-repeat; }
#page-group #timeline section.welcome > section + section { margin: 30px 0 0; }
#page-group #timeline section.caution { padding: 100px 20px; text-align: center; }
#page-group #timeline section.caution h1:before { background-repeat: no-repeat; background-image: url("../images/sprite-2nd.png?20120528"); background-position: -360px -680px; background-color: transparent; content: ""; display: block; margin: 0 auto 8px; }
#page-group #timeline section.caution form input[type="submit"] { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); display: inline-block; padding: 0 10px; line-height: 25px; border: 1px solid #BECAD7; cursor: pointer; background: -moz-linear-gradient(top, white, #E9EDF2); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E9EDF2)); margin: 10px 0 0 0; }
#page-group #timeline section.caution form input[type="submit"]:hover { border-color: #748BA3; text-decoration: none; }
#page-group #timeline div.more { padding: 15px 15px 10px; }
#page-group #timeline div.more a.ui-loading { border-color: #fff; text-indent: -9999px; }
#page-group .group-sidemenu { display: table-cell; vertical-align: top; width: 246px; }
#page-group .group-sidemenu section { padding: 15px; }
#page-group .group-sidemenu section + section { border-top: 1px solid #d6dee5; }
#page-group .group-sidemenu section h1 { font-size: 14px !important; line-height: normal !important; margin: 0 0 5px 0 !important; }
#page-group .group-sidemenu section h1 a { color: #666666; }
#page-group .group-sidemenu section h1 span { font-size: 10px; font-weight: normal; color: #555; }
#page-group .group-sidemenu section .users-grid { padding: 2px 12px 10px 4px; }
#page-group .group-sidemenu section .users-grid li { display: inline-block; margin-top: 8px; margin-left: 8px; }
#page-group .group-sidemenu section div.invite { margin: 10px 0 0 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #F2F4F6; padding: 10px 5px 10px 10px; position: relative; text-align: center; *zoom: 1; }
#page-group .group-sidemenu section div.invite span { display: block; text-align: left; }
#page-group .group-sidemenu section div.invite span span { padding: 3px 0; display: inline-block; color: #ddd; }
#page-group .group-sidemenu section div.invite span span:before { content: "?"; display: inline-block; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; background-color: #6B8EB2; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3); padding: 1px 4px 0; color: white; font-weight: bold; margin: 0 5px; line-height: 1.2em; font-size: 12px; }
#page-group .group-sidemenu section div.invite input { font-size: 11px; padding: 3px 0; width: 175px; float: left; margin: 0 3px 0 0; }
#page-group .group-sidemenu section div.invite div.action { text-align: right; margin: 2px 0 0 0; }
#page-group .group-sidemenu section div.invite div.action span.toggle-action { background-repeat: no-repeat; background-image: url("../images/sprite-2nd.png?20120528"); background-position: -597px -434px; background-color: transparent; display: inline-block; width: 19px; height: 19px; *zoom: 1; }
#page-group .group-sidemenu section div.invite div.action span.toggle-action:hover { background-color: white; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
#page-group .group-sidemenu section div.invite div.action span.toggle-action:after { content: ""; display: table; clear: both; }
#page-group .group-sidemenu section div.invite div.action div.action-box { display: none; text-align: center; border-top: 1px dotted #BECAD7; margin: 10px 0 0 0; padding: 5px 0 0 0; }
#page-group .group-sidemenu section div.invite div.action + div { border-top: 1px solid #D1E0E8; -moz-box-shadow: 0 1px 0 0 #fff inset; -webkit-box-shadow: 0 1px 0 0 #fff inset; box-shadow: 0 1px 0 0 #fff inset; margin: 5px 0 0 0; }
#page-group .group-sidemenu section div.invite div.action + div a { display: block; text-align: left; padding: 7px 0 0; }
#page-group .group-sidemenu section div.invite:after { content: ""; display: table; clear: both; }
#page-group .group-sidemenu section div.invite button { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); display: inline-block; padding: 0 10px; line-height: 25px; border: 1px solid #BECAD7; cursor: pointer; background: -moz-linear-gradient(top, white, #E9EDF2); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E9EDF2)); }
#page-group .group-sidemenu section div.invite button:hover { border-color: #748BA3; text-decoration: none; }
#page-group .group-sidemenu section .users-list li { position: relative; padding: 3px 0; line-height: 30px; font-size: 11px; *zoom: 1; }
#page-group .group-sidemenu section .users-list li + li { border-top: 1px dotted #D6DEE5; }
#page-group .group-sidemenu section .users-list li:after { content: ""; display: table; clear: both; }
#page-group .group-sidemenu section .users-list div { float: right; line-height: 28px; }
#page-group .group-sidemenu section .users-list form { display: inline-block; }
#page-group .group-sidemenu section .users-list input { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); display: inline-block; padding: 0 10px; line-height: 25px; border: 1px solid #BECAD7; cursor: pointer; background: -moz-linear-gradient(top, white, #E9EDF2); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E9EDF2)); font-size: 11px; padding: 0px 2px; line-height: normal; }
#page-group .group-sidemenu section .users-list input:hover { border-color: #748BA3; text-decoration: none; }
#page-group .group-sidemenu section .users-list a ._user-icon { vertical-align: middle; margin: 0 3px 0 0; float: left; }
#page-group .group-sidemenu section .users-list a div { float: none; display: inline-block; }
#page-group .group-sidemenu section ul.images { *zoom: 1; }
#page-group .group-sidemenu section ul.images:after { content: ""; display: table; clear: both; }
#page-group .group-sidemenu section ul.images li { display: inline; }
#page-group .group-sidemenu section ul.images a { position: relative; display: inline-block; overflow: hidden; float: left; width: 100px; height: 100px; margin: 0 5px 5px 0; text-align: center; }
#page-group .group-sidemenu section .events li, #page-group .group-sidemenu section .enquete li { border-top: 1px dotted #d6dee5; padding: 8px 0; }
#page-group .group-sidemenu section .activity { max-height: 300px; overflow: auto; margin: 0 -12px; }
#page-group .group-sidemenu section .activity li { font-size: 11px; line-height: 15px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; padding: 0 12px 8px; min-height: 31px; }
#page-group .group-sidemenu section .activity li + li { padding: 8px 12px; border-top: 1px dotted #d6dee5; }
#page-group .group-sidemenu section .activity li time { color: #999; font-size: 10px; display: inline-block; }
#page-group .group-sidemenu section .activity li ._user-icon { margin: 0 8px 0 0; float: left; }
#page-group .group-sidemenu section .activity li div:last-child { margin: 0 0 0 38px; }
#page-group .group-sidemenu section p.more { margin: 10px 0 0 0; text-align: right; }
#page-group #images { margin: 15px 0 0; }
#page-group #images .image-item { height: 176px; }
#page-group #images p.none { text-align: center; background-color: #F2F4F6; padding: 10px 15px; margin: 0 0 20px; }
#page-group #search-result { padding: 0 30px 0; }
#page-group #search-result .members, #page-group #search-result .requests-members { margin: 15px 0 15px 0; }
#page-group #search-result .members h1, #page-group #search-result .requests-members h1 { margin: 0 0 15px 0; }
#page-group #search-result .members ul, #page-group #search-result .requests-members ul { display: block; }
#page-group #search-result .members .userdata span a, #page-group #search-result .requests-members .userdata span a { font-size: 12px !important; font-weight: normal !important; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; max-width: 140px; }
#page-group #search-result .members .userdata span a:link, #page-group #search-result .requests-members .userdata span a:link { color: #333333; text-decoration: none; }
#page-group #search-result .members .userdata span a:visited, #page-group #search-result .requests-members .userdata span a:visited { color: #777777; text-decoration: none; }
#page-group #search-result .members .userdata span a:hover, #page-group #search-result .requests-members .userdata span a:hover { text-decoration: underline; }
#page-group #search-result .members .userdata span a:active, #page-group #search-result .requests-members .userdata span a:active { color: #333333; text-decoration: none; }
#page-group #search-result .members div.action input, #page-group #search-result .requests-members div.action input { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); display: inline-block; padding: 0 10px; line-height: 25px; border: 1px solid #BECAD7; cursor: pointer; background: -moz-linear-gradient(top, white, #E9EDF2); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E9EDF2)); margin: 5px 0 0 0; line-height: 19px; padding: 1px 7px; font-size: 12px; }
#page-group #search-result .members div.action input:hover, #page-group #search-result .requests-members div.action input:hover { border-color: #748BA3; text-decoration: none; }
#page-group #search-result .members div.action + input, #page-group #search-result .requests-members div.action + input { margin: 0 0 0 5px; }

div#page-group-list section#contents { width: 782px; }
div#page-group-list section#contents div.extaraNaviAlso { margin: 5px 0 0 0; }
div#page-group-list section#contents ul.group { display: block; margin: 15px 20px; }
div#page-group-list section#contents ul.group li { *zoom: 1; display: inline-block; padding: 13px 13px 13px 0; width: 230px; vertical-align: top; position: relative; }
div#page-group-list section#contents ul.group li:after { content: ""; display: table; clear: both; }
div#page-group-list section#contents ul.group li a { display: block; }
div#page-group-list section#contents ul.group li a:hover { text-decoration: none; }
div#page-group-list span.noticetip { position: absolute; top: 7px; left: -10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.3); box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.3); display: inline-block; font-family: "Lucida Grande", Tahoma, Verdana, Arial, "Hiragino Kaku Gothic Pro", Meiryo, "MS PGothic", sans-serif; font-size: 9px; font-weight: bold; color: #3B5998; background-color: #D8DFEA; padding: 0 4px 1px 3px; letter-spacing: -1px; margin: 0 0 0 5px; letter-spacing: 0; }
div#page-group-list div.group-icon { float: left; margin: 0 10px 0 0; width: 70px; height: 70px; border: 1px solid #DDD; border-radius: 5px; padding: 2px; }
div#page-group-list div.group-data { padding: 0 0 0 86px; }
div#page-group-list div.group-data h2 { font-size: 13px; font-weight: bold; vertical-align: top; word-break: break-all; word-wrap: break-word; }
div#page-group-list span.times { font-weight: normal; color: #999; }

#page-group-edit .page-group-title { margin: 0 0 10px !important; padding: 0 20px; border-bottom: 1px solid #d6dee5; }
#page-group-edit p.error { text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-color: #B51500; color: white !important; padding: 5px; margin: 0 0 10px 0; font-size: 13px; }
#page-group-edit form { margin: 0 20px; padding-bottom: 20px; }
#page-group-edit form dt, #page-group-edit form th { width: 140px; padding: 10px 5px 5px; text-align: right; }
#page-group-edit form dt:after, #page-group-edit form th:after { content: ':'; margin-left: 5px; color: #ccc; }
#page-group-edit form dt { float: left; clear: both; }
#page-group-edit form td, #page-group-edit form dd { padding: 10px 5px 5px; }
#page-group-edit form dd { margin-left: 150px; }
#page-group-edit form input[type="radio"], #page-group-edit form input[type="checkbox"] { margin: 0 4px 0 0; vertical-align: baseline; }
#page-group-edit form input[type="submit"] { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; display: inline-block; padding: 4px 10px; text-shadow: #fcfcf8 0 1px 2px; text-decoration: none; vertical-align: middle; font-size: 12px; font-weight: bold; line-height: 18px; /*  font-family: メイリオ, Meiryo, sans-serif;*/ color: #258fb8; text-align: center; background-color: #f1f1df; background-image: linear-gradient(to bottom, #fefefc, #e5e5c3); background-image: -moz-linear-gradient(top, #fefefc, #e5e5c3); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fefefc), color-stop(1, #e5e5c3)); filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr="#fefefc", EndColorStr="#e5e5c3"); border: 1px solid #cfe0e9; cursor: pointer; margin-top: 10px; margin-left: 150px; font-size: 14px; line-height: 20px; }
#page-group-edit form input[type="submit"]:hover { text-decoration: none; background-color: #f1f1df; background-image: linear-gradient(to bottom, #fcfcf8, #c6c674); background-image: -moz-linear-gradient(top, #fcfcf8, #c6c674); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fcfcf8), color-stop(1, #c6c674)); filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr="#fcfcf8", EndColorStr="#c6c674"); }
#page-group-edit form .ui-count-target { width: 288px; margin-right: 2px; }
#page-group-edit form textarea { width: 388px; }
#page-group-edit form .over { color: red; }
#page-group-edit form .ui-disabled { color: #aaa; }
#page-group-edit form .ui-disabled label { cursor: text; }
#page-group-edit form .icon { position: relative; min-height: 70px; }
#page-group-edit form .icon img { position: absolute; top: 10px; }
#page-group-edit form .icon .action-delete-icon { -moz-border-radius: 16px; -webkit-border-radius: 16px; border-radius: 16px; position: absolute; top: 0px; left: 65px; width: 16px; height: 16px; margin: 0; background: #000 url("../images/common/icon_remove.png") no-repeat 1px 1px; border: 2px solid #fff; cursor: pointer; }
#page-group-edit form .icon div { margin-left: 80px; }
#page-group-edit form .notes { margin-left: 16px; }
#page-group-edit form .notes.warning { color: tomato; }
#page-group-edit form .notes + .notes { margin-top: -0.5em; }
#page-group-edit form .error { padding: 3px 0; display: block; color: #B51500; }
#page-group-edit form .error:before { content: "!"; display: inline-block; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; background-color: #F03D25; border-top: 1px solid #E23923; border-bottom: 1px solid #C0311E; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3); padding: 0 6px; color: white; font-weight: bold; margin: 0 5px 0 0; line-height: 1.2em; }

section.join-group-modal h1 img { vertical-align: -10px; margin-right: 9px; }
section.join-group-modal .terms { overflow-y: scroll; overflow-x: hidden; max-height: 500px; margin-bottom: 40px; }
section.join-group-modal .terms h3 { font-size: 140%; font-weight: bold; padding: 4px 0px; }
section.join-group-modal .terms h4 { font-size: 120%; font-weight: bold; padding: 12px 0px 2px 0px; }
section.join-group-modal .terms-check { width: 40%; margin: 0px auto; }
section.join-group-modal input[type="submit"] { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.8); display: inline-block; padding: 0 10px; line-height: 25px; border: 1px solid #BECAD7; cursor: pointer; background: -moz-linear-gradient(top, white, #E9EDF2); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E9EDF2)); margin: 0px auto; width: 40%; display: block; }
section.join-group-modal input[type="submit"]:hover { border-color: #748BA3; text-decoration: none; }

.pickup-modal .introduction-modal { width: 282px; padding: 30px 30px 15px !important; font-weight: normal; }
.pickup-modal .label { margin: 0 0 10px; font-weight: bold; line-height: 1; }
.pickup-modal .handle { display: none; position: absolute; top: 4px; left: 0; border: 2px solid #fff; cursor: move; }
.pickup-modal .remove { position: absolute; top: 4px; right: 0; border: 2px solid #fff; cursor: pointer; }
.pickup-modal .item { position: relative; height: 32px; padding-left: 24px; background-color: #fff; border-top: 1px solid #d6dee5; }
.pickup-modal .item.ui-sortable-helper { border-bottom: 1px solid #d6dee5; }
.pickup-modal .item-title { width: 224px; height: 22px; margin-top: 4px; padding: 0 4px; line-height: 17px; vertical-align: middle; border: 1px solid #fff; }
.pickup-modal .item-title:hover { background-color: #ffffcc; }
.pickup-modal .item-title:focus { border-color: #becad7; }
.pickup-modal .add-container + ._notes { margin: 10px 0 0; }
.pickup-modal .add-container input { width: 272px; height: 22px; padding: 0 4px; line-height: 17px; }
.pickup-modal .add-container .add { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; width: 60px; margin-left: 2px; padding: 6px 0; font-size: 12px; font-weight: bold; color: #fff; line-height: 1; background-color: #0096db; border: none; cursor: pointer; }

._pickup-placeholder { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; padding: 10px; color: #777; background-color: #f5f5f5; }

.pickup-item + .pickup-item { margin-top: 2px; }
.pickup-item .comment-badge { margin-left: 4px; vertical-align: baseline; color: #ccc; }
.pickup-item .comment-badge:before { font-family: PixivIconsRegular; content: "b"; margin-right: 2px; }

.group-items { margin: 20px 0; margin-left: 25px; }

.group-item { display: inline-block; width: 296px; margin: 0 5px; vertical-align: top; }
.group-item:nth-child(n+4) { margin-top: 10px; padding-top: 10px; border-top: 1px solid #f5f5f5; }
.layout-a .group-item { width: 234px; }
.group-item .group { position: relative; display: block; min-height: 76px; padding: 5px 10px 5px 91px; }
.group-item .group:hover { text-decoration: none; }
.group-item .group:hover .title { text-decoration: underline; }
.group-item .count-badge { position: absolute; top: -2px; left: -6px; }
.group-item .icon-container { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; position: absolute; left: 5px; padding: 2px; border: 1px solid #f5f5f5; }
.group-item .icon-container ._icon { position: absolute; bottom: 3px; right: 3px; }
.group-item .group-icon { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.group-item .title { font-weight: bold; font-size: 14px; }
.group-item .meta { color: #555; }
.group-item .description { margin: 5px 0 0; color: #555; }
.group-item .member-count:before { font-family: PixivIconsRegular; content: "G"; padding-right: 2px; color: #809db8; }
.group-item .closed:before { font-family: PixivIconsRegular; content: "a"; padding-right: 2px; color: #809db8; }
