/*====================================================================================
	CONTENTS AREA SETTING
====================================================================================*/
/*
=== INDEX ===
* HEADLINE
* THUMBNAIL LIST
* PAGING
* MOVIE PLAYER
* MOVIE DETAIL
* SOCIAL BUTTON
* LECTURE
* STYLUS
*/
/*------------------------------------------------------------------------------------
	HEADLINE
------------------------------------------------------------------------------------*/
h2 {
	font-size: 21px;
	font-weight: normal;
	line-height: 1.25;
	width: 640px;
	height: 56px;
	padding: 8px;
	margin-bottom: 31px;
	border-top: 1px solid #D9E0E6;
	border-bottom: 1px solid #D9E0E6;
	display: table;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

h2 span:first-child {
	width: 100%;
	height: auto;
	vertical-align: middle;
	padding-left: 24px;
	background-image: url('/img/icon/h_img.png');
	background-position: left center;
	background-repeat: no-repeat;
	display: table-cell;
	word-wrap: break-word;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

span#suspended {
	background-image: none;
	display: inline;
	vertical-align: baseline;
	font-size: small;
	background-color: lightgray;
	color: white;
	border-radius: 10px;
	padding: 2px 8px;
	margin-left: 5px;
}

.work h3 {
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	line-height: 16px;
	width: 100%;
	height: auto;
	margin-bottom: 12px;
	display: table;
}

.work h3 img {
	vertical-align: top;
}

.work h3 span {
	margin-left: 4px;
}
/*------------------------------------------------------------------------------------
	HEADLINE END
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	SNS ACCOUNT & USER NAME SETTING
------------------------------------------------------------------------------------*/

.authorName a {
	height: 16px;
	vertical-align: text-top;
}

.authorName a:last-child {
	font-size: 16px;
	font-weight: bold;
	line-height: 1.25;
	width: 100%;
	height: auto;
	padding-left: 2px;
}

.user-name-twitter {
	color: #BDC3C7;
}

.work-author-profile-name-twitter {
	font-weight: bold;
}
/*------------------------------------------------------------------------------------
	SNS ACCOUNT & USER NAME SETTING END
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	THUMBNAIL LIST
------------------------------------------------------------------------------------*/
.block {
	width: 640px;
	height: auto;
	margin-bottom: 31px;
}

.work {
	width: 310px;
	height: auto;
	margin-right: 20px;
	float: left;
}

.end-margin-none {
	margin-right: 0;
}

.list-thumb {
	text-align: center;
	width: auto;
	height: auto;
	background-color: #EDEFF2;
	/*background-color: #ffffff;*/
	overflow: hidden;

	-webkit-border-radius: 6px 6px 0 0;
	   -moz-border-radius: 6px 6px 0 0;
	    -ms-border-radius: 6px 6px 0 0;
	     -o-border-radius: 6px 6px 0 0;
	        border-radius: 6px 6px 0 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.list-thumb a:hover {
	filter: alpha(opacity = 70);
	opacity: 0.7;
}

.list-thumb a {
	text-align: center;
	vertical-align: middle;
	line-height: 1;
	width: 310px;
	height: 310px;
	padding: 8px;
	/*background-color: #D9E0E6;*/
	display: table-cell;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}
.list-thumb.comic a {
	height: auto;
}
.list-thumb a > img {
	-webkit-box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.8);
	-moz-box-shadow:    1px 1px 2px 0 rgba(0, 0, 0, 0.8);
	-ms-box-shadow:     1px 1px 2px 0 rgba(0, 0, 0, 0.8);
	box-shadow:         1px 1px 2px 0 rgba(0, 0, 0, 0.8);
	background-image: url("/img/material/CheckeredPattern00.png");
}

.work dl {
	width: 100%;
	height: auto;
	padding: 8px;
	border: 1px solid #D9E0E6;

	-webkit-border-radius: 0 0 6px 6px;
	   -moz-border-radius: 0 0 6px 6px;
	    -ms-border-radius: 0 0 6px 6px;
	     -o-border-radius: 0 0 6px 6px;
	        border-radius: 0 0 6px 6px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.workTitle {
	font-size: 16px;
	font-weight: bold;
	line-height: 1.25;
	width: 100%;
	height: auto;
	margin-bottom: 12px;
}

.work dd {
	line-height: 1.25;
	width: 100%;
	height: auto;
}

.work dd li {
	width: 100%;
}

.work dt,
.work dd,
.work dd li {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.work-info,
.manga-info {
	text-align: right;
	border-top:1px dotted #DAE0E5;
}

.work-info ul,
.manga-info ul {
	margin: 9px 0 0 0;
}

.work-info li,
.manga-info li {
	display: inline;
}

.work-info span {
	height: 16px;
	color: #BDC3C7;
	vertical-align: middle;
	line-height: 16px;
	height: auto;
	display: inline-block;
}

.manga-info span {
	height: 16px;
	vertical-align: middle;
	line-height: 16px;
	height: auto;
	display: inline-block;
}

#infoCategory span:first-child {
	padding-left: 22px;
	background-image: url('/img/icon/icon_category.png');
	background-position: 0 0;
	background-repeat: no-repeat;
	margin: 9px 0 0 0;
}

#infoDate span,
#infoUpdate span {
	color: #BDC3C7;
	padding-left: 22px;
	background-image: url('/img/icon/icon_date.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

#infoTime,
#infoView,
#cheerPoint,
#infoLike {
	margin-left: 8px;
}

#infoTime span {
	padding-left: 21px;
	background-image: url('/img/icon/icon_time.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

#infoView span {
	padding-left: 27px;
	background-image: url('/img/icon/icon_view.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

#cheerPoint span {
	color: #E40000;
	padding-left: 27px;
	background-image: url('/img/icon/cheer_point.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

#infoLike span {
	padding-left: 22px;
	background-image: url('/img/icon/info_like.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

/*------------------------------------------------------------------------------------
	THUMBNAIL LIST LIST
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	PAGING
------------------------------------------------------------------------------------*/
.list-paging-top,
.list-paging-bottom {
	font-size: 14px;
	text-align: center;
	line-height: 1;
	width: 640px;
	height: auto;
}

.list-paging-top {
	padding: 31px 0;
}

.list-paging-bottom {
	padding-bottom: 31px;
}

.list-paging-top a,
.list-paging-bottom a {
	padding: 12px;
	margin: 0 6px;
	background-color: #ffffff;
	border: #D9E0E6 solid 1px;
	display: inline-block;

    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
        -ms-border-radius: 4px;
         -o-border-radius: 4px;
            border-radius: 4px;
}

.list-paging-top span,
.list-paging-bottom span {
	padding: 12px;
	margin: 0 6px;
	background-color: #EDEFF2;
	border: #D9E0E6 solid 1px;
	display: inline-block;

    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
        -ms-border-radius: 4px;
         -o-border-radius: 4px;
            border-radius: 4px;
}

#page-next-list-top,
#page-next-list-bottom {
	margin-right: 0;
}
/*------------------------------------------------------------------------------------
	PAGING END
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	MOVIE PLAYER
------------------------------------------------------------------------------------*/
.play-movie {
	width: 640px;
	height: auto;
}

#movie-box {
	width: 640px;
	height: 505px;
	position: relative;
}

#movie-box span.reported{
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	-ms-box-shadow: none;
	box-shadow: none;
	text-align: center;
	display: grid;
	height: 100%;
	font-size: 21px;
	color: gray;
	align-items: center;
}

#movie-image {
	position: absolute;
	background-image: url("/img/material/CheckeredPattern00.png");
}

#play-movie-link {
	width: 640px;
	height: 505px;
	position: absolute;
	display: block;
	background: url('/img/btn/play_btn.png') center center no-repeat;
}

#youtube-player {
	width: 640px;
	height: 505px;
	display: none;
}
/*------------------------------------------------------------------------------------
	MOVIE PLAYER END
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	MOVIE DETAIL
------------------------------------------------------------------------------------*/
/*#art-detail-info {
	border: #D9E0E6 solid 1px;

    -webkit-border-radius: 0 0 6px 6px;
       -moz-border-radius: 0 0 6px 6px;
        -ms-border-radius: 0 0 6px 6px;
         -o-border-radius: 0 0 6px 6px;
            border-radius: 0 0 6px 6px;
}*/

