@charset "shift_jis";

body	{
     margin:0;
     font-family: 'メイリオ','Hiragino Kaku Gothic Pro', sans-serif}




/*初期設定(全ページ共通）
------------------------------------*/
body{
    margin:0;
    padding:0 20px;
    text-decoration:none;
    font-size:small;
    color:#333333;
    background:#ffffff;
}

h1{
    margin-bottom:10px;
    font-size:medium;
    font-weight: bold;
    padding-bottom: .5em;
    border-bottom: 1.5px solid #999999;
}

h2{
	margin-top:40px;
	margin-bottom:10px;
	padding-left:10px;
	border-left:solid 10px #fea725;
	font-size:medium;
	font-weight:normal;
}

h3{
    font-size:small;
    margin-bottom:10px;
    padding:0;
}

h4{
    font-size:small;
    font-weight:normal;
    margin-bottom:10px;
    padding:0;
}

p{
    margin-bottom:5px;
    padding:0;
}


a:link, a:visited{
    color:#003399;
    text-decoration:none;
}


a:hover{
	color: #cc0066;
	text-decoration: underline;
}

.boxA, .contents, .boxB, .header-menu, .header-button, .main, .footer {
    display:block;
}



/*h1下写真(ｐ1)と注文ボタン(ｐ2)*/
.p1 img{
	float:right;
    margin-left:1em;
}

.p1 {
	margin-bottom:20px;
}


.p2 img {
   	padding:20px 0 20px 0;
    max-width:100%;
	height:auto;
	border:none;
	display:block;
	margin:auto;
}

.p2 p {
	text-align:right;
}


/*パンくずリストパンくずリスト*/
#breadcrumbs ol {
    margin:5px 0 30px 5px;
    padding:0;
}

#breadcrumbs ol li {
  display: inline;
  list-style-type: none;
  font-size:small;
}

#breadcrumbs ol li:before {
  content: " > ";
}

#breadcrumbs ol li:first-child:before {
  content:"";
}



/*テーブル*/

table {
    font-size:small;
    border:1.5px solid #999999;
    border-collapse:collapse;
}

th, td {
	padding:0.2em;
	border:1.5px solid #999999;
	text-align:center;
}

th {
	background:#d9d9d9;
}



/*ul33*/
.ul33 ul {
	margin:0;
	padding:0;
	list-style:none;
}

.ul33 li a {
	display:block;
	padding:0 10px;
}

.ul33 li p {
	display:block;
	padding:0 10px 10px 10px;
}

.ul33 ul:after {
	content:"";
	display:block;
	clear:both;
}

.ul33 li {
	float:left;
	width:33.333%;
}

.ul33 img {
	max-width:100%;
	margin-right:1em;
	height:auto;
	border:none;
}


/*ul50*/
.ul50 ul {
	margin:0;
	padding:0;
	list-style:none;
}

.ul50 li a {
	display:block;
	padding:0 10px;
}

.ul50 li p {
	display:block;
	padding:0 10px 10px 10px;
}

.ul50 ul:after {
	content:"";
	display:block;
	clear:both;
}

.ul50 li {
	float:left;
	width:50%;
}

.ul50 img {
	max-width:100%;
	margin-right:1em;
	height:auto;
	border:none;
}



/*ul100*/
.ul100 ul {
	margin:0;
	padding:0;
	list-style:none;
}

.ul100 li a {
	display:block;
	padding:0 10px;
}

.ul100 li p {
	display:block;
	padding:0 10px 0 10px;
}

.ul100 ul:after {
	content:"";
	display:block;
	clear:both;
}

.ul100 li {
    padding-bottom:10px;
	float:left;
	width:100%;
}

.ul100 img {
	max-width:100%;
	height:auto;
	border:none;
}


/*アイコン*/
.fa {
	color:#333333;
}









/*詳細変更
------------------------------------*/

/*トップページｈ1ラインを消す*/
.header-site h1 {
    margin-bottom:0;
    font-size:small;
    font-weight:normal;
    padding-bottom:0;
    border-bottom:none;
}



/*header-site サイト名*/
.header-site img {	
	border:none;
}



/*nav ナビゲーション*/
nav ul{
  overflow:hidden;
  margin:0 0 10px 0;
  padding:0;
  border:1px solid #dddddd;
  border-radius:7px;
  box-shadow:inset 1px 1px 0 #fff, 1px 1px 3px rgba(0,0,0,0.1);
  line-height:1.0;
  background:url(images/li-bg.jp) repeat-x bottom;
}

nav li, nav a{
  display:block;
}

nav li{
  float:left;	
  border-right:1px solid #dddddd;
}

nav a{
  padding:8px 12px;
  font-weight:bold;
  text-decoration:none;
  text-shadow:1px 1px 0 #ffffff;
}

nav a:hover{
  background:URL(images/li-bg-hover.jpg) repeat-x bottom;
}


/*nav(ナビゲーション)文字カラー指定*/
#current a{
  color:#333333;
}

#current a:hover{
	color: #cc0066;
    text-decoration:none;
}



/*headerボックスの間隔調整*/
.boxA {
	padding-top:20px;
	padding-bottom:10px;
}



/*header-buttonの調整*/
.header-button ul{
    margin:0;
	padding:0 20px 10px 20px;
	text-align:center;
	list-style:none;
}

.header-button li a {
	display:block;
	padding:0 10px;
}

.header-button ul:after {
	content:"";
	display:block;
	clear:both;
}

.header-button li {
	float:left;
	width:25%;
}

.header-button img {
	max-width:100%;
	height:auto;
	border:none;
}



/*フッター（コピーライト）*/
.footer p {
	margin:0;
	text-align:center;	
}

/*フッターの上に区切り線、余白を入れる*/
.footer {
	border-top:solid 1px #dddddd;
	margin-top:40px;
	padding-top:15px;
	padding-bottom:15px;
}






/*########## 599px以下 ##########*/
@media(max-width:599px){

/*header-menu ナビゲーション*/
.header-menu li a {
	padding:7px 6px;
}


/*header-buttonの調整*/
.header-button ul{
	padding:0 10px 10px 10px;
	text-align:center;
}

.header-button li {
	float:left;
	width:50%;
}


/*ul33*/
.ul33 li {
	width:50%;
}

.ul33 li:nth-child(3) {
	clear:both;
}

.ul33 li:nth-child(5) {
	clear:both;
}


/*製品*/
.product li a {
	padding:0 10px 10px 0;
}

.product li p {
	display:none;
}





}




/*########## 600px以上 ##########*/
@media(min-width:600px){

/*header-siteとheader-addを横に並べる設定*/
.boxA:after {
	content:"";
	display:block;
	clear:both;
}

.header-site {
	float:left;
	width:auto;
}

.header-add {
	float:right;
	width:auto;
}


/*ul100並び*/
.ul100 li {
	width:50%;
}

.ul100 li:nth-child(5) {
	clear:both;
}









}


/*########## 767px以下 ##########*/
@media(max-width:787px){





}



/*########## 768px以上 ##########*/
@media(min-width:768px){





}


/*########## 1040px以上 ##########*/
@media(min-width:1040px){

/*全体の横幅の固定*/
nav, .boxA, .boxB, .header-menu, .header-button, .footer {
	width:1000px;
	margin-left:auto;
	margin-right:auto;
}

.contents {
	width:600px;
	margin-left:auto;
	margin-right:auto;
}


}