@charset 'utf-8';
*{
	box-sizing: border-box;
}
html{
	font-size: 62.5%;
}
#header, .loginForm ul li, body {
  position:relative
}
#loginTopNav ul li .btnLink:hover, .hedNavLink li a:hover, .hedNavLink2 li a:hover, a:hover {
  opacity:.7
}
abbr, address, audio, b, blockquote, body, canvas, caption, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, form, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, mark, object, ol, p, pre, q, samp, small, span, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, ul, var, video {
  background:rgba(0,0,0,0);
  border:0;
  box-sizing:border-box;
  margin:0;
  outline:0;
  padding:0;
  vertical-align:baseline;
  word-break:break-all;
  word-wrap:break-word
}
@font-face {
  font-family:AC-Icon;
  font-style:normal;
  font-weight:400;
  src:url(../css/fonts/AC-Icon_-w29iu3.eot);
  src:url(../css/fonts/AC-Icon.eot) format('embedded-opentype'), url(../css/fonts/AC-Icon_-w29iu3.ttf) format('truetype'), url(../css/fonts/AC-Icon_-w29iu3.woff) format('woff'), url(../css/fonts/AC-Icon_-w29iu3.svg) format('svg')
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  background:rgba(0,0,0,0);
  border:0;
  display:block;
  margin:0;
  outline:0;
  padding:0;
  vertical-align:baseline
}
body {
  background:#f6f6f6;
  font-family:'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, sans-serif;
  font-weight:400;
}
body, h2 {
  font-size:1.2rem;
}
#header h1, #header nav ul li {
  float:left
}
#introduct h2, a {
  word-break:break-all;
  word-wrap:break-word
}
#cleators-t-list .cleator-name, .cleator-demo, .cleator-genre, .cleator-title {
  text-overflow:ellipsis;
  white-space:nowrap
}
#notice, #noticeIcon, .newProject a, .point, .view, .workInfoSample .ReferenceFile, button, input[type=button], input[type=submit], label {
  cursor:pointer
}
footer ul, nav ul, ol, ul {
  list-style:none
}
blockquote::after, blockquote::before, q::after, q::before {
  content:none
}
#LoginIndexForm::after, #header .headerArea::after, #loginTopNav ul li .btnLink::after, #loginTopNav ul li .btnLink::before, .clearfix::after, .workDetailArea .nothumb:before {
  content:''
}
a {
  color:#666;
  text-decoration:none
}
#header .innerNav a:hover, .cleator-name a, .footerInfo ul li a:hover, .footerNav dl dd a:hover, .hedNavLink li a, .hedNavLink2 li a {
  text-decoration:underline
}
input[type=radio] {
  vertical-align:text-bottom
}
.ie7 input[type=checkbox] {
  vertical-align:baseline
}
.ie6 input {
  vertical-align:text-bottom
}
button, input, select, textarea {
  margin:0
}
.clear {
  clear:both
}
.clearfix {
  zoom:1
}
.clearfix::after {
  clear:both;
  display:block
}
.cleator-name a {
  color:#3c94cc
}
#header {
  background:-webkit-gradient(linear, left top, left bottom, color-stop(.98, rgba(0,0,0,.4)), color-stop(0, rgba(69,69,69,.8)));
  background:-webkit-linear-gradient(top, rgba(69,69,69,.8) 0, rgba(0,0,0,.4) 98%);
  background:linear-gradient(to bottom, rgba(69,69,69,.8) 0, rgba(0,0,0,.4) 98%);
  box-shadow:1px 1px 5px rgba(0,0,0,.5);
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#CC454545, EndColorStr=#66000000);
  min-height:36px;
  padding:10px 0 0;
  width:100%;
  z-index:10000
}
#header .headerArea h1 img {
  height:31px;
  width:123px
}
.hedLogin {
  padding:8px 0 0
}
#header .headerArea {
  margin:0 auto;
  padding:0 0 0 10px
}
#header .headerArea::after {
  clear:both;
  display:block
}
.after h1 {
  margin-left:-3px
}
.headerArea h1 a {
  display:block;
  height:31px
}
#header .innerNav a {
  color:rgba(255,255,255,.8);
  display:block;
  font-weight:400;
  line-height:31px
}
.loginForm {
  float:right;
  margin-right:5px;
  overflow:visible
}
#footer, #main, .PageTopArea, .TopBtnRed, .acount, .innerNav, .newProjects section {
  overflow:hidden
}
#LoginIndexForm {
  margin-bottom:15px
}
#LoginIndexForm::after {
  clear:both;
  display:block
}
.loginForm ul li {
  background:#ddd;
  border:none;
  border-radius:4px;
  float:left;
  font-size:95%;
  height:22px;
  margin-left:3px;
  width:202px
}
.loginForm ul li label {
  display:none;
  left:3px;
  position:absolute;
  top:2px
}
.loginForm input {
  background:#ddd;
  border:none;
  border-radius:4px;
  font-size:95%;
  height:16px;
  padding:2px 4px;
  position:relative
}
#topBlock01, #topBlock02 {
  border-bottom:1px solid #e3e3e3
}
#topBlock02, #topBlock03 {
  border-top:1px solid #fff
}
.loginForm .mailForm, .loginForm .passForm {
  background-color:rgba(0,0,0,0);
  width:192px
}
.loginForm div, .loginForm ul {
  float:left;
  position:relative
}
.loginForm div p {
  float:left
}
.login .btn {
  box-shadow:none;
  font-size:10px;
  height:22px;
  line-height:18px;
  padding:2px 4px
}
.loginForm .login {
  margin-left:3px
}
.loginForm div .checkBox {
  color:#fff;
  padding:0;
  position:absolute;
  right:0;
  top:22px;
  width:130px
}
.loginForm div .checkBox label {
  font-size:10px;
  margin-bottom:0
}
.loginForm div .checkBox input {
  display:inline;
  margin-right:8px;
  padding-left:10px;
  vertical-align:middle
}
.acount {
  color:rgba(0,0,0,.06);
  display:block;
  font-size:95px;
  height:51px;
  line-height:41px;
  margin-left:10px;
  right:0;
  top:0;
  white-space:nowrap;
  z-index:-1
}
.acount-name {
  color:#ffe184
}
.hedNavLink li a, .hedNavLink2 li a {
  color:#ddd
}
.hedNavLink {
  display:block;
  float:left;
  margin:5px 0 0 10px
}
.hedNavLink li {
  display:block;
  float:left;
  margin-left:20px
}
.hedNavLink2 {
  display:block;
  float:left;
  margin:5px 0 0 10px
}
.hedNavLink2 li {
  display:block;
  float:left;
  margin-left:20px
}
#wrapper {
  margin:0 auto;
  width:100%
}
#main {
  clear:both;
  width:100%
}
.PageTopArea {
  margin:0 auto;
  text-align:right;
}
.PageTopArea p a {
  display:block;
  height:26px
}
.hedNavRit {
  right:10px;
  top:10px
}
.hedNavRit .editingLink, .hedNavRit .noticeLink {
  float:left
}
#loginTopNav {
  float:right;
  margin:0 80px 0 0
}
#loginTopNav .shownav {
  display:none
}
#loginTopNav .navArea {
  margin:0 auto
}
#loginTopNav ul .treeNav {
  float:left;
  padding-right:40px;
  position:relative
}
#loginTopNav ul li .btnLink {
  color:#ddd;
  display:block;
  font-weight:400;
  height:35px;
  line-height:27px
}
#loginTopNav ul li .btnLink::before {
  float:left;
  height:16px;
  margin:5px 3px 0 0;
  width:16px
}
#loginTopNav ul li .btnLink::after {
  clear:both;
  display:block
}
.btnLink.hcompe::before {
  background:url(../img/ico-compe.png) no-repeat rgba(0,0,0,0)
}
.btnLink.hsong::before {
  background:url(../img/ico-songs.png) no-repeat rgba(0,0,0,0)
}
.btnLink.haccount::before {
  background:url(../img/ico-account.png) no-repeat rgba(0,0,0,0)
}
#content {
  clear:both;
  margin:0 auto;
  position:relative;
  width:1078px
}
#footer {
  background:-webkit-gradient(linear, left top, left bottom, color-stop(1, #000), color-stop(0, #232627));
  background:-webkit-linear-gradient(#232627, #000);
  background:linear-gradient(#232627, #000);
  clear:both;
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ff232627, EndColorStr=#ff000000);
  padding:18px 0 19px;
  width:100%
}
.footerArea {
  margin:0 auto;
}
.footerIcn {
  margin:-1px 0 -1px 2px
}
.footerNav {
  margin-left:2px
}
.footerInfo a:hover, .footerNav a:hover {
  color:#ccc;
  text-decoration:underline
}
.footerNav dl {
  float:left;
  margin-right:44px;
  margin-top:3px
}
.footerNav .musicIcn {
  margin-right:0
}
.footerNav dl dt {
  color:#fff;
  font-weight:700;
  height:21px;
  margin-bottom:8px;
  padding-top:1px
}
.footerNav .creationIcn dt {
  background:url(../img/icn_creation.gif) 0 3px no-repeat;
  padding-left:22px
}
.footerNav .creationIcn dd {
  padding-left:22px
}
.footerNav .managementIcn dt {
  background:url(../img/icn_management.gif) 0 2px no-repeat;
  padding-left:24px
}
.footerNav .managementIcn dd {
  padding-left:24px
}
.footerNav .groupeIcn dt {
  background:url(../img/icn_groupe.gif) 0 1px no-repeat;
  padding-left:22px
}
.footerNav .groupeIcn dd {
  padding-left:22px
}
.footerNav .settingIcn dt {
  background:url(../img/icn_setting.gif) 0 2px no-repeat;
  padding-left:21px
}
.footerNav .settingIcn dd {
  padding-left:21px
}
.footerNav .musicIcn dt {
  background:url(../img/icn_music.gif) no-repeat;
  padding-left:26px
}
.footerNav .musicIcn dd {
  padding-left:26px
}
.footerNav dl dd {
  padding-bottom:7px
}
.footerInfo {
  background:url(../img/bg_footerInfo_line.gif) repeat-y;
  float:right;
  margin:0 10px 0 0;
  padding:9px 0 0 45px;
  width:320px
}
.footerInfo ul li {
  float:left;
  margin:0 7px 5px 0
}
.footerInfo ul .footerNavL {
  width:155px
}
.footerInfo ul li a:hover {
  padding-bottom:2px
}
.footerInfo ul li a {
  color:#fff;
  font-size:92%
}
#copyright {
  background:-webkit-linear-gradient(#000, #232627) rgba(0,0,0,0);
  background:linear-gradient(#000, #232627) rgba(0,0,0,0);
  color:#fff;
	padding-bottom: 2rem;
	display: inline-block;
  text-align:center;
  width:100%
}
#rrr form, .rrr-li select {
  margin-bottom:0
}
.show {
  max-height:none!important
}
#pannav {
  margin-bottom:10px
}
#UserBt {
  display:none
}
#LoginRemember {
  margin:0 5px 2px 0;
  padding:0
}
.checkBox label {
  display:inline
}
#closeBt {
  display:none
}
@media only screen and (max-width:580px), only screen and (min-device-pixel-ratio :1.5) and (max-device-width:1080px), only screen and (-webkit-min-device-pixel-ratio :1.5) and (max-device-width:1080px) {
body {
  font-size:14px;
  overflow-x:hidden;
  padding-bottom:0;
  width:100%
}
#wrapper {
  height:100%;
}
#footer {
  padding:0
}
header {
  min-width:inherit;
  padding:3px 0
}
#copyright {
  min-width:0
}
.footerInfo ul li {
  background-image:url(https://artistcrowd.jp/img/arrow_wh.png);
  background-position:95% 50%;
  background-repeat:no-repeat;
  background-size:14px;
  border-bottom:solid 2px #333;
  line-height:40px;
  margin:0!important;
  text-indent:10px;
  width:100%!important
}
.footerInfo ul li:first-child {
  border-top:solid 2px #333
}
.footerInfo ul li a {
  display:block;
  line-height:40px;
  text-decoration:none;
  width:100%
}
#loginTopNav.opened ul li>a img, .footerIcn, footer .footerNav {
  display:none
}
footer .footerInfo ul li a:hover {
  background-color:rgba(255,255,255,.1);
  padding:0;
  text-decoration:none
}
#loginTopNav.opened ul li.treeNav:nth-child(1)>a:after {
  content:'\30af\30ea\30a8\30fc\30b7\30e7\30f3'
}
#loginTopNav.opened ul li.treeNav:nth-child(2)>a:after {
  content:'\30de\30cd\30fc\30b8\30e1\30f3\30c8'
}
#loginTopNav.opened ul li.treeNav:nth-child(3)>a:after {
  content:'\30b0\30eb\30fc\30d7\4f5c\6210'
}
#loginTopNav.opened ul li.treeNav:nth-child(4)>a:after {
  content:'\8a2d\5b9a'
}
#loginTopNav.opened ul li.treeNav:nth-child(5)>a:after {
  content:'\697d\66f2\7ba1\7406'
}
#loginTopNav.opened ul.innerNav li {
  border-bottom:1px solid #3e4345;
  width:100%
}
#loginTopNav.opened ul.innerNav li:last-child {
  border-bottom:none
}
.PageTopArea {
  width:90%
}
footer {
  padding:0
}
footer .footerArea {
  width:100%
}
footer .footerArea .footerIcn img {
  height:31px!important;
  width:123px!important
}
footer .footerInfo {
  font-size:12px;
  clear:both;
  float:none;
  margin:0;
  padding:0;
  width:auto
}
footer .footerInfo ul li {
  margin:0 20px 10px 0
}
footer .footerInfo ul li.footerNavL {
  width:auto
}
}