@charset "utf-8";
/*===================================================================

[Information]
 Coder:			Yuji Hisamatsu
 Last update:	2010-11-29
 Description:	共通スタイル定義
 File name:		common.css

[index]
 + float
 + clear float
 + text align
 + table
 + dl format
 + listmark
 + font style
 + common box
 + width
 + form style
 + display
 + anchor
 + breadcrumb
 + navigation
 + pagetop
 + pager

===================================================================*/

/*-----------------------------------
	橋本が追加
-----------------------------------*/
.cursor-pointer{
    cursor:pointer;
}

.sdk-notes
{
	border: none;
	width: 100%;
}
.sdk-comm
{
	white-space: nowrap; 
	width: 5px;
	vertical-align: top;
}
.box-padd20 {
	padding:0 20px;
}
.box-details {
	margin:15px 30px;
}
.driver-product-body {
	margin:15px 0;
	padding-bottom:12px;
	border-bottom:#ccc 3px dotted;
}
.driver-blue
{
	font-weight: bolder; 
    color: #2C71B2;
}
.driver-details
{
	font-size:20px;
	font-weight: bolder; 
    color: #2C71B2;
}
.driver-caption
{
	font-size:35px;
	font-weight: bolder; 
	letter-spacing: 5px;
    color: #2E57A5;
}
.driver-content
{
	margin-top:20px;
	margin-left:30px;
	font-size:20px;
	letter-spacing: 5px;
    color: #2C71B2;
}
.right-float-catalog {
	float:right;
	margin:-30px 10px 0px 0px;
}
.right-float-webcatalog
{
    font-size: 7px;
	float:right;
	position: relative;
	left: -5px;
	top: -35px;
}

.right-float {
	float:right;
	margin:-60px 50px -100px 0px;
}

.right-float2 {
	float:right;
	margin:-60px 30px -100px 0px;
}
.right-float3 {
	float:right;
	margin:-30px 90px 0px 0px;
}
.right-float4 {
	float:right;
	margin:-150px 50px 0px 0px;
}

.orange {
    color: #FF8050;
}

.right-orange {
	float:right;
	margin:8px 10px 8px 8px;
    color: #FF8050;
}

.right-float-orange {
	float:right;
/*	margin:-15px 10px 0px 0px;*/
    color: #FF8050;
}

.right-float2-orange {
	float:right;
	margin:-30px 25px 0px 0px;
    color: #FF8050;
}

.right-float3-orange {
	float:right;
	margin:0px 20px 0px 0px;
    color: #FF8050;
}

.right-float4-orange {
	float:right;
	margin:-17px 10px 0px 0px;
    color: #FF8050;
    font-size: xx-small;
}

.position-top20left40 {
	position: relative;
	left: 40px;
	top: 20px;
}

.style-xs {
	float:right;
	font-size:9px;
}

.style-8
{
	font-size: 8px;
}
.style-xxsamll
{
    font-size: xx-small;
}
.style-xsamll
{
    font-size: x-small;
}
.style-samll
{
    font-size: small;
}
.style-medium
{
	font-size: medium;
}
.style-red
{
    color: #FF0000;
}
.style-linkblue
{
    color: #06C;
}
.camera-green
{
	margin:-15px 0px 15px 0px;
    color: #4cbb47;
}
.camera-violet
{
	margin:-5px 0px 5px 0px;
    color: #b200ff;
}
.camera-red
{
	margin:-15px 0px 15px 0px;
    color: #dd1d25;
}

td.pyramid
{
	vertical-align: top;
	width: 15px;
}
img.pyramid
{
	margin-top: 5px;
	border: 0;
	width: 10px;
	height:10px;
}

#underline_black
{
	text-decoration:underline;
    color: black;
}



/*-----------------------------------
	float
-----------------------------------*/
.left {
	float:left;
}
.right {
	float:right;
}
img.left {
	float:left;
	margin:0 8px 8px 0;
}
img.right {
	float:right;
	margin:0 0 8px 8px;
}

