@charset "UTF-8";
/* CSS Document */
* {
margin: 0;
padding: 0;
}

html{
overflow-y:scroll;
height:100%;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}

body {
color:#333333;
text-align: center;
font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Arial,Helvetica,"sans-serif";
font-size:88%;
line-height:150%;
}

div article{
text-align:center;
}

blockquote, q {
quotes: none;
}

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

input, textarea{
margin: 0;
padding: 0;
}

ol, ul{
list-style:none;
}

table{
border-collapse: collapse; 
border-spacing:0;
height: auto;
max-width: 100%;
width: auto;
}

th,td{
height: auto;
max-width: 100%;
width: auto;
}

caption, th{
text-align: left;
}

a:focus {
outline:none;
}

.clearfix:after {
content: "."; 
display: block;
clear: both;
height: 0;
visibility: hidden;
}

.clearfix {
min-height: 1px;
}

* html .clearfix {
height: 1px;
/*¥*//*/
height: auto;
overflow: hidden;
/**/
}

.br:before {
content: "\A" ;
white-space: pre ;
}

img {
height: auto;
max-width: 100%;
vertical-align: bottom;
width: auto;
}

h3 {
margin-bottom: 5px;
color:#C50003;
font-size:320%;
line-height: 1;
font-weight:bold;
font-family:'Montserrat Subrayada',"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}

h4 {
margin-bottom: 25px;
font-size: 110%;
line-height: 1;
letter-spacing:0.1em;
font-weight:normal;
}

h5 {
margin-bottom: 3px;
font-size:110%;
line-height: 1;
font-weight: bold;
}


.sp {
display:none;
}

#main {
height: 100%;
margin:0 auto;
}
#main img{
margin-top: 5px;
width: 100%;
}

@media only screen and (min-width:1501px) {
#main {
width: 85%;
}
}

#header_pc {
height: 70px;
width: 100%;
box-shadow: 0 3px 5px rgba(0,0,0,0.1);
background: #fff;
}
.fixed {
position: fixed;
top: 0px;
z-index: 9999;
}
#header_pc .container {
width: 100%;
margin: 0 auto;
position: relative;
height: 70px;
}
@media only screen and (min-width:1501px) {
#header_pc .container {
width: 85%;
}
}
#header_pc #logo {
position: absolute;
left: 40px;
top: 7px;
width:150px;;
}
#header_pc #logo a:hover {
opacity: 0.6;
}
#header_pc #global_navi {
	width: 600px;
	position: absolute;
	top: 28px;
	right: 31px;
	text-align: right;
}
#header_pc #global_navi li {
display: inline;
text-align: center;
font-size: 96%;
line-height: 1;
font-family: "arial";
margin-left: 15px;
}
#header_pc #global_navi a {
color: #333;
text-decoration: none;
}
#header_pc #global_navi a:hover {
color: #C50003;
}

#header_sp {
display:none;
}

#greeting {
width:90%;
margin:0 auto;
padding-top:50px;
font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}

@media screen and (min-width: 1401px) {
#greeting {
width:75%;
}
}

#greeting h2 {
margin-bottom: 5px;
color:#C50003;
font-size:320%;
line-height: 1;
font-weight:bold;
margin-bottom: 30px;
	font-family: 'Montserrat Subrayada',Georgia, "Times New Roman", Times, "serif";
}

#greeting h3 {
margin-bottom: 10px;
font-size:230%;
line-height: 1;
font-weight:bold;
	color: #333333;
	font-family: 'Quicksand',Georgia, "Times New Roman", Times, "serif";
}

#greeting p.copy {
font-size:120%;
margin-bottom:15px;
letter-spacing:0.05em;
}

#greeting div.text {
line-height: 190%;
font-size:125%;
letter-spacing:0.05em;
}

#about {
padding-top:80px;
width:80%;
margin:0 auto;
}

#about #company{
position: relative;
overflow: hidden;
}

#about #company ul {
}
#about #company ul li{
	display: inline-block;
	width: 50%;
	margin: 20px 0;
	float: left;
}
#about #company table{
	margin:0 0 0 40px;
	border-collapse:separate;
	border-spacing:8px;
}

