@charset "UTF-8";
.base {
  box-sizing: border-box;
  font-size: 4.16666667vw; /*32px*/
}
@media only screen and (min-width: 40em ) { /*幅640px*/
	.base {
	 font-size:2.08604954vw;
	 /* font-size: 16px;*/
  }
}
@media only screen and (min-width: 48em ) { /*幅768px*/
  .base {
    /*font-size: 1.58730159vw;*/
	 /*font-size:1.334444537vw; 1200*/
   font-size:1.291364vw;
	 /* font-size: 16px;*/
  }
}

@media only screen and (min-width: 77.5em ) { /*幅1240px*/
  .base {
    font-size: 100%; 
  }
}
/**base.css 上書き**************************/
.main-conts{
	padding: 0 .625em;
	box-sizing: border-box;
}
@media only screen and (min-width: 48em ) {
  .main-conts{
    padding: 0 1em;
  }
}
@media only screen and (min-width: 75em ) { /*幅1200px*/
  .main-conts{
    padding: 0;
  }
}
.breadcrumbs-in{
	margin-left:0;
	margin-bottom: 0;
	padding: 0;
}
.breadcrumbs-in li {
    margin-right: 0;
	padding-right:.5625em;
	margin-top: 0;
}
.breadcrumbs-in a{
	color: #555;
	font-size: .7em;
}
.breadcrumbs-in li:before{
	/*content: url(./images/icon/icon-folder-brc.png);*/
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: scale(0.7);
    transform: scale(0.7);
}
@media only screen and (min-width: 48em ) {
	.breadcrumbs-in{
		margin-left:2em;
	}
	.breadcrumbs-in li {
		margin-right:5px;
		padding-right:18px;
	}
	.breadcrumbs-in a{
		font-size: 1em;
	}
	.breadcrumbs-in li:before{
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
/*--------------------------------------------------------
ヘッダー
--------------------------------------------------------*/


#header{
	background: -webkit-gradient(linear, left top, right bottom, from(#000), color-stop(0.25, #000), color-stop(0.25, #333), color-stop(0.5, #333), color-stop(0.5, #000), color-stop(0.75, #000), color-stop(0.75, #333), to(#333));
	background: -moz-linear-gradient(-45deg, #000 25%, #333 25%, #333 50%, #000 50%, #000 75%, #333 75%, #333);
	background: linear-gradient(-45deg, #000 25%, #333 25%, #333 50%, #000 50%, #000 75%, #333 75%, #333);
	background-size: 5px 5px;
}

#header h1{
	margin: 0;
	padding:0;
	font-size:.94em;
	line-height:1.7em;
	font-family: 'Noto Sans Japanese', serif;
	font-weight:900;
}


/*●ヘッダーロゴテキスト*/
.header-logo a{ text-decoration: none; }

.header-logo a:link,
.header-logo a:visited{ color: #333; }
.header-logo a:hover,
.header-logo a:active{ color: #f60; }

@media only screen and (min-width: 48em ) {
	#header{
		background-image:url(images/studio246/bg_bk.gif);
		font-size: 1.2em;
		width:100%;
	}
	
}
/*--------------------------------------------------------
新ヘッダー　マイページログイン用2017 1/5作成開始
--------------------------------------------------------*/
#header_mypage{
	background-image:url(images/studio246/bg_bk.gif);
	font-size: 1.2em;
	width:100%;
}

#header-in{
	width:100%;
	margin:0 auto;
	padding: 0;
}

/*●ヘッダーロゴ（メインタイトル）*/
#header-logo{
	float: left;
	width: 3.125em; /*ロゴ（メインタイトル）下の<h1>の1行の幅はこちらのwidthの値を変更*/
}
#header-logo p{
	margin:0;
}
#header-title{
	float: left;
	width: auto; /*ロゴ（メインタイトル）下の<h1>の1行の幅はこちらのwidthの値を変更*/
	margin:.625em 0 0 1em;
	font-size:0.66em;
	padding:0;
}
#header-title p{
	margin: 0;
	padding:0;
	font-size:.94em;
	line-height:1.7em;
	font-family: 'Noto Sans JP';
	font-weight:900;
}

