@charset "utf-8";

/* last-update: 20150714 */
/* last-update: 20180214 */

/* ------------------------------------
common.css: I N D E X
------------------------------------
- overwrite: _assets

- common css
- reset (clearfix, base)
- common:
contents, headerMenu,
right-nav (first hierarchy), floatNav

- index css
- top slide
- main
- news
- serch
- contact
- service
- banner
- caution

- news css
- index
- details: menu, contents, column

- product css
- index
- headerMenuWhite
- sp_title
- index
- product: right-nav
- details: index, intro, merit, catalog

- catalog css
------------------------------------ */


/* --------- overwrite: _assets --------- */
.st-GlobalInner {
max-width: 100%;
padding: 0;
}
.st-GlobalNav_Area .st-GlobalInner {
position: absolute;
}
/* --------- : common: floatNav --------- */
/* #floatNav{
display:block;
position:absolute;
top:150px; 
}*/

/* -----------------------------------------------------------------
common css
----------------------------------------------------------------- */
/* --------- reset --------- */
#contents *, #contents *:before, #contents *:after {
/* box-sizing: inherit; */ /* overwrite: _assets */
box-sizing: content-box;
}

body, #contents div, #contents dl, #contents dt, #contents dd,
#contents ul, #contents ol, #contents li,
#contents h1, #contents h2, #contents h3, #contents h4, #contents h5, #contents h6,
#contents pre, #contents form, #contents fieldset, #contents input, #contents textarea, #contents p, #contents blockquote{
padding:0;
margin:0;
}
#contents fieldset, #contents img{
border:0;
}
#contents div{
display:block;
}
#contents address, #contents caption, #contents cite, #contents code,
#contents dfn, #contents em, #contents strong, #contents th, #contents var{
font-weight:normal;
font-style:normal;
}
#contents ol, #contents ul{
list-style:none;
}
#contents caption, #contents th{
text-align:left;
}
#contents h1, #contents h2, #contents h3, #contents h4, #contents h5, #contents h6{
font-weight:normal;
font-size:100%;
}
#contents q:before, #contents q:after{
content:'';
}
#contents abbr, #contents acronym{
border:0;
}
#contents img{
vertical-align: bottom;
}
#contents input, #contents select, #contents textarea{
font-size:100%;
font-family:inherit;
}

/* clearfix */
.clearfix {
display:inline-block;
}
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
* html .clearfix {
height:1%;
}
.clearfix {
display:block;
}

/* link */
#contents a:link { color:#1780c4; text-decoration:none; }
#contents a:visited { color:#1780c4; text-decoration:none; }
#contents a:hover { color:#1780c4; text-decoration:underline; }




/* --------- common: contents --------- */
body #contents{
line-height:1.5;
color:#555555;
margin:0 auto;
}
#contents h1{
color:#ffffff;
font-size:21px;
padding:5px 0 5px 10px;
font-weight:bold;
}
#contents {
background-color:#ffffff;
width:100%;
}
#contents a:link, #contents a:visited {
text-decoration:none;
color:#2a96e1;
}
#contents a:hover, #contents a:active {
text-decoration:underline;
color:#2a96e1;
}
#contents #index,
#contents #news,
#contents #catalog,
#contents #product {
margin:40px auto 50px auto;
max-width:950px;
text-align:left;
z-index:0;
}
#contents .main {
float:left;
width:680px;
text-align:left;
word-break:normal;
}

@media screen and (max-width: 640px) {
body #contents,
#contents,
#contents #index,
#contents #news,
#contents #catalog,
#contents #product{
float:none;
width:92%;
margin:40px auto 0 auto;
}
}


/* --------- common: headerMenu --------- */
#contents #headerMenu{
background-color:#ffffff;
width:100%;
height:37px;
position:relative;
z-index:500;
}
#contents #menu{
width:100%;
max-width:950px;
margin:0 auto;
padding:0;
text-align:center;
	background-image:url("../img/common/menu_line.gif");
background-repeat:no-repeat;
background-position:left center;
}
#contents #menu ul{
display:table;
position:absolute;
text-align:left;
}
#contents #menu li{
	background-image:url("../img/common/menu_line.gif");
background-repeat:no-repeat;
background-position:right center;
float:left;
display:table-cell;
max-width:188px;
width:20%;
margin:0;
}
#contents #menu li:first-child{
border-left:none;
}
#contents #menu li a{
display:block;
padding:15px 0;
color:#333333;
font-size:14px;
text-decoration:none;
}
#contents #menu .level1 > a:hover {
color:#1780c4;
}

#contents #menu .level2{
display:none;
overflow:hidden;
border-top:solid 1px #ccc;
border-left:solid 1px #ccc;
border-right:solid 1px #ccc;
}
#contents #menu ul.level2,
#contents #menu ul.level2 li{
box-sizing:inherit!important;
list-style-type:none!important;
list-style:none!important;
list-style-position:outside!important;
list-style-image:none!important;
}
#contents #menu .level2 li{
display:block;
float:none;
z-index:500;
width:auto;
height:auto;
background-color:#fafafa;
background-repeat:no-repeat;
background-position:10% 22px;
background-size:5%;
border-bottom:solid 1px #ccc;
}
#contents #menu .level2 li a{
display:inline-block;
box-sizing:border-box;
min-width:188px;
padding:15px 0 15px 35px;
}
/* for Edge */
@supports (-ms-ime-align:auto) {
#contents #menu .level2 li a{
padding:15px 0 15px 35px;
}
}
/* for IE11 */
@media all and (-ms-high-contrast:none){
#contents #menu .level2 li a{
padding:15px 0 15px 35px;
}
}

