@charset "UTF-8";
/*********************************************
	KM MUSIC Inc. Web Site's css

	ー index.css ー

*********************************************/

/* --------------------

	mainVisual

-------------------- */
#wrapper main #mainVisual {
	width: 804px;
	/*height: 340px; 2019.02.21 変更*/
	height: 415px;
	background-color: #ff9900;
	overflow: hidden;
	position: relative;
}
#wrapper main #mainVisual img {
	width: 100%;
	position: absolute;
	/*top: -25px; 2019.02.21 削除*/
}


/* --------------------

	container [点滅ボタン]

-------------------- */
#wrapper main #headline .container .btnBlink {
	position: absolute;
	top: 30px;
	right: 0;
	width: 240px;
	text-align: center;
	color: #fff;
	background-color: #3366cc;
	border-radius:5px;
	padding: 0.50em 0;
	animation: blink 1.0s linear infinite normal;
	-webkit-animation: blink 1.0s linear infinite normal;
	-moz-animation: blink 1.0s linear infinite normal;
	-o-animation: blink 1.0s linear infinite normal;
}
#wrapper main #headline .container .btnBlink p:before {
	position: absolute;
	top: 25%;
	left: 2.00em;
	content: url("../img/triangle2.png");
}
#wrapper main #headline .container .btnBlink p {
	padding-left: 1.50em;
}
#wrapper main #headline .container .btnBlink a {
	color: #fff;
}
a:hover {
	animation:none;
	-webkit-animation:none;
}
@-webkit-keyframes blink{
    0% { background: #2f5fbe; }
   64% { background: #80aafd; }
 100% { background: #80aafd; }
}
@-moz-keyframes blink{
    0% { background: #2f5fbe; }
  64% { background: #80aafd }
 100% { background: #80aafd }
}
@keyframes blink{
   0% { background: #2f5fbe }
  64% { background: #80aafd }
 100% { background: #80aafd }
}

/* --------------------

	container [list]

-------------------- */
#wrapper main #headline .container ul li {
	margin-top: 1.31em;
	width: 100%;
	border: 1px solid #ccc;
	padding: 1.88em;

}
#wrapper main #headline .container ul li:hover {
	opacity: 0.8;
	background: #f9fafa;
	border: 1px solid #3366cc;
	text-decoration: none;
	color: #000;
}
#wrapper main #headline .container ul li.noPage:hover {
	opacity: 1.00;
	background: #fff;
	border: 1px solid #ccc;
	text-decoration: none;
	color: #000;
}
#wrapper main #headline .container ul a:hover {
	text-decoration: none;
}
#wrapper main #headline .container ul li a:visited,
#wrapper main #headline .container ul li a p {
	color: #000;
}

/* ==========================

　テキスト + 画像（共通）

========================== */

#wrapper main #headline .container ul li .nameArtist {
	font-size: 1.38em;
	font-weight: bold;
	padding-bottom: 0.88em;
	color: #000;
}

/***
 Diskリリース情報
 ***/
 #wrapper main #headline .container ul li .releaseDisc {
	/*border: 1px dashed #ccc;*/
	margin-top: 1.00em;
	padding: 0.50em;
	background: #f5f5f5;
}
#wrapper main #headline .container ul li .releaseDisc .imgDisc {
	float: left;
	overflow: hidden;
	position: relative;
	width: 120px;
	margin-right: 1.50em;
}
#wrapper main #headline .container ul li .releaseDisc .imgDisc img {
	width: 100%;
}
#wrapper main #headline .container ul li .releaseDisc .infoDisc {
	font-size: 0.75em;
	letter-spacing: 0.08em;
}
#wrapper main #headline .container ul li .releaseDisc .infoDisc .titleDisc {
	font-size: 1.25em;
	font-weight: bold;
	color: #ccc;
}

/***
 左
 ***/
/* テキストが左 */
#wrapper main #headline .container ul li .listDetailLeft {
    float: left;
	width: 315px;
	color: #000;
}
/* 画像が左 */
#wrapper main #headline .container ul li .imgArtistLeft {
    float: left;
	width: 320px;
}
/*#wrapper main #headline .container ul li .imgArtistLeft div {
	overflow: hidden;
	position: relative;
}*/


/***
 右
***/
/* テキストが右 */
#wrapper main #headline .container ul li .listDetailRight {
    float: right;
	width: 315px;
	color: #000;
}
/* 画像が右 */
#wrapper main #headline .container ul li .imgArtist {
    float: right;
	width: 320px;
}
/*#wrapper main #headline .container ul li .imgArtist div {
	overflow: hidden;
	position: relative;
}*/



