﻿@charset "utf-8";
/*---FONT---*/
* {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font: 13px;
 *font-size:small;
 *font:x-small;
 border:0;
}
table {
	font-size: inherit;
	font: 100%;
}
img {
	border: 0px;
	 vertical-align: bottom; 
}
article, aside, figure, figcaption, footer, header, nav, section {
display: block;
}

/*--------------------------------------

          body relation 

---------------------------------------*/

body {
	width: 100%;
	
	height: 100%;
	background: #fcfcfc;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9;
}
/*--------------------------------------

           header relation 

---------------------------------------*/

#global_header{ width:100%; background:#a00; min-width:1200px; }
#header_inner{ width:1000px; background:#a00; margin:0 auto; padding:10px 0;}
#header_inner h1{ color:#FFF; }


/*--------------------------------------

              top image

---------------------------------------*/
#top_image{ width:100%; background:#111111; min-width:1200px; border-bottom:5px solid #555;}
#viewer {text-align: center;}



/*--------------------------------------

                 main

---------------------------------------*/
#main_bg{ width:100%; border-top:3px solid #ccc;}
#bg_shadow{width:1200px; margin:0 auto; background:url("../img/main_bg.png");}
.main_wrapper{width:1000px; margin:0 auto; }
.contents{width:1000px; margin:0 auto; }