.mov-detail {
	width: 640px;
	height: auto;
	padding: 12px;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.mov-detail > p {
	width: 48px;
	height: auto;
	margin-right: 8px;
	float: left;
}

.mov-detail > p img {
	width: 48px;
	height: 48px;

    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
        -ms-border-radius: 50%;
         -o-border-radius: 50%;
            border-radius: 50%;
}

.mov-detail > ul {
	width: 556px;
	height: auto;
	float: right;
}

.mov-detail > ul li {
	text-align: left;
	line-height: 1.5;
	height: auto;
}

.mov-detail > ul li:first-child {
	line-height: 1;
}

/*------------------------------------------------------------------------------------
	MOVIE DETAIL END
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	SOCIAL BUTTON
------------------------------------------------------------------------------------*/
#shareBtn {
	text-align: center;
	width: 100%;
	height: auto;
	margin-bottom: 48px;
}

#shareBtn li {
	display: inline;
}

#shareBtn li a {
	vertical-align: middle;
	text-decoration: none;
	line-height: 64px;
	width: 308px;
	height: 64px;
	padding: 20px;
	display: inline-block;

    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
         -o-box-sizing: border-box;
            box-sizing: border-box;
	-webkit-border-radius: 6px;
	   -moz-border-radius: 6px;
	    -ms-border-radius: 6px;
	     -o-border-radius: 6px;
	        border-radius: 6px;
}

#shareBtn li a:hover {
	-webkit-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	   -moz-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	    -ms-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
			box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
}

#shareTwitter a {
	background-color: #000000;
	margin-right: 20px;
}

#shareFacebook a {
	background-color: #3A5795;
}

#shareBtn span {
	color: #ffffff;
	font-size: 16px;
	line-height: 24px;
	height: 24px;
	padding-left: 36px;
	display: table-cell;
	background-position: 0 0;
	background-repeat: no-repeat;
}

#shareTwitter span {
	background-image: url('/img/icon/shareTwitter.png?20240130');
}

#shareFacebook span {
	background-image: url('/img/icon/shareFacebook.png');
}

#socialBtn {
	text-align: center;
	width: 100%;
	height: auto;
	margin-top: 50px;
}

#socialBtn li {
	vertical-align: bottom;
	margin-right: 8px;
	display: inline-block;
	*display: inline;
}

#socialBtn iframe {
	margin: 0 !important;
}

#show-noEtc {
	color: #b3bac1;
	font-size: 16px;
	line-height: 1;
	text-align: center;
	width: 100%;
	height: auto;
	margin-bottom: 31px;
}
/*------------------------------------------------------------------------------------
	SOCIAL BUTTON END
------------------------------------------------------------------------------------*/
.contents {
	width: 640px;
	height: auto;
	margin-right: 20px;
	float: left;
}

/*.contents {
	width: 640px;
	height: auto;
	margin-right: 20px;
	float: left;
}*/

.about_contents,
.lecture {
	margin: 0;
	float: right;
}

.lecture_contents {
	width: 640px;
	height: auto;
	float: right;
}

.other_contents {
	width: 640px;
	height: auto;
	float: left;
}

.important-information {
	border: 1px solid red;
	background-color: #fcc;
	margin-bottom: 20px;
	padding: 10px;
}

.important-information p {
	font-weight: bold;
	color: red;
	font-size: 14px;
}

.anniversary-message {
	text-align: center;
	width: 640px;
	height: auto;
	margin-bottom: 31px;
	padding: 31px 24px;
	border: 1px solid #FF8200;

    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
         -o-box-sizing: border-box;
            box-sizing: border-box;
}

.anniversary-message span {
	color: #FF8200;
	font-size: 31px;
	font-weight: bold;
	word-break: normal;
}

.popular-work,
.new-work,
.story-list-work {
	width: 640px;
	height: auto;
	padding-bottom: 12px;
	margin-bottom: 31px;
}

.tweet-area {
	width: 640px;
	height: 460px;
	padding-bottom: 12px;
	margin-bottom: 31px;
	border-bottom: #D9E0E6 solid 1px;
	overflow: hidden;
}

