@charset "UTF-8";
@import "base.css";
@import "fonts.css";

/*==========================================================================*/
/*//////////////////////////////////////////////////////////////////////////*/
/*//////                                                              //////*/
/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/
/*//////                                                              //////*/
/*//////////////////////////////////////////////////////////////////////////*/
/*                                                                          */
/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */
/*                                                                          */
/*==========================================================================*/

/*==========================================================================*/
/*                           Common-Setting                                 */
/*==========================================================================*/

/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */

h1,h2,h3,h4,h5,h6,input,button,textarea,select,p,blockquote,th,td,pre,address,li,dt,dd {
	font-size: 140%;
}


a { color: #f41; }
a:hover,
a:active { color: #f96; text-decoration: none; }
a:visited {
}

p { 
	line-height: 23px;
	padding: 0 0 16px;
}
/*p { padding: 0 0 16px; }*/

.image_l { float: left; padding: 0 23px 12px 0; }
.image_r { float: right; padding: 0 0 12px 23px; }
.image_r img,
.image_l img {
	padding: 3px 0 5px;
}

.image_l01 { float: left; padding: 0 23px 12px 0; }
.image_r01 { float: right; padding: 0 0 12px 23px; }
.image_r01 img,
.image_l01 img {
	padding: 0 0 5px;
}

table .image_l { padding: 5px 8px 8px 0; }
table .image_r { padding: 5px 0 8px 8px; }


/* common_reset
------------------------------------------------------------------------*/

img { 
	border: 0; 
	vertical-align: bottom;
}

.center {
	text-align: center;
}

.fLeft {
	float: left!important;
}

.fRight {
	float: right!important;
}

.clearBoth {
	clear: both;
}

p.clearAfter {
	clear: both;
	height: 0;
	width: 0;
	padding-bottom: 5px;
	line-height: 0;
	visibility: hidden;
}

/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/

html {
	background: none;
	min-width: 1040px;
	max-width: 100%;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	min-width: 1040px;
	max-width: 100%;
}

#wrapper {
	/*background: url(imgs/contents_bg.jpg) no-repeat center top;*/
	text-align: left;
}
#index #wrapper {
	/*background: url(imgs/index_bg.jpg) no-repeat center top;*/
}

#aboutus #wrapper {background: url(imgs/about_us_main.jpg) no-repeat center top;}
#contact #wrapper {background: url(imgs/contact_main.jpg) no-repeat center top;}
#enquiry #wrapper {background: url(imgs/enquiry_main.jpg) no-repeat center top;}
#infomation #wrapper {background: url(imgs/infomation_main.jpg) no-repeat center top;}
#services #wrapper {background: url(imgs/services_main.jpg) no-repeat center top;}
#sitemap #wrapper {background: url(imgs/sitemap_main.jpg) no-repeat center top;}

#main {
	margin: 0 auto;
	padding-top: 30px;
	padding-bottom: 30px;
	width: 950px;
}

#index #main {
	padding-bottom: 50px;
}


/*==========================================================================*/
/*                               Header                                     */
/*==========================================================================*/

#header {
	/*height: 400px;*/
	margin: 0 auto;
	width: ;
}

#index #header {
	/*height: 490px;*/
}
#header p.bg {
	background: url(imgs/header_bg.png) repeat 0 0;
	height: 100px;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 1000;
}
#header p {	padding: 0; }

.hSection {
	margin: 0 auto;
	width: 950px;
	position: relative;
	z-index: 1001;
}

#headerInner {
	position: absolute;
	z-index: 3000;
	height: 100px;
	left: 0;
	top: 0;
	width: 100%;
}

#header h1 {
	font-size: 10px;
}
#logo {
	float: left;
	padding-top: 5px;
}
/*#header .langues {
	float: right;
	width: 186px;
	padding-top: 30px;
	position: absolute;
	right: -12px;
	top: 0;
}
#header .langues li {
	background: url(imgs/bg_line.jpg) no-repeat 0 2px;
	float: left;
	padding-left: 18px;
}
#header .langues li.en {
	background: none;
	padding-left: 0;
}
#header .langues li.vi {
	float: right;
}
#header .langues li a {
    background: url(imgs/flagE.jpg) no-repeat 0 3px;
    color: #333;
	font-size: 11px;
    display: block;
    padding: 0 10px 0 22px;
    text-decoration: none;
}
#header .langues li.vi a {
    background: url(imgs/flagV.jpg) no-repeat 0 3px;
}*/

