@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 {
-webkit-text-size-adjust: 100%;
}

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:135%;
}

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;
/**/
}

.sp_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:190%;
line-height: 1;
font-family:'Montserrat Subrayada',"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
font-weight: bold;
margin-top:20px;
border-top: #C50003 1px solid;
padding-top: 8px;
}

h4 {
margin-bottom: 15px;
color:#666;
font-size: 100%;
line-height: 1;
letter-spacing:0.1em;
font-weight:normal;
border-bottom: #C50003 1px solid;
padding-bottom: 8px;
}
h5 {
margin-bottom: 3px;
font-size:105%;
line-height: 1;
font-weight: bold;
}

.pc {
display:none;
}

#main {
width:100%;
margin-top:40px;
}

#header_pc {
display:none;
}

#header_sp {
margin: 0 auto;
width:100%;
}

#greeting {
width:90%;
margin:0 auto;
padding-top: 30px;
font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
#greeting h2 {
border-top: #C50003 1px solid;
border-bottom: #C50003 1px solid;
padding:10px 0;
margin-bottom: 5px;
color:#C50003;
font-size:190%;
line-height: 1;
font-weight:bold;
	font-family: 'Montserrat Subrayada',Georgia, "Times New Roman", Times, "serif";
}
#greeting h3 {
border: none;
margin-bottom: 10px;
font-size:150%;
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:10px;
margin-bottom:25px;
}

#greeting div.text {
line-height: 160%;
}


#about {
width:90%;
margin:0 auto;
padding-top: 30px;
text-align: center;
}

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

#about #company ul {
}
#about #company ul li{
width:100%;
}
#about #company table{
	margin:0 auto;
	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:90%;
margin:0 auto;
padding-top: 30px;
}
#services  ul {
overflow: hidden;
padding: 0;
text-align:center;
}

#services li {
width: 100%;
margin-bottom:10px;
}
#services li {
min-height: 1px;
}
#services li:after {
content: "."; 
display: block;
clear: both;
height: 0;
visibility: hidden;
}

* html #services li {
height: 1px;
/*¥*//*/
height: auto;
overflow: hidden;
/**/
}

#services .service{
font-size: 100%;
color:#C50003;
letter-spacing:0.1em;
font-weight:bold;
text-align:left;
}
#services .thumbnail{
width:18%;
height:18%;
float:left;
}

#services .thumbnail img{
margin-bottom:8px;
}

#services li div{
float:right;
width:80%;
}


#services .detail {
font-size:90%;
text-align:justify;
}

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

#products ul {
margin:0 auto;
}
#products ul li {
margin-bottom:10px;
}
#products .thumbnail{
width:22%;
height:22%;
float:left;
}

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

#products li div.sp_product{
float:right;
width:75%;
}

#products .product_name{
color:#C50003;
font-weight:bold;
text-align:left;
line-height: 120%;
}
#products .product_name .sub{
font-weight:normal;
margin:0 auto;
font-size:90%;
}

#products .detail{
font-size:90%;
text-align:justify;
}


#recruit {
width:90%;
margin:0 auto;
padding-top: 30px;
}
#recruit section {
}


#contact {
width:90%;
margin:0 auto;
padding-top: 30px;
}
#contact section {
}

#contact table{
margin:0 auto 15px auto;
width:100%;
border-top:#666666 1px dotted;
border-left:#666666 1px dotted;
border-right:#666666 1px dotted;
}

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

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


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


#contact table td .answer{
background:#EDEDED none repeat scroll 0 0;
border:#CCC 1px solid;
padding: 5px 0;
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 {
　　-webkit-appearance: none;
width: 100%;
margin:0px;
}
#contact .submit input{
background-color: #C50003;
	border:#C50003 1px solid;
font-weight:bold;
color:#fff;
border:0;
padding:10px;
}
#contact .submit input:hover{
background-color: #fff;
color:#C50003;
	border:#C50003 1px solid;
}

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

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


#footer {
padding: 20px;
background-color: #2b2f32;
text-align: center;
font-size: 	96%;
color: #aaa;
margin-top:20px;
}

#footer .banner {
	margin-top:10px;
}

#footer .banner img.left {
	width:48%;
	text-align:left;

}

#footer .banner img.right {
	width:48%;
	text-align:right;
}




.paradeiser {
position: fixed;
top: 0;
left: 0;
z-index: 999;
width: 100%;
height: 30px;
background: rgba(255, 255, 255, 0.95);
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.02), 0 2px 10px 0 rgba(0, 0, 0, 0.1);
-webkit-transition: top 0.4s ease;
transition: top 0.4s ease;
-webkit-backdrop-filter: blur(10px) saturate(100%);
backdrop-filter: blur(10px) saturate(100%);
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding:5px;
}
.paradeiser.headroom--pinned {
top: 0;
}
.paradeiser.headroom--unpinned {
top: -40px;
}
.paradeiser a, .paradeiser .paradeiser_dropdown {
position: relative;
z-index: 5;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
margin: 0;
padding: 0;
color: #9b9b9b;
text-align: center;
text-decoration: none;
font-weight: 400;
font-size: 10px;
font-family: -apple-system, -apple-system-body, "Roboto", "Helvetica Neue", "Segoe UI", "Arial", sans-serif;
cursor: pointer;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-flex: 5;
-webkit-flex-grow: 5;
-ms-flex-positive: 5;
flex-grow: 5;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}

.paradeiser a.active, .paradeiser a:hover, .paradeiser .paradeiser_dropdown.active, .paradeiser .paradeiser_dropdown:hover {
}
.paradeiser span {
font-size: 13px;
}.paradeiser span.large {
font-size: 20px;
}

.paradeiser span.paradeiser_dropdown {
margin-right: 10px;
text-align:right;
}
.paradeiser span.paradeiser_dropdown a {
}
.paradeiser .paradeiser_logo {
max-height:30px;
/*height:100%;*/
}

.paradeiser_container{
width:100%;
}

.left{
float:left;
}
.right{
float:right;
}
.paradeiser ul {
position: fixed;
top: 40px;
bottom: 0;
left: 0;
z-index: 998;
visibility: hidden;
margin: 0;
padding: 0;
width: 100%;
height: auto;
text-align: center;
opacity: 0;
-webkit-transition: opacity 0.4s;
transition: opacity 0.4s;
pointer-events: none;
}
.paradeiser ul:target, .paradeiser ul.open {
visibility: visible;
opacity: 1;
-webkit-transition: opacity 0.4s;
transition: opacity 0.4s;
pointer-events: auto;
}
.paradeiser ul li {
display: inline-block;
width: 100%;
background: #C50003;
text-align: center;
}
.paradeiser ul li a {
display: inline-block;
padding: 10px 0;
width: 100%;
color: #fff;
font-size: 110%;
}
.paradeiser ul li a:hover, .paradeiser ul li span:hover {
background: #f8eff2;
color: #C50003;
}
.paradeiser ul li:last-child {
height: 100%;
background: transparent;
}
.paradeiser ul li:last-child a {
display: block;
height: 100%;
background: rgba(0, 0, 0, 0.8);
backdrop-filter: blur(10px) saturate(100%);
}