/*
PC3カラム版 レスポンシブウェブCSS
Author:Web make
url:http://w-make.com/
blog:http://blog.w-make.com/
*/
/*css リセット*/
/*
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
border: 0;font-family: inherit;font-size: 100%;font-style: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;
}
:focus {
outline: 0;
}
header, main, article, section, aside, nav, details, figcaption, figure, footer{
display: block;
}
body{
	font-size: 13px;
}
p{
	font-size: 115%;
	margin: 5px 0 5px 0;
	color: #484848;
}
ol, ul {
	font-size: 115%;
	margin: 5px 10px 5px 15px;
	color: #484848;
}
h1{
	font-size: 160%;
}
h2,h3,h4{
	font-size: 140%;
}
section{
	padding: 5px 0 5px 0;
}
*/
/*
// 145 610 145 = 900
// 全体幅 980
// メイン（左＋コンテンツ） 805 = 145 + 610 = 755 + 50(マージン)
// 右 980 - 805 = 175 - 145 = 30(マージン)
// 40 145 10 610  / 10 145 40 //
// 40 200 10 550 / 10 180 40 = 1030
// 0 200 0 650 / 0 180 0 = 1030
*/

/* 全体
------------------------------------------------------------*/
#wrapper{
	width: 1030px; /*PC用*/
	text-align:left;
	margin:0 auto;
	background: #fff url(../images/bg_center.gif) repeat-y right top;
}
/* ヘッダ---------------------------------------------------*/
#head{
	height: 180px;
	background-color: #f08080;
	/* border-bottom: 7px solid #f08080; */
}
/* メイン---------------------------------------------------*/
#main{
	width: 850px;
	float: left;
	margin-top: 10px;
	margin-bottom: 10px;
}
/* コンテンツ-----------------------------------------------*/
#contents{
	width: 650px;
	float: right;
	/* background-color: #FFBD00; */
	margin-left: 0px;
}
/* 共通----------------------------------------------*/
#side_A{
	width: 200px;
}
#side_B{
	width: 180px;
}

#head, #footer, #contents, #side_A, #side_B{
	margin: 0;
	padding: 0;
}
/* サイドバー1----------------------------------------------*/
#side_A{
	/* background-color: #FFE34C; */
	float: left;
}
/* サイドバー2----------------------------------------------*/
#side_B{
	margin-top: 10px;
	/* background-color: #C5EDFF; */
	float: right;
}
/* フッター-------------------------------------------------*/
#footer{
	clear: both;
	/* background-color: #DBD9D9; */
}
/* モニター幅1024以下 */
/*
@media only screen and (max-width:1024){
		*{
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	}
	#wrapper{
		width: 100%;
	}
	#main{
		width: 80%;
	}
	#contents{
		width: 80%;
	}
	#side_A, #side_B{
		width: 18%;
	}
}
*/
/* iPad 768px縦以下 */
@media only screen and (max-width:768px){
	*{
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	}
	img, iframe {
	   max-width: 100%;
	   height: auto;
	}
	#wrapper{
		width: 100%;
		background-image: none !important;
	}
	#head{
		height: 130px;
	}
	#main{
		width: 100%;
		float: none;
		margin:0 0 10px 0;
	}
	#contents{
		width: 80%;
		margin:0px;
	}
	#side_A{
		width: 18%;
	}
	#side_B{
		float: none;
		clear: both;
		width: auto;
		margin:0 0 10px 0;
	}
	fieldset select,
	fieldset textarea,
	fieldset input{
		margin: 0;
		padding: 0;
		width: 100%;
	}
}
/* 480px以下（スマートフォン横）*/
@media screen and (max-width: 480px) {
	#contents, #side_A{
		float: none;
		clear: both;
		margin:10px 0 10px 0;
		width: auto;
	}
}
/* 320px以下(スマートフォン縦) */
@media only screen and (max-width:320px){

}