@media only screen and (min-width: 40em ) {
	#header-logo {
		float: left;
		width: 6.25em;
	}
	#header-title{
		margin:1.875em 0 0 .3125em;
		margin:1.5625em 0 0 .625em;
		font-size:0.8em;
	}
}
@media only screen and (min-width: 48em ) {
	#header-logo {
		float: left;
		width: 100px;
	}
	#header-title{
		margin:30px 0 0 5px;
		margin:25px 0 0 10px;
		font-size:0.8em;
	}
}
#header_mypage h1{
	margin: 0;
	padding:0;
	font-size: 1.5em;
	line-height:1.7em;
	font-family: 'Noto Sans Japanese', serif;
	font-weight:900;
}
#header-title a{
	color:#FFF;
	text-decoration:none;
}
#header-title a:hover{
	text-decoration: underline;
}

/*●ヘッダーロゴテキスト*/
.header-logo a{ text-decoration: none; }

.header-logo a:link,
.header-logo a:visited{ color: #333; }
.header-logo a:hover,
.header-logo a:active{ color: #f60; }


/*●ヘッダーテキスト・右上の文章*/
#header-in #header-text{
	float:right;
/*	width: 40%; /*・1行の幅はwidthの値を変更*/
	font-size:0.8em;
	font-weight:normal;
	vertical-align:bottom;
	color: #333;
	text-align:right;
	margin-right:10px;
	display:none;
}
#header-in #header-text p{
	margin-top:30px;
	padding:0 0 5px 0;
	font-size:0.75em;
	color:#FFF;
}
@media only screen and (min-width: 48em ) {
	#header-in #header-text{
		display:block;
	}
}
/*--------------------------------------------------------
バナー コンテンツ
--------------------------------------------------------*/
#contents_bnr{
	width:100%;
	margin:0 auto;
	background:url(images/studio246/bg_bk.gif);
	padding: 1.25em 0.9375em;
	overflow:auto;
	box-sizing: border-box;
}
#contents_bnr ul{
	/*width:1200px;*/
	max-width: 1200px;
	margin:0 auto;
	padding:0;
}
#contents_bnr li{
	text-decoration:none;
	list-style:none;
	padding:0;
	margin:0 0 .8em 0;
	float:left;
	width: 49%;
}
#contents_bnr li:nth-child(2n){
	float: right;
}
#contents_bnr li:nth-child(3){
	float: right;
}
#contents_bnr img{
	width:100%;
}
#contents_bnr li .youtube img{
	margin:0;
	padding:0;
	width:14.375em;
	height:auto;
}
@media only screen and (min-width: 40em ) {
	#contents_bnr{
		padding:1.25em;
	}
	#contents_bnr li{
		width: 14em;
		margin:0 .625em .8em 0;
	}
	#contents_bnr li:nth-child(2n){
		float: left;
	}
	#contents_bnr li:nth-child(3){
		float: left;
	}
	#contents_bnr li .youtube img{
		margin:0;
		padding:0;
		width: 14em;
		height:10em;
	}
}
@media only screen and (min-width: 48em ) {
	#contents_bnr{
		padding:1.25em .2em;
		box-sizing: border-box;
	}
	#contents_bnr li{
		width: 14em;
		margin:0 .525em .8em 0;
	}
	#contents_bnr li:nth-child(2n){
		float: left;
	}
	#contents_bnr li:nth-child(3){
		float: left;
	}
	#contents_bnr li:nth-child(4){
	}
	#contents_bnr li .youtube img{
		margin:0;
		padding:0;
		width: 14em;
		height:9.8em;
	}
}
@media only screen and (min-width: 75em ) {
	#contents_bnr li{
		width: 14.375em;
	}
	#contents_bnr li .youtube img{
		width: 14.375em;
		height:10em;
	}
}
/*--------------------------------------------------------
フッター
--------------------------------------------------------*/