/******
 画像
******/
/* 画像（横1つ） */
#wrapper main #headline .container ul li .imgArtist .layout1,
#wrapper main #headline .container ul li .imgArtistLeft .layout1 {
	width: 320px;
	overflow: hidden;
	position: relative;
}
/* 画像（2つ横並び） */
#wrapper main #headline .container ul li .imgArtist .layoutRow,
#wrapper main #headline .container ul li .imgArtistLeft .layoutRow {
	float: left;
	width: 160px;
	overflow: hidden;
	position: relative;

}
/* 画像（2つ縦並び） */
#wrapper main #headline .container ul li .imgArtist .layoutCol150,
#wrapper main #headline .container ul li .imgArtistLeft .layoutCol150 {
	height: 150px;
	overflow: hidden;
	position: relative;
}
/* #wrapper main #headline .container ul li .imgArtist div img,
#wrapper main #headline .container ul li .imgArtistLeft div img {
	position: absolute;
  	top: 50%;
  	left: 50%;
  	-webkit-transform: translate(-50%, -50%);
 	-ms-transform: translate(-50%, -50%);
  	transform: translate(-50%, -50%);
}*/
#wrapper main #headline .container ul li .imgArtist div img.w100,
#wrapper main #headline .container ul li .imgArtistLeft div img.w100 {
  	width: 100%;
  	height: auto;
	position: absolute;
  	top: 50%;
  	left: 50%;
  	-webkit-transform: translate(-50%, -50%);
 	-ms-transform: translate(-50%, -50%);
  	transform: translate(-50%, -50%);
}
#wrapper main #headline .container ul li .imgArtist div img.h100,
#wrapper main #headline .container ul li .imgArtistLeft div img.h100 {
  	width: auto;
  	height: 100%;
	position: absolute;
  	top: 50%;
  	left: 50%;
  	-webkit-transform: translate(-50%, -50%);
 	-ms-transform: translate(-50%, -50%);
  	transform: translate(-50%, -50%);
}

/* 画像（トリミングなし） 2016.06.28追加 */
#wrapper main #headline .container ul li .imgArtist .noTrimming,
#wrapper main #headline .container ul li .imgArtistLeft .noTrimming {
	position: inherit;
}
#wrapper main #headline .container ul li .imgArtist .noTrimming img,
#wrapper main #headline .container ul li .imgArtistLeft .noTrimming img {
  	width: 100%!important;
  	height: auto!important;
	position: inherit!important;
  	top: 0!important;
  	left: 0!important;
  	-webkit-transform: inherit!important;
 	-ms-transform: inherit!important;
  	transform: inherit!important;
}


/******
 テキスト
******/
#wrapper main #headline .container ul li .imgArtist p,
#wrapper main #headline .container ul li .imgArtistLeft p {
  	font-size: 0.75em;
	text-align: center;
}


#wrapper main #headline .container ul li .nameTour {
	font-size: 0.88em; /* 14px */
	letter-spacing: 0.08em;
	font-weight: bold;
	padding-bottom: 1.85em;
	color: #000;
}
#wrapper main #headline .container ul li .infoBox {
	border-top: 1px dashed #CCC;
	border-bottom: 1px dashed #CCC;
	font-size: 0.75em;
	letter-spacing: 0.08em;
	padding: 1.00em;
	margin: 1.00em 0 1.34em;
}

#wrapper main #headline .container ul li .releaseDetail {
	margin-bottom: 1.20em;
	color: #333;
}
#wrapper main #headline .container ul li .releaseDetail .dateSchedule,
#wrapper main #headline .container ul li .releaseDetail .nameVenue,
#wrapper main #headline .container ul li .releaseDetail .dateRelease {
	font-size: 0.88em; /* 14px */
	line-height: 1.4;
}

#wrapper main #headline .container ul li .infoComment {
	font-size: 0.88em; /* 14px */
	line-height: 1.4;
	margin-bottom: 1.00em;
}
#wrapper main #headline .container ul li .infoImg {
	margin-bottom: 1.00em;
}
#wrapper main #headline .container ul li .releaseDetail .dateRelease:before {
	content: url("../img/triangle1.png");
}
#wrapper main #headline .container ul li .releaseDetail .dateRelease span {
	padding-left: 0.55em;
	color: #cc3399;
}
#wrapper main #headline .container ul li .releaseDetail .dateRelease span:before {
	content: "発売日：";
}
#wrapper main #headline .container ul li .btn_details {
	color: #fff;
	font-size: 0.88em; /* 12px */
	border-radius: 5px;
	background: #3366cc;
	padding: 0.50em 1.00em;
	position: relative;
	width: 9.50em;
}
#wrapper main #headline .container ul li .btn_details p:before {
	position: absolute;
	top: 22%;
	content: url("../img/triangle2.png");
}