#about #company th{
	padding: 7px 10px;
	border-left: #C50003 5px solid;	
}

#about #company td{
	text-align: left;
	padding: 7px 10px 7px 20px;
}


#about .gmap{
	position: relative;
	padding-bottom: 75%;
	height: 0;
	overflow: hidden;
	z-index: 0;
}

#about .gmap iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}


#services {
width:100%;
padding-top:80px;
margin:0 auto;
}

@media screen and (min-width: 1501px) {
#services {
width:75%;
}
}

#services  ul {
overflow: hidden;
padding: 0 10%;
margin:15px 0 25px 0;
width:80%;
text-align:center;
}

#services li {
width: 22%;
float: left;
}
#services li.left {
margin-right:4%;
}

#services .service{
font-size: 120%;
color:#C50003;
letter-spacing:0.1em;
font-weight:bold;
}

#services .thumbnail img{
width:50%;
height:50%;
margin-bottom:10px;
}

#services .detail {
font-size:92%;
margin-top:10px;
text-align:justify;
}

#products {
width:100%;
padding-top:80px;
text-align:center;
margin:0 auto;
}

@media screen and (min-width: 1501px) {
#products {
width:75%;
}
}

#products ul {
margin:30px auto 0 auto;
text-align:center;
width:80%;
}

#products li {
width: 30%;
float:left;
}

#products li.left {
margin-right:4%;
}

#products .thumbnail img{
width:98%;
height:98%;
margin-bottom: 5px;
	border-radius: 5%;
}

#products .product_name{
background-color: #C50003;
color:#FFFFFF;
font-weight:bold;
margin:0 auto;
font-size:105%;
letter-spacing:0.1em;
padding: 8px 5px 5px;
line-height: 120%;
}
#products .product_name .sub{
font-weight:normal;
margin:0 auto;
font-size:85%;
letter-spacing:0.1em;
}


#products .detail{
font-size:92%;
margin-top:3px;
text-align:justify;
}

#recruit {
padding-top: 80px;
text-align:center;
width:100%;
margin:0 auto;
}

@media screen and (min-width: 1501px) {
#recruit {
padding-top: 75px;
}
}

#recruit div{
width:80%;
}

#contact {
padding-top:80px;
text-align:center;
width:100%;
margin:0 auto 70px auto;
}

@media screen and (min-width: 1501px) {
#contact {
width:60%;
}
}

#contact form{
width:70%;
margin:0 auto;
}

#contact .frame {
padding: 30px;
width:80%;
margin:0 auto;
background-color:#f8eff2;
}

#contact table{
margin:0 auto 20px auto;
width:100%;
border-top:#666666 1px solid;
border-left:#666666 1px solid;
border-right:#666666 1px solid;
background-color:#FFFFFF;
}

#contact table th{
text-align:center;
width:25%;
}

#contact table td{
text-align:left;
width:75%
}

#contact table th,#contact table td{
padding:20px;
border-bottom:#666666 1px solid;
font-size:86%;
vertical-align:middle;
}

#contact table td .answer{
background:#EDEDED none repeat scroll 0 0;
border:#CCC 1px solid;
padding: 6px 4px;
height: auto;
max-width: 100%;
width:90%;
}

#contact table td .answer01{
width:90%;
}

#contact table td .answer02{
width:40%;
}

#contact table td .answer03{
width:25%;
}

#contact .submit {
width: 100%;
margin:0px;
}
#contact .submit input{
background-color: #C50003;
	border:#C50003 1px solid;
font-size:110%;
font-weight:bold;
color:#fff;
border:0;
padding:20px;
}
#contact .submit input:hover{
background-color: #FFFFFF;
color:#C50003;
	border:#C50003 1px solid;
}


#privacy {
width:80%;
margin:0 auto;
padding: 30px 0;
}

#privacy div {
font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif ;
text-align:justify;
}


@media screen and (min-width: 1501px) {
#privacy {
width:75%;
}
}



#footer {
padding: 30px 50px;
background-color: #2b2f32;
text-align: center;
font-size: 	90%;
color: #aaa;
}

#footer .banner {
	text-align:center;
}

#footer .banner img {
	margin:20px 5px 0 5px;
	width:130px;
}