/*---------------------------------------
	clear float
---------------------------------------*/
.cl {
	clear:both;
}
hr {
	clear:both;
	color:#fff;
	border:#fff 0 solid;
}
.cfix:after {
    content:".";
    display: block;
    height:0px;
    clear:both;
    visibility:hidden;
}
.cfix {
    zoom:1;
}
/*---------------------------------------
    text align
---------------------------------------*/
.txt-l {
    text-align:left;
}
.txt-c {
    text-align:center;
}
.txt-r {
    text-align:right;
}
/*---------------------------------------
	table
---------------------------------------*/
table.tb-normal {
	width:100%;
	line-height:140%;
}
table.tb-normal {
	clear:both;
}
.tb-normal thead th {
}
.tb-normal td, .tb-normal th {
	border:#ddd 1px solid;
	padding:7px 10px;
	line-height:140%;
}
.tb-normal th {
	background:#f0f0f0 url(img/bg_th.gif) repeat-x;
}
.tb-normal tfoot td, .tb-normal tfoot th {
	background:#ddd;
	border:#aaa 1px solid;
	border-top:#777 2px solid;
	text-align:center;
}
.even {
	background-color:#fafafa !important;
	background-image:#fafafa url(img/bg_th.gif);
	background-repeat:repeat-x
}
/*---------------------------------------
	dl format
---------------------------------------*/
dl.dl-tb {
	width:auto;
}
dl.dl-tb dt {
	width:110px;
	float:left;
	border-right:#e6e6e6 1px solid;
}
dl.dl-tb dd {
	border-bottom:#eee 1px solid;
	padding:0 0 12px 120px;
	margin-bottom:10px;
}
dl.dl-tb dd p {
	display:inline;
	margin:0;
}
.dl-list dt {
	font-weight:bold;
	border-bottom:#ccc 1px solid;
}
.dl-list dd {
	margin-left:1em;
}

/*---------------------------------------
	listmark
---------------------------------------*/
.list-decimal li, li.list-decimal {
	list-style:decimal outside;
	margin:0 0 9px 30px;
}
.list-square li, li.list-square, .list-square dd {
	list-style:square outside;
	margin:6px 0 6px 20px;
}
.list li, li.list {
	list-style:disc outside;
	margin-left:20px;
}
.list-alpha li, li.list-alpha {
	list-style:lower-alpha outside;
	margin:6px 0 6px 22px;
}

/*---------------------------------------
	icon 
---------------------------------------*/
a.icn-arrow, .icn-arrow a {
	background:url(img/icn_arrow_list.gif) no-repeat 0px 49%;
	padding-left:15px;
}
.icn-arrow-dl {
	line-height:180%;
	padding:0 10px;
}
.icn-arrow-dl dt {
	background:url(img/icn_arrow_dl_dt.gif) no-repeat 0% 49%;
	padding-left:16px;
}
.icn-arrow-dl dd {
	background:url(img/icn_arrow_dl_dd.gif) no-repeat 0% 49%;
	padding-left:14px;
	margin:0 0 10px 16px;
}
.icn-agreement {
	padding-left:18px;
	background:url(img/icn_agreement.gif) no-repeat 0% 49%;
}
/*---------------------------------------
	font style
---------------------------------------*/
/*	font size	-----------------------*/
.xs {
	font-size:9px;
	line-height:150%;
}
.s {
	font-size:10px;
	line-height:140%;
}
.m {
	font-size:13px;
}
.l {
	font-size:17px;
}
.xl {
	font-size:20px;
}
.xxl {
	font-size:22px;
}
/*	font style	-----------------------*/
.b {
	font-weight:bold;
}
.n {
	font-weight:normal;
}
.i {
	font-style:italic;
}
.u {
	text-decoration:underline;
}
.d {
	text-decoration:line-through;
}
.indent {
	text-indent:1em;
}
/*	font color	-----------------------*/
.red {
	color:red;
}
.blue {
	color:blue;
}
.black {
	color:black;
}
.gray {
	color:gray;
}

/*----------------------------------------
	common box
----------------------------------------*/
.box {
	margin:15px 0;
}
.box-content {
	margin-bottom:25px;
}
.box-content p, .box-content ul, .box-content ol {
	margin-bottom:15px;
}
.box-content ul {
	list-style:disc outside;
	margin-left:20px;
}
.box-content ol {
	list-style:decimal outside;
	margin:0 0 9px 30px;
}
.box-half {
	width:48%;
}

