﻿@charset "utf-8";

/*初期設定*/
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,fieldset,legend,pre,blockquote,img {
margin:0px;
padding:0px;
}
ul {list-style:none;}
img {}
* {font-family: Arial, Helvetica, sans-serif;}
/*///全体リンク設定///*/
a:visited ,
a:link ,
a {color:#003399;}
a:active ,
a:hover {color:#ff0000;text-decoration:underline;}
/*全体詳細設定*/
body {background: #FFFFCB; font-size: 90%;}
#wrapper{text-align: center;background-color: #FFFFCB;}
#top{background: url(../img/bg_top_header.jpg) no-repeat center top;}
#sub{background: url(../img/bg_sub_header.jpg) no-repeat center top;width: 760px;}
#header{width: 760px;margin: 0px auto 0px auto;}
#sub div#header{height: 177px;}
#footer{clear: both;background: url(../img/border_red.gif) no-repeat left top;margin: 0px auto;width: 760px;}
#footer p{
	background: url(../img/border_red.gif) no-repeat left bottom;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
}
#footer p a{padding: 0px 1em 0px 1em;color: #333333;text-decoration: none;}
#logo{
	text-indent: -9999px;
	text-align: left;
	width: 760px;
	margin: 0px auto;
	height: 124px;
	background: url(../img/logo.gif) no-repeat 11px 0px;
}
#logo a{
	height: 124px;
	display: block;
	margin-left: 11px;
}
#header h2{
	float: right;
	width: 589px;
	background: url(../img/txt_header.jpg) no-repeat 0px 47px;
	height: 146px;
	text-indent: -9999px;
}
#sub div#contents{text-align: left;}
#gnbox{padding-top: 0px;}
#contents{clear: both;}
#sub{width: 760px;margin: 0px auto 0px auto;}
#contents:after{
display:block;
clear:both;
height:0;
visibility:hidden;
content:".";
zoom:1;

}
.clear {clear: both;}
/*gnavi*/
#glovalnavi{height: 28px;}
#glovalnavi li {float: left;list-style-type: none;padding: 0;margin: 0;height: 28px;}
#glovalnavi a{display: block;height: 28px;padding: 0;margin: 0;text-indent: -9999px;}
#glovalnavi #gn_top{width: 85px;}
#glovalnavi #gn_top a{background:url(../img/top_gn_home.jpg) no-repeat left top;width: 85px;}
#glovalnavi #gn_top a:hover{background:url(../img/top_gn_o_home.jpg) no-repeat left top;}
#glovalnavi #gn_products{width: 103px;}
#glovalnavi #gn_products a{background:url(../img/top_gn_products.jpg) no-repeat left top;width: 103px;}
#glovalnavi #gn_products a:hover{background:url(../img/top_gn_o_products.jpg) no-repeat left top;}
#glovalnavi #gn_qa{width: 67px;}
#glovalnavi #gn_qa a{background:url(../img/top_gn_qa.jpg) no-repeat left top;}
#glovalnavi #gn_qa a:hover{background:url(../img/top_gn_o_qa.jpg) no-repeat left top;}
#glovalnavi #gn_company{width: 216px;}
#glovalnavi #gn_company a{background:url(../img/top_gn_company.jpg) no-repeat left top;}
#glovalnavi #gn_company a:hover{background:url(../img/top_gn_o_company.jpg) no-repeat left top;}
#sub #glovalnavi #gn_company a{background:url(../img/sub_gn_company.jpg) no-repeat left top;}
#sub #glovalnavi #gn_company a:hover{background:url(../img/sub_gn_o_company.jpg) no-repeat left top;}
#glovalnavi #gn_contact{width: 123px;}
#glovalnavi #gn_contact a{background:url(../img/top_gn_contact.jpg) no-repeat left top;}
#glovalnavi #gn_contact a:hover{background:url(../img/top_gn_o_contact.jpg) no-repeat left top;}
#sub #glovalnavi #gn_contact a{background:url(../img/sub_gn_contact.jpg) no-repeat left top;}
#sub #glovalnavi #gn_contact a:hover{background:url(../img/sub_gn_o_contact.jpg) no-repeat left top;}
#glovalnavi #gn_link{width: 73px;}
#glovalnavi #gn_link a{background:url(../img/top_gn_link.jpg) no-repeat left top;}
#glovalnavi #gn_link a:hover{background:url(../img/top_gn_o_link.jpg) no-repeat left top;}
#sub #glovalnavi #gn_link a{background:url(../img/sub_gn_link.jpg) no-repeat left top;}
#sub #glovalnavi #gn_link a:hover{background:url(../img/sub_gn_o_link.jpg) no-repeat left top;}
#glovalnavi #gn_sitemap{width: 91px;}
#glovalnavi #gn_sitemap a{background:url(../img/top_gn_sitemap.jpg) no-repeat left top;}
#glovalnavi #gn_sitemap a:hover{background:url(../img/top_gn_o_sitemap.jpg) no-repeat left top;}
#sub #glovalnavi #gn_sitemap a{background:url(../img/sub_gn_sitemap.jpg) no-repeat left top;}
#sub #glovalnavi #gn_sitemap a:hover{background:url(../img/sub_gn_o_sitemap.jpg) no-repeat left top;}
#copy{clear: both;text-align: center;padding: 5px;padding-bottom:30px;}
/*set*/
.conpU20 {font-size: 100%;line-height: 1.5em;padding-bottom: 20px;}
.conpU10 {font-size: 100%;line-height: 1.5em;padding-bottom: 10px;}
.conp {font-size: 100%;line-height: 1.5em;}
.conul{	margin: 0 0 20px 0;}
.conul li{margin: 0 0 5px 1.5em;padding: 0 0 0 5px;list-style-image: url(../img/icon_orange.gif);}
.conulw{margin: 0 0 20px 0;}
.conulw li{margin: 0 0 5px 1.5em;padding: 0 0 15px 5px;list-style-image: url(../img/icon_green.gif);font-weight: bold;}
.conulw ul{margin: 10px 0 20px;}
.conulw li ul li{margin: 0 0 5px 1.5em;padding: 3px 0 0 5px;list-style-image: none;font-weight: normal;}
.liorange{list-style-image: url(../img/icon_orange.gif);}
.lipink{list-style-image: url(../img/icon_pink.gif);}
.ligreen{list-style-image: url(../img/icon_green.gif);}
/*top*/
#mainimagebox{width: 760px;margin: 0px auto;text-align: left;height: 257px;}
#topcatch{background: url(../img/top_txt_catch.gif) no-repeat 29px 55px;text-indent: -9999px;height: 115px;}
#mainimagebox h3{font-size: 120%;font-weight: normal;padding:20px 370px 0 29px;line-height: 130%;}
#howtobox{background: url(../img/bg_top_howto.jpg) no-repeat center top;height: 220px;}
#howtobox .howtobox2{height: 105px;	width: 710px;}
#howtobox #howtominiboxa{width: 442px;text-align: left;padding-left: 30px;float: left;margin-top: 20px;}
#howtobox #howtominiboxb{width: 430px;text-align: left;padding-left: 25px;float: left;margin-top: 25px;}
#howtobox p#howtoimga{float: right;margin-top: 10px;}
#howtobox p#howtoimgb{float: right;margin-top: 15px;}
.agentul{margin: 0 0 20px 0;}
.agentul li{margin: 0 0 5px 1.5em;padding: 0 0 0 5px;list-style-image: url(../img/icon_check.gif);}
#howtobox #howBOX{width: 710px;margin: auto;}
#howmain{width: 760px;height: auto;	margin: auto;clear: both;}
#howmain #SFPtopBOX{
	/*height: 340px;*/
	width: 760px;
	margin-top: 40px;
}
#howmain #SFPtopBOXa{width: 400px;float: left;margin-left: 20px;}
#howmain #SFPtopBOXa p{margin-bottom: 48px;}
#howmain #SFPtopBOXb{
	width: 250px;
	float: right;
	height: 340px;
	margin-right: 30px;
}

