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

	 MYD Module CSS

	 2016.10.11 ノート罫線追加
	 2016.5.27 imgディレクトリ変更

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



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

	 レイアウト

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

/* ==========================================================================
	 グリッド
	 ========================================================================== */

.myd-grid {
	margin: 20px 0 20px -20px;
	font-size: 0;
}

.myd-grid__unit {
	display: inline-block;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	padding: 0 0 0 20px;
	vertical-align: top;
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.618;
}

@media(max-width: 640px) {
	.myd-grid {
		margin: 0 0 20px;
	}
	.myd-grid__unit {
		padding: 0;
		width: 100% !important;
	}
}

/* ==========================================================================
	 間隔
	 ========================================================================== */

.myd-space {
	display: block;
	margin: 0 !important;
	padding: 0 !important;
	height: auto;
	outline: none !important;
	border: none !important;
	background: none !important;
	font-size: 0;
}

/* ==========================================================================
	 区切り線
	 ========================================================================== */

.myd-separator {
	display: block;
	margin: 0 auto;
	padding: 0;
	height: 0;
	outline: none !important;
	border: none;
	background: none !important;
	font-size: 0;
}

.myd-separator.solid  { border-top-width: 1px; border-top-style: solid; }
.myd-separator.dashed { border-top-width: 2px; border-top-style: dashed; }
.myd-separator.dotted { border-top-width: 3px; border-top-style: dotted; }
.myd-separator.double {
	height: 5px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}


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

	 囲み

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

*[class*="myd-box--"]:before,*[class*="myd-box--"]:after { display: table; content: ""; }
*[class*="myd-box--"]:after { clear: both; }
*[class*="myd-box--"] {
	*zoom: 1;
}

*[class*="myd-box--"] {
	margin: 20px auto;
	border-width: 1px;
	border-style: solid;
	border-color: transparent;
	background-color: #fff;
}

*[class*="myd-box--"] > *[class*="myd-box--"] {
	border-radius: 0;
}

*[class*="myd-box--"] > ul,
*[class*="myd-box--"] > ol {
	padding: 0 1.333em;
}

*[class*="myd-box--"] > p {
	color: #666;
}

/* 大 */

.myd-box--large {
	padding: 20px;
}

/* 中 */

.myd-box--medium {
	padding: 18px;
	font-size: 97%;
}

/* 小 */

.myd-box--small {
	padding: 18px;
	font-size: 94%;
}

@media(max-width: 640px) {
	.myd-box--large.
	.myd-box--medium,
	.myd-box--small {
		padding: 15px;
	}
}

/* 囲み - 囲みタイトル
	 ========================================================================== */

*[class*="myd-box--"] > *[class*="myd-box__title"] {
	position: relative;
	background-color: #ccc;
	text-align: left;
	line-height: 1.333;
}

*[class*="myd-box--"].radius-0 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-0 > *[class*="myd-box__title"]:before { border-radius: 0px 0px 0 0; }
*[class*="myd-box--"].radius-1 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-1 > *[class*="myd-box__title"]:before { border-radius: 0px 0px 0 0; }
*[class*="myd-box--"].radius-2 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-2 > *[class*="myd-box__title"]:before { border-radius: 1px 1px 0 0; }
*[class*="myd-box--"].radius-3 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-3 > *[class*="myd-box__title"]:before { border-radius: 2px 2px 0 0; }
*[class*="myd-box--"].radius-4 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-4 > *[class*="myd-box__title"]:before { border-radius: 3px 3px 0 0; }
*[class*="myd-box--"].radius-5 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-5 > *[class*="myd-box__title"]:before { border-radius: 4px 4px 0 0; }
*[class*="myd-box--"].radius-6 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-6 > *[class*="myd-box__title"]:before { border-radius: 5px 5px 0 0; }
*[class*="myd-box--"].radius-7 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-7 > *[class*="myd-box__title"]:before { border-radius: 6px 6px 0 0; }
*[class*="myd-box--"].radius-8 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-8 > *[class*="myd-box__title"]:before { border-radius: 7px 7px 0 0; }
*[class*="myd-box--"].radius-9 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-9 > *[class*="myd-box__title"]:before { border-radius: 8px 8px 0 0; }
*[class*="myd-box--"].radius-10 > *[class*="myd-box__title"],*[class*="myd-box--"].radius-10 > *[class*="myd-box__title"]:before { border-radius: 9px 9px 0 0; }

/* 飾り */

*[class*="myd-box--"] > *[class*="myd-box__title"] img {
	display: inline-block;
	vertical-align: text-bottom;
	margin-right: 6px;
	margin-top: -45px;
}

/* 大 */

.myd-box--large > .myd-box__title:first-child {
	margin: -20px -20px 20px !important;
	padding: 12px;
	font-weight: bold;
	font-size: 24px;
	font-size: 2.4rem;
}

	.sub .myd-box--large > .myd-box__title {
		padding: 1em;
		font-size: 15px;
		font-size: 1.5rem;
	}

/* 中 */
/* transparentなborderが1pxあるから、paddingよりmarginが1px多い */

.myd-box--medium > .myd-box__title:first-child {
	margin: -18px -18px 18px !important;
	padding: 12px;
	font-weight: bold;
	font-size: 21px;
	font-size: 2.1rem;
}

/* 小 */

.myd-box--small > .myd-box__title:first-child {
	margin: -18px -18px 18px !important;
	padding: 12px;
	font-weight: normal;
	font-size: 18px;
	font-size: 1.8rem;
}


/* 囲み - 囲みタイトル - タイトルの横の四角
	 ========================================================================== */

*[class*="myd-box--"] > .myd-box__title .myd-box__title__box {
	display: block;
	float: left;
	margin: -.25em .75em 0 0;
	padding: .6em 1em;
	background-color: #999;
	color: #fff;
	text-align: left;
	letter-spacing: 1px;
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 1;
}

/* ==========================================================================
	 画像バック囲み
	 ========================================================================== */

*[class^="myd-image-bg--"] {
	margin: 20px auto;
}

*[class^="myd-image-bg--"] > * {
	color: inherit !important;
}

/* メタル１
	 ========================================================================== */

