/*
Theme Name : Sample Theme
Theme URL : http://----//
*/

/*--============================

・img
・em
・a
・h1～h6
・li
・right/center/left
・margin
・padding
・clearFix

=============================--*/

/*-========【body】========-*/
div,p,dl,dt,dd,ul,ol,li,table,tr,th,td,
h1,h2,h3,h4,h5,h6,form,input,textarea,button,fieldset,blockquote {
	margin: 0;
	padding: 0;
	zoom: 1;  /* for IE hasLayout true */
}



/*-========【table】========-*/
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/*-========【right/center/left】========-*/
.txtR { text-align: right !important;}
.txtC { text-align: center !important;}
.txtL { text-align: left !important;}

/*-========【right/center/left】========-*/
.flotR { float: right;}
.flotL { float: left;}


/*-========【margin】========-*/
.mt0  { margin-top: 0px !important;}
.mt5  { margin-top: 5px !important;}
.mt10 { margin-top: 10px !important;}
.mt15 { margin-top: 15px !important;}
.mt20 { margin-top: 20px !important;}
.mt25 { margin-top: 25px !important;}
.mt30 { margin-top: 30px !important;}
.mt35 { margin-top: 35px !important;}
.mt40 { margin-top: 40px !important;}

.mr0  { margin-right: 0px !important;}
.mr5  { margin-right: 5px !important;}
.mr10 { margin-right: 10px !important;}
.mr15 { margin-right: 15px !important;}
.mr20 { margin-right: 20px !important;}
.mr25 { margin-right: 25px !important;}
.mr30 { margin-right: 30px !important;}
.mr35 { margin-right: 35px !important;}
.mr40 { margin-right: 40px !important;}

.mb0  { margin-bottom: 0px !important;}
.mb3  { margin-bottom: 3px !important;}
.mb5  { margin-bottom: 5px !important;}
.mb10 { margin-bottom: 10px !important;}
.mb15 { margin-bottom: 15px !important;}
.mb20 { margin-bottom: 20px !important;}
.mb25 { margin-bottom: 25px !important;}
.mb30 { margin-bottom: 30px !important;}
.mb35 { margin-bottom: 35px !important;}
.mb40 { margin-bottom: 40px !important;}
.mb60 { margin-bottom: 60px !important;}

.ml0  { margin-left: 0px !important;}
.ml5  { margin-left: 5px !important;}
.ml10 { margin-left: 10px !important;}
.ml15 { margin-left: 15px !important;}
.ml20 { margin-left: 20px !important;}
.ml25 { margin-left: 25px !important;}
.ml30 { margin-left: 30px !important;}
.ml35 { margin-left: 35px !important;}
.ml40 { margin-left: 40px !important;}
.ml60 { margin-left: 60px !important;}

.ml140 { margin-left: 140px !important;}

/*-========【padding】========-*/
.pt0  { padding-top: 0px !important;}
.pt5  { padding-top: 5px !important;}
.pt10  { padding-top: 10px !important;}
.pt15  { padding-top: 15px !important;}
.pt20  { padding-top: 20px !important;}

.pr0  { padding-right: 0px !important;}
.pr5  { padding-right: 5px !important;}
.pr10  { padding-right: 10px !important;}
.pr15  { padding-right: 15px !important;}
.pr20  { padding-right: 20px !important;}

.pb0  { padding-bottom: 0px !important;}
.pb5  { padding-bottom: 5px !important;}
.pb10  { padding-bottom: 10px !important;}
.pb15  { padding-bottom: 15px !important;}
.pb20  { padding-bottom: 20px !important;}

.pl0  { padding-left: 0px !important;}
.pl5  { padding-left: 5px !important;}
.pl10  { padding-left: 10px !important;}
.pl15  { padding-left: 15px !important;}
.pl20  { padding-left: 20px !important;}
.pl140  { padding-left: 140px !important;}

/* ------------------------------------------------------------
▼clearfix
------------------------------------------------------------ */
.clearfix:after {
	clear: both;
	display: block;
	visibility: hidden;
	font-size: 0;
	height: 0;
	content: ".";
}
.clearfix {
	display: inline-block;
	min-height: 1%;  /* for IE7 */
}
/* hide from MacIE \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* end hide from MacIE */


/*-========【li】========-*/
li { list-style: none;}

/*-========【カラーテキスト】========-*/