header{ width:1200px; background:;margin:0 auto;padding:0px; text-align:center;}
.inner{ width:840px; background:#fff; margin:0 auto; padding:80px; line-height: 180%; overflow:hidden;}
img.right{float:right;  margin-left:30px;}

h1.contents_header{background:url("../img/h1.png"); height:150px;}

.inner_box_header{ width:840px; height:100px;background:url("../img/box_header.gif");}
.inner_box{ width:680px; background:url("../img/box_bg.gif"); padding:0 80px; overflow:hidden;}
.inner_box_footer{width:840px;background:url("../img/box_footer.gif"); height:100px; margin-bottom:80px;}


/*--------------------------------------

                 bled

---------------------------------------*/

.table_cell{display:table-cell;}
.bled_right{ float:right;width:600px;}
.bled_left{ float:left; width:80px; }
.clear { clear:both; }
.bled{ width:680px; margin-bottom:20px; overflow:hidden;}
.bled_img{margin-right:30px; }
.vertical{vertical-align:middle;}
/*--------------------------------------

                 footer

---------------------------------------*/


footer{ width:100%; background:#ddd; padding:100px 0; border-top:5px solid #555;min-width:1200px; }
#footer_inner{ width:1000px; margin:0 auto; }


/*--------------------------------------

             commodity

---------------------------------------*/
.co_box_header{ width:840px; height:100px;background:url("../img/box_header.gif");}
.co_box{ width:680px; background:url("../img/box_bg.gif"); padding:0 80px; overflow:hidden;}
.co_box_footer{width:840px;background:url("../img/box_footer.gif"); height:100px; margin-bottom:80px;}

.co_box p{ text-align:center; margin-top:50px; cursor:pointer;}
.co_box p img:hover{opacity:0.5; }

/*--------------------------------------

             table

---------------------------------------*/

table {
margin-bottom: 20px;
width: 100%;
border: 1px solid #dcdcdc;
float: left;
background: #eee;
padding-bottom: 0px;
}
th,tr,td{
padding: 5px 20px;
text-align: center;
border: 1px solid #dcdcdc;
background: #fff;
font-weight:normal;

}
th{ width:150px; }
td{ text-align: left; }


/*--------------------------------------

responsive

---------------------------------------*/

@media screen and (max-width: 1380px) {
	
	
#header_inner{ width:800px;}

#viewer img{ }


header{ width:1000px; margin:0 auto;padding:0px; text-align:center;}
h1.contents_header{background:url("../img/h1.png"); height:150px; background-size:contain; background-repeat:no-repeat}

h1.contents_header img{width:800px; height: 130px;}
#bg_shadow{ width: 1000px; background-size: contain;}
.inner{ width:660px; background:#fff; margin:0 auto; padding:80px; line-height: 180%; overflow:hidden;}

.inner_box_header{width: 660px;background-size: contain;background-repeat:no-repeat; margin:0 auto; height:80px; background-position:bottom;}
.inner_box{ width:580px;background-size: contain; padding:40px;}
.inner_box_footer{width: 660px;background-size: contain;background-repeat:no-repeat; margin-bottom: 0;}

.co_box_header{width: 660px;background-size: contain;background-repeat:no-repeat; margin:0 auto; height:80px; background-position:bottom;}
.co_box{ width:580px;background-size: contain; padding:40px;}
.co_box_footer{width: 660px;background-size: contain;background-repeat:no-repeat; margin-bottom: 0;}


}
 @media screen and (max-width: 1199px) {
	 
	 #global_header{ width:100%; background:#a00; min-width:800px; }
#top_image{ min-width:800px;}

#header_inner{ width:700px;}
#viewer { }
#viewer img{ }


header{ width:800px; background:;margin:0 auto;padding:0px; text-align:center;}
h1.contents_header{background:url("../img/h1.png"); height:100px; background-size:contain; background-repeat:no-repeat}

h1.contents_header img{width:600px; height: 100px;}

.inner{ width:600px; background:#fefefe; margin:0 auto; padding:0 0 40px 0; line-height: 180%; overflow:hidden;}
img.right{float:none;  margin:30px auto; display: block;}
#bg_shadow{ width: 800px; background-size: contain;}


.inner_box_header{width: 600px;background-size: contain;background-repeat:no-repeat; margin:0 auto; height:80px; background-position:bottom;}
.inner_box{ width:520px;background-size: contain; padding:40px;}
.inner_box_footer{width: 600px;background-size: contain;background-repeat:no-repeat; margin-bottom: 0;}


.co_box_header{width: 600px;background-size: contain;background-repeat:no-repeat; margin:0 auto; height:80px; background-position:bottom;}
.co_box{ width:520px;background-size: contain; padding:40px;}
.co_box_footer{width: 600px;background-size: contain;background-repeat:no-repeat; margin-bottom: 0;}


footer{ width: 800px; }
#footer_inner{ width: 800px; }


}
 @media screen and (max-width: 853px) {
	 
	 #global_header{ width:100%; background:#a00; min-width:100%; }
#top_image{ min-width:100%;}

section{ width: 100% ; }

#header_inner{ width:90%;}
#viewer img{ width:100%; }


header{ width:100%; background:;margin:0 auto;padding:0px; text-align:center;}
h1.contents_header{height: auto; padding:20px 10px; color:#fff; text-shadow:1px 1px 1px #500; 
background: #a00;}

h1.contents_header img{width:100%; height: auto;}

.inner{ width:95%; background:#fefefe; margin:0 auto; padding:0 0 40px 0; line-height: 180%; overflow:hidden;min-width:0;}
img.right{float:none;  margin:30px auto; display: block; width: 100%; height:100%;}
#bg_shadow{ width: 100%; background-image: none;min-width:0;}


.inner_box_header{width: 95%;background-size: contain;background-repeat:no-repeat; margin:0 auto; height:80px; background-position:bottom;}
.inner_box{ width:95%;background-size: contain; padding:0px; margin:0 auto;}
.inner_box div{ width:95%; margin:0 auto;}
.inner_box_footer{width: 95%;background-size: contain;background-repeat:no-repeat; margin-bottom: 0; margin:0 auto;}


.co_box_header{width: 95%;background-size: contain;background-repeat:no-repeat; margin:0 auto; height:80px; background-position:bottom;}
.co_box{ width: 95%;background-size: contain; padding:0px;margin:0 auto;}
.co_box div{ width: 95%; margin:0 auto;}
.co_box_footer{width: 95%;background-size: contain;background-repeat:no-repeat; margin-bottom: 0;margin:0 auto;}

.co_box img{width: 70%; }
footer{ width:100%; min-width:0; padding: 40px 0;}
#footer_inner{ width: 95%; }

.btn_img{ width:80%; }
}