.spy li {
	margin-bottom: 8px;
    background-image: url('/img/line_dot.png');
    background-position: left bottom;
    background-repeat: repeat-x;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.comment-profile-img {
	width: 48px;
	height: 48px;
	margin-right: 12px;
	float: left;
}

.comment-profile-img img {
	width: 100%;
	height: auto;

    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

.comment-name {
	vertical-align: text-bottom;
	width: 580px;
	height: auto;
	display: table-cell;
	float: right;
}

.comment-name a {
	text-decoration: none;
}

.comment-profile-name-twitter {
	font-weight: bold;
}

.comment-user-name-twitter {
	color: #CBCCD0;
}

.comment {
	margin-top: 5px;
}

.aboutago {
	color: #CBCCD0;
	margin-top: 2px;
	margin-bottom: 5px;
}

.i_mobile_bottom {
	padding-bottom: 12px;
	margin-bottom: 31px;
}

/*#movInfo {
	text-align: right;
	width: 100%;
	height: auto;
	padding: 8px 4px 6px;
	border-bottom: 1px solid #D9E0E6;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#movInfo li {
	display: inline;
}

#movInfo li span {
	line-height: 1;
	display: inline-block;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#movInfo li:first-child span {
	padding-right: 12px;
}*/

#movInfo {
	text-align: right;
	width: 100%;
	height: auto;
	padding: 8px 6px 6px;
	border-bottom: 1px solid #D9E0E6;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#movInfo li {
	display: inline;
}

#movInfo span {
	height: 16px;
	color: #BDC3C7;
	vertical-align: middle;
	line-height: 16px;
	height: auto;
	display: inline-block;
}

#movInfoDate span {
	padding-left: 22px;
	background-image: url('/img/icon/icon_date.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

#movInfoTime,
#movInfoView {
	margin-left: 8px;
}

#movInfoTime span {
	padding-left: 21px;
	background-image: url('/img/icon/icon_time.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

#movInfoView span {
	padding-left: 27px;
	background-image: url('/img/icon/icon_view.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

#movCount {
	width: 100%;
	height: auto;
	border-top: 1px solid #D9E0E6;
	border-bottom: 1px solid #D9E0E6;
}

#show-likeCount,
#show-dlCount,
#show-pvCount {
	text-align: center;
	width: 33.333333%;
	height: auto;
	padding: 8px;
	border-right: 1px solid #D9E0E6;
	position: relative;
	float: left;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#show-pvCount {
	border-right: none;
}

#open-likeUser-win,
#no-likeUser,
#open-downloadUser-win,
#no-downloadUser,
#brush-installCount,
#show-pvCount span {
	text-align: center;
	vertical-align: middle;
	width: 100%;
	height: 64px;
	display: table;
}

#open-likeUser-win span,
#no-likeUser span,
#open-downloadUser-win span,
#no-downloadUser span,
#brush-installCount span,
#show-pvCount span span {
	display: table-cell;
	vertical-align: middle;
}

#movCount b {
	font-size: 19px;
}

#open-likeUser-win,
#no-likeUser,
#open-downloadUser-win,
#no-downloadUser {
	display: none;
}

#movMenu {
	width: 100%;
	height: auto;
	margin-bottom: 48px;
}

#movMenu li.hmsRestrict {
	width: 50%;
}

#movMenu li:not(.hmsRestrict) {
	width: 33.333333%;
}

#movMenu li {
	text-align: center;
	height: auto;
	padding: 12px 12px;
	float: left;
	display: table;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.facebook-box {
	margin-top:10px;
	margin-bottom:10px;
	border-bottom: #CBCCD0 solid 1px;
}

.showNoArt {
	font-size: 16px;
	line-height: 1;
	text-align: center;
	width: 100%;
	height: auto;
	margin: 31px auto;
}

.description {
	width: 100%;
	height: auto;
	line-height: 1.6;
}

.description th {
	text-align: right;
	width: 20%;
	height: auto;
	padding: 12px;
	border-bottom: #D9E0E6 solid 1px;
}

.description td {
	text-align: left;
	width: 70%;
	height: auto;
	padding: 12px;
	border-bottom: #D9E0E6 solid 1px;
}

ol.description.deletion-list {
	margin-left: 2em;
}

ol.description.deletion-list li:not(.deletion-list-inner-item) {
	list-style-type: none;
	counter-increment: cnt;
	position: relative;
}

.deletion-list li:not(.deletion-list-inner-item)::before {
	content: "(" counter(cnt) ") ";
	display:inline-block;
	margin-left:-3.5em;
	width: 3em;
	text-align: right;
	position: absolute;
	top: 0;
	left: 0;
}

ol.inner.list li:not(.item li) {
	list-style: none;
}

.emphasize {
	font-weight: bold;
	color: #548DD4;
}








.show-more {
	width: 100%;
	height: auto;
	border-top: #CBCCD0 solid 1px;
	border-bottom: #CBCCD0 solid 1px;
}

.show-more a {
	text-align: right;
	line-height: 1;
	width: 100%;
	height: auto;
	padding: 16px 8px 16px 0;
	display: inline-block;
	background-color: #ffffff;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

/* RANKING SEGMENT CONTROL */
#rankingSegment {
	text-align: center;
    width: 640px;
    height: 36px;
}

#rankingSegment li {
	display: inline;
}

#rankingSegment a {
	color: #00629D;
	font-size: 14px;
	text-decoration: none;
	width: 160px;
	height: 36px;
	padding-top: 8px;
	display: inline-block;
	border: 1px solid #00629D;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#rankingSegment span {
	color: #ffffff;
	font-size: 14px;
	width: 160px;
	height: 36px;
	padding-top: 8px;
	display: inline-block;
	border: 1px solid #00629D;
	background-color: #00629D;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#rDaily a,
#rDaily span,
#nArt a,
#nArt span {
	border-right: 0;
    -webkit-border-radius: 6px 0 0 6px;
       -moz-border-radius: 6px 0 0 6px;
        -ms-border-radius: 6px 0 0 6px;
         -o-border-radius: 6px 0 0 6px;
            border-radius: 6px 0 0 6px;
}