/*----------------------------------------
	width
----------------------------------------*/
.w100 {
	width:100px;
}
.w140 {
	width:100px;
}
.w200 {
	width:200px;
}
.w480 {
	width:480px;
}
.w550 {
	width:550px;
}
/*----------------------------------------
	form style
----------------------------------------*/
form textarea {
	width:400px;
	height:200px;
}
.icn-required {
	background:url(img/icn_required.png) no-repeat 100% 0;
	padding-right:47px;
}
form input.text {
	width:490px;
}
textarea.text {
	width:490px;
}
textarea.mid-text {
	width:490px;
	height:120px;
}
input.mid-text {
	width:300px;
}
input.numeric {
	width:100px;
}
form .numeric, form .text, form .mid-text {
	padding:4px 6px;
	border:#dfdfdf 1px solid;
	background:#fff url(img/bg_input.gif) repeat-x;
}
input.smt {
    margin:0 10px;
	padding:7px 0 8px 0;
	width:120px;
	border:2px solid #ddd;
    cursor:pointer;
    color:#333;
    font-size:100%;
    line-height:130%;
    text-decoration:none;
	letter-spacing:0.2em;

}
input:hover.smt {
	color:#336699;
	background-color:#dff4ff;
	border:2px solid #ccc;

}
.error {
	color:red;
	display:block;
}
input.btn-confirm {
	background:#f0f0f0 url(img/icn_mail_confirm.png) no-repeat 20px 50%;
	padding-left:20px;
}
input.btn-reset {
	background:#f0f0f0 url(img/icn_slash.png) no-repeat 20px 50%;
	padding-left:20px;
}
input.btn-edit {
	background:#f0f0f0 url(img/icn_mail_edit.png) no-repeat 20px 50%;
	padding-left:20px;
}
input.btn-send {
	background:#f0f0f0 url(img/icn_mail_send.png) no-repeat 20px 50%;
	padding-left:20px;
}
input.data-send {
	background:#f0f0f0 url(img/icn_mail_send.png) no-repeat 10px 50%;
	padding-left:30px;
}
/*---------------------------------------
	IME MODE  for IE
---------------------------------------*/
.ja {
	ime-mode: active;
}
.en {
	ime-mode: inactive;
}
/*----------------------------------------
	display
----------------------------------------*/
.none {
	visibility:hidden;
}
.block {
	display:block;
}
.inline {
	display:inline;
}
ul.inline {
	display:block;
}
ul.inline li {
	display:inline;
	margin-right:15px;
}

/*---------------------------------------
	anchor
---------------------------------------*/
.a-standsout a {
	text-decoration:none;
	color:#39C;
}
.a-standsout a:hover {
	color:#F33;
}
/*---------------------------------------
	breadcrumb
---------------------------------------*/
.breadcrumb ul {
	line-height:160%;
	margin:5px 0 10px;
	font-size:11px;
}
.breadcrumb li {
	display:inline;
	margin-right:15px;
}
.breadcrumb li a {
	background:url(img/icn_arrow_bc_a.gif) no-repeat 0% 49%;
	padding-left:12px;
	text-decoration:none;
}
.breadcrumb li strong {
	background:url(img/icn_arrow_bc_s.gif) no-repeat 0% 49%;
	padding-left:12px;
	text-decoration:none;
	color:#3bb0ec;
}
/*----------------------------------------
	navigation
----------------------------------------*/
.navigation {
	clear:both;
	margin:25px 0;
	border:#dedede 1px solid;
	background-color:#f6f6f6;
	padding:5px 2px;
}
.navigation a {
	color:#666;
}
.navigation .left {
	background:url(img/icn_prev.png) no-repeat 0% 50%;
	padding-left:18px;
	line-height:16px;
}
.navigation .right {
	background:url(img/icn_next.png) no-repeat 100% 50%;
	padding-right:18px;
	line-height:16px;
}

/*----------------------------------------
	page top
----------------------------------------
.pagetop {
	clear:both;
	position:relative;
	margin:20px 0;
	height:22px;
}
.pagetop a {
	display:block;
	position:absolute;
	right:0;
	background:url(img/btn_pagetop.png) no-repeat;
	width:155px;
	height:0 !important;
	height :22px;
	padding:22px 0 0;
	overflow:hidden;
}
.pagetop a:hover {
	background-position:0 -22px;
}*/
 .pagetop {
	clear:both;
  position: fixed;
  bottom: 5px;
  right: 0;
  width: 51px;
  margin-bottom: 2em;
}
.pagetop a {
	display:block;
	position:absolute;
  bottom: 5px;
	right:0;
	background:url(/assets/images/common/pagetop.svg) no-repeat;
	height:0 !important;
	height /**/:42px;
	padding:42px 0 0;
	overflow:hidden;
}

/*---------------------------------------
	pager
---------------------------------------*/
.pager {
	clear:both;
	margin-bottom:15px;
}
.pager li {
	display:inline;
	margin:0 0 0 3px;
	line-height:160%;
	font-weight:bold;
}
.pager li a {
	line-height:100%;
	padding:3px 6px;
	border:#d6d6d6 1px solid;
	color:#ccc;
	text-decoration:none;
	font-size:xx-small;
}
.pager li a:hover, .pager li a.prev:hover, .pager li a.next:hover {
	color:#fff;
	background-color:#996;
}
.pager li a.prev, .pager li a.next  {
	background-color:#f1f1f1;
	color:#666;
	font-weight:normal;
	font-size:small;
}