.myd-image-bg--metal-1 {
	padding: 40px;
	border-width: 1px;
	border-style: solid;
	border-color: #fff #999 #666;
	border-radius: 10px;
	background: 
		url("img/image-bg--metal-1--2.png") no-repeat left   top,
		url("img/image-bg--metal-1--2.png") no-repeat right  top,
		url("img/image-bg--metal-1--2.png") no-repeat left   bottom,
		url("img/image-bg--metal-1--2.png") no-repeat right  bottom, 
		url("img/image-bg--metal-1--1.png") repeat    center center;
	box-shadow: 0 1px 3px rgba(0,0,0,.5);
	color: #000;
	text-shadow: 0 1px 0 rgba(255,255,255,.75);
}

/* メタル２
	 ========================================================================== */

.myd-image-bg--metal-2 {
	padding: 40px;
	border-width: 1px;
	border-style: solid;
	border-color: #666 #333 #000;
	border-radius: 10px;
	background: 
		url("img/image-bg--metal-2--2.png") no-repeat left   top,
		url("img/image-bg--metal-2--2.png") no-repeat right  top,
		url("img/image-bg--metal-2--2.png") no-repeat left   bottom,
		url("img/image-bg--metal-2--2.png") no-repeat right  bottom, 
		url("img/image-bg--metal-2--1.png") repeat    center center;
	box-shadow: 0 1px 3px rgba(0,0,0,.5);
	color: #fff;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 1);
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.75);
}

/* メタル３
	 ========================================================================== */

.myd-image-bg--metal-3 {
	padding: 40px;
	border-width: 1px;
	border-style: solid;
	border-color: #fff #999 #666;
	border-radius: 2px;
	background: 
		url("img/image-bg--metal-3--2.png") no-repeat left   top,
		url("img/image-bg--metal-3--2.png") no-repeat right  top,
		url("img/image-bg--metal-3--2.png") no-repeat left   bottom,
		url("img/image-bg--metal-3--2.png") no-repeat right  bottom,
		url("img/image-bg--metal-3--1.png") repeat    center center;
	box-shadow: 0 1px 3px rgba(0,0,0,.5);
	color: #000;
	text-shadow: 0 1px 0 rgba(255,255,255,.75);
}

/* メタル４
	 ========================================================================== */

.myd-image-bg--metal-4 {
	padding: 40px;
	border-width: 1px;
	border-style: solid;
	border-color: #666 #333 #000;
	border-radius: 2px;
	background: 
		url("img/image-bg--metal-4--2.png") no-repeat left   top,
		url("img/image-bg--metal-4--2.png") no-repeat right  top,
		url("img/image-bg--metal-4--2.png") no-repeat left   bottom,
		url("img/image-bg--metal-4--2.png") no-repeat right  bottom,
		url("img/image-bg--metal-4--1.png") repeat    center center;
	box-shadow: 0 1px 3px rgba(0,0,0,.5);
	color: #fff;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 1);
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.75);
}

/* 紙
	 ========================================================================== */

.myd-image-bg--paper-no-pin {
	padding: 40px;
	background: 
		url("img/image-bg--paper-no-pin--1.png") no-repeat left   top,
		url("img/image-bg--paper-no-pin--2.png") no-repeat right  top,
		url("img/image-bg--paper-no-pin--3.png") no-repeat left   bottom,
		url("img/image-bg--paper-no-pin--4.png") no-repeat right  bottom, 
		url("img/image-bg--paper-no-pin--5.png") repeat-x  center top,
		url("img/image-bg--paper-no-pin--6.png") repeat-y  right  center,
		url("img/image-bg--paper-no-pin--7.png") repeat-x  center bottom,
		url("img/image-bg--paper-no-pin--8.png") repeat-y  left   center,
		url("img/image-bg--paper-no-pin--9.png") repeat    center center;
	color: #222;
}

/* 紙に押しピン：赤
	 ========================================================================== */

.myd-image-bg--paper-red-pin {
	padding: 53px 35px 35px;
	background: 
		url("img/image-bg--paper-red-pin--0.png") no-repeat center top,
		url("img/image-bg--paper-red-pin--1.png") no-repeat left   top,
		url("img/image-bg--paper-red-pin--2.png") no-repeat right  top,
		url("img/image-bg--paper-red-pin--3.png") no-repeat left   bottom,
		url("img/image-bg--paper-red-pin--4.png") no-repeat right  bottom,
		url("img/image-bg--paper-red-pin--5.png") repeat-x  center top,
		url("img/image-bg--paper-red-pin--6.png") repeat-y  right  center,
		url("img/image-bg--paper-red-pin--7.png") repeat-x  center bottom,
		url("img/image-bg--paper-red-pin--8.png") repeat-y  left   center, 
		url("img/image-bg--paper-red-pin--9.png") repeat    center center;
	color: #222;
}

/* 紙に押しピン：青
	 ========================================================================== */

.myd-image-bg--paper-blue-pin {
	padding: 53px 35px 35px;
	background: 
		url("img/image-bg--paper-blue-pin--0.png") no-repeat center top,
		url("img/image-bg--paper-blue-pin--1.png") no-repeat left   top,
		url("img/image-bg--paper-blue-pin--2.png") no-repeat right  top,
		url("img/image-bg--paper-blue-pin--3.png") no-repeat left   bottom,
		url("img/image-bg--paper-blue-pin--4.png") no-repeat right  bottom,
		url("img/image-bg--paper-blue-pin--5.png") repeat-x  center top,
		url("img/image-bg--paper-blue-pin--6.png") repeat-y  right  center,
		url("img/image-bg--paper-blue-pin--7.png") repeat-x  center bottom,
		url("img/image-bg--paper-blue-pin--8.png") repeat-y  left   center, 
		url("img/image-bg--paper-blue-pin--9.png") repeat    center center;
	color: #222;
}

/* 紙に押しピン：緑
	 ========================================================================== */

.myd-image-bg--paper-green-pin {
	padding: 53px 35px 35px;
	background: 
		url("img/image-bg--paper-green-pin--0.png") no-repeat center top,
		url("img/image-bg--paper-green-pin--1.png") no-repeat left   top,
		url("img/image-bg--paper-green-pin--2.png") no-repeat right  top,
		url("img/image-bg--paper-green-pin--3.png") no-repeat left   bottom,
		url("img/image-bg--paper-green-pin--4.png") no-repeat right  bottom,
		url("img/image-bg--paper-green-pin--5.png") repeat-x  center top,
		url("img/image-bg--paper-green-pin--6.png") repeat-y  right  center,
		url("img/image-bg--paper-green-pin--7.png") repeat-x  center bottom,
		url("img/image-bg--paper-green-pin--8.png") repeat-y  left   center,
		url("img/image-bg--paper-green-pin--9.png") repeat    center center;
	color: #222;
}