.langs{
	float: right;
	width: 198px;
	position: absolute;
	right: -27px;
	top: 26px;
}
.langs li {
	background: url(imgs/bg_line.jpg) no-repeat 100% 4px;
	display: inline;
	width: 98px;
	padding-left: 10px;
}
.langs li.last {
	background: none;
}
.langs li a {
	font-size:11px; 
	color:#2c2c2c;
    display: inline;
    padding: 0 10px 0 0;
    text-decoration: none;
}
.langs li a img { vertical-align: middle; padding-right: 3px}
.langs li a:hover{color: red;}

#gNav {	
	float: right;
	padding-top: 57px;
	margin-right: -25px;
}
#gNav li {
	float: left;
	position: relative;
	/*width: 105px;*/
	text-align: center;
	z-index: 2005;
	height: 43px;
	cursor: pointer;
	padding: 0 13px;
}
#gNav li a {
	color: #004098;
	text-decoration: none;
	display: block;
	font: 19px "Times New Roman", Times, serif;
	padding: 5px 7px 0;
	/*width: 90px;*/
}
#gNav li a.atv,
#gNav li a:hover {
	border-top: 2px solid #004098;
	padding-top: 3px;
}

#gNav li a.active {
	border-top: 2px solid #004098;
	padding-top: 3px;
}

/*#gNav li.last {
	width: 110px;
}
#gNav li.last a {
	width: 110px;
}*/

#gNav li ul.sublink {
	background: url(imgs/navi_bg.png) repeat 0 0;
	display: none;
	padding-bottom: 3px;
	width: 180px!important;
	position: absolute;
	left: 0;
	top: 43px;
}
#gNav li ul.sublink li {
	float: none;
	width: 150px;
	margin: 0 auto;
	padding: 5px 0 7px;
	height: auto;
	border-bottom: 1px solid #6895c6;
}
#gNav li ul.sublink li.last {
	border-bottom: none;
}
#gNav li ul.sublink li a {
	background: url(imgs/icon_03.png) no-repeat 0 6px;
	color: #fff;
	font-size: 15px;
	width: 150px;
	margin: 0 auto;
	text-align: left;
	padding-left: 16px;
	padding-top: 0;
}
#gNav li ul.sublink li a:hover {
	color: #D2E1F9;
	border: none;
	padding-top: 0;
}


/* ------------------------------------------------------------------- js */
#slides {
	/*position: absolute;
	left: 50%;
	top: 0;
	margin-left: -700px;*/
}
.slideIcon { float: right; margin: -38px 0 19px; width: 70px; }
.slideIcon li {
	float: left;
	font-size: 0;
	padding: 0 3px 0 3px;
}
.slideIcon li a {
	display: block;
	width: 16px;
	height: 16px;
}

.slideIcon li.current a {
	background: url(imgs/icon_01.png) no-repeat 0 0;
	text-align: -9999px;
}
.slideIcon li.current img {
	visibility: hidden;
}
.page {position: relative; z-index: 200; width: 950px; margin: 0 auto;}

.slides_container,
.slides_control { position: relative;}
.slides,
h2.slides_container,
.slides_control,
.slides_container span {
	height: 490px;
}

.slides_container { width: 1400px; margin: 0 auto; overflow: hidden;}

.slides_container a {
	position: absolute;
	left: 5px;
	top: 283px;
}
.prev,.next { display: none; }
#products {
	width: 100%;
	height: 490px;
	overflow: hidden;
	position: relative;
	text-align: center;
}

#products_example {
	width: 1400px;
	margin: 0 auto;
	text-align: center;
	overflow: visible;
}

/*==========================================================================*/
/*                            navigation                                    */
/*==========================================================================*/

#navi {
	float: left;
	width: 230px;
	text-align: center;
}

#navi p {
	padding-bottom: 0;
}


/*==========================================================================*/
/*                              Footer                                      */
/*==========================================================================*/

#footer p { padding-bottom: 0;}
#footer {
	color: #fff;
	clear: both;
	height: 50px;
	background: #004098;
	margin-bottom: -20px;

}
#footer address {
	font-size: 11px;
	width: 950px;
	padding-top: 20px;
	margin: 0 auto;
	text-align: center;
}

#footer address a{
	text-decoration: none!important;
	color: #fff!important;
}
.pageTop {
	position:fixed;
	bottom:65px;
	right:30px;
	margin:0;
	vertical-align:bottom;
	padding-bottom: 0!important;
}


/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/

/* contents
------------------------------------------------------------------------*/

/*#content {
	min-height: 407px;
}*/

.banner { 
	padding-top: 20px;
	text-align: center;
}

.bannerLast {
	clear: both;
	padding: 0;
	text-align: center;	
}

#index #content {
	margin: 0 auto;
	width: ;
	padding: 0 0 0 0;
}

