@charset "shift_jis";

/*-------------- Header menu --------------*/
#head-index {
margin:0px;
padding:0px;
width:780px;
height:350px;
background-image:url(../img/top-img.jpg);
background-repeat:no-repeat;
}

#head-top {
margin:0px;
padding:0px;
width:780px;
height:190px;
background-image:url(../img/menu-img.jpg);
background-repeat:no-repeat;
}

/*-------------- Header menu / top menu01 --------------*/
ul#top-m01 {
margin:0;
padding:0;
height:30px;
list-style:none;
width:780px;
background-image:url(../img/menu-top.jpg);
background-repeat:no-repeat;
}

ul#top-m01 li{
margin:0;
padding:0;
float:left;
list-style:none;
width:95px;
}

ul#top-m01 a{
display:block;
width:95px;
height:30px;
margin:0;
padding:0;
float:left;
background-image:url(../img/menu-top.jpg);
text-indent:-999px;
text-decoration:none;
overflow:hidden;
}

#top-m01 li.product, #top-m01 li.product a{ background-position:0 0; width:95px; }
#top-m01 li.aboutus, #top-m01 li.aboutus a{ background-position:-95px 0; width:80px; }
#top-m01 li.contact, #top-m01 li.contact a{ background-position:-175px 0; width:160px; }
#top-m01 li.sitemap, #top-m01 li.sitemap a{ background-position:-335px 0; width:88px; }

#top-m01 li.product a:hover{ background-position:0 -30px; }
#top-m01 li.aboutus a:hover{ background-position:-95px -30px; }
#top-m01 li.contact a:hover{ background-position:-175px -30px; }
#top-m01 li.sitemap a:hover{ background-position:-335px -30px; }

/*-------------- Header menu / top menu01 / aboutUs --------------*/
ul#us-m01 {
margin:0;
padding:0;
height:30px;
list-style:none;
width:780px;
background-image:url(../img/menu-about.jpg);
background-repeat:no-repeat;
}

ul#us-m01 li{
margin:0;
padding:0;
float:left;
list-style:none;
width:95px;
}

ul#us-m01 a{
display:block;
width:95px;
height:30px;
margin:0;
padding:0;
float:left;
background-image:url(../img/menu-about.jpg);
text-indent:-999px;
text-decoration:none;
overflow:hidden;
}

#us-m01 li.product, #us-m01 li.product a{ background-position:0 0; width:95px; }
#us-m01 li.aboutus, #us-m01 li.aboutus a{ background-position:-95px 0; width:80px; }
#us-m01 li.contact, #us-m01 li.contact a{ background-position:-175px 0; width:160px; }
#us-m01 li.sitemap, #us-m01 li.sitemap a{ background-position:-335px 0; width:88px; }

#us-m01 li.product a:hover{ background-position:0 -30px; }
#us-m01 li.aboutus a:hover{ background-position:-95px -30px; }
#us-m01 li.contact a:hover{ background-position:-175px -30px; }
#us-m01 li.sitemap a:hover{ background-position:-335px -30px; }

/*-------------- Header menu / top menu03 / contact --------------*/
ul#cont-m01 {
margin:0;
padding:0;
height:30px;
list-style:none;
width:780px;
background-image:url(../img/menu-contact.jpg);
background-repeat:no-repeat;
}

ul#cont-m01 li{
margin:0;
padding:0;
float:left;
list-style:none;
width:95px;
}

ul#cont-m01 a{
display:block;
width:95px;
height:30px;
margin:0;
padding:0;
float:left;
background-image:url(../img/menu-contact.jpg);
text-indent:-999px;
text-decoration:none;
overflow:hidden;
}

#cont-m01 li.product, #cont-m01 li.product a{ background-position:0 0; width:95px; }
#cont-m01 li.aboutus, #cont-m01 li.aboutus a{ background-position:-95px 0; width:80px; }
#cont-m01 li.contact, #cont-m01 li.contact a{ background-position:-175px 0; width:160px; }
#cont-m01 li.sitemap, #cont-m01 li.sitemap a{ background-position:-335px 0; width:88px; }

#cont-m01 li.product a:hover{ background-position:0 -30px; }
#cont-m01 li.aboutus a:hover{ background-position:-95px -30px; }
#cont-m01 li.contact a:hover{ background-position:-175px -30px; }
#cont-m01 li.sitemap a:hover{ background-position:-335px -30px; }


