

/* common
-----------------------------------------------------------*/
html, body {
    height: 100%;
}
body{
	margin:0 auto;
	padding:0px;
	font-size:86.66%;
	color:#666666;
	line-height:1.6;
	background:none;
}

textarea{
	display:block;width:100%!important;
	padding:0 0 0 10px;
}

p,ul,li,form{
	margin:0px;
	padding:0px;
}
a:link   {color:#0063c6; text-decoration:underline}
a:visited{color:#0063c6; text-decoration:underline}
a:hover  {color:#ff6600; text-decoration:none;}
a:active {color:#0063c6; text-decoration:underline}


img{max-width:100%;}

a img:hover{
    opacity:0.50;
    filter: alpha(opacity=50);
}

table{
	border-collapse:separate;
	border-spacing:0;
	margin:0px;
	padding:0px;
}

strong {font-weight:bold;}

select, textarea, input[type="text"] ,
input[type="text"], input[type="password"] {
    display: inline-block;
    padding: 5px;
    line-height: 1.7;
    border: 1px solid #c3c3c3;
    background: #fafafa;
}

.noborder{border-top:none!important;border-bottom:none!important;}
.border{border-bottom:1px #ccc solid;padding-bottom:10px!important;}

.focus:onfocus{
	color:#aaa;
}


/* 2.login
----------------------------------------------------------- */
div#login_contents       {width:60%;}
div#login_contents p,
div#login_contents h1,
div#input      　　　　  {width:95%;}
div#login_contents dl    {width:calc(95% - 10px);}
div#login_contents dl dt {width:auto;}
div#login_contents dl dd {width:75%;}
div#login_contents dl dd input{width:95%;}

body#login {
	padding:100px 0;
    background: #f0f0f0!important;
}

div#login_contents,
div#login_contents p,
div#login_contents h1,
div#input {
	text-align:left;
}

div#login_contents {
	margin:0 auto;
	padding:20px;
	text-align:center;
	border:1px #cccccc solid;
	background:white;
}

div#login_contents h1{
	margin: 10px auto;
	padding:10px 0 0 0;
	font-size:100%;
	border-top:1px #cccccc solid;
}
div#login_contents dl {
	margin:10px auto;
	padding:0;
	text-align:left;
}
div#login_contents dl dt{
	float:left;
	padding: 15px 0 0;
	clear:both;
}
div#login_contents dl dd{
	float:right;
	padding: 10px 0 0 0;
}
div#login_contents p.login_contentserror {
	color: #CC3300;
	text-align:center;
}
div#input {
	clear:both;
	margin:10px auto;
	padding:10px 0 0 0;
	text-align:center;
	border-top:1px #cccccc solid;
}
div#input input{
	padding:4px 10px 2px;
}
a:hover img{
    opacity:0.50;
    filter: alpha(opacity=50);
}
address {
	margin:3px auto;
	text-align:center;
	font-style:normal;
}




/* wrapper
-----------------------------------------------------------*/
div#wrapper{
	width:100%;
	margin:0 auto;
	text-align:center;
}




/* heaeder
[-----------------------------------------------------------*/
div#header{
	width:95%;
	padding:10px 0;
	margin:0 auto;
	border:none;
}




/* container
-----------------------------------------------------------*/
div#container{
	width:95%;
	padding:0;
	margin:0 auto;
}
div#container td{
	padding:0;
	margin:0;
	vertical-align:top;
}



/* sidemenu
-----------------------------------------------------------*/
div#sidemenu-Wrap{
	margin:0px;
	padding:0 0 200px;
	background:url(../images/logo.gif) no-repeat center bottom;
	overflow:hidden;
	zoom:1;
}
table#sidemenu{
	width:180px;
	margin:0px;
}
table#sidemenu td{
	text-align:left;
	margin:0px;
	padding:0px;
}

#sidemenutd ul{
	width:100%;
	margin:0;
	padding:0;
}
#sidemenu td ul li{
	list-style:none;
	margin:0 3px;
	padding:0;
	line-height:1.8;
}
#sidemenu td ul li.last{
	list-style:none;
	margin-bottom:10px;
}
#sidemenu td ul.other li{
	line-height:1.5;
}
#sidemenu td ul.other li span{
	display:block;
	width:160px;
	padding-left:15px;
}