.bg_top {
	clear: both;
	font-size: 0;
	padding: 0;
	text-align: center;
}

.bg_btm {
	clear: both;
	font-size: 0;
	padding-bottom: 20px;
	text-align: center;
}


.map_r { float: right; padding: 3px 0 17px 23px; }
.map_r p { padding-bottom: 0; }



/* ------------------------------------------------------------------- box */

/*.box01 {
	background: url(imgs/box01_2.jpg) repeat-y 0 0;
	padding: 10px 20px;
}

.box_style01 {
	overflow: hidden;
	background: #F8F8F8;
	border: 5px double #1EA1E9;
	clear: both;
	padding: 9px 25px 5px 25px;
	margin-bottom: 20px;
}

.box_style02 {
	border: 4px double #24A6DA;
	padding: 9px;
	margin-bottom: 15px;
}*/

.boxL {
	float: left;
	width: 493px;
}

.boxR {
	float: right;
	width: 493px;
}

.boxL p, .boxR p{
	text-align: justify;
}


/* ------------------------------------------------------------------- hx */

.bHead {
	height: 400px;
}
.bHead .inner {
	width: 100%;
	position: relative;
	overflow: hidden;
	height: 400px;
}
.bHead .inner h2 {
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -700px;
	text-align: center;
}
h3 {
	color: #063e93;
	font-size: 160%;
	padding-bottom: 19px;
}

h4 {
	font-size: 0;
	clear: both;
    padding: 0 0 15px;
}


/* ------------------------------------------------------------------- list */

/*.list_text01 { padding-bottom: 10px; }
.list_text01 li {
	background: url(imgs/icon_01.jpg) no-repeat 0 3px;
	padding: 0 0 5px 20px;
}*/

ul.list_bnr01 {
	width: 105%;
	margin-right: -29px;
	padding-bottom: 20px;
}
ul.list_bnr01 li {
	float: left;
	text-align: center;
	padding-right: 19px;
}
ul.list_bnr01 li p { padding-bottom: 0; }
ul.list_bnr01 li p.title {
	color: #004098;
	font-size: 120%;
	padding-bottom: 10px;
}
ul.list_bnr01 li a:hover{
	opacity: 0.8;
    filter: alpha(opacity=80);
}

ul.list_contact li {
	padding: 6px 0 30px 43px;
	position: relative;
}
ul.list_contact li .icon {
	position: absolute;
	left: 0;
	top: 0;
}

ul.list_contact li .icon a {
	text-decoration: underline!important;
}

ul.list_btn {
	text-align: center;
}
ul.list_btn li {
	display: inline;
	padding: 0 20px;
}
dl.list_info { 
	float: left; }
	
dl.list_info dt {
	width: 23%;
}
dl.list_info dd {
	margin: -1.4em 0 0 0;
	padding: 0 0 3px 8.5em;
	text-indent: -0.7em;
}