#contents #menu .level2 li:hover,
#contents #menu .level2 li:active{
background-color:#ebf4fc;
}

/* --------- common: right-nav (first hierarchy) --------- */
#contents .nav{
float:right;
max-width:220px;
text-align:left;
}
#contents .nav ul{
width:220px;
}
#contents .nav ul.list{
margin-bottom:13px;
}
#contents .nav .list li,
#contents .nav .bnr li{
margin-bottom:7px;
text-align:left;
}
#contents .nav .contact li{
margin-bottom:20px;
}
#contents .nav .bnr li{
margin-bottom:9px;
}
#contents .nav .contact a:hover,
#contents .nav .bnr a:hover{
opacity:0.8;
}

@media screen and (max-width: 640px) {
#contents .nav{
float:none;
width:100%;
max-width:100%;
text-align:left;
}
#contents .nav .contact{
width:100%;
}
#contents .nav ul{
width:100%;
margin:0 auto;
}
#contents .nav .contact li,
#contents .nav .bnr{
margin-bottom:20px;
}
#contents .nav ul li img {
max-width:100%;
width:100%;
}
}


/* --------- common: floatNav --------- */
#floatNav{
display:block;
position:fixed;
right:-287px;
width:327px;
height:180px;
z-index:600;
color:#ffffff;
transition:0.3s;
}
#floatNav a{
color:#ffffff;
}
#floatNav:hover{
width:327px;
right:0;
}
#floatNav .floatNav-btn{
display:block;
width:40px;
position:relative;
}
#floatNav .floatNav-banner{
position:absolute;
top:0;
right:0;
width:287px;
height:179px;
background-color:#e87769;
z-index:600;
}

#floatNav .floatNav-btn .floatNav-icon {
background-color:#df0522;
border-radius:4px 0 0 0;
padding:10px 0;
border-bottom:1px solid #ea7666;
text-align:center;
}
#floatNav .floatNav-btn .floatNav-contact {
display:block;
height:133px;
background-color:#df0522;
border-radius:0 0 0 4px;
padding:15px 0 0 0;
text-align:left;
}
#floatNav .floatNav-btn p {
font-size:0.9375rem;
-webkit-writing-mode:vertical-rl;
-ms-writing-mode:tb-rl;
writing-mode:vertical-rl;
line-height:1;
letter-spacing:0.1em;
position:absolute;
top:64px;
right:-3px;
}
/* for Edge */
@supports (-ms-ime-align:auto) {
#floatNav .floatNav-btn p {
right:12px;
}
}
/* for IE11 */
@media all and (-ms-high-contrast:none){
*::-ms-backdrop, #floatNav .floatNav-btn p {
right:12px;
}
*::-ms-backdrop, #floatNav .floatNav-banner{
height:180px;
}
}

#floatNav .floatNav-banner ul{
overflow:hidden;
list-style:none;
margin:0;
padding:0;
}
#floatNav .floatNav-banner li{
float:left;
width:143px;
height:55px;
border-top:1px solid #f1aaa2;
border-left:1px solid #f1aaa2;
}
#floatNav .floatNav-banner img{
max-width:none;
vertical-align:bottom;
}
#floatNav .floatNav-banner li:nth-child(2){
width:142px;
}
#floatNav .floatNav-banner li:first-child{
width:286px;
height:124px;
}

@media screen and (max-width: 640px){
#floatNav{
transition:0;
}
#floatNav:hover{
width:327px;
right:-287px;
}
#floatNav .floatNav-btn .floatNav-icon a[href^="tel:"]{
cursor:pointer;
}
}
/* ----- index: area ----- */
body #contents #index{
	margin:40px auto 30px auto;
	max-width:1110px;
	text-align:left;
	z-index:0;
}
body #contents #index .main-area{
	background-color:#ffffff;
}
@media screen and (max-width: 1110px){
	body #contents #index .main-area,
	body #contents div.contact .contact-index {
		padding:0 2%;
	}
}
@media screen and (max-width: 640px){
	body #contents{
		width:100%;
		margin:0 auto;
		background-color:#ffffff;
	}
	body #contents #index{
		margin:20px auto 30px auto;
		width:100%;
	}
	body #contents #index .main-area{
		padding:0;
	}
}

/* --------- headerMenuWhite --------- */
#contents #headerMenuWhite{
	clear:both;
	width:100%;
	position:relative;
	z-index:500;
	background-color: #ffffff;
}
#contents #menuWrapper{
	clear:both;
	overflow:hidden;
	width:100%;
	border-top: solid 1px #cccccc;
	border-bottom: solid 1px #cccccc;
}
@media screen and (max-width: 640px) {
	#contents #menuWrapper{
		position:absolute;
		top:0;
		left:0;
		width:100%;
	}
}
/* sp_title */
#contents #spProducttitle{
	display:none;
}
@media screen and (max-width: 640px) {
/* sp_title */
#contents #menuWrapper,
#contents #spTitle,
#contents #spMenu{
	display:none;
}
}