@charset "utf-8";
/* ぱたぱたアニメ館 */
/* copyありコード */
.code-container-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #eee;
  padding: 10px 15px;
  border-bottom: 1px solid #ccc;
  height: 40px;
  box-sizing: border-box;
}
.code-label {
  color: #333;
}
.code-container-header .copy-button {
  position: static;
  margin: 0;
}
.copy-button {
  appearance: none;
  border: none;
  outline: none;
  cursor: pointer;
  z-index: 10;
  padding: 5px 10px;
  background-color: #6699ff;
  color: white;
  border-radius: 4px;
}
.copy-button:hover {
  opacity: 1;
  background-color: #c7254e;
}
.code-container {
  position: relative;
  border: 1px solid #aaa;
  border-radius: 4px;
  overflow: hidden;
  width: 98%;
  margin: 0 auto;
}
.code-content {
  padding-right: 20px;
  background: #fbfbfb;
}
.code-content pre {
  margin: 0;
  padding: 0 0 0 15px; /* 左に余白、右は0 */
  overflow-x: auto;
  white-space: pre;
  tab-size: 2;
}
.code-content pre code {
  display: block;
  padding: 0;
}
/* copyナシcssコード */
.no-copy {
	margin:0;
	padding:0;
	max-width:100%; 
	border:1px solid #aaa;
	border-radius:4px; 
  background-color:#fbfbfb;
	overflow-x:auto;
	tab-size:2;
	position: relative;
}
.no-copy pre {
  margin: 0;
  padding: 0px 15px;
  overflow-x: auto;
  white-space: pre;
  tab-size: 2;
}
.no-copy pre code {
  display: block;
  padding: 0;
}

/* 右下配置 */
.bottom-right-text {
  position: absolute; 
  bottom: 0;
  right: 0;
	color:#aaa;
	margin: 0;
  padding: 5px 10px;
}

/* その他 */
.notes-code {
	width:95%;
	margin:0 auto;
	padding:7px 10px 20px 10px;
	font-size:18px;
	text-align:left;
	color:#003399;
	border-top:1px dashed #0033cc;
}