.attentionRed { color:#ff0000;}
.attentionWred { color:#910000;}
.attentionBlue { color:#0038a8;}

/*-========【テキストサイズ】========-*/
.fsizeS { font-size: 85%;}
.fsizeM { font-size: 120%;}
.fsizeL { font-size: 145%;}
/* ------------------------------------------------------------
other hack
------------------------------------------------------------ */
/* for IE6 background flicker bug */
* html { filter: expression( document.execCommand("BackgroundImageCache", false, true) ); }


/* ------------------------------------------------------------
.attenstionList
------------------------------------------------------------ */
ul.attentionList {
	margin:4px 0;
	line-height:1.4em;
	color:#666;
	font-size:85%;
	list-style-type:none !important;
}

ul.attentionList li {
	padding:0 0 0 1em !important;
	text-indent:-1em !important;
	/*
	padding-left:2.5em !important;
	text-indent:-2.5em;
	*/
	background:none !important;
}

p.attentionList {
	margin:-10px 0 30px !important;
	line-height:1.4em;
	color:#666;
	font-size:85% !important;
	padding:0 0 0 2em !important;
	text-indent:-1em !important;
}

#contents article .indentBox .leadBox p.attentionList {
	padding:0 0 0 34em !important;
	text-indent:-1em !important;
}

/* ------------------------------------------------------------
.listArea
------------------------------------------------------------ */
ul.listArea {
	margin:4px 0;
	line-height:1.4em;
	color:#666;
	list-style:none;
}

ul.listArea li {
	padding-left:1.5em !important;
	text-indent:-1.5em;
}


dl.listArea {
	margin:0;
	padding:0 0 15px;
	border-bottom:1px solid #CCC;
}

dl.listArea dt {
	margin:0 0 15px;
	padding:0;
	border-bottom:1px solid #CCC;
}

dl.listArea dt span {
	margin:0 0 5px 15px;
	padding:0 0 0 10px;
	border-left:5px solid #FBCD46;
	display:inline-block;
	font-weight:bold;
}

dl.listArea dd {
	margin:0 0 10px 15px;
}


dl.listArea02 {
	margin:0 0 30px;
	padding:15px;	
	border:2px solid #D0D0D0;
	border-radius:7px;	
}

dl.listArea02 dt {
	margin:0 0 0 16px;
	padding:0;
	font-weight:bold;
}

dl.listArea02 dd {
	margin:0 0 5px 15px;
}


ul.numberListArea {
	margin: 0 0 30px !important;
	padding:7px 25px !important;
	border-top:1px dotted #CCC;
	border-bottom:1px dotted #CCC;
}

ul.numberListArea li {
	margin: 8px 0 0 !important;
	padding: 0 0 0 1.2em !important;
	background: none !important;
	text-indent: -0.7em;
	font-size: 114%;
}

ul.numberListArea li:first-child {
	margin:0;
}

/* ------------------------------------------------------------
.imgGuideArea
------------------------------------------------------------ */
.imgGuideArea {
	border:2px solid #D0D0D0;
	border-radius:7px;	
	padding:15px;
}

.imgGuideArea ul li {
	margin:0;
	padding:0 !important;
	min-height:230px;
	background: none !important;
}

.imgGuideArea ul li img {
	float:left !important;
	display:inline !important;
}


/* ------------------------------------------------------------
.imgListArea
------------------------------------------------------------ */
.imgListArea01 {
	text-align:center !important;
}

.imgListArea01 ul {
	letter-spacing:-0.04em !important;
	text-align:center !important;
}

.imgListArea01 ul li {
	margin:0;
	padding:0 !important;
	background: none !important;
	display:inline-block !important;
}

/* ------------------------------------------------------------
.images
------------------------------------------------------------ */
.images {
	margin:0 auto 20px;
	border:3px solid #BAEC80;
	width:600px;
}

/* ------------------------------------------------------------
.guideArea
------------------------------------------------------------ */
dl.guideArea {
	margin:0 0 30px;
	border-radius:10px;
	padding:15px;
	background:#E5E5D6;
}

dl.guideArea dt {
	margin:20px 0 0;
	padding:0 0 0 10px;
	font-weight:bold;
}

dl.guideArea dt:first-child {
	margin:0;
}

dl.guideArea dd {
	padding:8px 5px;
	border-radius:5px;
	background:#FFF;
	color:#666;
	font-size:85%;
}

@media screen and (max-device-width: 709px) {
	#contents article .indentBox .leadBox p.attentionList {
		margin:0 0 25px !important;
		padding:0 0 0 0 !important;
		text-indent:-3em !important;
		display:inline !important;
	}
	
	p.attentionList {
		margin-top:0 !important;
		padding:0 0 0 1em !important;
	}
	
	#contents article .indentBox .artBox p {
		width:100% !important;
	}
	
	#contents article .indentBox .artBox p img,
	#contents article .indentBox .artBox div img {
		margin-bottom:25px !important;
		width:100% !important;
		height:auto;
		display:block !important;
		float:none !important;
	}
	
	
	
	#contents article .indentBox .artBox div {
		width:100% !important;
	}

	.images {
		display:none;
	}
	
	.isampleImages img {
		width:100% !important;
		height:auto !important;
	}

}