#howtobox p#howtoimga{float: right;margin-top: 10px;margin-right: 5px;height: 85px;width: 224px;padding: 0px;}
#howtobox p#howtoimgb{float: right;margin-top: 25px;margin-right: 5px;height: 68px;width: 254px;padding: 0px;}
#howtobox #howtominiboxa{width: 442px;padding-left: 30px;float: left;margin-top: 20px;text-align: left;}
#howtobox #howtominiboxb{width: 400px;padding-left: 25px;float: left;margin-top: 31px;text-align: left;height: 42px;clear: left;}
p.Stopcoment{text-align: left;padding-left: 20px;}
p.button{text-align: right;}
/*----h4-h5----*/
#top h5#ttl_DA_top{clear: both;background: url(../img/top_r31_c4.gif) no-repeat 8px 0px;height: 38px;width: 760px;text-indent:-9999px;margin-top: 20px;}
#SFPtopBOXb h4{text-align: left;}
#DAbox{margin-bottom: 10px;text-align: left;padding: 30px;}
/*sub*/
#sub h2{padding-left: 1px;background-repeat: no-repeat;background-position: 8px 0px;height: 60px;width: 760px;text-indent:-9999px;}
#sub h2#ttl_aqua_eraser{background-image: url(../img/ttl_sewline_fablic_aqua_eraser.gif);}
#sub h2#ttl_company{background-image: url(../img/ttl_company.gif);}
#sub h2#ttl_QA{background-image: url(../img/ttl_qa.gif);}
#sub h2#ttl_link{background-image: url(../img/ttl_link.gif);}
#sub h2#ttl_sitemap{background-image: url(../img/ttl_sitemap.gif);}
#sub h2#ttl_products{background-image: url(../img/ttl_products.gif);}
#sub h2#ttl_contact{background-image: url(../img/ttl_contact.gif);}
#sub h2#ttl_eraser{background-image: url(../img/ttl_sewline_fabric_eraser.gif);}
#sub h2#ttl_glue_pen{background-image: url(../img/ttl_sewline_fabric_glue_pen.gif);}
#sub h2#ttl_pencil{background-image: url(../img/ttl_sewline_fabric_pencil.gif);}
#sub h2#ttl_rollerball{background-image: url(../img/ttl_blanctracing_rollerball.gif);}
#sub h2#ttl_3function{background-image: url(../img/ttl_3functionone.gif);}
#sub h2#ttl_howto_refill{background-image: url(../img/ttl_howto_refill.gif);}
#sub h2#ttl_howtouse_3fio{background-image: url(../img/ttl_howtouse_3fio.gif);}
#sub h2#ttl_howtouse_e{background-image: url(../img/ttl_howtouse_e.gif);}
#sub h2#ttl_howtouse_gp{background-image: url(../img/ttl_howtouse_gp.gif);}
#sub h2#ttl_gp {background-image: url(../img/bg_ttl.gif);text-indent:0px;font-size: 130%;}
#sub h2#ttl_gp span{color: #FF9900;display: block;padding: 10px 30px 0px 30px;}
#sub h3{
	clear: both;
	background: url(../img/sttl_icon.gif) no-repeat 8px 0px;
	padding: 5px 10px 10px 50px;
	margin: 10px 0;
}
#sub h2#ttl_air_erasable_fabric_pen{background-image: url(../img/ttl_sewline_air_erasable_fabric_pen.gif);}
#sub h2#ttl_sewline_quickthru_needle_threader{background-image: url(../img/ttl_sewline_quickthru_needle_threader.gif);}
/*box*/
.ttlconBox {padding: 0px 40px 20px 30px;clear: both;}
.sttlconBox {padding: 5px 50px 10px;clear: both;}
/*font*/
.redfont{color: #FF6666;}
.bluefont{color: #3399CC;}
.greenfont{color: #99CC33;}
.orangefont{color: #FF9900;}
/* Except IE
  -----------------------------------*/
html>body {font-size: 10pt;}
/*inquiry*/
.inquiryp{margin: 0px auto; width:500px;}
#inquiry table{background-color:#FFFFCB;margin: 15px auto 0px; width:500px;border-top: 1px dotted #666666;}
#inquiry th{text-align:left;font-size:100%;padding:5px 10px;border-bottom: 1px dotted #666666;color: #333333;}
#inquiry td{font-size: 100%;border-bottom: 1px dotted #666666;color: #333333;padding: 5px 5px;}
#inquiry .submit{text-align:center;font-size:100%;width:450px;margin:10px auto 5px;}
#inquiry .inptext{width:320px;margin:2px;}
#inquiry .inptext2{width:50px;margin:2px;}
#inquiry .small{font-size:90%;color:red;}
#inquiry .error{width:320px;margin:2px;background-color:#cccccc;}
#errorTxt{border: 1px dotted #FF9900;padding: 10px;background-color: #FFFFCC;}
/*eraser*/
#eraser{float: left;width: 500px;}
#eraserimg {float: right;width: 145px;}
/*howtoglue*/
#howtoglueimg {margin:30px 10px 50px 10px;}

/**/
#floatbox {clear: both;width: 500px;}
.sttlconBoxW {
	padding: 5px 0px 0px;
	clear: both;
	background: url(../img/bg_ttl_box_header.gif) no-repeat left top;
	background-color: #FFFFFF;
	width: 690px;
	margin-top: 20px;
	margin-bottom: 40px;
}
.sttlconBoxWin{background: url(../img/bg_ttl_box_footer.gif) no-repeat left bottom;background-color: #FFFFFF;padding: 20px;}
/*3function*/
#funfloatbox {width: 690px;padding-bottom: 20px;}
#funfloatbox div#left {float: left;width: 230px;}
#funfloatbox #right {float: right;width: 420px;}
#funbox{clear: both;margin: 0px 40px;}
/*pencil*/
#pencilmainbox{clear: both;width: 690px;padding-bottom: 20px;}
#pencilmainbox #left {float: left;width: 300px;}
#pencilmainbox #right {float: right;width: 382px;}
#pencilcon1{clear: both;padding-bottom: 20px;padding-left: 40px;}
#pencilcon1 .left {float: left;width: 170px;}
#pencilcon1 .right {float: right;width: 430px;}
#pencilcon2{clear: both;padding-bottom: 20px;padding-left: 40px;}
#pencilcon2 .left {float: left;width: 430px;}
#pencilcon2 .right {float: right;width: 170px;}
/*glue*/
#gluemainbox{clear: both;width: 690px;padding-bottom: 20px;}
#gluemainbox #left {float: left;width: 320px;}
#gluemainbox #right {float: right;width: 350px;}
#gluecon1{clear: both;padding-bottom: 20px;padding-left: 40px;}
#gluecon1 .left {float: left;width: 220px;}
#gluecon1 .right {float: right;width: 380px;}
#gluecon2{clear: both;padding-bottom: 20px;padding-left: 40px;}
#gluecon2 .left {float: left;width: 450px;}
#gluecon2 .right {float: right;width: 130px;}
/*aqua*/
#aquamainbox{clear: both;width: 690px;padding-bottom: 20px;}
#aquamainbox #left {float: left; width: 300px;}
#aquamainbox #right {float: right;	width: 382px;}
#aquacon1{clear: both;padding-bottom: 20px;padding-left: 40px;}
#aquacon1 .left {float: left; width: 130px;}
#aquacon1 .right {	float: right; width: 450px;}
#aquacon2{clear: both;padding-bottom: 20px;padding-left: 40px;}
#aquacon2 .left {float: left; width: 370px;}
#aquacon2 .right {float: right; width: 210px;}
/*roller*/
#rollerimg{margin:30px 10px 50px 10px;}
#rollerfloatbox {width: 690px;padding-bottom: 20px;}
#rollerfloatbox div#left {float: left;width: 230px;}
#rollerfloatbox #right {float: right;width: 420px;}
/*sitemap*/
.mapul{	margin: 0 0 20px 0;}
.mapul li{margin: 0 0 10px 1.5em;padding: 0 0 0 5px;list-style-image: url(../img/icon_orange.gif);}
.mapul li ul{margin: 10px 0;}
.mapul li li{margin: 0 0 5px 1.5em;padding: 0 0 0 5px;list-style-image: url(../img/icon_orange.gif);}
.mapul li li ul{margin: 10px 0;}
.mapul li li li{margin: 0 0 5px 1.5em;padding: 0 0 0 5px;list-style-image: url(../img/icon_orange.gif);}
/*qa*/
.qadelete{display: none;}
#sub h3.q{
	clear: both;
	background: url(../img/txt_q.gif) no-repeat 0px 20px;
	padding: 20px 10px 10px 30px;
}
#sub div.a{clear: both;background: url(../img/txt_a.gif) no-repeat 0px 0px;padding: 0px 10px 30px 30px;}
/**/
.photoul{width: 620px;}
.photoul li{float: left;width: 285px;padding-bottom: 20px;}
.photoul li p{width: 265px;margin:0 auto;}
li.leftli{clear: both;}
li.rightli{clear: right;}
.imgul li{float: left;width: 320px;padding-bottom: 20px;text-align: center;}
.imgul li p{width: 300px;margin:0 auto;}
.center {text-align: center;}


.gencon{clear: both;padding-bottom: 20px;padding-left: 40px;}