#rMonthly a,
#rMonthly span,
#nArtist a,
#nArtist span {
	border-left: 0;
    -webkit-border-radius: 0 6px 6px 0;
       -moz-border-radius: 0 6px 6px 0;
        -ms-border-radius: 0 6px 6px 0;
         -o-border-radius: 0 6px 6px 0;
            border-radius: 0 6px 6px 0;
}

.search-art {
	color: #00629D;
	border: 1px solid #00629D;
	border-right: 0;
	background-color: #ffffff;

    -webkit-border-radius: 6px 0 0 6px;
       -moz-border-radius: 6px 0 0 6px;
        -ms-border-radius: 6px 0 0 6px;
         -o-border-radius: 6px 0 0 6px;
            border-radius: 6px 0 0 6px;
}

.search-artist {
	color: #00629D;
	border: 1px solid #00629D;
	background-color: #ffffff;

    -webkit-border-radius: 0 6px 6px 0;
       -moz-border-radius: 0 6px 6px 0;
        -ms-border-radius: 0 6px 6px 0;
         -o-border-radius: 0 6px 6px 0;
            border-radius: 0 6px 6px 0;
}

#search-selected {
	color: #ffffff;
	background-color: #00629D;
}
/*------------------------------------------------------------------------------------
	List Area End
------------------------------------------------------------------------------------*/
#downloadBtn {
	color: #ffffff;
	font-size: 16px;
	font-weight: bold;
	line-height: 1;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	width: 160px;
	height: 48px;
	display: table-cell;
	background-color: #ffa000;

    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

#downloadBtn:hover {
	-webkit-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	   -moz-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	    -ms-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
			box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
}
/*------------------------------------------------------------------------------------
	PLayer End
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	Administration Area
------------------------------------------------------------------------------------*/
div.admin-area {
	padding: 7px 12px;
	border-bottom: #ccc solid 1px;
}

div.admin-area div.admin-info {
}

div.admin-area div.admin-error-info {
	color: red;
}

div.admin-area div.admin-buttons {
	text-align: right;
}

div.admin-area input[type="button"], div.admin-area input[type="submit"],
div.admin-area button {
	font-size: 14px;
	width: auto;
	height: auto;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 12px;
	padding-right: 12px;
	margin-top: 7px;
	margin-bottom:4px;
	background-image: url('/img/btn/btn_bg.png');
	background-position: top left;
	background-repeat: repeat-x;
	border: #999 solid 1px;
	cursor: pointer;
}
/*------------------------------------------------------------------------------------
	Administration Area End
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	Contribution Area
------------------------------------------------------------------------------------*/
.contribution-area {
	width: 100%;
	height: auto;
	margin-bottom: 48px;
}

.contribution-area form > div p {
	text-align: right;
	line-height: 1;
	width: 50%;
	height: auto;
	margin-bottom: 4px;
	float: left;
}

.contribution-area form > div p:first-child {
	text-align: left;
}

.contribution-area form > div p:last-child {
	color: gray;
}

.contribution-area textarea {
	font-size: 14px;
	width: 640px;
	height: 64px;
	padding: 4px;
	border: 1px solid #cccccc;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

#contribution-btn {
	text-align: center;
	padding-top: 24px;
}

#contribution-btn a,
#contribution-btn input[type=submit],
#contribution-btn input[type=button] {
	/* color: #0B649B; */
	color: #006699;
	font-size: 16px;
	line-height: 2;
	text-decoration: none;
	width: 192px;
	height: 48px;
	margin: 0 auto;
	cursor: pointer;
	display: table;
	background-color: #ffffff;
	border: 1px solid #0B649B;
	/*border: 1px solid #006699;*/

    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

#contribution-btn #reducePointHalf,
#contribution-btn #adminDelete,
#contribution-btn #adminPrivate,
#contribution-btn #adminRepublish,
#contribution-btn #authorDelete,
#contribution-btn #deleteMyArt,
#contribution-btn #btnDeleteIcon,
#contribution-btn #btnBan,
#contribution-btn #btnUnban {
	font-weight: bold;
    color: #E74C3C;
	border: 1px solid #E74C3C;
}

#contribution-btn a:hover {
	-webkit-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	   -moz-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	    -ms-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
			box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
}

#contribution-btn span {
	vertical-align: middle;
	display: table-cell;
}

#check-tweet {
	text-align: center;
	width: 100%;
	height: auto;
	margin-top: 32px;
}

#check-tweet input[type=checkbox] {
	vertical-align: middle;
	margin-right: 4px;
}

#check-tweet label {
	vertical-align: middle;
	font-size: 16px;
	line-height: 1;
	width: 100%;
	height: auto;
	margin: 24px 0 0;
	cursor: pointer;
}

.caution {
	color: gray;
	text-align: left;
	line-height: 1.45;
	margin-top: 10px;
}

.showAllWorks {
	text-align: center;
	width: 100%;
	height: auto;
}
/*------------------------------------------------------------------------------------
	Contribution Area End
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	Comment Area
------------------------------------------------------------------------------------*/
.comment-area {
	width: 100%;
	height: auto;
	margin-bottom: 31px;
}

#show-noCom {
	color: #b3bac1;
	font-size: 16px;
	line-height: 1;
	text-align: center;
	width: 100%;
	height: auto;
}