/* 紙に押しピン：黄色
	 ========================================================================== */

.myd-image-bg--paper-yellow-pin {
	padding: 53px 35px 35px;
	background: 
		url("img/image-bg--paper-yellow-pin--0.png") no-repeat center top,
		url("img/image-bg--paper-yellow-pin--1.png") no-repeat left   top,
		url("img/image-bg--paper-yellow-pin--2.png") no-repeat right  top,
		url("img/image-bg--paper-yellow-pin--3.png") no-repeat left   bottom,
		url("img/image-bg--paper-yellow-pin--4.png") no-repeat right  bottom,
		url("img/image-bg--paper-yellow-pin--5.png") repeat-x  center top,
		url("img/image-bg--paper-yellow-pin--6.png") repeat-y  right  center,
		url("img/image-bg--paper-yellow-pin--7.png") repeat-x  center bottom,
		url("img/image-bg--paper-yellow-pin--8.png") repeat-y  left   center,
		url("img/image-bg--paper-yellow-pin--9.png") repeat    center center;
	color: #222;
}

/* 付箋：グリーン
	 ========================================================================== */

.myd-image-bg--postit-green {
	padding: 25px 30px 30px 35px;
	background: 
		url("img/image-bg--postit-green--1.png") no-repeat left   top,
		url("img/image-bg--postit-green--2.png") no-repeat right  top,
		url("img/image-bg--postit-green--3.png") no-repeat left   bottom,
		url("img/image-bg--postit-green--4.png") no-repeat right  bottom,
		url("img/image-bg--postit-green--5.png") repeat-x  center top,
		url("img/image-bg--postit-green--6.png") repeat-y  right  center,
		url("img/image-bg--postit-green--7.png") repeat-x  center bottom,
		url("img/image-bg--postit-green--8.png") repeat-y  left   center,
		url("img/image-bg--postit-green--9.png") repeat    center center;
	color: #222;
}

/* 付箋：ブルー
	 ========================================================================== */

.myd-image-bg--postit-blue {
	padding: 25px 30px 30px 35px;
	background: 
		url("img/image-bg--postit-blue--1.png") no-repeat left   top,
		url("img/image-bg--postit-blue--2.png") no-repeat right  top,
		url("img/image-bg--postit-blue--3.png") no-repeat left   bottom,
		url("img/image-bg--postit-blue--4.png") no-repeat right  bottom,
		url("img/image-bg--postit-blue--5.png") repeat-x  center top,
		url("img/image-bg--postit-blue--6.png") repeat-y  right  center,
		url("img/image-bg--postit-blue--7.png") repeat-x  center bottom,
		url("img/image-bg--postit-blue--8.png") repeat-y  left   center,
		url("img/image-bg--postit-blue--9.png") repeat    center center;
	color: #222;
}

/* 付箋：グレー
	 ========================================================================== */

.myd-image-bg--postit-gray {
	padding: 25px 30px 30px 35px;
	background: 
		url("img/image-bg--postit-gray--1.png") no-repeat left   top,
		url("img/image-bg--postit-gray--2.png") no-repeat right  top,
		url("img/image-bg--postit-gray--3.png") no-repeat left   bottom,
		url("img/image-bg--postit-gray--4.png") no-repeat right  bottom,
		url("img/image-bg--postit-gray--5.png") repeat-x  center top,
		url("img/image-bg--postit-gray--6.png") repeat-y  right  center,
		url("img/image-bg--postit-gray--7.png") repeat-x  center bottom,
		url("img/image-bg--postit-gray--8.png") repeat-y  left   center,
		url("img/image-bg--postit-gray--9.png") repeat    center center;
	color: #222;
}

/* 付箋：ピンク
	 ========================================================================== */

.myd-image-bg--postit-pink {
	padding: 25px 30px 30px 35px;
	background: 
		url("img/image-bg--postit-pink--1.png") no-repeat left   top,
		url("img/image-bg--postit-pink--2.png") no-repeat right  top,
		url("img/image-bg--postit-pink--3.png") no-repeat left   bottom,
		url("img/image-bg--postit-pink--4.png") no-repeat right  bottom,
		url("img/image-bg--postit-pink--5.png") repeat-x  center top,
		url("img/image-bg--postit-pink--6.png") repeat-y  right  center,
		url("img/image-bg--postit-pink--7.png") repeat-x  center bottom,
		url("img/image-bg--postit-pink--8.png") repeat-y  left   center,
		url("img/image-bg--postit-pink--9.png") repeat    center center;
	color: #222;
}

/* 付箋：イエロー
	 ========================================================================== */

.myd-image-bg--postit-yellow {
	padding: 25px 30px 30px 35px;
	background: 
		url("img/image-bg--postit-yellow--1.png") no-repeat left   top,
		url("img/image-bg--postit-yellow--2.png") no-repeat right  top,
		url("img/image-bg--postit-yellow--3.png") no-repeat left   bottom,
		url("img/image-bg--postit-yellow--4.png") no-repeat right  bottom,
		url("img/image-bg--postit-yellow--5.png") repeat-x  center top,
		url("img/image-bg--postit-yellow--6.png") repeat-y  right  center,
		url("img/image-bg--postit-yellow--7.png") repeat-x  center bottom,
		url("img/image-bg--postit-yellow--8.png") repeat-y  left   center,
		url("img/image-bg--postit-yellow--9.png") repeat    center center;
	color: #222;
}

/* マーカー：グリーン
	 ========================================================================== */

.myd-image-bg--marker-green {
	margin: -10px auto 0;
	padding: 55px 50px 60px;
	background: 
		url("img/image-bg--marker-green--1.png") no-repeat left   top,
		url("img/image-bg--marker-green--2.png") no-repeat right  top,
		url("img/image-bg--marker-green--3.png") no-repeat left   bottom,
		url("img/image-bg--marker-green--4.png") no-repeat right  bottom,
		url("img/image-bg--marker-green--5.png") repeat-x  center top,
		url("img/image-bg--marker-green--6.png") repeat-y  right  center,
		url("img/image-bg--marker-green--7.png") repeat-x  center bottom,
		url("img/image-bg--marker-green--8.png") repeat-y  left   center,
		url("img/image-bg--marker-green--9.png") repeat    center center;
	color: #222;
}