#footer{
	clear: both;
	background:url(images/studio246/bg_red.gif);
	color: #fff;
	/*font-size: 1.5em;*/
	width:100%;
}
#footer h4{
	/*font-size:1.3em;*/
	font-family: 'Noto Sans Japanese', serif;
	font-weight:900;
}
#footer-in{
	/*width:1200px;*/
	max-width: 1200px;
	padding:.9375em;
	margin:0 auto;
	font-size:1em;
}

#footer-in .left_w60{
	width:60%;
	font-size:1.2em;
}
#footer-in .left_w60 img{
	width:120px;
	margin:5px 0 10px 0;
	vertical-align:middle;
}
#footer-in .right_w40{
	width:40%;
	text-align:right;
}
#footer-in .right_w40 img{
	margin:0 0 0 20px;
	max-height:30px;
}
@media only screen and (min-width: 48em ) {
	#footer-in{
		padding:20px 2em;
		font-size:0.75em;
	}
}

#footer a:link,
#footer a:visited{ color: #fff; text-decoration:none; }
#footer a:hover,
#footer a:active{ color: #ff0; }


#footer-in li{
	list-style: none;
}


#footer .footer_area01{
	float: none;
	width: 100%;
}

#footer .footer_area02{
	float: none;
	width: 100%;
}

#footer .footer_area03{
	float: none;
	width: 100%;
}
#footer .footer_area01 p,
#footer .footer_area02 p,
#footer .footer_area03 p{
	margin:5px 0;	
}
@media only screen and (min-width: 48em ) {
	#footer .footer_area01{
		float: left;
		width: 33%;
	}

	#footer .footer_area02{
		float: left;
		width: 33%;
	}

	#footer .footer_area03{
		float: left;
		width: 33%;
	}
}

/*●フッターメニュー*/
#footer .footer-menu{
	overflow: hidden;
}

#footer .footer-menu ul{
	float: left;
	width: 42%;
	margin-right: 5%;
	padding: 1%;
}

#footer .footer-menu ul ul{
	float: none;
	width: auto;
	margin-top: 1em;
	margin-right: 0;
}

.footer-menu li{
	margin-bottom: 5px;
	padding: 0px 0 3px;
	padding-left: 25px;
	background: url(../images/icon/icon-arrow02.png) left top no-repeat;
}

.footer-menu li li{
	padding-left: 15px;
	padding-top: 0;
	background: url(../images/icon/icon-arrow03.png) left 5px no-repeat;
}


/*●フッターバナー*/
#footer-banner{
	clear: both;
	padding: 20px 0;
	border-top: 1px solid #ccc;
}

#footer-banner li{
	display: inline;
	list-style: none;
}


/*●コピーライト*/
.copyright{
	padding: 15px 0;
	background: #eaeaea;
	font-size: 1.2em;
	text-align: center;
}


/*●フッターモバイル用TEL*/
#footer_tel,#footer_tel .box{
	display:none;
	
}
/*●コピーライト*/
.copyright{
	padding: 15px 0;
	background: #eaeaea;
	text-align: center;
	color: #000;
}
.copyright p{
	margin: 0;
	font-size: .6em;
}
/**********************************************************************************************/

h1.title-main{
	width:100%;
	height:100%;
	padding: 0;
	background: #ececec;
	color: #000;
	font-weight: bold;
	font-size: 1.75em;
	margin: .09375em 0 .625em;
}
h1.title-main span{
	padding:.15625em .3125em;
	display: block;
}
@media only screen and (min-width: 48em ) {
	h1.title-main{
	margin: 1em 0 1.25em;
	}
	h1.title-main span{
		padding:.5em .89285714em;
	}
}
h1.title-main:after {
content:"";
display:block;
height:4px;
width:100%;
background: #e80c02; /* Old browsers */
background: -moz-linear-gradient(left, #e80c02 15%, #b8b8b8 15%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #e80c02 15%,#b8b8b8 15%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #e80c02 15%,#b8b8b8 15%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e80c02', endColorstr='#b8b8b8',GradientType=1 ); /* IE6-9 */

}
.history-txt{
	font-size: 1em;
	margin-bottom: 1.5625em;
}
@media only screen and (min-width: 48em ) {
	.history-txt{
		font-size: 1.125em;
		margin-bottom: 4em;
	}
}
/***********/
.tab-area{
	background: url(images/studio246/bg01.jpg);
	margin-bottom: 4.375em;
}
#tab{
	margin: 0;
	border-left: .125em solid #CCC;
	border-right: .125em solid #CCC;
}