.visitor-com {
	width: 100%;
	height: auto;
	padding-bottom: 8px;
	margin-top: 12px;
	background-image: url('/img/line_dot.png');
	background-position: left bottom;
	background-repeat: repeat-x;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.visitor-com dt {
	width: 48px;
	height: 48px;
	margin-right: 12px;
	float: left;
}

.visitor-com img {
    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

.visitor-com dd {
	line-height: 1.4;
	width: 580px;
	height: auto;
	float: right;
}

.visitor-name {
	margin-right: 7px;
}

.visitor-service-icon img {
	margin-right: 0px;
	vertical-align: text-bottom;
}


.visitor-name img {
	margin-right: 4px;
}

.showVisitorCom {
	width: 100%;
	height: auto;
	padding-top: 4px;
	position: relative;
}

.showVisitorCom p {
	line-height: 1;
	width: 552px;
	height: auto;
	word-wrap: break-word;
}

.showVisitorCom p:first-child {
	line-height: 1.45;
	padding-bottom: 4px;
}

.aboutago {
	color: #CCCCCC;
	width: 580px;
	height: auto;
}

.visitor-profile-name-twitter {
	font-weight: bold;
}

.visitor-user-name-twitter {
	color: gray;
}

.delete_com {
	top: 0;
	right: 0;
	width: 24px;
	height: 24px;
	border: none;
	background-image: url('/img/btn/delete_comment.png');
	background-position: 0 0;
	background-repeat: no-repeat;
	background-color: #ffffff;
	z-index: 50;
	position: absolute;
	cursor: pointer;

    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
        -ms-border-radius: 4px;
         -o-border-radius: 4px;
            border-radius: 4px;
	-webkit-transition: 0.8s;
	   -moz-transition: 0.8s;
	    -ms-transition: 0.8s;
			transition: 0.8s;
}

.delete_com:hover {
	background-color: #EDEFF2;
}

.paging-com {
	font-size: 16px;
	text-align: center;
	width: 640px;
	height: auto;
	padding-top: 31px;
	padding-bottom: 31px;
	display: block;
}

.paging-com a {
	padding: 7px;
	margin-left: 6px;
	margin-right: 6px;
	border: #CCC solid 1px;
}

.paging-com span {
	font-weight: bold;
	padding: 7px;
	margin-left: 6px;
	margin-right: 6px;
	background-color: #EEE;
	border: #CCC solid 1px;
}

.paging-com #page-next-com {
	margin-right: 0px;
}
/*------------------------------------------------------------------------------------
	Comment Area End
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	User Plofile
------------------------------------------------------------------------------------*/
.mov-list-user-profile {
	width: 640px;
	height: auto;
	padding-bottom: 12px;
	margin-bottom: 0;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.mov-list-user-detail dt {
	width: 48px;
	height: auto;
	margin-right: 12px;
	float: left;
}

.mov-list-user-detail dt img {
	width: 48px;
	height: auto;
    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

.mov-list-user-detail dd {
	line-height: 1.5;
	width: 580px;
	height: auto;
	margin-bottom: 4px;
	float: right;
}

.mov-list-user-detail dd:last-child {
	margin: 0;
}

.author-profile-name-twitter {
	font-weight: bold;
}

.author-user-name-twitter {
	color: gray;
}

.mov-list-user-profile p {
	width: 100%;
	height: auto;
	padding-top: 12px;
	margin-top: 12px;
	background-image: url('/img/line_dot.png');
	background-position: top left;
	background-repeat: repeat-x;
}

/* CATEGORY */
.select-artwork-category {
	text-align: center;
	width: 100%;
	height: auto;
	margin: 12px 0;
}

.select-artwork-category div {
	border-bottom: 1px solid #D9E0E6;
	display: -moz-flex;
	display: -webkit-flex;
	display: flex;
	justify-content: space-between;
}

.select-artwork-category div {
	width: 310px;
	height: 44px;
	position: relative;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.select-artwork-category div:second-child {
	margin: 0 2px 0 8px;

}

.select-artwork-category div:forth-child {
	margin: 0 8px 0 2px;
}

.select-artwork-category div a {
	color: #A3ABB3;
	top: 1px;
	text-decoration: none;
	width: 100%;
	height: auto;
	border-top: 1px solid #D9E0E6;
	border-left: 1px solid #D9E0E6;
	border-right: 1px solid #D9E0E6;
	background-color: #EDEFF2;
	position: absolute;
	display: table;

    -webkit-border-top-left-radius: 6px;
        -moz-border-radius-topleft: 6px;
         -ms-border-radius-topleft: 6px;
          -o-border-radius-topleft: 6px;
             border-radius-topleft: 6px;
             border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
        -moz-border-radius-topright: 6px;
         -ms-border-radius-topright: 6px;
          -o-border-radius-topright: 6px;
             border-radius-topright: 6px;
             border-top-right-radius: 6px;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.select-artwork-category div a span {
	font-size: 16px;
	vertical-align: middle;
	width: 100%;
	height: 42px;
	display: table-cell;

    -webkit-border-top-left-radius: 6px;
        -moz-border-radius-topleft: 6px;
         -ms-border-radius-topleft: 6px;
          -o-border-radius-topleft: 6px;
             border-radius-topleft: 6px;
    -webkit-border-top-right-radius: 6px;
        -moz-border-radius-topright: 6px;
         -ms-border-radius-topright: 6px;
          -o-border-radius-topright: 6px;
             border-radius-topright: 6px;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

div.tabSpaceLeft, div.tabSpaceRight {
	width: 8px;
}

div.tabSpaceCenter {
	width: 4px;
}

div.select-artwork-category {
	display: flex;
}

#tab-selected {
	color: #333333;
	background-color: #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
}

.tab-selected a span {
	color: #D9E0E6;
	background-color: #FFFFFF;
	border-bottom: 1px solid #FFFFFF;

}

#userData,
#userData-manga {
	text-align: center;
	width: 100%;
	height: 64px;
	border-top: 1px solid #D9E0E6;
	border-bottom: 1px solid #D9E0E6;
}

#userData p {
	width: 50%;
	height: 64px;
	padding: 8px;
	border-right: 1px solid #D9E0E6;
	float: left;
	display: table;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#userData-manga p {
	width: 33.3333%;
	height: 64px;
	padding: 8px;
	border-right: 1px solid #D9E0E6;
	float: left;
	display: table;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#userData p:last-child,
#userData-manga p:last-child {
	border-right: none;
}

#userData span,
#userData-manga span {
	display: table-cell;
	vertical-align: middle;
}

#userData b,
#userData-manga b {
	font-size: 19px;
}

.list-number {
	font-size: 14px;
	line-height: 1.5;
	text-align: center;
	width: 100%;
	height: auto;
	margin: 31px 0;
}

#sortSegment {
    text-align: center;
    width: 100%;
    height: auto;
    margin-top: 31px;
}

#sortSegment form {
    text-align: center;
    width: 320px;
    height: auto;
    margin: 0 auto;
}

#sortSegment p {
    width: 160px;
    height: 36px;
    float: left;
}