#wrapper main #headline .container ul li .btn_details span {
	padding-left: 1.50em;
	color: #fff;
}




@media all and (-ms-high-contrast: none){ /* IE用 */
	#wrapper main #headline .container ul li .imgArtist div img.h100 {
  		width: auto;
  		height: 100%;
	}
}


/*********************************************

 1024pxまでスマホ・タブレット向け表示に変更

**********************************************/
@media all and (min-width: 0) and (max-width: 1004px) {

	/* --------------------

		mainVisual(〜1024px)　

	-------------------- */
	#wrapper main #mainVisual {
		width: 100%;
		height: auto;
	}
	#wrapper main #mainVisual img {
		width: 100%;
		position: inherit;
		top: 35px;
	}


	/* --------------------

		container [点滅ボタン](〜1024px)

	-------------------- */
	#wrapper main #headline .container .btnBlink {
		top: 1.00em;
		width: 3.00em;
		padding: 0.25em 0;
	}
	#wrapper main #headline .container .btnBlink p:before {
		position: absolute;
		top: 0;
		left: 0;
		content: none;
	}
	#wrapper main #headline .container .btnBlink p {
		padding: 0.30em 0;
		font-size: 0.8em;
	}

	/* --------------------

		container [list]  (〜1024px)

	-------------------- */
	#wrapper main #headline .container ul li {
		padding: 0;
		margin-top: 60px;
		position: relative;
	}
	#wrapper main #headline .container ul li:first-child {
		margin-top: 1.31em;
	}
	#wrapper main #headline .container ul li.noPage {
		margin-bottom: -40px;
	}

	/* ==========================

	　テキスト + 画像（共通）

	========================== */

	#wrapper main #headline .container ul li .nameArtist {
		padding: 0.68em;
		line-height: 1.3;
		text-align: center;
	}

	/***
	 Diskリリース情報
	 ***/
	 #wrapper main #headline .container ul li .releaseDisc {
		margin-top: 0.50em;
		padding: 0.68em;
	}
	#wrapper main #headline .container ul li .releaseDisc .imgDisc {
		width: 100px;
		margin-right: 0.75em;
	}
	#wrapper main #headline .container ul li .releaseDisc .infoDisc {
		font-size: 0.75em;
		letter-spacing: 0.08em;
	}
	#wrapper main #headline .container ul li .releaseDisc .infoDisc .titleDisc {
		font-size: 1.00em;
	}


	/*********
	 左右　解除
	 *********/
	#wrapper main #headline .container ul li .listDetailLeft,
	#wrapper main #headline .container ul li .listDetailRight {
		float: none;
		width: 100%;
	}
	#wrapper main #headline .container ul li .nameTour {
		padding: 0 1.15em 1.00em;
	}
	#wrapper main #headline .container ul li .releaseDetail {
		padding: 0 1.15em;
	}
	#wrapper main #headline .container ul li .infoComment {
		margin: 0 1.00em 1.00em;
	}
	#wrapper main #headline .container ul li .infoImg {
		margin: 0 1.00em 1.00em;
		text-align: center;
	}
	#wrapper main #headline .container ul li .btn_details {
		position: absolute;
		bottom: -40px;
		font-size: 1.00em;
		font-weight: bold;
		border-radius: 0;
		padding: 0.50em 1.00em;
		margin-top: 1.00em;
		width: 100%;
		text-align: center;
	}

	#wrapper main #headline .container ul li .imgArtist,
	#wrapper main #headline .container ul li .imgArtistLeft {
		float: none;
		width: 100%;
		margin-bottom: 1.50em;
	}

	/* 画像（トリミングなし）2019.06.28 */
	#wrapper main #headline .container ul li .imgArtist .noTriming,
	#wrapper main #headline .container ul li .imgArtistLeft .noTriming {
		position: relative;
	}

	/* 画像（横1つ） */
	#wrapper main #headline .container ul li .imgArtist .layout1,
	#wrapper main #headline .container ul li .imgArtistLeft .layout1 {
		width: 100%;
	}
	/* 画像（2つ横並び） */
	#wrapper main #headline .container ul li .imgArtist .layoutRow,
	#wrapper main #headline .container ul li .imgArtistLeft .layoutRow {
		float: left;
		width: 50%;
	}


}
.no-wrap {
    display: inline-block; /* インラインブロック化 */
}