/* マーカー：ブルー
	 ========================================================================== */

.myd-image-bg--marker-blue {
	margin: -10px auto 0;
	padding: 55px 50px 60px;
	background: 
		url("img/image-bg--marker-blue--1.png") no-repeat left   top,
		url("img/image-bg--marker-blue--2.png") no-repeat right  top,
		url("img/image-bg--marker-blue--3.png") no-repeat left   bottom,
		url("img/image-bg--marker-blue--4.png") no-repeat right  bottom,
		url("img/image-bg--marker-blue--5.png") repeat-x  center top,
		url("img/image-bg--marker-blue--6.png") repeat-y  right  center,
		url("img/image-bg--marker-blue--7.png") repeat-x  center bottom,
		url("img/image-bg--marker-blue--8.png") repeat-y  left   center,
		url("img/image-bg--marker-blue--9.png") repeat    center center;
	color: #222;
}

/* マーカー：ピンク
	 ========================================================================== */

.myd-image-bg--marker-pink {
	margin: -10px auto 0;
	padding: 55px 50px 60px;
	background: 
		url("img/image-bg--marker-pink--1.png") no-repeat left   top,
		url("img/image-bg--marker-pink--2.png") no-repeat right  top,
		url("img/image-bg--marker-pink--3.png") no-repeat left   bottom,
		url("img/image-bg--marker-pink--4.png") no-repeat right  bottom,
		url("img/image-bg--marker-pink--5.png") repeat-x  center top,
		url("img/image-bg--marker-pink--6.png") repeat-y  right  center,
		url("img/image-bg--marker-pink--7.png") repeat-x  center bottom,
		url("img/image-bg--marker-pink--8.png") repeat-y  left   center,
		url("img/image-bg--marker-pink--9.png") repeat    center center;
	color: #222;
}

/* マーカー：イエロー
	 ========================================================================== */

.myd-image-bg--marker-yellow {
	margin: -10px auto 0;
	padding: 55px 50px 60px;
	background: 
		url("img/image-bg--marker-yellow--1.png") no-repeat left   top,
		url("img/image-bg--marker-yellow--2.png") no-repeat right  top,
		url("img/image-bg--marker-yellow--3.png") no-repeat left   bottom,
		url("img/image-bg--marker-yellow--4.png") no-repeat right  bottom,
		url("img/image-bg--marker-yellow--5.png") repeat-x  center top,
		url("img/image-bg--marker-yellow--6.png") repeat-y  right  center,
		url("img/image-bg--marker-yellow--7.png") repeat-x  center bottom,
		url("img/image-bg--marker-yellow--8.png") repeat-y  left   center,
		url("img/image-bg--marker-yellow--9.png") repeat    center center;
	color: #222;
}

/* 黒板１
	 ========================================================================== */

.myd-image-bg--chalkboard-1 {
	padding: 40px;
	background: 
		url("img/image-bg--chalkboard-1--1.png") no-repeat left   top,
		url("img/image-bg--chalkboard-1--2.png") no-repeat right  top,
		url("img/image-bg--chalkboard-1--3.png") no-repeat left   bottom,
		url("img/image-bg--chalkboard-1--4.png") no-repeat right  bottom,
		url("img/image-bg--chalkboard-1--5.png") repeat-x  center top,
		url("img/image-bg--chalkboard-1--6.png") repeat-y  right  center,
		url("img/image-bg--chalkboard-1--7.png") repeat-x  center bottom,
		url("img/image-bg--chalkboard-1--8.png") repeat-y  left   center,
		url("img/image-bg--chalkboard-1--9.png") repeat    center center;
	color: #fff;
	text-shadow: 0 1px 2px rgba(0,0,0,.75);
}

/* 木板１
	 ========================================================================== */

.myd-image-bg--woodboard-1 {
	padding: 30px 35px 35px;
	background: 
		url("img/image-bg--woodboard-1--1.png") no-repeat left   top,
		url("img/image-bg--woodboard-1--2.png") no-repeat right  top,
		url("img/image-bg--woodboard-1--3.png") no-repeat left   bottom,
		url("img/image-bg--woodboard-1--4.png") no-repeat right  bottom,
		url("img/image-bg--woodboard-1--5.png") repeat-x  center top,
		url("img/image-bg--woodboard-1--6.png") repeat-y  right  center,
		url("img/image-bg--woodboard-1--7.png") repeat-x  center bottom,
		url("img/image-bg--woodboard-1--8.png") repeat-y  left   center,
		url("img/image-bg--woodboard-1--9.png") repeat    center center;
	color: #222;
}

/* 木枠１
	 ========================================================================== */

.myd-image-bg--woodframe-1 {
	padding: 75px 80px;
	background: 
		url("img/image-bg--woodframe-1--1.png") no-repeat left   top,
		url("img/image-bg--woodframe-1--2.png") no-repeat right  top,
		url("img/image-bg--woodframe-1--3.png") no-repeat left   bottom,
		url("img/image-bg--woodframe-1--4.png") no-repeat right  bottom,
		url("img/image-bg--woodframe-1--5.png") repeat-x  center top,
		url("img/image-bg--woodframe-1--6.png") repeat-y  right  center,
		url("img/image-bg--woodframe-1--7.png") repeat-x  center bottom,
		url("img/image-bg--woodframe-1--8.png") repeat-y  left   center,
		url("img/image-bg--woodframe-1--9.png") repeat    center center;
	color: #222;
}


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

	 部品

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

/* ==========================================================================
	 帯見出し
	 ========================================================================== */