/* extended menu */
#sidemenu td ul#extend li{
	width:100%;
	margin:0px;
	padding:0px;
	background:none;
}
#sidemenu td ul#extend li div a{
	display:block;
	overflow:visible;
	margin:0 0 0 4px;
	padding:5px 0 0 16px;
	border-left:1px dotted #999999;
	background:none;
}
#sidemenu td ul#extend li div a:last-child{
	padding:0 0 15px 16px;
}
div#viewTop a{
	text-indent:-8px;
}
div#viewTop a:before{
	content:"･";
}

p.MenuTitle{
    margin: 0;
    padding: 10px 5px 9px 15px;
    color: white;
    text-align: left;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-bottom: 1px #ffffff solid;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}

p.MenuTitle:hover{
	background-color:#ff6400;
}

p.MenuTitle a{
	display:block;
	color:#ffffff;
}
p.MenuTitle a:link,
p.MenuTitle a:visited,
p.MenuTitle a:hover{
	color:#ffffff;
}
#menu_tree04_01,
#menu_tree04_02,
#menu_tree04_03,
#menu_tree04_04,
#menu_tree04_05,
#menu_tree04_06{text-indent:1em;}




/* color of titlebar */

p.MenuTitle{background-color:#1353bc;}

p.MenuTitleView,
p.MenuTitleSystem,
p.MenuTitleView:hover,
p.MenuTitleSystem:hover {background-color:#cccccc;cursor:default;}


.MenuSTitle{
	color:#ffffff;
	background-color:#00d2fd;
	margin:0px;
	padding:2px 5px;
	text-align:left;
}

.ContentTitle {background-color:#1353bc;}
.ContentSTitle{background-color:#cccccc;}





/* contents
-----------------------------------------------------------*/
table#contents{
	width:100%;
	margin:0px;
	padding:0px;
}
table#contents tr td{
	text-align:left;
	vertical-align:top;
	padding:10px 0;
	margin:0 auto;
}


.ContentTitle{
    margin-bottom: 0;
    padding: 20px 10px 15px 30px;
    font-size: 142.8571428%;
    font-weight: bold;
    color: #ffffff;
    text-align: left;
}

/* btn */
table#contents td div.btn{
	padding:10px 0;
}
table#contents td div.btn input{
	margin:0 5px 0 0;
	padding:9px 15px 7px;
	color:#0063c6;
	text-decoration:underline;
	border-radius:5px; 
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
	border:1px #acacac solid; 
}
table#contents td div.btn input:hover{
	color:#28508c;
	border:1px #7eb4ea solid;
	background-color:#e5f1fc;
}


table#contents td div.btn p.previous{
	float:right;
	width:9em;
	margin:10px 5px 10px 0;
	padding:9px 15px 7px;
	text-align:center;
	border-radius:5px;
    -webkit-border-radius:5px; 
    -moz-border-radius:5px;
	border:1px #acacac solid;
	background-color:#f0f0f0; 
}
table#contents td div.btn p.previous:hover{
	color:#28508c;
	border:1px #7eb4ea solid;
	background-color:#e5f1fc;
}


/* title */
.ContentSTitle{
    clear: both;
    color: #ffffff;
    margin: 5px 0;
    padding: 10px 10px 8px;
    font-size: 114.2857%;
    text-align: left;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}

.ContentSTitle.second{
    margin: 5px 0 0 10px;
	background-color:#b4b4b4;
}


.ContentSTitle:hover{
	background-color:#ff6400;
}
.ContentSTitle a{display:block;}
.ContentSTitle a:link,
.ContentSTitle a:hover,
.ContentSTitle a:visited,
.ContentSTitle a:active,
.MenuTitle a:link,
.MenuTitle a:hover,
.MenuTitle a:visited,
.MenuTitle a:active {color:white;}

table.itembox{
	width:100%;
	margin:0 0 15px;
	padding:0 0 15px;
	border-bottom:1px #cccccc solid;
}
table.itembox tr td{
	width:50%;
	text-align:left;
	vertical-align:top;
}
table.itembox img{
	float:left;
}
table.itembox tr td table tr td{
	border-bottom:none;
}