/*-------------- Header menu / top menu04 / sitemap --------------*/
ul#map-m01 {
margin:0;
padding:0;
height:30px;
list-style:none;
width:780px;
background-image:url(../img/menu-sitemap.jpg);
background-repeat:no-repeat;
}

ul#map-m01 li{
margin:0;
padding:0;
float:left;
list-style:none;
width:95px;
}

ul#map-m01 a{
display:block;
width:95px;
height:30px;
margin:0;
padding:0;
float:left;
background-image:url(../img/menu-sitemap.jpg);
text-indent:-999px;
text-decoration:none;
overflow:hidden;
}

#map-m01 li.product, #map-m01 li.product a{ background-position:0 0; width:95px; }
#map-m01 li.aboutus, #map-m01 li.aboutus a{ background-position:-95px 0; width:80px; }
#map-m01 li.contact, #map-m01 li.contact a{ background-position:-175px 0; width:160px; }
#map-m01 li.sitemap, #map-m01 li.sitemap a{ background-position:-335px 0; width:88px; }

#map-m01 li.product a:hover{ background-position:0 -30px; }
#map-m01 li.aboutus a:hover{ background-position:-95px -30px; }
#map-m01 li.contact a:hover{ background-position:-175px -30px; }
#map-m01 li.sitemap a:hover{ background-position:-335px -30px; }

/*-------------- Table/ AboutUs --------------*/
table.abus {
margin:15px 0px 15px 0px;
border:1px solid #b5b5b5;
border-collapse:collapse;
border-spacing:0;
empty-cells:show;
width:530px;
}
.abus th{
border-right:1px solid #b5b5b5;
border-bottom:1px solid #b5b5b5;
width:120px;
padding:10px 5px 10px 5px;
text-align:center;
font-size:0.8em;
line-height:1.5em;
}
.abus td{
border-right:1px solid #b5b5b5;
border-bottom:1px solid #b5b5b5;
width:410px;
padding:10px 5px 10px 5px;
text-align:left;
font-size:0.8em;
line-height:1.5em;
}

/*-------------- Table/ AboutUs02 --------------*/
table.enkaku {
margin:15px 0px 15px 0px;
border-top:1px solid #b5b5b5;
border-bottom:1px solid #b5b5b5;
border-collapse:collapse;
border-spacing:0;
empty-cells:show;
width:530px;
}
.enkaku th{
border-bottom:1px solid #b5b5b5;
width:100px;
padding:10px 5px 10px 5px;
text-align:left;
font-size:12px;
line-height:1.5em;
font-weight:normal;
}
.enkaku td{
border-bottom:1px solid #b5b5b5;
width:430px;
padding:10px 5px 10px 5px;
text-align:left;
font-size:12px;
line-height:1.5em;
}

/*-------------- Table/ top News --------------*/
table.news {
margin:0px 0px 5px 0px;
border-top:1px dotted #b5b5b5;
border-bottom:1px dotted #b5b5b5;
border-collapse:collapse;
border-spacing:0;
empty-cells:show;
width:530px;
}
.news th{
border-bottom:1px dotted #b5b5b5;
width:100px;
padding:5px 0px 5px 0px;
text-align:left;
font-size:0.8em;
line-height:1.5em;
font-weight:normal;
}
.news td{
border-bottom:1px dotted #b5b5b5;
width:430px;
padding:5px 0px 5px 0px;
text-align:left;
font-size:0.8em;
line-height:1.5em;
}

/*-------------- Table/ top Banner --------------*/
table.baner {margin:5px 0px 10px 0px;border-collapse:collapse;border-spacing:0;empty-cells:show;width:550px;}
.baner td{padding:5px 0px 5px 0px;text-align:left;}


/*-------------- Left menu / tile / index menu --------------*/
ul#indexmenu {
margin:0px 0px 20px 0px;
padding:0;
height:90px;
list-style:none;
width:180px;
background-image:url(../img/left-tile1.gif);
background-repeat:no-repeat;
}

ul#indexmenu li{
margin:0;
padding:0;
float:left;
list-style:none;
width:180px;
}

ul#indexmenu a{
display:block;
width:180px;
height:30px;
margin:0;
padding:0;
float:left;
background-image:url(../img/left-tile1.gif);
text-indent:-999px;
text-decoration:none;
overflow:hidden;
}

#indexmenu li.pro-tile, #indexmenu li.pro-tile a{ background-position:0 0; width:180px; }
#indexmenu li.iraka, #indexmenu li.iraka a{ background-position:0px -30px; width:180px; }
#indexmenu li.salon, #indexmenu li.salon a{ background-position:0px -60px; width:180px; }

