@charset "UTF-8";
@font-face { 
font-family:'honoka'; 
src:url('../font/honoka.eot'); /* IE9以上用 */
src:url('../font/honoka.eot?#iefix') format('embedded-opentype'), /* IE8以前用 */
	url('../font/honoka.woff') format('woff'), /* モダンブラウザ用 */
	url('../font/honoka.ttf') format('truetype'); /* iOS, Android用 */
}
*{ margin:0px; padding:0px; border:none; font-family:Meiryo UI, "メイリオ", arial, helvetica, sans-serif; -webkit-text-size-adjust:100%; }

html{ text-align:center; color:#555; background-color:#FFF; }
body{ text-align:center; min-width:1000px; }

a{ outline:none; text-decoration:none; }
a img{ -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
a:hover img{ opacity:0.7; filter:alpha(opacity=70); }
ul{ list-style:none; }
p.clear{ clear:both; }

textarea { resize:none; } 

/* トップスライドショー */
div#servicebg{ width:100%; height:427px; background-color:#000; overflow:hidden; z-index:997; }
div#service{ overflow:hidden; z-index:998; }
div#service img{ background-color:#CCC; z-index:999; }
div#slidetopbg{ position:relative; height:0px; width:100%; margin-bottom:50px; z-index:1000; }
div#slidetop{ position:absolute; bottom:0px; left:0px; background:url(../img/slide0.png) center no-repeat; width:100%; height:427px; z-index:1001; }


/* メニュー */
div#menubgbg{ width:100%; min-width:1000px; height:110px; overflow:hidden; }
div#menubg{ position:static; top:0px; left:0px; width:100%; min-width:1000px; height:110px; z-index:2000; background-color:#FFF; box-shadow:0px 0px 5px #888; }
div#headbg{ width:950px; height:40px; display:table; margin:0px auto; text-align:left; margin-bottom:5px; overflow:hidden; }
h1#head{ width:100%; height:100%; display:table-cell; vertical-align:middle; font-weight:normal; font-size:11px; overflow:hidden; }
h1#head a{ float:right; color:#555; }
h1#head span{ float:right; padding:0px 5px; }
h1#head a:hover{ color:#888; }
ul.menu{ width:949px; height:50px; margin:0px auto; border-right:1px solid #CCC; }
ul.menu li{ float:right; height:50px; border-left:1px solid #CCC; display:table; }
ul.menu li a{ position: relative; color:#000; font-size:15px; height:100%; padding:0px 30px 0px 10px; display:table-cell; vertical-align:middle; text-align:left; font-weight:bold; transition: 0.3s ease-in-out; }
ul.menu li p{ font-size:11px; line-height:15px; color:#F00; font-weight:normal; }
ul.menu li.act a{ color:#F00; }
ul.menu li.act a:hover p{ }
ul.menu li a:hover{ color:#F00; }
ul.menu li a:hover p{ }
ul.menu li.ho{ float:left; border:none; }
ul.menu li.ho a{ padding:0px; height:100%; width:364px; display:block; background:url(../img/logo.png) left center no-repeat; background-size:contain; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
ul.menu li.ho a:hover{ opacity:0.7; filter:alpha(opacity=70); }

div#topbg{ width:100%; height:350px; margin-bottom:50px; text-align:center; background:url(../img/topbg.webp) top center no-repeat; }
div#pagebg{ width:100%; padding:25px 0px; text-align:center; background:#CCC center no-repeat; }
div#tp-inner{ position:relative; width:950px; margin:0px auto; background:center no-repeat; }

p.cap{ font-size:50px; margin-bottom:10px; font-weight:bold; text-align:center; color:#FFF; font-family:'Oswald',sans-serif; text-shadow:0px 2px 5px #888; }
p.sub{ font-size:12px; font-weight:normal; color:#555; text-align:center; font-family:'honoka'; }

ul.root{ margin-bottom:40px; width:950px; height:30px; margin:0px auto; margin-bottom:40px; }
ul.root li{ float:left; line-height:30px; font-size:12px; color:#000; }
ul.root li a{ color:#666; }
ul.root li a:hover{ color:#F00; }
ul.root li.ya{ line-height:30px; font-size:8px; text-align:center; padding:0px 10px; color:#666; }
ul.root li.ba{ float:right; }

dl.top-contents{ text-align:left; width:950px; margin:0px auto; }
dl.top-contents dt{ float:left; clear:both; width:325px; font-size:50px; line-height:50px; font-weight:bold; text-align:left; color:#000; font-family:'Oswald',sans-serif; }
dl.top-contents dt span{ color:#EA5514; font-family:'Oswald',sans-serif; }
dl.top-contents dt p{ font-size:12px; font-weight:normal; color:#555; line-height:30px; }
dl.top-contents dd{ width:625px; margin-left:325px; }
dl.top-contents dd:after { content:" "; display:block; clear:both; height:0px; } 

div#wrapper{ width:950px; margin:0px auto; }
div#left{ float:left; width:250px; text-align:left; padding-bottom:0px; }
div#right{ float:right; width:650px; text-align:left; padding-bottom:0px; }


/* 新着情報 */
div.info{ margin-bottom:25px; }
div.info:hover{ opacity:0.7; filter:alpha(opacity=70); }
div.info div.dt{ float:left; margin-right:15px; width:55px; height:55px; padding:5px; background-color:#EA5514; color:#FFF; text-align:center; }
div.info div.dt p.mm{ font-size:10px; line-height:12px; }
div.info div.dt p.dd{ font-size:27px; line-height:31px; font-style:italic; }
div.info div.dt p.yy{ font-size:10px; line-height:12px; }
div.info div.dana{ height:65px; }
div.info div.dana p.da{ font-size:18px; line-height:20px; color:#000; margin-bottom:10px; }
div.info div.dana p.na{ font-size:12px; line-height:15px; color:#888; }


/* おすすめ製品情報 */
div#product{ background:url(../img/pro-c.png) center fixed; text-align:center; }
div.pro-t{ height:74px; background:url(../img/pro-t.png) center; }
div.pro-pt{ height:74px; background:url(../img/pro-pt.png) center; }
div.pro-c{ clear:both; width:960px; margin:0px auto; padding:25px 0px; border-top:1px solid #ddd; border-bottom:0px solid #ddd; }
div.pro-b{ height:74px; background:url(../img/pro-b.png) center; }

#carousel-bg { position:relative; width:960px; height:300px; overflow:hidden; }
#carousel{ position:absolute; width:975px; height:100%; text-align:left; }
#carousel ul li{ position:relative; width:325px; height:100%; float:left; text-align:left; }
#carousel ul li:hover div.img{ box-shadow:0px 0px 7px #333; }
#carousel ul li div.img{ position:relative; width:300px; height:225px; margin-bottom:5px; margin-left:5px; background:no-repeat center; background-size:cover; }
#carousel ul li div.img img.pop{ position:absolute; top:5px; right:5px; width:50px; height:50px; }
#carousel ul li p{ width:300px; margin-left:5px; }
#carousel ul li p.na{ line-height:30px; font-size:15px; height:30px; overflow:hidden; color:#000; font-weight:bold; }
#carousel ul li p.ca{ line-height:20px; font-size:12px; height:40px; overflow:hidden; color:#555; }


/* お知らせ */
p.mid{ font-size:22px; line-height:25px; min-height:29px; font-weight:bold; border-bottom:1px solid #aaa; padding:10px 0px; }

p.yyyy{ clear:both; margin-bottom:10px; padding-bottom:10px; line-height:30px; color:#000; border-bottom:1px dotted #bbb; }
p.yyyy a{ color:#333; display:block; font-weight:bold; }
p.yyyy a:hover{ color:#666; background:url(../img/libg.png) right center no-repeat; }

ul.archives{ padding-top:10px; }
ul.archives li{ margin-bottom:10px; padding-bottom:10px; border-bottom:1px dotted #bbb; cursor:pointer; font-size:0.8em; }
ul.archives li a{ width:100%; display:block; }
ul.archives li div.img{ float:left; width:50px; padding-top:50px; margin-right:10px; background-position:center; background-size:cover; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;}
ul.archives li div.dta{ overflow:hidden; }
ul.archives li a div.dta p.dt{ font-size:12px; }
ul.archives li a div.dta p.da{ font-size:14px; margin-top:0px; }
ul.archives li a.act div.img{ opacity:1.0; filter:alpha(opacity=100); }
ul.archives li a.act div.dta p.dt{ color:#333; }
ul.archives li a.act div.dta p.da{ color:#F00; }
ul.archives li a.non div.img{ opacity:0.6; filter:alpha(opacity=60); }
ul.archives li a.non div.dta p.dt{ color:#aaa; }
ul.archives li a.non div.dta p.da{ color:#000; }
ul.archives li a.non:hover div.img{ opacity:1.0; filter:alpha(opacity=100); }
ul.archives li a.non:hover div.dta p.dt{ color:#333; }
ul.archives li a.non:hover div.dta p.da{ color:#F00; }

p.ida{ font-size:22px; line-height:25px; min-height:29px; font-weight:bold; border-bottom:1px solid #aaa; padding:10px 0px; }
p.idt{ font-size:12px; line-height:30px; margin-bottom:20px; }
div.ina{ line-height:25px; font-size:15px; text-align:justify; text-justify:inter-ideograph; }
div.ina div.img{ width:100%; padding-top:56%; background-position:center; background-repeat:no-repeat; }
p.ili{ margin-top:30px; }
p.ili a{ color:#555; }
p.ili a:hover{ color:#888; }
p.ibt{ text-align:center; margin-top:30px; }
p.ibt a.btn{ display:block; width:150px; padding:10px 15px; background-color:#000; color:#FFF; text-shadow:0px 1px 1px #888; margin:0px auto; font-size:14px;-webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
p.ibt a.btn:hover{ text-shadow:0px 0px 5px #FFF; box-shadow:0px 1px 5px #555; background-color:#111; }

div#prevback{text-align:center; width:370px; margin:50px auto 0px; clear:both;}
div#prevback ul li.prev{width:110px; height:50px; position:relative; float:left;}
div#prevback ul li.top {width:150px; height:50px; position:relative; float:left;}
div#prevback ul li.next{width:110px; height:50px; position:relative; float:left;}
div#prevback ul li a div.ppp { position:absolute; top:0px; left:0px; width:50px; padding-top:50px; background: center no-repeat; background-size:cover; }
div#prevback ul li a div.nnn { position:absolute; top:0px;right:0px; width:50px;padding-top:50px; background: center no-repeat; background-size:cover; }
div#prevback ul li a img.ttt { position:absolute; top:0px; left:0px; width:110px; height:50px;}
div#prevback ul li a:hover div.ppp { opacity:0.6; filter: alpha(opacity=60);}
div#prevback ul li a:hover div.nnn { opacity:0.6; filter: alpha(opacity=60);}
div#prevback ul li a:hover img.ttt { opacity:1.0; filter: alpha(opacity=100);}


/* 製品情報 */
ul.pmenu{ padding-top:10px; }
ul.pmenu li{ height:50px; margin-bottom:10px; padding-bottom:10px; border-bottom:1px dotted #bbb; }
ul.pmenu li a{ width:100%; height:50px; display:block; }
ul.pmenu li a img{ float:left; width:50px; height:50px; margin-right:10px; opacity:0.7; filter:alpha(opacity=70); }
ul.pmenu li a div{ overflow:hidden; }
ul.pmenu li a div p{ white-space:nowrap; }
ul.pmenu li a div p.ja{ font-size:16px; margin-bottom:3px; }
ul.pmenu li a div p.en{ font-size:12px; line-height:16px; height:16px; }
ul.pmenu li a.act img{ opacity:1.0; filter:alpha(opacity=100); }
ul.pmenu li a.act div p.ja{ color:#F00; }
ul.pmenu li a.act div p.en{ color:#333; }
ul.pmenu li a.non img{ opacity:0.6; filter:alpha(opacity=60); }
ul.pmenu li a.non div p.ja{ color:#000; }
ul.pmenu li a.non div p.en{ color:#aaa; }
ul.pmenu li a.non:hover img{ opacity:1.0; filter:alpha(opacity=100); }
ul.pmenu li a.non:hover div p.ja{ color:#F00; }
ul.pmenu li a.non:hover div p.en{ color:#333; }

ul.pageview{ clear:both; height:31px; font-size:12px; padding:9px 0px; }
ul.pageview li{ float:left; line-height:31px; }
ul.pageview li a{ display:block; width:31px; height:31px; margin-right:5px; text-align:center; }
ul.pageview li a.act{ color:#FFF; background-color:#EA5514; }
ul.pageview li a.non{ color:#555; background-color:#eee; }
ul.pageview li a.non:hover{ color:#FFF; background-color:#EA5514; }

ul.product{ width:650px; padding-top:20px; border-top:1px solid #aaa; }
ul.product li{ float:left; width:300px; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #ddd; }
ul.product li.c1{ margin-right:50px; }
ul.product li p{ overflow:hidden; }
ul.product li p.dt{ font-size:10px; line-height:25px; height:25px; color:#555; }
ul.product li div.img{ position:relative; width:100%; padding-top:75%; background-position:center; background-size:cover; }
ul.product li div.img img.pop{ position:absolute; top:5px; right:5px; width:35px; height:35px; }
ul.product li div.img:hover{ box-shadow:0px 1px 7px #777; }
ul.product li p.na{ font-size:14px; line-height:25px; color:#000; height:25px; }
ul.product li p.ms{ font-size:12px; line-height:18px; color:#555; height:36px; }

/* 製品情報詳細 */
div#view1 { float:left; position:relative; width:575px; padding-bottom:431px; }
div#view1 div { position:absolute; top:0px; left:0px; }
div#view1 div.img { width:100%; padding-top:431px; background-position:center; background-size:cover; }
div#view1 img.pop{ position:absolute; top:10px; right:10px; width:74px; height:74px; }

ul#thumbBtn1 { float:right; width:62px;  }
ul#thumbBtn1 li{ position:relative; float:left; width:62px; padding-bottom:62px; margin-bottom:4px; cursor:pointer; opacity:0.4; filter: alpha(opacity=40); background-position:center; background-size:cover; z-index:0; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; }
ul#thumbBtn1 li:hover { opacity:1.0; filter:alpha(opacity=100); z-index:1; box-shadow:0px 0px 10px #aaa; }
ul#thumbBtn1 li.active{ opacity:1.0; filter:alpha(opacity=100); z-index:1; box-shadow:0px 0px 10px #aaa; }

p.pti{ font-family:'honoka'; line-height:28px; margin:12px 0px; font-size:23px; border-left:4px solid #900; padding-left:8px; }
p.pdt{ text-align:right; font-size:12px; line-height:25px; color:#aaa; margin-bottom:30px; }
p.pms{ font-family:'honoka'; font-size:25px; color:#000; margin:20px 0px 15px; }
p.pna{ font-family:'honoka'; font-size:15px; line-height:20px; }
p.pbt{ text-align:center; }
p.pbt .btn{ display:block; width:200px; padding:15px; background-color:#000; color:#FFF; text-shadow:0px 1px 1px #888; margin:0px auto; font-size:14px;-webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
p.pbt .btn:hover{ text-shadow:0px 0px 5px #FFF; box-shadow:0px 1px 5px #555; background-color:#111; }
table.p_detail{ width:100%; margin:20px 0px 25px; border-top:1px solid #ddd; }
table.p_detail td{ border-bottom:1px solid #ddd; line-height:22px; vertical-align:top; padding:10px; 5px; }
table.p_detail td a{ color:#333; }
table.p_detail td a:hover{ color:#888; }
table.p_detail td a.pdf{ padding-right:20px; background:url(../img/pdf.png) right center no-repeat; background-size:contain; }
table.p_detail td.c1{ width:120px; font-size:12px; color:#666; font-weight:bold; }
table.p_detail td.c2{ width:auto; font-size:14px; color:#333; }


/* サービス */
p.sda{ font-family:'honoka'; line-height:28px; margin:12px 0px; font-size:23px; border-left:4px solid #900; padding-left:8px; }
p.sdt{ text-align:right; font-size:12px; line-height:25px; color:#aaa; }
div.sna{ line-height:25px; font-size:15px; text-align:justify; text-justify:inter-ideograph; margin-bottom:10px; }
p.spd { font-size:15px; padding:10px 5px; border-top:1px dotted #aaa; border-bottom:1px dotted #aaa; }
p.spd a{ color:#333; padding-right:20px; background:url(../img/pdf.png) right center no-repeat; background-size:contain; }
p.spd a:hover{ color:#333; }
p.sku{ margin-bottom:50px; }

/* 会社案内 */
table.company{ width:650px; margin:25px auto; text-align:left; }
table.company td{ padding:10px 0px; vertical-align:top; }
table.company td.c1{ width:150px; padding-left:15px; }
table.company td.c2{ width:auto; text-align:justify; text-justify:inter-ideograph; }
table.company td a{ color:#555; }
table.company td a:hover{ color:#000; }

/* フッター */
div#contact{ position:relative; width:950px; height:242px; margin:0px auto; background:url(../img/contact.png) center no-repeat; }
div#contact img.tel{ position:absolute; bottom:15px; left:380px; }
div#contact img.mail{ position:absolute; bottom:15px; left:595px; }

div#footbg{ width:100%; text-align:center; border-top:1px solid #ddd; background:url(../img/footbg.png) center no-repeat #F0F0F0; }
div#foot{ position:relative; width:950px; height:200px; margin:0px auto; }
div#foot a.flogo{ position:absolute; top:30px; left:0px; }
div#foot div.add{ position:absolute; top:80px; left:0px; text-align:left; font-size:0.8em; line-height:18px; }
div#foot div.add a{ color:#555; }
div#foot div.add a:hover{ color:#888; }
div#foot a.pagetop{ position:absolute; top:30px; right:0px; }
div#foot ul.follow{ position:absolute; bottom:15px; right:0px; }
div#foot ul.follow li{ float:left; margin-left:15px; }
div#foot ul.follow li.fb{ padding-top:1px; }
div#foot ul.follow li.tw{ padding-top:0px; }
div#foot ul.follow li.go{ padding-top:2px; }

div#copybg{ width:100%; text-align:center; background-color:#F00; color:#FFF; }
ul.copy{ width:950px; height:40px; margin:0px auto; padding:20px 0px; }
ul.copy li{ float:left; line-height:40px; font-size:11px; }
ul.copy li a{ color:#FFF; }
ul.copy li a:hover{ color:#ccc; }