table.itembox tr td table caption{
	text-align:left;
}

#products span,
#method span,
#layout span,
#category span,
#sender span{
	display:block;
	padding-left:20px;
}

#page span{
	display:inline-block;
	padding-left:20px;
}

table.itembox p.googlemap{
	margin:0;
	padding:0;
}
table.itembox p.googlemap img{
	float:none;
	padding:0 2px;
	vertical-align: middle;
}


div#extended_deco,
div#text04,
div#text03,
div#text02,
div#text{
	width: calc(100% - 40px);
	max-height:200px;
	position:fixed;
	left:0;
	bottom:0;
    margin:10px 0 0 0;
	padding:20px;
	border-top:1px #ccc solid;
	border-left:1px #ccc solid;
	border-right:1px #ccc solid;
	background:white;
	overflow:scroll;
}

p.open_btn,
p.shut_btn{
	float:right;
	display:inline-block;
	width:10em;
	margin:0 5px;
	padding:0;
	text-align:center;
	background:#cccccc;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}
p.open_btn:hover,
p.shut_btn:hover{
	background:#ff6600;
}
p.open_btn a,
p.shut_btn a{
	display:block;
	color:white;
	padding:12px 0;
}
p.shut_btn{
	width:5em;
}
p.shut_btn a{
	margin:0 5px!important;
	padding:12px 0!important;
	color:white!important;
	border:none!important;
	box-shadow:none!important;
	background:none!important;
}



span.blue       {color:#0071be;font-weight:bold;}
span.darkblue   {color:#0a318f;font-weight:bold;}
span.red        {color:#c80000;font-weight:bold;}
span.orange     {color:#ff6600;font-weight:bold;}
span.yellowgreen{color:#5c9f1d;font-weight:bold;}
span.green      {color:#005d1e;font-weight:bold;}
span.bluegreen  {color:#00a291;font-weight:bold;}
span.purple     {color:#51278a;font-weight:bold;}
span.wine       {color:#b30063;font-weight:bold;}
span.pink       {color:#ff7f9a;font-weight:bold;}
span.aqua       {color:#00b2fd;font-weight:bold;}
span.ashes      {color:#adadad;font-weight:bold;}




div#extended_deco strong span{margin-right:10px;}

div#text a,
div#text02 a,
div#text03 a,
div#text04 a {
    background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8));
    background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
    background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
    background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
    background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
    background: -moz-linear-gradient(center top , #FFFFFF 0%, #EBEBEB 50%, #DBDBDB 50%, #B5B5B5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(50%,#EBEBEB), color-stop(50%,#EBEBEB), color-stop(100%,#B5B5B5));
    background: -webkit-linear-gradient(top, #FFFFFF 0%,#EBEBEB 50%,#EBEBEB 50%,#B5B5B5 100%);
    background: -o-linear-gradient(top, #FFFFFF 0%,#EBEBEB 50%,#EBEBEB 50%,#B5B5B5 100%);
    background: -ms-linear-gradient(top, #FFFFFF 0%,#EBEBEB 50%,#EBEBEB 50%,#B5B5B5 100%);
    background: linear-gradient(to bottom, #FFFFFF 0%,#EBEBEB 50%,#EBEBEB 50%,#B5B5B5 100%);
    border: 1px solid #949494;
    -webkit-border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border-radius: 2px 2px 2px 2px;
    -webkit-box-shadow: 2px 2px 4px rgba(100, 100, 100, 0.3);
    -moz-box-shadow: 2px 2px 4px rgba(100, 100, 100, 0.3);
    box-shadow: 2px 2px 4px rgba(100, 100, 100, 0.3);
    margin: 0 5px 5px 0;
    padding: 5px 10px 3px;
    color: #666666;
    display: inline-block;
    font-size: 14px;
    letter-spacing: normal;
    vertical-align: top;
}

/* for tag btn */
a.blue       {color:white!important;font-weight:bold;background:#0071be!important;}
a.darkblue   {color:white!important;font-weight:bold;background:#0a318f!important;}
a.red        {color:white!important;font-weight:bold;background:#c80000!important;}
a.orange     {color:white!important;font-weight:bold;background:#ff6600!important;}
a.yellowgreen{color:white!important;font-weight:bold;background:#5c9f1d!important;}
a.green      {color:white!important;font-weight:bold;background:#005d1e!important;}
a.bluegreen  {color:white!important;font-weight:bold;background:#00a291!important;}
a.purple     {color:white!important;font-weight:bold;background:#51278a!important;}
a.wine       {color:white!important;font-weight:bold;background:#b30063!important;}
a.pink       {color:white!important;font-weight:bold;background:#ff7f9a!important;}
a.aqua       {color:white!important;font-weight:bold;background:#00b2fd!important;}
a.ashes      {color:white!important;font-weight:bold;background:#adadad!important;}


div#text a.color{
	width:auto;
	text-align:center;
}


/*tooltip*/
.tip {
	width:400px;
    position:absolute;
    display:none;
	margin:0;
    padding:10px;
    color: #464646;
	text-align:center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background:#ffffff;
	z-index:1000;
	overflow:hidden;

}
.tip span {
	position:static !important;
	margin:0 !important;
}







div#text a:hover,
a.color-palette:hover{
    background: -moz-linear-gradient(center top , #ff6400 0%, #ff6400 50%, #ffa86f 50%, #ffa86f) repeat scroll 0 0 transparent;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff6400), color-stop(50%,#ffa86f), color-stop(50%,#ffa86f), color-stop(100%,#ffa86f));
	background: -webkit-linear-gradient(top, #ff6400 0%,#ff6400 50%,#009a44 50%,#ffa86f 100%);
	background: -o-linear-gradient(top, #ff6400 0%,#ff6400 50%,#ffa86f 50%,#ffa86f 100%);
	background: -ms-linear-gradient(top, #ff6400 0%,#ff6400 50%,#ffa86f 50%,#ffa86f 100%);
	background: linear-gradient(to bottom, #ff6400 0%,#ff6400 50%,#ffa86f 50%,#ffa86f 100%);
    color: #ffffff !important;
}

/* photo */
div.photo{
	width:180px;
	display:inline-block;
	*display:inline;
	margin:0 20px 10px 0;
	vertical-align:top;
	zoom:1;
	overflow:hidden;
}
div.photo img{
	display:block;
	float:none;
	margin:0 auto;
}



/* pcode */
input.pcode1{width:3em!important;margin-bottom:10px;}
input.pcode2{width:4em!important;margin:0 10px 10px 0;}

/* company */
div#extended_company input[type="text"]{width: 97%;}


/* pic */
span.thumb,
span.btn{
	display:inline-block;
	*display:inline;
	width:125px;
	height:85px;
	vertical-align:top;
	overflow:hidden;
	zoom:1;
}
span.btn{
	width:auto;
	height:auto;
}


/*undisplayed*/
tr.undisplayed td,
tr.undisplayed td input{
	color:#cccccc;
}
tr.undisplayed td:hover,
tr.undisplayed td input:hover{
	color:#464646;
}
tr.undisplayed td img{
    opacity:0.25;
    filter: alpha(opacity=25);
}


/*FORM*/
.form520{
	width:500px;
	display:block;
}
.form350{
	width:330px;
	display:block;
}
.form300{
	width:280px;
	display:block;
}
.form250{
	width:230px;
	display:block;
}
.form200{
	width:180px;
	display:block;
}
.form200i{
	width:180px;
	display:block;
}
.form100i{
	width:80px;
}
.form_full{
	width:100%;
	display:block
}
.form_gallery{
	width:168px;
	display:block
}
#extended_photo input[type="file"]{
	width: 180px!important;
}








/*FOOTER[
-----------------------------------------------------------*/
div#footer{
	width:90%;
	margin:0 auto;
	padding:0;
	text-align:center;
}



/*LIST[
-----------------------------------------------------------*/
table.list{
	width:100%;
	margin:0px;
	padding:0px;
	border-top:1px #cccccc solid;
}

table.list tr td{
	text-align:left;
	vertical-align:top;
	margin:0px;
	padding:3px 10px 3px 5px;
	border-right:10px transparent solid;
	border-bottom:1px #cccccc solid;
}

table.list tr td img{margin-right:10px;}

.bkBlue{
	background-color:#edffff;
	margin:0;
	padding:0;
}

/*search area*/
table#search {
	width:100%;
	margin:10px 0;
	padding:10px;
	border:1px #ccc solid;
	background:#f0f0f0;
}
table#search span{
	display:inline-block;
	*display:inline;
	margin:5px;
	white-space:nowrap;
}
table#search table {
	margin:0 auto;
}
table#search td {
	padding:3px 10px !important;
	line-height:2.4;
}
table#search p {
	padding:1px 10px;
}
table#search td.btn {
	text-align:right;
	vertical-align:bottom;
}

/*pager*/
ul#pager{
	width:90%;
	margin:5px 0;
}
ul#pager li,
ul#pager li a,
ul#pager li span,
ul#pager li .pageCurrent{
	display:block;
	width:2em;
}
ul#pager li{
	float:left;
	margin:5px 10px 5px 0;
	padding:0;
	text-align:center;
	line-height:1.5;
	font-weight:bold;
}
ul#pager li a{
	padding:2px;
	text-align:center;
	line-height:1.5;
	border:1px #cccccc solid;
}
ul#pager li a:link   { background:white;}
ul#pager li a:visited{ background:white;}
ul#pager li a:hover  { background:#28508c; color:white; border:1px #28508c solid;}
ul#pager li a:action { background:white;}

ul#pager li.step,
ul#pager li.step a{
	width:9em;
}
ul#pager li span.pageCurrent{
	/* margin:5px 5px 5px 0; */
	padding:2px;
	color:white;
	text-align:center;
	line-height:1.5;
	background:#28508c;
	border:1px #28508c solid;
}


/*member_list*/
p.number{
	margin-top:-2.4em;
}


/*faqcategorylistinput[
-----------------------------------------------------------*/
table#input{
	margin:10px;
	padding:0px;
	border:solid 1px #000000;
	background-color:#eeeeee;
}
table#input td{
	margin:0px;
	padding:0px 25px;
	align:left;
}
.bottom{
	text-valign:bottom;
	padding:1.3em 0 0 0;
}



/*　06function  
----------------------------------------------------------- */
.line {
	border-bottom:1px #cccccc solid;
	margin:5px 0;
	padding:5px 0;
}
.coution{
	font-size:83.33%;
	margin:0px;
	padding:0 0 0 5px;
}
.pageTop{
	text-align:right;
	display:block;
	padding-top:10px;
	padding-bottom:10px;
	border-top:1px #cccccc solid;
	border-bottom:1px #cccccc solid;
	margin:10px 0 10px 0;
}
.noBorder {
	padding-bottom:0 !important;
	border-bottom:none !important;
}
.TxtRed{
	color:#CC3300;
}
td.left {text-align:left;}
td.right{text-align:right;}
.gray_line{
	background:url(images/gray_line.gif) repeat-x center;
}
.err {
	border:2px solid #6B0E09;
	padding:3px; 
	color:#CC3300;
	margin:0 0 1px 0;
}
.T10P{
	padding:10px 0 0 0;
}
.T20P{
	padding:20px 0 0 0;
}  
.B10M{
	margin:0 0 10px 0;
}
.B10P{
	padding:0 0 10px 0;
}
.T10M{
	margin:10px 0 0 0;
}
.T20M{
	margin:20px 0 0 0;
}



/*　07file not found page  
----------------------------------------------------------- */
div#NotFound {
	width:100%;
	margin:70px auto;
}
div#NotFound div,
div#NotFound p,
div#NotFound ul,
div#NotFound ul li{
	width:400px;
	margin:0 auto;
}
div#NotFound div a img{
	margin:0 auto;
	padding-left:140px;
	vertical-align:center;
	border:none;
}
div#NotFound p{
	margin:15px auto;
	padding:15px 0;
	text-align:left;
	border-top:1px #cccccc solid;
	border-bottom:1px #cccccc solid;
}
div#NotFound ul {
	padding:0;
}
div#NotFound ul li {
	margin:0;
	padding-left:12px;
	list-style:none;
	background:url(../common/img/arrow02.png) no-repeat left 0.4em;
}