.history-tab li {
  float: left;
	margin: 0;
  padding:0 0 .25em;
  width: 50%;
  list-style: none;
  cursor: pointer;
  background:url(images/studio246/bg01.jpg) #eee;
  box-sizing: border-box;
  text-align: center;
}

.history-tab li p span{
	background: url(images/studio246/icon01_off.png) 0 50% no-repeat;
	background-size: .625em;
	padding:.5em 1em;
	font-size:.9em;
	font-weight: bold;
	color: #FFF;
}

.history-tab li.select {
	background: url(images/studio246/icon02.png) no-repeat 50% bottom ;
	background-size: .6em;
}
.history-tab li p{
	padding:.625em 0;
	margin: 0;
	/*background: #b8b8b8;*/
	background: #909090;
}
.history-tab li:hover p{
	background: #b8b8b8;
	/*background: #dcdcdc;*/
}
.history-tab li.select p{
	background: #e80c02;
}
.history-tab li.select p span{
	background: url(images/studio246/icon01_on.png) 0 50% no-repeat;
	background-size: .625em;
}
@media only screen and (min-width: 40em ) {
	.history-tab li {
		padding:0 0 8px;
	}
	.history-tab li p{
		padding:1.5em 0;
	}
	.history-tab li p span{
		background-size: auto;
		padding:.5em 2.5em;
		font-size:1.375em;
	}
	.history-tab li.select p span{
		background-size: auto;
	}
	.history-tab li.select {
		background-size: auto;
	}
}
@media only screen and (min-width: 48em ) {
	.history-tab li {
		padding:0 0 8px;
	}
	.history-tab li p{
		padding:1.5em 0;
	}
	.history-tab li p span{
		background-size: auto;
		padding:.5em 2.5em;
		font-size:1.375em;
	}
	.history-tab li.select p span{
		background-size: auto;
	}
	.history-tab li.select {
		background-size: auto;
	}
}

.disnon {
  display: none;
}
.content_wrap {
	border-left: .125em solid #CCC;
	border-right: .125em solid #CCC;
	border-bottom: .125em solid #CCC;
	padding: .28125em;
}
@media only screen and (min-width: 48em ) { 
  .content_wrap {
	padding: 1.5625em .8125em;
  }
}

