@charset "utf-8";
/* CSS Document */

/* ---------------------------------------------------------
   Reset Browser Style
--------------------------------------------------------- */
* {
	margin: 0;
	padding: 0;
}

ol, ul {
	list-style-type: none;
}

fieldset,img {
	border: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* ---------------------------------------------------------
   Element Style
--------------------------------------------------------- */
body {
	font-size: 13px;
	line-height: 1.33;
	color: #333;
	font-family: sans-serif;
}
	/* IE7 fix */
	*:first-child+html body {
		font-family: 'メイリオ', 'ＭＳ Ｐゴシック', sans-serif;
		font-size: small;
	}
	/* IE6 fix */
	* html body {
		font-family: 'ＭＳ Ｐゴシック', sans-serif;
		font-size: small;
}


h1 {
	margin-bottom: 15px;
	height: 50px;
	line-height: 1.0;
	overflow: hidden;
	font-size: 1px;
}

a {
}

/* ---------------------------------------------------------
   Page Structure
--------------------------------------------------------- */
.layout-wrapper {
	width: 100%;
	background: #e9f9fa;
}
.layout-header {
	position: relative;/*for IE7 zoom*/
	width: 100%;
	background:url(../img/bg_layout-header.gif) left top repeat-x;
}
.layout-body {
	margin: 0 auto;
	width: 1024px;
	background: url(../img/bg_layout-body_a.jpg) left top no-repeat;
}
.layout-footer {
	width: 100%;
	position: relative;/*for IE7 zoom*/
	background: url(../img/bg_layout-footer_a.gif) left top repeat-x;
}

.wrapper {
	margin: 0 auto;
	width: 1024px;
}
.layout-header .wrapper {
	background:url(../img/bg_layout-header.gif) left top repeat-x;
}
.layout-body .wrapper {
	background: url(../img/bg_layout-body_a.jpg) left top no-repeat;
}
.layout-footer .wrapper {
	background: url(../img/bg_layout-footer_a.gif) left top repeat-x;
}

.header {
	margin: 0 auto;
	position: relative;
	width: 780px;
	height: 143px;
	overflow: hidden;
}
.content {
	margin: 0 auto;
	padding-top: 15px;
	width: 780px;
	overflow: hidden;
}
.footer {
	margin: 0 auto;
	position: relative;
	width: 780px;
	height: 79px;
	overflow: hidden;
	background:url(../img/bg_footer.gif) left top no-repeat;
}

.header *,
.footer * {
	margin: 0;
	padding: 0;
	line-height: 1.01;
}

/* ---------------------------------------------------------
   Header Block
--------------------------------------------------------- */
.header .logo {
	margin: 5px 0 10px 0;
	padding: 0;
	height: 73px;
	overflow: hidden;
}

.header .english {
	position: absolute;
	top: 10px;
	left: 674px;
	width: 106px;
	height: 16px;
}

.header .menu {
	width: 780px;
	height: 46px;
	overflow: hidden;
	background: url(../img/header_menu.jpg) left top no-repeat;
}
.header .menu li {
	float: left;
	width: 130px;
}
.header .menu li a {
	display: block;
	margin: 0 1px;
	width: 128px;
	height: 46px;
	overflow: hidden;
	text-indent: -9999em;
}

.kodawari .header .menu li.kodawari a,
.header .menu li.kodawari a:hover {
	background: url(../img/header_menu.jpg) -1px -46px no-repeat;
}
.material .header .menu li.material a,
.header .menu li.material a:hover {
	background: url(../img/header_menu.jpg) -131px -46px no-repeat;
}
.making .header .menu li.making a,
.header .menu li.making a:hover {
	background: url(../img/header_menu.jpg) -261px -46px no-repeat;
}
.qa .header .menu li.qa a,
.header .menu li.qa a:hover {
	background: url(../img/header_menu.jpg) -391px -46px no-repeat;
}
.csr .header .menu li.csr a,
.header .menu li.csr a:hover {
	background: url(../img/header_menu.jpg) -521px -46px no-repeat;
}
.oem .header .menu li.oem a,
.header .menu li.oem a:hover {
	background: url(../img/header_menu.jpg) -651px -46px no-repeat;
}

/* ---------------------------------------------------------
   Content Block
--------------------------------------------------------- */

.lead {
	margin: 0 0 20px;
}

.section,
.section-box {
	clear: both;
	width: 100%;
	overflow: hidden;
}

.section h2 {
	margin-bottom: 15px;
	height: 35px;
	line-height: 1.0;
	overflow: hidden;
	font-size: 1px;
}

.lead p,
.section p {
	margin: 0 10px;
	line-height: 1.66;
}

.section dl.content-list {
	margin: 0 0 0 20px;
	line-height: 1.66;
}
.section dl.content-list dt {
	color: #f26200;
	font-weight: bold;
}
.section dl.content-list dd {
	margin-bottom: 20px;
}

/* ---------------------------------------------------------
   Footer Block
--------------------------------------------------------- */
.footer .menu {
	position: absolute;
	top: 9px;
	right: 0;
	width: 501px;
	height: 21px;
	overflow: hidden;
	background: url(../img/footer_menu.gif) left top no-repeat;
}
.footer .menu li {
	float: left;
}
.footer .menu li.oem {
	width: 83px;
}
.footer .menu li.company {
	width: 83px;
}
.footer .menu li.recruit {
	width: 83px;
}
.footer .menu li.privacy {
	width: 147px;
}
.footer .menu li.contact {
	width: 105px;
}
.footer .menu li a {
	margin: 5px;
	display: block;
	height: 11px;
	overflow: hidden;
	font-size: 1px;
	text-indent: -9999em;
}

.footer .copyright {
	position: absolute;
	top: 54px;
	left: 169px;
}

/* ---------------------------------------------------------
   Common Class style
--------------------------------------------------------- */

.align-left {
	display: inline;
	float: left;
}
.align-right {
	display: inline;
	float: right;
}

/* ---------------------------------------------------------
   Page style
--------------------------------------------------------- */
/* Index
--------------------------------------------------------- */

/* Index
--------------------------------------------------------- */
.index .layout-footer,
.index .layout-footer .wrapper {
	background: url(../img/index_bg_layout-footer.gif) center top no-repeat;
}

.index .header h1 {
}

.index .content {
	padding-bottom: 5px;
}

.index .keyvisual {
	margin-bottom: 15px;
}

.index .banner-link {
	clear: both;
	width: 780px;
}
.index .banner-link ul {
	width: 780px;
	overflow: hidden;
}
.index .banner-link ul li {
	margin-bottom: 10px;
	line-height: 1.01;
}
.index .banner-link ul li.odd {
	margin-right: 10px;
}
.index .banner-link ul li.kodawari,
.index .banner-link ul li.material,
.index .banner-link ul li.making,
.index .banner-link ul li.qa {
	float: left;
	width: 385px;
	height: 140px;
	overflow: hidden;
}
.index .banner-link ul li.oem {
	width: 780px;
	height: 60px;
	overflow: hidden;
}
.index .banner-link ul li.csr,
.index .banner-link ul li.company {
	float: left;
	width: 385px;
	height: 60px;
	overflow: hidden;
}

/* Kodawari
--------------------------------------------------------- */
.kodawari .layout-wrapper {
	background: #f2f7fa;
}
.kodawari .layout-body,
.kodawari .layout-body .wrapper {
	background: url(../img/kodawari_bg_layout-body.jpg) left top no-repeat;
}
.kodawari .layout-footer,
.kodawari .layout-footer .wrapper {
	background: url(../img/kodawari_bg_layout-footer.gif) left top repeat-x;
}

.kodawari .content {
	padding-bottom: 60px;
}
.kodawari .lead {
	background: url(../img/kodawari_bg_lead.gif) left top repeat-y;
}
.kodawari .lead-content {
	background: url(../img/kodawari_bg_lead-content.jpg) left top no-repeat;
}
.kodawari .lead-footer {
	height: 4px;
	background: url(../img/kodawari_bg_lead-footer.gif) left top no-repeat;
	font-size: 1px;
}
.kodawari .lead p {
	margin: 0 15px;
}
.kodawari .lead p.image {
	margin: 10px 0;
	text-align: center;
}

.kodawari .section table {
	margin-right: 10px;
	text-align: right;
	vertical-align: middle;
}
.kodawari .section table td {
	vertical-align: middle;
}
.kodawari .section table img {
	padding-right: 5px;
}

.kodawari .border {
	margin: 20px 0;
	clear: both;
	height: 1px;
	overflow: hidden;
}

/* Material
--------------------------------------------------------- */
.material .content {
	padding-bottom: 50px;
}
.material .section {
	background: url(../img/material_bg_section.gif) left top repeat-y;
}
.material .section .section-content {
	background:url(../img/material_bg_section-content.jpg) left top no-repeat;
}
.material .section .section-footer {
	height: 5px;
	background:url(../img/material_bg_section-footer.gif) left top no-repeat;
	font-size: 1px;
}
.material .section .section-box {
	padding-top: 15px;
}
.material .section .image {
	width: 370px;
}
.material .section .text {
	width: 395px;
}
.material .section h2 {
	margin: 0;
	height: 55px;
}
.material .section p {
	margin: 0 0 20px 20px;
}

/* Making
--------------------------------------------------------- */
.making-top .layout-wrapper {
	background: #ecfcfc;
}
.making-top .layout-body,
.making-top .layout-body .wrapper {
	background: url(../img/bg_layout-body_b.jpg) left top no-repeat;
}
.making-top .layout-footer,
.making-top .layout-footer .wrapper {
	background: url(../img/bg_layout-footer_b.gif) left top repeat-x;
}

.making-top .lead {
	margin: 0 0 15px;
}
.making-top .section {
	margin-bottom: 15px;
}
.making-top .section .image {
	margin-bottom: 0;
	width: 225px;
	height: 150px;
}
.making-top .section .text {
	width: 535px;
}
.making-top .section .goto-detail {
	margin-top: 15px;
}


.making-soap .layout-wrapper {
	background: #dcf0f2;
}
.making-soap .layout-body,
.making-soap .layout-body .wrapper {
	background: url(../img/making-soap_bg_layout-body.jpg) left top no-repeat;
}
.making-soap .layout-footer,
.making-soap .layout-footer .wrapper {
	background: url(../img/making-soap_bg_layout-footer.gif) left top repeat-x;
}

.making-soap .content {
	padding-bottom: 40px;
}
.making-soap .section {
	margin-bottom: 20px;
}
.making-soap .section h2 {
	margin-bottom: 12px;
}
.making-soap .section-content {
	width: 100%;
	overflow: hidden;
}
.making-soap .section .text {
	width: 650px;
}
.making-soap .section .two-image .text {
	width: 525px;
}
.making-soap .section .image {
	width: 125px;
}
.making-soap .section .two-image .image {
	width: 250px;
}

.making-soap .section .text p,
.making-soap .section .text dt,
.making-soap .section .text dd,
.making-soap .section .text li {
	margin: 0 5px;
	line-height: 1.66;
}
.making-soap .section dl.content-list {
	margin-left: 0;
}
.making-soap .section dl.content-list dd {
	margin-bottom: 0;
}
.making-soap .section .image img {
	padding-right: 5px;
}
.making-soap .section .artisanry {
	margin-top: 12px;
	clear: both;
	width: 100%;
	background:url(../img/making-soap_bg_artisanry.gif) left top repeat-y;
}
.making-soap .section .artisanry dd {
	padding: 5px 15px 10px;
	background:url(../img/making-soap_bg_artisanry_footer.gif) left bottom no-repeat;
}

.making-soap ul.oeminfo {
	padding-top: 20px;

}
.making-soap ul.oeminfo li.text {
	height: 121px;
	overflow: hidden;
}
.making-soap ul.oeminfo li.link {
	background: url(../img/making-soap_bg_link_oeminfo.jpg) left top no-repeat;
	text-align: center;
}


.making-skincare .layout-wrapper {
	background: #f9f1ee;
}
.making-skincare .layout-body,
.making-skincare .layout-body .wrapper {
	background: none;
}
.making-skincare .layout-footer,
.making-skincare .layout-footer .wrapper {
	background: url(../img/making-skincare_bg_layout-footer.gif) left top repeat-x;
}

.making-skincare .content {
	padding-bottom: 20px;
}
.making-skincare .section p {
	margin: 0 10px 15px;
}

.making-skincare .column {
	margin: 10px 0 20px;
	background: url(../img/making_skincare_bg_column.gif) left top repeat-y;
}
.making-skincare .column-header {
	height: 6px;
	background: url(../img/making_skincare_bg_column_header.gif) left top no-repeat;
	font-size: 1px;
}
.making-skincare .column-footer {
	height: 6px;
	background: url(../img/making_skincare_bg_column_footer.gif) left top no-repeat;
	font-size: 1px;
}
.making-skincare .column p,
.making-skincare .column dl {
	margin: 10px 25px;
	line-height: 1.66;
}
.making-skincare .column p.image {
	margin: 3px 0;
	text-align: center;
}
.making-skincare .column dt {
	color: #F26200;
	font-weight: bold;
}

/* Q&A
--------------------------------------------------------- */

.qa .content {
	padding-bottom: 40px;
}

.qa .content-box-wrapper {
	background: url(../img/bg_content_box_wrapper.gif) left top repeat-y;
}
.qa .content-box {
	padding-top: 35px;
	background: url(../img/bg_content_box.jpg) left top no-repeat;
}
.qa .content-box-footer {
	height: 5px;
	background: url(../img/bg_content-box_footer.gif) left top no-repeat;
	font-size: 1px;
}

.qa .content-box dl.content-list {
	margin: 15px 20px 0;
}

/* CSR
--------------------------------------------------------- */
.csr .layout-wrapper {
	background: #f8f9fb;
}
.csr .layout-body,
.csr .layout-body .wrapper {
	background: url(../img/csr_bg_layout-body.jpg) left top no-repeat;
}
.csr .layout-footer,
.csr .layout-footer .wrapper {
	background: url(../img/csr_bg_layout-footer.gif) left top repeat-x;
}

.csr .content {
	padding-bottom: 20px;
}

.csr .lead * {
	font-size: 13px;
	line-height: 1.66;
}
.csr .lead h2 {
	margin:0;
	height: 55px;
	overflow: hidden;
}
.csr .sanwa-env {
	margin-bottom: 15px;
	height: 220px;
	overflow: hidden;
	background: url(../img/csr_bg_sanwa-env.jpg) left top no-repeat;
}
.csr .sanwa-env p {
	margin: 15px 0 0 15px ;
	width: 480px;
}
.csr .philosophy {
	height: 130px;
	overflow: hidden;
	background: url(../img/csr_bg_philosophy.jpg) left top no-repeat;
}
.csr .philosophy p {
	margin: 15px 15px 0 ;
}

.csr .shishin {
	margin-bottom: 30px;
}
.csr .shishin .image {
	margin: 0;
}

.csr .section .section-box {
	margin: 0 auto;
	margin-bottom: 15px;
	width: 760px;
}

.csr .section .section-box .text {
	width: 500px;
}
.csr .section .section-box .image {
	width: 215px;
}
.csr .section .section-box .text h3 {
	margin-bottom: 10px;
	font-size: 1px;
}
.csr .section .section-box .text p {
	margin: 0;
}


/* OEM
--------------------------------------------------------- */

.oem .content {
	padding-bottom: 40px;
}

.oem .lead {
	background: url(../img/oem_bg_lead.gif) left top repeat-y;
}
.oem .lead-content {
	background: url(../img/oem_bg_lead_content.jpg) left top no-repeat;
}
.oem .lead-footer {
	height: 4px;
	background: url(../img/oem_bg_lead_footer.gif) left top no-repeat;
	font-size: 1px;
}
.oem .lead-content h2 {
	margin-bottom: 10px;
}
.oem .lead-content p {
	margin: 0 15px 5px;
}

.oem .section {
	margin-bottom: 15px;
}

.oem .section .text {
	width: 535px;
}
.oem .section .image {
	width: 225px;

}
.oem .section .text p {
	margin: 0 10px;
}

.oem .section .image img {
	padding-right: 10px;
}

.oem .oeminfo {
	padding-top: 20px;
}
.oem .oeminfo li {
	text-align: center;
}

/* Company
--------------------------------------------------------- */
.company .layout-wrapper {
	background: #ecfcfc;
}
.company .layout-body,
.company .layout-body .wrapper {
	background: url(../img/bg_layout-body_b.jpg) left top no-repeat;
}
.company .layout-footer,
.company .layout-footer .wrapper {
	background: url(../img/bg_layout-footer_b.gif) left top repeat-x;
}

.company .content {
	padding-bottom: 40px;
}

.company .content-box-wrapper {
	background: url(../img/company_bg_content_box_wrapper.gif) left top repeat-y;
}
.company .content-box {
	padding-top: 15px;
	background: url(../img/company_bg_content_box.jpg) left top no-repeat;
}
.company .content-box-footer {
	height: 5px;
	background: url(../img/company_bg_content-box_footer.gif) left top no-repeat;
	font-size: 1px;
}

.company .lead {
	width: 100%;
	overflow: hidden;
}
.company .lead .lead-title {
	width: 545px;
}
.company .lead .lead-title p {
	margin: 0 15px 20px;
}
.company .lead .lead-image {
	width: 230px;
}
.company .lead .lead-image p {
	margin: 5px 20px 0 7px;
}
.company .lead .lead-text {
	width: 545px;
}

.company .lead .lead-text p {
	margin: 0 15px;
}
.company .lead .lead-text .president {
	margin-top: 1em;
	text-align: right;
}

.company .section-box {
	padding-bottom: 10px;
}
.company .section .text {
	width: 445px;
}
.company .section .text h3 {
	margin: 15px;
	font-size: 125%;
}
.company .section .text dl {
	margin: 0 15px 15px;
	width: 415px;;
	overflow: hidden;
	line-height: 1.66;
}
.company .section .text dl.company-info-1,
.company .section .text dl.company-info-2 {
	padding-bottom: 15px;
	border-bottom: 1px #333 dotted;
}
.company .section .text dl dt {
	float: left;
	clear: both;
	width: 7.5em;
	font-weight: bold;
}
.company .section .text dl dd {
	margin-left: 7.5em;
}

.company .section .map {
	width: 330px;
}
.company .section .map dl {
	margin: 0 20px 0 7px;
}
.company .section .map dt {
	font-weight: bold;
}
.company .section .map dd {
	margin-bottom: 15px;
}


/* Recruit
--------------------------------------------------------- */

.recruit .content {
	padding-bottom: 40px;
}

.recruit .content-box-wrapper {
	background: url(../img/recruit_bg_content_box_wrapper.gif) left top repeat-y;
}
.recruit .content-box {
	background: url(../img/recruit_bg_content_box.jpg) left top no-repeat;
}
.recruit .content-box-footer {
	height: 5px;
	background: url(../img/recruit_bg_content-box_footer.gif) left top no-repeat;
	font-size: 1px;
}

.recruit .lead {
	margin: 0;
}
.recruit .lead .message {
	margin: 0;
	padding: 26px 42px 26px 76px;
	height: 127px;
	overflow: hidden;
}
.recruit .lead h2 {
	margin-left: 20px;
	margin-bottom: 20px;
}
.recruit .lead p {
	margin: 0 25px 30px;
}

.recruit .section-box {
	padding-bottom: 10px;
}
.recruit .section .text {
	width: 545px;
}
.recruit .section .text dl.table-list {
	margin: 0 15px 0 25px;
	width: 505px;;
	overflow: hidden;
	line-height: 2.0;
}
.recruit .section .text dl.table-list dt {
	float: left;
	clear: both;
	width: 7em;
	font-weight: bold;
}
.recruit .section .text dl.table-list dd {
	margin-left: 7em;
}
.recruit .section .text .goto-form {
	margin: 0 15px 20px 0;
	text-align: right;
}

.recruit #recruit-form {
	margin: 0 15px 0 25px;
	width: 505px;;
	overflow: hidden;
	line-height: 2.0;
}