ul.list_page {
	background: url(imgs/sitemap_bg_04.jpg) repeat-y 0 0;
}
ul.list_page li {
	background: url(imgs/sitemap_bg_03.jpg) no-repeat 0 4px;
	padding: 0 0 5px 20px;
}
ul.list_page li a { color: #201c1d; text-decoration: none; }
ul.list_page li a:hover{  color: #00a1e9; }
/* ul.list_page li a:hover,
ul.list_page li a:visited { text-decoration: underline; color: #ffa157; } */
ul.list_page li.first {
	background: url(imgs/sitemap_bg_01.jpg) no-repeat 0 -4px;
}
ul.list_page li.special {
	background: url(imgs/sitemap_bg_02.jpg) no-repeat 0 4px;
	position: relative;
}
ul.list_page li.last {
	background: url(imgs/sitemap_bg_05.jpg) no-repeat 0 4px;
}

ul.list_page li.special span.open {
	display: block;
	text-indent: -9999px;
	width: 12px;
	height: 7px;
	font-size: 0;
	position: absolute;
	left: 0;
	top: 5px;
	cursor: pointer;
}
ul.list_page li ul { 
	margin-left: -2px;
	padding-top: 7px;
	display: none;
}
ul.list_page li ul li {
	padding: 0 0 5px 15px;
}


ul.list_pro01 {
	margin-right: -33px;
	padding-top: 10px;
}
ul.list_pro01 li {
	float: left;
	padding: 0 13px 34px 0;
	width: 182px;
}
ul.list_pro01 li span {
	display: block;
	padding-top: 5px;
}
ul.list_pro01 span.title {
	font-size: 130%;
	font-weight: normal;
}
ul.list_pro01 li img {
	border: 1px solid #ccc;
}
ul.list_pro01 li .readmore span {
	display: inline;
}


p.pageList {
	text-align: right;
}
p.pageList span { margin-right: 2px;}
p.pageList span a {
	background: #fff;
	color: #333;
	cursor: pointer;
	padding: 0 4px;
	text-decoration: none;
}
p.pageList span.active a {
	background: #054ba3;
	color: #fff;
	padding: 0 4px;
	cursor: text;
}


/* ------------------------------------------------------------------- table */

table {
    margin-bottom: 20px;
    width: 100%;
}
img.center,
table.img_center img {
	display: block;
	margin: 0 auto;
	text-align: center;
}
table th,td {
    border: 1px solid #71cce7;
    padding: 7px 6px;
}
table th {
    background: #e8f7fc;
    color: #2881A9;
	padding: 7px 6px 6px;
	vertical-align:middle;
	text-align:center;
}
table td {
	vertical-align: top;
}
table th img {
    padding-bottom: 4px;
}

table.td_middle td,
table .vMiddle {
	vertical-align: middle;
}

table.td_center td {
	text-align: center;
}
table.th_left th {
	text-align: left;
}

.box_form {
	float: left;
	width: 60%;
}
.box_form table { margin-bottom: 0; }
.box_form th {
	vertical-align: top;
	border: none;
	background: none;
	width: 20%;
	text-align: left;
	color: #333;
	font-weight: normal;
	font-size: 140%;
	padding: 13px 0 5px;
}

.box_form td {
	vertical-align: middle;
	border: none;
	background: none;
	padding: 5px 0;
}

.box_form td input {
	border: 1px solid #e9e9e9;
	padding: 7px 10px 4px;
	width: 90%;
}

.box_form td input#code {
	width: 148px;
}
.box_form td input#quantity {
	width: 148px;
}
.box_form td input#attach {
	width: 90%;
	margin-bottom: 10px;
}

.box_form td select {
	border: 1px solid #e9e9e9;
	width: 95%;
	padding: 6px 7px 5px 10px;
}

.box_form .must {
	color: #FF0000;
	padding-left: 10px;
}

.box_form td.labelC {
	padding: 5px 10px;
	width: 15%; 
}
.box_form .note {
	color: #7d7d7d;
	font-size: 90%;
}

.box_form textarea {
	border: 1px solid #e9e9e9;
	width: 92%;
	padding: 6px 7px 5px 10px;
	margin-bottom: 10px;
}

.box_form .list_btn input {
	width: auto;
	height: auto;
	padding: 0;
	border: none;
}

/* ------------------------------------------------------------------- top */

/* add
------------------------------------------------------------------------*/
.section { padding-bottom: 30px; }

.mb0 { margin-bottom : 0; }
.pb0 { padding-bottom: 0!important; }

.mb05 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }

.pb05 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }
.pb15 { padding-bottom: 15px; }
.pb20 { padding-bottom: 20px; }
.pb25 { padding-bottom: 25px; }
.pb30 { padding-bottom: 30px; }
.pb40 { padding-bottom: 40px; }
.pb50 { padding-bottom: 50px; }

.w10 { width: 10%; }
.w15 { width: 15%; }
.w16 { width: 16%; }
.w20 { width: 20%; }
.w25 { width: 25%; }
.w28 { width: 28%; }
.w30 { width: 30%; }
.w33 { width: 33%; }
.w35 { width: 35%; }
.w40 { width: 40%; }
.w50 { width: 50%; }

.pl30 { padding-left: 30px; }
.pl57 { padding-left: 57px; }

.bold { font-weight:  bold; }

.gm-style-iw:after,
.gm-style div:after,
.gMapInfoWindow:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.gm-style-iw,
.gm-style div,
.gMapInfoWindow { display: block; }
p.mapInfo {
	min-width: 190px;
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 0;
}

.clearN { clear: none;}


/* clearfix
------------------------------------------------------------------------*/

ul.list_pro01,
#content,
ul.list_bnr01,
.section {
	zoom: 1;
}

ul.list_pro01:after,
#content:after,
ul.list_bnr01:after,
.section:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	line-height: 0;
	visibility: hidden;
}

/* resize Browser

min-width: 1040px;
max-width: 100%;

*/

ul.list_pro01 li a {
	text-decoration: none;
} 
ul.list_pro01 li a span { color: #000000; }
/* ul.list_pro01 li a:hover,
ul.list_pro01 li a:active { color: #f96; text-decoration: none; }
ul.list_pro01 li a:visited {
} */

.min-height { min-height: 350px; }
.about-content .image_r { min-height: 220px; }
.about-content p { text-align: justify; }
.txt_left { float: left;}
.txt_mgL30 { margin-left: 30px; float: left;}