/****history*************************/
.history-list{
	margin: 0;
	padding: 0;
	list-style: none;
  display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -moz-flex;
display: flex;
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.history-list > li{
	float: left;
	text-align: left;
  margin: 0 .2em .5em 0;
  width: 32.5%;
	padding: 0;
}
.history-list > li a{
	text-decoration: none;
}
.history-list > li a:hover{
	color: #f60;
}
.history-list > li a:hover .day span{
	border: 1px solid #f60;
}
.history-list > li:nth-child(3n){
  margin: 0 0 2.1875em 0;
}
.history-list > li:nth-child(4),.history-list > li:nth-child(7),.history-list > li:nth-child(10),
.history-list > li:nth-child(13),.history-list > li:nth-child(16),.history-list > li:nth-child(19),
.history-list > li:nth-child(22),.history-list > li:nth-child(25),.history-list > li:nth-child(28),
.history-list > li:nth-child(31),.history-list > li:nth-child(34),.history-list > li:nth-child(37),
.history-list > li:nth-child(40),.history-list > li:nth-child(43){
	clear: both;
}
.history-list > li:nth-child(6n+1) {
  clear: both;
}
@media only screen and (min-width: 40em ) {
	
	.history-list > li{
		margin: 0 .475em 2.1875em 0;
    width: 32.5%;
	}
	.history-list > li:nth-child(2n){
		float: left;
	}
	.history-list > li:nth-child(2n+1){
		clear:none;
	}
  
	/*.history-list > li:nth-child(3n) {
		margin: 0 0 2.1875em 0;
	}*/
  .history-list > li:nth-child(3n){
    margin: 0 0 1.56255em 0;
  }
	.history-list > li:nth-child(7) {
		clear: both;
	}
	.history-list > li:nth-child(13),.history-list > li:nth-child(19),.history-list > li:nth-child(25),
  .history-list > li:nth-child(31),.history-list > li:nth-child(37),.history-list > li:nth-child(43){
		clear: both;
	}
}
@media only screen and (min-width: 48em ) {
  .history-list > li{
		margin: 0 .75em 1.56255em 0;
		width: 24.2%;
	}
  .history-list > li:nth-child(4n){
    margin: 0 0 1.56255em 0;
  }
  .history-list > li:nth-child(3n){
    margin: 0 .75em 1.56255em 0;
  }
  .history-list > li:nth-child(6n) {
      margin: 0 0 1.56255em 0;
  }
  
}
@media only screen and (min-width: 58.75em ) {
	.history-list > li{
		margin: 0 .75em 1.56255em 0;
		/*width: 11.5625em;*/
    width: 15.8%;
	}
  .history-list > li:nth-child(4n){
    margin: 0 .75em 1.56255em 0;
  }
	.history-list > li:nth-child(6n) {
		margin:0 0 1.56255em 0;
	}
}
@media only screen and (min-width: 75em ) {
	.history-list > li{
		margin: 0 .75em 1.56255em 0;
		width: 11.5625em;
	}
	.history-list > li:nth-child(6n) {
		margin:0 0 1.56255em 0;
	}
}

.history-list > li img{
	width: 100%;
}


.history-list li .img{
	background: url(images/studio246/bg02.jpg);
	text-align: center;
	padding:.25em;
	width: 100%;
	margin: 0 auto .5em;
	box-sizing: border-box;
}
.history-list > li .day{
	margin: 0 0 .25em;
}
.history-list > li .day time{
	border: 1px solid #000;
	padding: .2em .35em;
}
.history-list > li .title{
	font-size: .625em;
	line-height: 1.625em;
	margin: 0;
	font-weight: bold;
}
@media only screen and (min-width: 40em ) {
	.history-list > li .img{
		width: 100%;
		padding:.4375em;
		margin: 0 auto .75em;
	}
	.history-list > li .day{
		margin: 0 1em .25em;
	}
	.history-list > li .title{
		font-size: 1.0625em;
		margin: 0 1em;
	}
	.history-list > li:nth-child(6n+1) {
		clear:both;
	}
}

@media only screen and (min-width: 48em ) {
	.history-list > li .img{
		width: 100%;
		padding:.4375em;
		margin: 0 auto .5em;
	}
	.history-list > li .day{
		margin: 0 1em .25em;
	}
	.history-list > li .title{
		font-size: 1.4em;
		margin:0 .3em;
	}
	.history-list > li:nth-child(6n+1) {
		clear: both;
	}
}
@media only screen and (min-width: 58.75em ) {
  .history-list > li .img{
		width: 100%;
		padding:.4375em;
		margin: 0 auto .5em;
	}
	.history-list > li .day{
		margin: 0 1em .25em;
	}
	.history-list > li .title{
		font-size: .8125em;
		margin:0 .3em;
	}
	.history-list > li:nth-child(6n+1) {
		clear: both;
	}
}
/****engineer-box*************************/
.engineer-area{
	 padding: .71875em;
}
@media only screen and (min-width: 48em ) {
	.engineer-area{
		 padding: 1.5625em;
	}
}
.engineer-area h2{
	margin: 0;
	margin-bottom: 1em;
	padding: .25em .8em;
	/*background:#034396;*/
	background:#555;
	font-size: 1em;
}
@media only screen and (min-width: 48em ) {
	.engineer-area h2{
		font-size: 1.5em;
	}
}
.engineer-area article{
	background: #030303;
	padding: .3125em;
	width: auto;
	margin-bottom: .78125em;
}
.engineer-area article:hover{
	color: #818181;
}
.engineer-area article a{
	display: block;
	text-decoration: none;
}
.engineer-area article a:hover .txt{
	color:#AFAFAF;
}
.engineer-area article .img{
	display: table-cell;
	width:8.75em;
	text-align: center;
}
.engineer-area article .img{
    box-sizing: border-box; 
    -ms-flex-negative: 0; 
    flex-shrink: 0; 
    height:6.75em; 
    margin-right: 1.5625em; 
    overflow: hidden; 
    position: relative;
}
.engineer-area article .img img { 
    width: 100%;
    height: auto;
    margin: auto; 
    position: absolute; 
    right: -6.25em; 
    left: -6.25em; 
    /*top: -2.25em;*/
}
.engineer-area article .txt{
	display: table-cell;
	color: #FFF;
	font-family: 'Poppins', sans-serif;
	vertical-align: middle;
	text-align: center;
	font-size: 1em;
	font-weight: bold;
	width: 11.40625em;
}
.engineer-area article .txt span{
	font-size: .77777778em;
	display: block;
}
@media only screen and (min-width: 40em ) {
	.engineer-area article{
		padding: .625em;
		width: 97%;
		margin-bottom: 1.875em;
	}
	.engineer-area article .img{
		width: 26.5em;
    	height:11.75em; 
	}
	.engineer-area article .img img { 
		/*top:-1.25em;*/
	}
	.engineer-area article .txt{
		font-size: 2em;
		width: 23.3333333em;
	}
	.engineer-area article .txt span{
		display:inline;
	}
}
@media only screen and (min-width: 48em ) {
	.engineer-area article{
		padding: .625em;
		width: 98.33%;
		margin-bottom: 1.875em;
	}
	.engineer-area article .img{
		width: 17.5em;
	}
	.engineer-area article .img img { 
		/*top: -3.25em;*/
	}
	.engineer-area article .txt{
		font-size: 2.25em;
		width: 23.3333333em;
	}
	.engineer-area article .txt span{
		display:inline;
	}
}

/****engineer-detai
***************************************************************************/


.engineer-tab li {
  float: left;
	margin: 0;
  padding:0 0 .25em;
  width: 33.333%;
  list-style: none;
  cursor: pointer;
  background:url(images/studio246/bg01.jpg) #eee;
  box-sizing: border-box;
  text-align: center;
	border-right: 1px solid #FFF;
}

.engineer-tab li:last-child{
	border-right:none;
}
.engineer-tab li p span{
	background: url(images/studio246/icon01_off.png) 0 50% no-repeat;
	background-size: .625em;
	padding:.5em .75em;
	font-size:.9em;
	font-weight: bold;
	color: #FFF;
}

@media only screen and (min-width: 48em ) {
	.engineer-tab li p span{
		padding:.5em 1em;
	}
}
.engineer-tab li.select {
  background: url(images/studio246/icon02.png) no-repeat 50% bottom ;
	background-size: .6em;
}
.engineer-tab li p{
	padding:.625em 0;
	margin: 0;
	background: #909090;
}
.engineer-tab li:hover p{
	background: #b8b8b8;
	/*background: #dcdcdc;*/
}
.engineer-tab li.select p{
	background: #e80c02;
}
.engineer-tab li.select p span{
	background: url(images/studio246/icon01_on.png) 0 50% no-repeat;
	background-size: .625em;
}


@media only screen and (min-width: 40em ) {
	.engineer-tab li {
		padding:0 0 8px;
	}
	.engineer-tab li p{
		padding:1.5em 0;
	}
	.engineer-tab li p span{
		background-size: auto;
		padding:.5em 1.5em;
		font-size:1.375em;
	}
	.engineer-tab li.select p span{
		background-size: auto;
	}
	.engineer-tab li.select {
		background-size: auto;
	}
}
@media only screen and (min-width: 48em ) {
	.engineer-tab li {
		padding:0 0 8px;
	}
	.engineer-tab li p{
		padding:1.5em 0;
	}
	.engineer-tab li p span{
		background-size: auto;
		padding:.5em 2em;
		font-size:1.375em;
	}
	.engineer-tab li.select p span{
		background-size: auto;
	}
	.engineer-tab li.select {
		background-size: auto;
	}
}
.profile-area{
	padding:1.09375em;
}
.profile-area h2{
	border-bottom: 1px dashed #000;
	background: none;
	font-size: 1.125em;
	padding: .3125em 0;
	margin:0 0 .625em;
	color: #000;
	font-weight: bold;
}
.profile-area p{
	margin-bottom: 1.5625em;
}
.profile-area h2 span{
	border-left: 4px solid #000;
	padding: .15em .5em;
}
@media only screen and (min-width: 40em ) {
	.profile-area{
		padding:2.1875em;
	}
	.profile-area h2{
		padding: .5em 0;
		margin:0 0 .625em;
		font-size: 1.3125em;
	}
	.profile-area h2 span{
		border-left: 4px solid #000;
		padding: .3em .5em;
	}
}
@media only screen and (min-width: 48em ) {
	.profile-area{
		padding:2.1875em;
	}
	.profile-area h2{
		padding: .5em 0;
		margin:0 0 .625em;
		font-size: 1.3125em;
	}
	.profile-area h2 span{
		border-left: 4px solid #000;
		padding: .3em .5em;
	}
}
h1.title-detail{
	background: #000;
	color:#FFF;
	font-family: 'Poppins', sans-serif;
	font-size: 1.2em;
}
@media only screen and (min-width: 40em ) {
	h1.title-detail{
		font-size: 1.75em;
	}
}
@media only screen and (min-width: 48em ) {
	h1.title-detail{
		font-size: 1.75em;
	}
}
/***************************/
.song-detail-area{
	margin:0;
}
.name-area{
	padding:1.09375em;
	background: #CFCFCF;
	margin-bottom: .9375em;
}
.name-area p{
	margin: 0;
}
.name-area p.charge span:last-child {
	display: none;
}


@media only screen and (min-width: 48em ) {
	.song-detail-area{
		margin:2.1875em 2.8125em;
	}
	.name-area{
		padding:.937em;
		margin-bottom:1.16875em;
	}

.single .name-area{
	display: table;
	width: 100%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

.single .name-area .eye-catch,
.single .name-area .charge-box{
	display: table-cell;
	float: none;
	vertical-align: middle;
	text-align: left;
	table-layout: auto;
}

.single .name-area .eye-catch{
	margin-left: 1em;
	padding-right: 1em;
}

.single .name-area .eye-catch{
	width: 120px;
}

.single .name-area .eye-catch img{
	max-width: 120px;
}

}

/*--------------------------------------------------------
ページトップ
--------------------------------------------------------*/

.page-top{
	position: fixed;
	right: 0;
	bottom: 30px;
	z-index: 99;
	width: 143px;
	line-height:1.4rem;
	color: #fff;
	font-size: 0.9rem;
	text-align: left;
}

.page-top img{
	width:25px;
	margin:0 0 0 10px;
}

* html .page-top{ display: none; }

.page-top a{
	display: none;
	padding: 10px;
	padding-left: 22px;
	border: 0px solid #fff;
	border-right: 0;
	text-decoration: none;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
}

.page-top a:link,
.page-top a:visited{
	background: url(images/bg_bk_opacity.png);
	color: #FFF;
}

.page-top a:hover,
.page-top a:active{
	background:#eaeaea;
	color: #333;
}

.page-top-mobile, .page-top-mobile img{
	display:none;
}
.page-top{
	  display:none;
}
.page-top-mobile{
    display:block;
    position:fixed;
    right: 3%;
    bottom:30px;
    z-index:99;
    width:100%;
}
.page-top-mobile img{
  display:block;
  width:11%;
  float:right;
}
@media only screen and (min-width: 48em ) {
/*---以下モバイル用---*/
  .page-top{
	  display: block;
  }
  .page-top a{
	  display: block;
  }
  .page-top-mobile{
	  display: none;
  }
}