#sortSegment p input[type='radio'] {
    width: 100%;
    height: 36px;
    display: none;
}

#sortSegment p label {
    color: #0B649B;
    font-size: 14px;
    line-height: 1;
    width: 100%;
    height: 36px;
    padding-top: 11px;
    border: 1px solid #0B649B;
    background-color: #FFFFFF;
    display: inline-block;
    cursor: pointer;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#sortSegment p:nth-child(1) label {
    -webkit-border-top-left-radius: 6px;
        -moz-border-radius-topleft: 6px;
         -ms-border-radius-topleft: 6px;
          -o-border-radius-topleft: 6px;
             border-radius-topleft: 6px;
    -webkit-border-bottom-left-radius: 6px;
        -moz-border-radius-bottomleft: 6px;
         -ms-border-radius-bottomleft: 6px;
          -o-border-radius-bottomleft: 6px;
             border-radius-bottomleft: 6px;
}

#sortSegment p:nth-child(2) label {
    -webkit-border-top-right-radius: 6px;
        -moz-border-radius-topright: 6px;
         -ms-border-radius-topright: 6px;
          -o-border-radius-topright: 6px;
             border-radius-topright: 6px;
    -webkit-border-bottom-right-radius: 6px;
        -moz-border-radius-bottomright: 6px;
         -ms-border-radius-bottomright: 6px;
          -o-border-radius-bottomright: 6px;
             border-radius-bottomright: 6px;
}

#sortSegment p:nth-child(1) input[type='radio']:checked + #selectNew {
    color: #FFFFFF;
    background-color: #0B649B;
}

#sortSegment p:nth-child(2) input[type='radio']:checked + #selectTotal {
    color: #FFFFFF;
    background-color: #0B649B;
}
/*------------------------------------------------------------------------------------
	User Plofile End
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	Search Area Start
------------------------------------------------------------------------------------*/
.search-area {
	width: 100%;
	height: auto;
}

#contents-searchBox {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
	flex-grow: 1;
    max-width: 360px;
    text-align: center;
	height: 36px;
	margin-bottom: 24px;
	position: relative;
    min-width: 0;
}

#contents-searchBox input[type=text] {
	height: 36px;
	padding: 0 4px;
	border: 1px solid #D9E0E6;
	background-color: #ffffff;
	flex-grow: 1;
	flex-shrink: 1;
	outline: none;
	top: 0;
	min-width: 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
    -webkit-border-radius: 4px 0 0 4px;
       -moz-border-radius: 4px 0 0 4px;
        -ms-border-radius: 4px 0 0 4px;
         -o-border-radius: 4px 0 0 4px;
            border-radius: 4px 0 0 4px;
}

#contents-searchBox input[type=submit] {
	width: 32px;
	height: 36px;
	border: 1px solid #D9E0E6;
	border-left: 0;
	background-color: #ffffff;
	background-image: url('/img/btn/searchBtn_bg.png');
	background-position: -1px 1px;
	background-repeat: no-repeat;
	cursor: pointer;
	position: absolute;
	left: 464px;
	top: 0;

	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
    -webkit-border-radius: 0 4px 4px 0;
       -moz-border-radius: 0 4px 4px 0;
        -ms-border-radius: 0 4px 4px 0;
         -o-border-radius: 0 4px 4px 0;
            border-radius: 0 4px 4px 0;
}

#contents-segmented-contol {
	text-align: center;
	width: 100%;
	height: auto;
}

.segmented-contol {
	width: 320px;
	height: auto;
	margin: 0 auto;
}

.segmented-contol p {
	float: left;
}