h1.myd-subheader--bar,
h2.myd-subheader--bar,
h3.myd-subheader--bar,
h4.myd-subheader--bar,
h5.myd-subheader--bar,
h6.myd-subheader--bar,
div.myd-subheader--bar {
	padding: 10px;
	margin: 30px 0 15px;
	font-size: 21px;
	font-size: 2.1rem;
	line-height: 1.333;
}

	 /* Hのスタイルリセット */
	 h1.myd-subheader--bar,
	 h2.myd-subheader--bar,
	 h3.myd-subheader--bar,
	 h4.myd-subheader--bar,
	 h5.myd-subheader--bar,
	 h6.myd-subheader--bar,
	div.myd-subheader--bar { background-image: none !important; }

	 h1.myd-subheader--bar:before,
	 h2.myd-subheader--bar:before,
	 h3.myd-subheader--bar:before,
	 h4.myd-subheader--bar:before,
	 h5.myd-subheader--bar:before,
	 h6.myd-subheader--bar:before,
	div.myd-subheader--bar:before { content: none !important; }

	 h1.myd-subheader--bar:after,
	 h2.myd-subheader--bar:after,
	 h3.myd-subheader--bar:after,
	 h4.myd-subheader--bar:after,
	 h5.myd-subheader--bar:after,
	 h6.myd-subheader--bar:after,
	div.myd-subheader--bar:after { content: none !important; }

.myd-subheader--bar img {
	display: inline-block;
	vertical-align: text-bottom;
	margin-right: 6px;
	margin-top: -45px;
}

/* ==========================================================================
	 ランキング見出し
	 ========================================================================== */

*.ranking-wrapper {
	padding: .5em 0 .3em;
	line-height: 1.333;
}

.ranking {
	display: block;
	padding-top: 9px;
	padding-left: 51px;
	min-height: 40px;
	background-repeat: no-repeat;
	color: #666;
	font-weight: bold;
	font-size: 27px;
	font-size: 2.7rem;
}

.ranking--1 { background-image: url("img/ranking1.png"); }
.ranking--2 { background-image: url("img/ranking2.png"); }
.ranking--3 { background-image: url("img/ranking3.png"); }
.ranking--4 { background-image: url("img/ranking4.png"); }
.ranking--5 { background-image: url("img/ranking5.png"); }

/* ==========================================================================
	 ポイント見出し
	 ========================================================================== */

.point-wrapper {
	line-height: 1.333;
}

.point-wrapper .point {
	display: block;
	padding: 6px 0 6px 51px;
	min-height: 42px;
	color: #666;
	font-weight: bold;
	font-size: 21px;
	font-size: 2.1rem;
	position: relative;
}

.point-wrapper .point:before {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 39px;
	height: 39px;
	border-radius: 3px;
	background-color: #666;
	color: #fff;
	text-align: center;
	font-weight: bold;
	font-size: 21px;
	line-height: 39px;
}

.point-wrapper .point--1:before  { content:"1"; }
.point-wrapper .point--2:before  { content:"2"; }
.point-wrapper .point--3:before  { content:"3"; }
.point-wrapper .point--4:before  { content:"4"; }
.point-wrapper .point--5:before  { content:"5"; }
.point-wrapper .point--6:before  { content:"6"; }
.point-wrapper .point--7:before  { content:"7"; }
.point-wrapper .point--8:before  { content:"8"; }
.point-wrapper .point--9:before  { content:"9"; }
.point-wrapper .point--10:before { content:"10"; }

/* ==========================================================================
	 ノート罫線
	 ========================================================================== */

