/*　真ん中の司る部分　*/
@charset "utf-8";
html{color:#000;background:#FFF;}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;font-size:12px;line-height:16px;letter-spacing:0px;}

table{border-collapse:collapse;border-spacing:0;}

fieldset,img{border:0;}

address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}

del,ins{text-decoration:none;}

li{list-style:none;}

caption,th{text-align:left;}

h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}

q:before,q:after{content:'';}

abbr,acronym{border:0;font-variant:normal;}

sup{vertical-align:baseline;}

sub{vertical-align:baseline;}

legend{color:#000;}

input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}

input,button,textarea,select{*font-size:100%;}



body {
 text-align:center;
 font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
background:url(dottbase_gray.jpg);
}


/**  ここから組み合わせのパーツリンク**/

div.pattern_parts_main{
 clear:both;
 width:720px;
 margin:0 auto;
 padding:10px;
 text-align:left;
 position:relative;
 background:rgba(255,255,255,1);
}

 p.title{
	 text-align:center;
	 font-size:20px;
	 padding:10px;
	 font-weight:bold;
 }

div.caution_icon_box{
	clear:both;
	float:left;
	width:98%;
	background:rgba(250,250,250,1);
	padding:1%;
	margin:5px 0;
	border:1px solid gray;
	border-radius:10px;
}

	div.caution_icon_box img.icon{
		float:left;
		width:160px;
		margin:5px;
	}

	div.caution_icon_box p.note{
		float:left;
		width:98%;
		padding:1%;
		margin:5px 0;
		font-size:15px;
		line-height:1.6;
	}
	
		div.caution_icon_box span{
			display:block;
			font-size:0.8em;
			background:rgba(0,0,0,0.1);
			padding:3px;
	}

hr.line{
 clear:both;
 float:left;
 width:98%;
 border:1px dashed rgba(0,0,0,0.5);
 margin:10px 1%;
}

/* ここからNGと注意のパーツレイアウト*/
	div.ng_box{
	 float:left;
	 border:2px dashed red;
	 padding:5px 30px;
	 background:white;
	 width:641px;
	}
	
	p.ng_title{
		font-size:15px;
		margin:5px 5px 0;
	}
	
		p.ng_title span{
			display:block;
			font-size:0.8em;
			background:rgba(0,0,0,0.1);
			padding:3px;
			color:rgba(0,0,0,0.5);
			margin:3px 0 0;
		}
	
	div.ng_parts_box{
	 float:left;
	 text-align:center;
	 margin:5px;
	 width:200px;
	}
	 
	div.ng_parts_box p.parts_name{
	 text-align:center;
	 background:rgba(255,255,255,1);
	 color:rgba(0,0,0,1);
	 font-size:12px;
	 padding:3px;
	 border-top:3px solid rgba(29,32,136,0.5);
	}

		p.parts_name span{
		 display:block;
		 background:rgba(0,0,0,0.1);
		 color:rgba(0,0,0,0.5);
		 font-size:0.8em;
		 padding:2px 5px;
		}

		div.image_box{
		 text-align:center;
		 width:200px;
		 padding:3px 0;
		 background:url(dottbase_gray.jpg);
		 float:left;
		}

		div.image_box img{
		 width:100px;
		}


	 /*　閉じるボタン　*/
div.tojiru {
	float:left;
  clear:both;
  width:720px;
  margin:20px 0 0;
  text-align:center;
}

	div.tojiru  div{
		margin:0 auto;
		background:url(close-mark.png) no-repeat;
		width:250px;
		height:30px;
		position:relative;
	}
	
		div.tojiru  div div{
			position:absolute;
			top:0;
			left:0;
			width:100%;
			height:100%;
			opacity:0;
			background:rgba(0,0,0,0.5);
		}
		
			div.tojiru  div div:hover{
			opacity:1;
			transition:0.2s;
			border-radius:8px;
			}