#indexmenu li.pro-tile a:hover{ background-position:180px 0px; }
#indexmenu li.iraka a:hover{ background-position:180px -30px; }
#indexmenu li.salon a:hover{ background-position:180px -60px; }

/*-------------- Left menu / WaterPloof menu --------------*/
ul#watermenu {
margin:0px 0px 20px 0px;
padding:0;
height:60px;
list-style:none;
width:180px;
background-image:url(../img/left-water21.gif);
background-repeat:no-repeat;
}

ul#watermenu li{
margin:0;
padding:0;
float:left;
list-style:none;
width:180px;
}

ul#watermenu a{
display:block;
width:180px;
height:30px;
margin:0;
padding:0;
float:left;
background-image:url(../img/left-water21.gif);
text-indent:-999px;
text-decoration:none;
overflow:hidden;
}

#watermenu li.wploof-t, #watermenu li.wploof-t a { background-position:0 0; width:180px; }
#watermenu li.jetspry, #watermenu li.jetspry a { background-position:0px -30px; width:180px; }

#watermenu li.wploof-t a:hover { background-position:180px 0px; }
#watermenu li.jetspry a:hover { background-position:180px -30px; }



ul#watermenu02 {
margin:0px 0px 20px 0px;
padding:0;
height:90px;
list-style:none;
width:180px;
background-image:url(../img/left-water02.gif);
background-repeat:no-repeat;
}

ul#watermenu02 li{
margin:0;
padding:0;
float:left;
list-style:none;
width:180px;
}

ul#watermenu02 a{
display:block;
width:180px;
height:20px;
margin:0;
padding:0;
float:left;
background-image:url(../img/left-water02.gif);
text-indent:-999px;
text-decoration:none;
overflow:hidden;
}

#watermenu02 li.kouhou, #watermenu02 li.kouhou a { background-position:0px 0px; width:180px; }
#watermenu02 li.tokucho, #watermenu02 li.tokucho a { background-position:0px -20px; width:180px; }
#watermenu02 li.hikaku, #watermenu02 li.hikaku a { background-position:0px -40px; width:180px; }
#watermenu02 li.jiseki, #watermenu02 li.jiseki a { background-position:0px -60px; width:180px; }

#watermenu02 li.kouhou a:hover { background-position:180px 0px; }
#watermenu02 li.tokucho a:hover { background-position:180px -20px; }
#watermenu02 li.hikaku a:hover { background-position:180px -40px; }
#watermenu02 li.jiseki a:hover { background-position:180px -60px; }


/*-------------- Left menu / Ceragarden menu --------------*/
ul#ceramenu {
margin:0px 0px 30px 0px;
padding:0;
height:60px;
list-style:none;
width:180px;
background-image:url(../img/left-cera.gif);
background-repeat:no-repeat;
}

ul#ceramenu li{
margin:0;
padding:0;
float:left;
list-style:none;
width:180px;
}

ul#ceramenu a{
display:block;
width:180px;
height:30px;
margin:0;
padding:0;
float:left;
background-image:url(../img/left-cera.gif);
text-indent:-999px;
text-decoration:none;
overflow:hidden;
}

#ceramenu li.cera-t, #ceramenu li.cera-t a { background-position:0 0; width:180px; }
#ceramenu li.ceragar, #ceramenu li.ceragar a { background-position:0px -30px; width:180px; }

#ceramenu li.cera-t a:hover { background-position:180px 0px; }
#ceramenu li.ceragar a:hover { background-position:180px -30px; }

/* -------------------------------
追加_202509
---------------------------------- */
#head-index {
background-size:cover;
}
#head-index .catch-txt{
	display: flex;
	justify-content:center;
	align-items:center;
	height:320px;
}

#head-index .catch-txt img{
	max-width:300px;
	width:100%;
}

.top-container {
  display: flex;
  /*align-items: flex-start;*/
  gap: 20px;
  width:80%;
  margin:0 auto;
}
.topimage-column {
  max-width: 380px; /* PC時の画像列の幅 */
  width:100%;
}

.topimage-column img {
  width: 100%;
  height: auto;
  display: block;
}

.top-container2{
	margin:1em auto;
	 width:80%;
}
.topimage-column1{
	width:100%;
}
.topimage-column1 img {
  width: 100%;
  height: auto;
  display: block;
}