.entry-content .myd-notebook-line {
	border-bottom: 1px solid #ddd;
	background-image: linear-gradient( #ddd .1em, transparent .1em );
	background-size: auto 4.5rem;
	line-height: 4.5rem;
}

.entry-content .myd-notebook-line.myd-notebook-line--green        { border-bottom-color: #096    !important; background-image: linear-gradient( #096    .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--blue         { border-bottom-color: #369    !important; background-image: linear-gradient( #369    .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--gray         { border-bottom-color: #666    !important; background-image: linear-gradient( #666    .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--purple       { border-bottom-color: #936    !important; background-image: linear-gradient( #936    .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--red          { border-bottom-color: #c33    !important; background-image: linear-gradient( #c33    .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--yellow       { border-bottom-color: #f90    !important; background-image: linear-gradient( #f90    .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--black        { border-bottom-color: #000    !important; background-image: linear-gradient( #000    .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--light-green  { border-bottom-color: #abddcd !important; background-image: linear-gradient( #abddcd .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--light-blue   { border-bottom-color: #bccddd !important; background-image: linear-gradient( #bccddd .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--light-gray   { border-bottom-color: #cdcdcd !important; background-image: linear-gradient( #cdcdcd .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--light-purple { border-bottom-color: #ddbccd !important; background-image: linear-gradient( #ddbccd .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--light-red    { border-bottom-color: #eebcbc !important; background-image: linear-gradient( #eebcbc .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--light-yellow { border-bottom-color: #ffddab !important; background-image: linear-gradient( #ffddab .1em, transparent .1em ); }
.entry-content .myd-notebook-line.myd-notebook-line--silver       { border-bottom-color: #dddddd !important; background-image: linear-gradient( #dddddd .1em, transparent .1em ); }

/* ==========================================================================
	 チェックリスト
	 ========================================================================== */

ul[class*="myd-checklist--"],
ol[class*="myd-checklist--"] {
	margin: 0 auto;
	padding: 0;
}

*[class*="myd-checklist--"] > li {
	margin: 0;
	padding: .5em .5em .5em 24px;
	background-image: url("img/bullet--check-red.png");
	background-position: 3px .65em;
	background-repeat: no-repeat;
	list-style-type: none;
	text-align: left;
	line-height: 1.618;
}

/* 大 */

.myd-checklist--large {
	border-top: 1px solid #ddd;
}

.myd-checklist--large > li {
	border-bottom: 1px solid #ddd;
	font-weight: bold;
}

.myd-checklist--large > li:nth-child(odd){
}

.myd-checklist--large.checklist--green  > li { background-image: url("img/check--green--large.png" ); }
.myd-checklist--large.checklist--blue   > li { background-image: url("img/check--blue--large.png"  ); }
.myd-checklist--large.checklist--gray   > li { background-image: url("img/check--gray--large.png"  ); }
.myd-checklist--large.checklist--purple > li { background-image: url("img/check--purple--large.png"); }
.myd-checklist--large.checklist--red    > li { background-image: url("img/check--red--large.png"   ); }
.myd-checklist--large.checklist--yellow > li { background-image: url("img/check--yellow--large.png"); }

/* 中 */

.myd-checklist--medium {
	border-top: 1px dashed #ccc;
}

.myd-checklist--medium > li {
	border-bottom: 1px dashed #ccc;
}

.myd-checklist--medium > li:nth-child(odd){
}

.myd-checklist--medium.checklist--green  > li { background-image: url("img/check--green--medium.png" ); }
.myd-checklist--medium.checklist--blue   > li { background-image: url("img/check--blue--medium.png"  ); }
.myd-checklist--medium.checklist--gray   > li { background-image: url("img/check--gray--medium.png"  ); }
.myd-checklist--medium.checklist--purple > li { background-image: url("img/check--purple--medium.png"); }
.myd-checklist--medium.checklist--red    > li { background-image: url("img/check--red--medium.png"   ); }
.myd-checklist--medium.checklist--yellow > li { background-image: url("img/check--yellow--medium.png"); }

/* 小 */

.myd-checklist--small {
	border-top: 1px dashed #ccc;
}

.myd-checklist--small > li {
	font-size: 13px;
	font-size: 1.3rem;
	border-bottom: 1px dashed #ccc;
}

.myd-checklist--small.checklist--green  > li { background-image: url("img/check--green--small.png" ); }
.myd-checklist--small.checklist--blue   > li { background-image: url("img/check--blue--small.png"  ); }
.myd-checklist--small.checklist--gray   > li { background-image: url("img/check--gray--small.png"  ); }
.myd-checklist--small.checklist--purple > li { background-image: url("img/check--purple--small.png"); }
.myd-checklist--small.checklist--red    > li { background-image: url("img/check--red--small.png"   ); }
.myd-checklist--small.checklist--yellow > li { background-image: url("img/check--yellow--small.png"); }

/* ==========================================================================
	 バッジ
	 ========================================================================== */

.myd-badge {
	overflow: hidden;
	margin: 0 -6px 15px 0;
	padding: 0;
	list-style-type: none;
}

.myd-badge li {
	float: left;
	overflow: hidden;
	margin: 0 6px 6px 0;
	padding: 6px 9px;
	height: 24px;
	border-radius: 3px;
	text-align: center;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1;
}

/* ==========================================================================
	 評価の星
	 ========================================================================== */

.myd-ranking__star {
}

.myd-ranking__star--good {
	margin-left: 3px;
	color: gold;
}

.myd-ranking__star--bad {
	margin-left: 3px;
	color: silver;
}

/* ==========================================================================
	 ボタン（色、角丸の指定は共通クラスを使う）
	 ========================================================================== */

a.myd-button {
	position: relative;
	display: inline-block;
	margin: 5px auto;
	padding: .7em .9em .8em;
	border: 1px solid rgba(0,0,0,.1);
	background-origin: border-box;
	box-shadow: 0 1px 2px rgba(0,0,0,.2), inset 0 -1px rgba(0,0,0,.1), inset 0 1px rgba(255,255,255,.2);
	color: #fff !important;
	text-align: center;
	text-decoration: none;
	text-shadow: 0 1px 2px rgba(0,0,0,.333);
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1;
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAQAAAC0NkA6AAAANklEQVRYw+3QQREAQAgDMWDOv+bDBH1lqyCtCtS78yYheSQkJCQkJCQkJCQk7iIhISEhIclIPo7jAKuTKBS5AAAAAElFTkSuQmCC");
	background-repeat: repeat-x;
	background-position: center bottom;
}

	.sub a.myd-button {
		margin: 5px auto
	}

a.myd-button:before {
	margin-right: 5px;
	content: "\f18e";
	font-family: FontAwesome;
	opacity: 0.7;
	-ms-filter: "alpha(opacity=70)";
}

a.myd-button:hover {
	color: #fff !important;
	text-decoration: none;
	opacity: 0.9;
	-ms-filter: "alpha(opacity=90)";
	filter: alpha(opacity=90);
}

a.myd-button:active {
	top: 1px;
	box-shadow: inset 0 2px 2px rgba(0,0,0,.3);
	color: #fff !important;
}

/* サイズ */

a.myd-button.button--large         { font-size: 22px; font-size: 2.2rem; padding: .7em .9em .8em; }
a.myd-button.button--large--wide   { font-size: 22px; font-size: 2.2rem; padding: .7em .9em .8em; display: block; }
a.myd-button.button--medium        { font-size: 18px; font-size: 1.8rem; padding: .6em .8em .7em; }
a.myd-button.button--medium--wide  { font-size: 18px; font-size: 1.8rem; padding: .6em .8em .7em; display: block; }
a.myd-button.button--small         { font-size: 14px; font-size: 1.4rem; padding: .5em .7em .6em; }
a.myd-button.button--small--wide   { font-size: 14px; font-size: 1.4rem; padding: .5em .7em .6em; display: block; }
a.myd-button.button--x-small       { font-size: 12px; font-size: 1.2rem; padding: .4em .6em .5em; }
a.myd-button.button--x-small--wide { font-size: 12px; font-size: 1.2rem; padding: .4em .6em .5em; display: block; }

/* ==========================================================================
	 よくある質問
	 ========================================================================== */

.myd-faq-q {
	margin: -1px 0 0;
	margin-bottom: 15px;
	padding: 0 0 15px 38px;
	border-bottom: 1px solid rgba(0,0,0,.1);
	background: transparent url("img/faq--icon-q.png") no-repeat 0 0;
	text-align: left;
	font-weight: bold;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.333;
}

	.sub .myd-faq-q {
		font-size: 14px;
		font-size: 1.4rem;
		line-height: 1.618;
	}

.myd-faq-q > * {
	margin-top: 0 !important;
}

.myd-faq-a {
	padding: 0 0 0 38px;
	background: transparent url("img/faq--icon-a.png") no-repeat 0 0;
}

.myd-faq-a p {
	margin: 0 0 1em;
	text-align: left;
	font-size: 15px;
	font-size: 1.5rem;
}

	.sub .myd-faq-a p {
		font-size: 14px;
		font-size: 1.4rem;
		line-height: 1.618;
	}

.myd-faq-a *:last-child {
	margin-bottom: 0 !important;
}

/* ==========================================================================
	 お客様の声（大）
	 ========================================================================== */

.myd-customer-feedback--large {
	margin: 2em;
	padding: 45px 45px 45px;
	background: 
		url("img/customer-feedback-1--1.png") no-repeat left top,
		url("img/customer-feedback-1--2.png") no-repeat right top,
		url("img/customer-feedback-1--3.png") no-repeat left bottom,
		url("img/customer-feedback-1--4.png") no-repeat right bottom,
		url("img/customer-feedback-1--5.png") repeat-x  center top,
		url("img/customer-feedback-1--6.png") repeat-y  right center,
		url("img/customer-feedback-1--7.png") repeat-x  center bottom,
		url("img/customer-feedback-1--8.png") repeat-y  left center,
		url("img/customer-feedback-1--9.png") repeat    center center;
}

.myd-customer-feedback--large .customer-feedback__hgroup {
	margin: 0 0 1em;
	padding: 0 0 1em;
	border-bottom: 1px solid #ccc;
}

.myd-customer-feedback--large h3 {
	margin: 0 60px 10px 0;
	font-weight: normal;
	font-size: 24px;
	font-size: 2.4rem;
	line-height: 1.333;
}

.myd-customer-feedback--large .customer-feedback__name {
	margin: 0 0 1em;
	color: #333;
	text-align: left;
	font-weight: bold;
	font-size: 16px;
	font-size: 1.6rem;
}

.myd-customer-feedback--large .customer-feedback__name--small {
	margin-top: 2em;
	color: #333;
	text-align: right;
	font-weight: bold;
	font-size: 14px;
	font-size: 1.4rem;
}

.myd-customer-feedback--large .customer-feedback__image {
	width: 130px;
	float: right;
	margin: 0 -75px 20px 20px;
	border: 7px solid #fff;
	background-color: #f8f8f8;
	box-shadow: 0 1px 1px 1px rgba(0, 0, 0, .15) ;
	font-size: 0;
	-webkit-transform: rotate(5deg);
	   -moz-transform: rotate(5deg);
	        transform: rotate(5deg);
	-webkit-transform-origin: center center;
	   -moz-transform-origin: center center;
	        transform-origin: center center;
}

.myd-customer-feedback--large .customer-feedback__image > img {
	width: 100%;
}

.myd-customer-feedback--large p {
	margin: 0;
	padding: 0;
	background: url("img/note-line-gackground-image.gif") ;
	color: #4C5966;
	line-height: 40px;
}

@media(max-width: 800px) {
	.myd-customer-feedback--large {
		margin: 20px 0;
		padding: 20px;
	}
	.myd-customer-feedback--large .customer-feedback__name--small {
		margin-top: 1em;
	}
	.myd-customer-feedback--large .customer-feedback__image {
		margin: 0 auto 20px;
		transform: none;
		float: none;
	}
}

/* ==========================================================================
	 サムネイル画像付き記事リンク（ブログカード）
	 ========================================================================== */

.blog-card {
	display: block;
	overflow: hidden;
	margin: 1em 0;
	padding: 1em;
	max-width: 100%;
	width: 100%;
	border: 1px solid #ddd;
	border-radius: 5px;
	word-wrap: break-word;
}

a.blog-card:hover,
a.blog-card:active,
a.blog-card:visited {
	text-decoration: none;
}

a.blog-card:hover {
	background-color: rgba(255,255,0,.1);
	transition: 0.3s linear;
}

.blog-card-thumbnail {
	float: left;
	line-height: 0;
}

.blog-card-content {
	margin-left: 110px;
	line-height: 120%;
}

.blog-card-title {
	margin-bottom: 5px;
	color: #111;
	font-weight: bold;
	font-size: 16px;
}

.blog-card-excerpt {
	color: #666;
	font-size: 90%;
}

.blog-card-date {
	margin-top: 5px;
	color: #777;
	font-size: 70%;
}


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

	 部品：シリウス対応用

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

/* メッセージ
	 ========================================================================== */

.alert {
	margin: 12px auto;
	padding: 12px 15px;
	border: 1px solid #EBCCD1;
	border-radius: 3px;
	background-color: #F2DEDE;
	color: #A94442;
	line-height: 1.333;
}
.alert:before {
	display: inline-block;
	margin-right: 3px;
	content: "\f06a";
	vertical-align: middle;
	font-size: 124%;
	font-family: FontAwesome;
}
.alert.noimage:before {
	content: none;
}

.accept {
	margin: 12px auto;
	padding: 12px 15px;
	border: 1px solid #D6E9C6;
	border-radius: 3px;
	background-color: #DFF0D8;
	color: #3C763D;
	line-height: 1.333;
}
.accept:before {
	display: inline-block;
	margin-right: 3px;
	content: "\f058";
	vertical-align: middle;
	font-size: 124%;
	font-family: FontAwesome;
}
.accept.noimage:before {
	content: none;
}

.attention {
	margin: 12px auto;
	padding: 12px 15px;
	border: 1px solid #FAEBCC;
	border-radius: 3px;
	background-color: #FCF8E3;
	color: #8A6D3B;
	line-height: 1.333;
}
.attention:before {
	display: inline-block;
	margin-right: 3px;
	content: "\f071";
	vertical-align: middle;
	font-size: 124%;
	font-family: FontAwesome;
}
.attention.noimage:before {
	content: none;
}

.hint {
	margin: 12px auto;
	padding: 12px 15px;
	border: 1px solid #BCE8F1;
	border-radius: 3px;
	background-color: #D9EDF7;
	color: #31708F;
	line-height: 1.333;
}
.hint:before {
	display: inline-block;
	margin-right: 3px;
	content: "\f0eb";
	vertical-align: middle;
	font-size: 124%;
	font-family: FontAwesome;
}
.hint.noimage:before {
	content: none;
}

/* ユーザーの声
	 ========================================================================== */

.myd-customer-feedback--small {

}

.myd-customer-feedback--small .customer-feedback__image {
	float: left;
	margin-right: 21px;
}

.myd-customer-feedback--small .customer-feedback__text {
	overflow: auto;
}


/* Q & A
	 ========================================================================== */

.faq-1__q {
	display: block;
	background: transparent url("img/faq-1__q.png") no-repeat 0 0;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	padding-left: 51px;
	padding-top: 9px;
	margin-bottom: 12px;
}

.faq-2__q {
	display: block;
	background: transparent url("img/faq-2__q.png") no-repeat 0 0;
	font-size: 15px;
	font-size: 1.5rem;
	font-weight: bold;
	padding-left: 51px;
	padding-top: 9px;
	padding-bottom: 12px;
	border-bottom: 1px solid #ddd;
	margin-bottom: 12px;
}

.faq-2__a {
	display: block;
	background: transparent url("img/faq-2__a.png") no-repeat 0 0;
	font-size: 15px;
	font-size: 1.5rem;
	padding-left: 51px;
	padding-top: 9px;
	margin-bottom: 12px;
}

/* 矢印
	 ========================================================================== */

*[class*="arrow-bullet--"] {
	margin: 6px 0;
	padding-top: 6px;
	padding-bottom: 6px;
	padding-left: 30px;
	background-position: 0px 6px;
	background-repeat: no-repeat;
}

.arrow-bullet--orange { background-image: url("img/arrow-bullet--orange.png") }
.arrow-bullet--black  { background-image: url("img/arrow-bullet--black.png") }
.arrow-bullet--blue   { background-image: url("img/arrow-bullet--blue.png") }
.arrow-bullet--red    { background-image: url("img/arrow-bullet--red.png") }


/* 区切り線
	 ========================================================================== */

hr[class*="horizontal-rule--"] {
	margin: 12px auto;
	border: 0;
	background: transparent;
}

hr.horizontal-rule--gray {
	border-bottom: 1px solid #999;
}

hr.horizontal-rule--red {
	border-bottom: 1px solid #D9534F;
}

hr.horizontal-rule--blue {
	border-bottom: 1px solid #337AB7;
}

hr.horizontal-rule--gray--dooted {
	border-bottom: 1px dotted #999;
}

hr.horizontal-rule--gray--dotted--heavy {
	border-bottom: 2px dotted #999;
}

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

	 その他

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

/* ==========================================================================
	 テーブル
	 ========================================================================== */

.myd-table img {
	max-width: none;
}


@media(max-width: 640px) {
	.main .myd-table__wrapper table {
		width: 840px;
	}
	.main .myd-table__wrapper {
		overflow-x: scroll;
		width: 100%;
		position: relative;
	}
	.main .myd-table__wrapper:before {
		display: block;
		color: #666;
		content: "※ 表は左右にスクロールできます";
		font-size: 13px;
		margin: 1em 0;
		text-align: left;
	}
}

/* ==========================================================================
	 共通
	 ========================================================================== */

/* 角丸 */

.radius-0  { border-radius:  0px !important; }
.radius-1  { border-radius:  1px !important; }
.radius-2  { border-radius:  2px !important; }
.radius-3  { border-radius:  3px !important; }
.radius-4  { border-radius:  4px !important; }
.radius-5  { border-radius:  5px !important; }
.radius-6  { border-radius:  6px !important; }
.radius-7  { border-radius:  7px !important; }
.radius-8  { border-radius:  8px !important; }
.radius-9  { border-radius:  9px !important; }
.radius-10 { border-radius: 10px !important; }

/* 文字色 */

[class*="text-color--"] { color: #aaa; }
.text-color--green      { color: #096 !important; }
.text-color--blue       { color: #369 !important; }
.text-color--gray       { color: #666 !important; }
.text-color--purple     { color: #936 !important; }
.text-color--red        { color: #c33 !important; }
.text-color--yellow     { color: #f90 !important; }

/* 枠線色 */

[class*="border-color--"]   { border-color: #aaa; }
.border-color--green        { border-color: #096 !important; }
.border-color--blue         { border-color: #369 !important; }
.border-color--gray         { border-color: #666 !important; }
.border-color--purple       { border-color: #936 !important; }
.border-color--red          { border-color: #c33 !important; }
.border-color--yellow       { border-color: #f90 !important; }
.border-color--black        { border-color: #000 !important; }
.border-color--light-green  { border-color: #abddcd !important; }
.border-color--light-blue   { border-color: #bccddd !important; }
.border-color--light-gray   { border-color: #cdcdcd !important; }
.border-color--light-purple { border-color: #ddbccd !important; }
.border-color--light-red    { border-color: #eebcbc !important; }
.border-color--light-yellow { border-color: #ffddab !important; }
.border-color--silver       { border-color: #dddddd !important; }

/* 背景色 */

[class*="background-color--"]   { background-color: #aaa; }
.background-color--green        { background-color: #096 !important; }
.background-color--blue         { background-color: #369 !important; }
.background-color--gray         { background-color: #666 !important; }
.background-color--purple       { background-color: #936 !important; }
.background-color--red          { background-color: #c33 !important; }
.background-color--yellow       { background-color: #f90 !important; }
.background-color--black        { background-color: #333 !important; }
.background-color--light-green  { background-color: #e5f5ef !important; }
.background-color--light-blue   { background-color: #eaeff5 !important; }
.background-color--light-gray   { background-color: #efefef !important; }
.background-color--light-purple { background-color: #f5eaef !important; }
.background-color--light-red    { background-color: #faeaea !important; }
.background-color--light-yellow { background-color: #fff5e5 !important; }
.background-color--silver       { background-color: #eeeeee !important; }

.background-color--green , .background-color--green  > * { color: #fff !important; }
.background-color--blue  , .background-color--blue   > * { color: #fff !important; }
.background-color--gray  , .background-color--gray   > * { color: #fff !important; }
.background-color--purple, .background-color--purple > * { color: #fff !important; }
.background-color--red   , .background-color--red    > * { color: #fff !important; }
.background-color--yellow, .background-color--yellow > * { color: #fff !important; }
.background-color--black , .background-color--black  > * { color: #fff !important; }

/* 中身の最初と最後の余白を消す */

.myd-grid-inner > *:first-child,
*[class*="myd-box--"] > *:first-child,
.myd-color-border-box > *:first-child,
.myd-color-background-box > *:first-child,
.myd-color-border-background-box > *:first-child,
*[class*="myd-image-bg--"] > :first-child {
	margin-top: 0 !important;
}

.myd-grid-inner > *:last-child,
*[class*="myd-box--"] > *:last-child,
.myd-color-border-box > *:last-child,
.myd-color-background-box > *:last-child,
.myd-color-border-background-box > *:last-child,
*[class*="myd-image-bg--"] > :last-child {
	margin-bottom: 0 !important;
}