.recruit #recruit-form .form-info {
	line-height: 1.33;
	margin-bottom: 20px;
}
.recruit #recruit-form .form-info dt {
	font-weight: bold;
}
.recruit #recruit-form .contact-tel {
	margin-top: 1em;
}

.recruit .section .column {
	width: 230px;
}
.recruit .section .column dl {
	margin: 0 20px 1em 7px;
	line-height: 1.33;
}
.recruit .section .column dt {
	margin-bottom: 2px;
	font-weight: bold;
	color: #F26200;
}
.recruit .section .column dd {
	padding-bottom: 5px;
}

/* Contact
--------------------------------------------------------- */

.contact .content {
	padding-bottom: 40px;
}

.contact .content-box-wrapper {
	background: url(../img/bg_content_box_wrapper.gif) left top repeat-y;
}
.contact .content-box {
	padding-top: 35px;
	width: 780px;
	background: url(../img/bg_content_box.jpg) left top no-repeat;
}
.contact .content-box-footer {
	height: 5px;
	background: url(../img/bg_content-box_footer.gif) left top no-repeat;
	font-size: 1px;
}

.contact .section {
	padding: 15px 20px;
	width: 740px;
}
.contact .section h2 {
	margin-bottom: 5px;
	font-size: 115%;
	height: auto;
}
.contact .section h3 {
	margin: 0.8em 0 0;
	color: #F26200;
	font-size: 100%;
	font-weight: bold;
}
.contact .section p {
	margin: 0 ;
	line-height: 1.66;
}
.contact .section dt {
	margin: 0 ;
	line-height: 1.66;
}
.contact .section dd {
	margin: 0 ;
	line-height: 1.66;
}
.contact .section li {
	margin: 0 ;
	line-height: 1.66;
}

.contact .section p.date {
	text-align: right;
}

.contact .mail-form{
	margin: 20px 0;
}



.mail-form table th,
.mail-form table td {
	padding: 2px 4px;
}
.mail-form table th {
	vertical-align: top;
	text-align: left;
}
.mail-form form input {
	padding: 1px;
}
.mail-form form option {
	padding: 0 5px;
}