.segmented-left-selected {
	cursor: auto;
	color: #FFFFFF;
	background: #00629D;
	width: 160px;
	height: 36px;
	line-height: 1;
	font-size: 14px;
	text-align: center;
	border: 1px solid #00629D;
	border-radius: 4px 0px 0px 4px;
	-webkit-border-radius: 4px 0px 0px 4px;
	-moz-border-radius: 4px 0px 0px 4px;
	display: inline-block;
	_display: inline;
	margin: 0;
	padding: 11px 0 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.segmented-left-unselected {
	cursor: pointer;
	color: #00629D;
	background: #FFFFFF;
	width: 160px;
	height: 36px;
	line-height: 1;
	font-size: 14px;
	text-align: center;
	border: 1px solid #00629D;
	border-radius: 4px 0px 0px 4px;
	-webkit-border-radius: 4px 0px 0px 4px;
	-moz-border-radius: 4px 0px 0px 4px;
	display: inline-block;
	_display: inline;
	margin: 0;
	padding: 11px 0 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.segmented-right-selected {
	cursor: auto;
	color: #FFFFFF;
	background: #00629D;
	width: 160px;
	height: 36px;
	line-height: 1;
	font-size: 14px;
	text-align: center;
	border-left: 0 solid #00629D;
	border-top: 1px solid #00629D;
	border-bottom: 1px solid #00629D;
	border-right: 1px solid #00629D;
	border-radius: 0px 4px 4px 0px;
	-webkit-border-radius: 0px 4px 4px 0px;
	-moz-border-radius: 0px 4px 4px 0px;
	display: inline-block;
	_display: inline;
	margin: 0;
	padding: 11px 0 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.segmented-right-unselected {
	cursor: pointer;
	color: #00629D;
	background: #FFFFFF;
	width: 160px;
	height: 36px;
	line-height: 1;
	font-size: 14px;
	text-align: center;
	border-left: 0 solid #00629D;
	border-top: 1px solid #00629D;
	border-bottom: 1px solid #00629D;
	border-right: 1px solid #00629D;
	border-radius: 0px 4px 4px 0px;
	-webkit-border-radius: 0px 4px 4px 0px;
	-moz-border-radius: 0px 4px 4px 0px;
	display: inline-block;
	_display: inline;
	margin: 0;
	padding: 11px 0 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}
/*------------------------------------------------------------------------------------
	Search Area End
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	Device table start
------------------------------------------------------------------------------------*/
.device-table {
	border: 1px solid #999999;
	border-collapse: collapse;
	margin-top: 10px;
	margin-bottom: 10px;
	width: 600px;
}

.device-table td,
.device-table th {
	border: 1px solid #999;
	padding: 6px;
	font-size: 12px;
	vertical-align: middle;
}

.device-table th.device {
	width: 150px;
}

.device-table td.device {
	width: 150px;
}

.device-table th.spec {
	width: 0%;
}

.device-table thead th {
	background-color: #000;
	color: #fff;
}

.device-table td.support,
.device-table td.no-support {
	text-align: center;
}

.device-table td.support {
	font-weight: bold;
	background-color: #efe;
}

.device-table td.layer-num {
	text-align: right;
	padding-left: 10px;
	padding-right: 10px;
}

.device-table td.more-layer-num {
	text-align: right;
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
	background-color: #efe;
}
/*------------------------------------------------------------------------------------
	Device table end
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	General table start
------------------------------------------------------------------------------------*/
.general-table {
	border: 1px solid #999999;
	border-collapse: collapse;
	margin-top: 10px;
	margin-bottom: 10px;
	width: 600px;
}

.general-table td,
.general-table th {
	border: 1px solid #999;
	padding: 6px;
	font-size: 12px;
	vertical-align: middle;
	line-height: 150%;
}

.general-table th {
	background-color: #000;
	color: #fff;
}
/*------------------------------------------------------------------------------------
	General table end
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	App Store badge area start
------------------------------------------------------------------------------------*/
.app-store-badge-area {
	float: right;
	width: 166px;
}

.app-description {
	font-weight: bold;
	text-align: center;
	margin-top: 15px;
}

.app-store-badge {
	margin: 10px auto 10px auto;
	display: inline-block;
}
/*------------------------------------------------------------------------------------
	App Store badge area end
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	GENERAL PURPOSE PARTS
------------------------------------------------------------------------------------*/
.gpBtn,
.gpBtn100p {
	color: #0B649B;
	font-size: 16px;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	width: 192px;
	height: 48px;
	margin: 0 auto;
	display: table;
	border: 1px solid #0B649B;
	background-color: #ffffff;

    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

.gpTopBtn {
	color: #0B649B;
	font-size: 16px;
	line-height: 40px;
	text-align: center;
	text-decoration: none;
	width: auto;
	height: 40px;
	margin: 0 0 0 auto;
	padding: 0 30px;
	display: table;
	border: 1px solid #ffffff;
	vertical-align: middle;

	background-image: url("/img/icon/arrow_right.png");
	background-position: 96% center;
	background-repeat: no-repeat;

    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

.gpBtn100p {
	width: 100%;
	display: table-cell;
	vertical-align: middle;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

#toggleLike {
	padding-left: 24px;
	background-image: url('/img/icon/likeIcon.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

#toggleRetract {
	padding-left: 24px;
	background-image: url('/img/icon/likedIcon.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

.btnOn {
	color: #FFFFFF;
	border: 1px solid #0B649B;
	background-color: #0B649B;
}

.gpBtn:hover,
.btnOn:hover,
.gpBtn100p:hover {
	text-decoration: none;
	-webkit-box-shadow: 0 1px 3px 0 rgba(30, 30, 30, 0.5);
	   -moz-box-shadow: 0 1px 3px 0 rgba(30, 30, 30, 0.5);
	    -ms-box-shadow: 0 1px 3px 0 rgba(30, 30, 30, 0.5);
			box-shadow: 0 1px 3px 0 rgba(30, 30, 30, 0.5);
}

.gpTopBtn:hover {
	border: 1px solid #0B649B;
		text-decoration: none;
	-webkit-box-shadow: 0 1px 3px 0 rgba(30, 30, 30, 0.5);
	   -moz-box-shadow: 0 1px 3px 0 rgba(30, 30, 30, 0.5);
	    -ms-box-shadow: 0 1px 3px 0 rgba(30, 30, 30, 0.5);
			box-shadow: 0 1px 3px 0 rgba(30, 30, 30, 0.5);
}

.gpBtn span{
	display: table-cell;
	vertical-align: middle;
}

.btnOn span,
.gpBtn100p span {
	vertical-align: middle;
}

.gpFormBtn[type=submit] {
	color: #0B649B;
	font-size: 16px;
	width: 192px;
	height: 48px;
	cursor: pointer;
	background-color: #ffffff;
	border: 1px solid #0B649B;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

.gpFormBtn[type=submit]:hover {
	-webkit-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	   -moz-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	    -ms-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
			box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
}

.search-no-result {
	font-size: 16px;
	text-align: center;
	line-height: 1;
	width: 100%;
	height: auto;
	margin-top: 31px;
}

.offline-meeting h3 {
	text-align: left;
	width: 616px;
	height: auto;
	padding: 0px 18px 12px 6px;
	margin-bottom: 12px;
	background-image: url('/img/line_slash.png');
	background-position: left bottom;
	background-repeat: repeat-x;
	display: block;
	font-size: 14px;
}

.offline-meeting h3 img {
	margin-right: 7px;
	vertical-align: bottom;
}

.offline-meeting ol {
	margin-top: 20px;
	font-size: normal;
	line-height: 150%;
}
/*------------------------------------------------------------------------------------
	LECTURE
------------------------------------------------------------------------------------*/
.chapter h3 {
	text-align: left;
	font-size: 21px;
	font-weight: normal;
	width: 100%;
	height: auto;
	margin: 0 0 24px;
}

.table_of_contents h3 {
	text-align: center;
	font-size: 21px;
	font-weight: normal;
	width: 100%;
	height: auto;
	margin: 0 0 24px;
}

.screenShot {
	text-align: center;
	width: 100%;
	height: auto;
}

.screenShot img {
	margin: 0 auto;
	border: 1px solid #D9E0E6;
}

.paragraph,
.procedure-list {
	line-height: 1.8;
	width: 100%;
	height: auto;
}

/* <p>の下部マージンを設定する */
.marginBottom-31px {
	margin-bottom: 31px;
}

.marginBottom-50px {
	margin-bottom: 50px;
}

/* <p>内でフォントを太字、カラーを赤に設定する */
.paragraph b,
.procedure-list b {
	color: #FC0006;
}

/* <p>内でフォントサイズを大きくしたい場合に設定する */
.paragraph b.fontSize16px,
.procedure-list b.fontSize16px,
.paragraph span.fontSize16px,
.procedure-list span.fontSize16px {
	font-size: 16px;
	padding: 0 4px;
}

/* <p>内で太字でフォントカラーを黒くしたい場合に設定する */
.paragraph b.fontBlack {
	font-size: 12px;
	color: black;
}

/* <p>内でフォントカラーのみを赤に設定する */
.paragraph span.fontColorRed,
.procedure-list span.fontColorRed {
	color: #FC0006;
}

/* <p>内に画像を挿入する */
.paragraph span.inlineImg,
.procedure-list span.inlineImg {
	vertical-align: middle;
	width: 30px;
	height: 30px;
	margin: 0 4px;
	display: inline-block;
}

.paragraph span.inlineImg img,
.procedure-list span.inlineImg img {
	width: 100%;
	height: auto;
}

.paragraph video {
	width: 50%;
	height: auto;
	margin: 0 auto;
}

.navi {
	text-align: center;
	width: 100%;
	height: auto;
	margin-bottom: 50px;
}

.navi #pageBack {
	width: 50%;
}

.navi #pageNext {
	width: 50%;
}

.navi #pageNext a {
	color: #FFFFFF;
	font-weight: bold;
	background-color: #236795;
	border: #236795 solid 1px;
}

.navi li {
	height: auto;
	display: inline;
}

.navi li a {
	font-size: 14px;
	vertical-align: middle;
	width: auto;
	height: 58px;
	padding: 10px 12px;
	margin: 0 12px;
	background-color: #ffffff;
	border: #D9E0E6 solid 1px;
	display: inline-block;

    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
        -ms-border-radius: 4px;
         -o-border-radius: 4px;
            border-radius: 4px;
}

.navi li a span {
	font-size: 16px;
	width: 100%;
	height: 36px;
	vertical-align: middle;
	display: table-cell;
}

.table_of_contents {
	width: 100%;
	height: auto;
	padding: 31px 0;
	border-top: 1px solid #D9E0E6;
}

.table_of_contents ol {
	display: flex;
	flex-wrap: wrap;
}

.table_of_contents ol li {
	font-size: 16px;
	width: calc(50% - 4px);
	height: auto;
	margin-left: 2px;
	margin-right: 2px;
	border-bottom: 1px dotted #cccccc;
	display: grid;
}

.table_of_contents ol li > a {
	padding: 4px 0 4px 4px;
	padding-inline-start: 4px;
	padding-inline-end: 0;
	display: table;
	color: black;
	word-break: break-word;
	display: flex;
	align-items: center;
}

.table_of_contents ol li > a:hover {
	text-decoration-line: none;
	background-color: #EDEFF2
}

.table_of_contents ol li > a > img {
	display: table-cell;
	border: solid 1px #dddddd;
}

.table_of_contents ol li > a > div {
	display: table-cell;
	vertical-align: middle;
	width: 100%;
}

.table_of_contents ol li > a > div > div {
	margin-left: 10px;
	margin-inline-start: 10px;
	margin-inline-end: 0px;
}
/*------------------------------------------------------------------------------------
	LECTURE END
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	STYLUS
------------------------------------------------------------------------------------*/
#purchase-btn {
	text-align: center;
	padding-top: 24px;
}

#purchase-btn a {
	color: #0B649B;
	/*color: #006699;*/
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	width: auto;
	height: 48px;
	margin: 0 auto;
	padding: 0 12px;
	cursor: pointer;
	display: table;
	background-color: #ffffff;
	border: 1px solid #0B649B;
	/*border: 1px solid #006699;*/

    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

#purchase-btn a:hover {
	-webkit-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	   -moz-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
	    -ms-box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
			box-shadow: 0 1px 2px 0 rgba(30, 30, 30, 0.5);
}

#purchase-btn span {
	vertical-align: middle;
	display: table-cell;
}
/*------------------------------------------------------------------------------------
	STYLUS END
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	IMPROPER
------------------------------------------------------------------------------------*/
#improper{
	text-align: center;
	margin-bottom: 32px;
}
.improper-btn {
	color: #b3bac1;
	font-size: 16px;
	line-height: 1;
	width: 100%;
	height: auto;
}
/*------------------------------------------------------------------------------------
	IMPROPER END
------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------
	User Profile
------------------------------------------------------------------------------------*/
.user-profile {
	line-height: 1.5;
	width: 640px;
	height: auto;
	padding: 4px 16px 12px;
	margin-bottom: 12px;
	border-top: #D9E0E6 solid 1px;
	border-bottom: #D9E0E6 solid 1px;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.user-profile h3,
.info h3 {
	font-size: 20px;
	line-height: 1;
	width: 100%;
	height: 16px;
	padding: 12px 0;
	margin-bottom: 8px;
	background-position: left bottom;
	background-repeat: repeat-x;
	display: block;
}

.user-profile h3 span,
.info h3 span {
	padding-left: 24px;
	background-image: url('/img/icon/h_img.png');
	background-position: 0 0;
	background-repeat: no-repeat;
}

.user-profile dd {
	overflow: hidden;
}

.user-detail,
.other-works {
	width: 100%;
	height: auto;
	margin-bottom: 8px;
	margin-left: 14px;
	background-position: left bottom;
	background-repeat: repeat-x;
	font-size: 12px;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	    -ms-box-sizing: border-box;
	        box-sizing: border-box;
}

.user-detail dt {
	width: 48px;
	height: 48px;
	margin-right: 12px;
	margin-top: 8px;
	float: left;
}

.user-detail dt img {
    -webkit-border-radius: 6px;
       -moz-border-radius: 6px;
        -ms-border-radius: 6px;
         -o-border-radius: 6px;
            border-radius: 6px;
}

.user-detail dd {
	width: 540px;
	height: auto;
	float: right;
}

.user-info li {
	margin-bottom: 4px;
}

.user-info li:last-child {
	margin-bottom: 0;
}

.user-name a img {
	vertical-align: text-bottom;
}

.user-profile-name-twitter {
	font-weight: bold;
}

.user-user-name-twitter {
	color: gray;
}
/*------------------------------------------------------------------------------------
	User Profile End
------------------------------------------------------------------------------------*/