﻿@charset "utf-8";

/* ----------------------------------------
 common
---------------------------------------- */
html,body{height:100%;}
body{
	line-height:1.7;
	color:#4d4d4d;
	font-size:14px;
	font-family:Tahoma,Arial,Verdana,Helvetica,sans-serif;
}
h1,h2,h3,h4,h5,h6,p{
	margin:0;
	padding:0;
}
a{
	color:#4d4d4d;
	text-decoration:underline;
}
a:hover{
	color:#f00;
	text-decoration:underline;
}
img{vertical-align:top;}

.clearfix {zoom:1;}
.clearfix:after{
	content: ""; 
	display: block; 
	clear: both;}
.fl{float:left;}
.fr{float:right;}
.clear{clear:both;}

/* ----------------------------------------
 header
---------------------------------------- */
#header{
	margin:0 0 30px;
	width:100%;
}
#header-i{
	width:100%;
	height:70px;
	color:#fff;
	background-color:#353399;
	position:relative;
}
#header-i a{
	color:#fff;
}
#logo{
	position:absolute;
	top:26px;
	left:32px;
}
#lang{
	margin:0;
	padding:0;
	height:1%;
	list-style:none;
	position:absolute;
	top:8px;
	right:32px;
}
#lang li{
	padding:0 0 0 18px;
	float:left;
	color:#7271b8;
	background:url(../img_com/header/h_line.gif) repeat-y 8px 0;
	font-size:86%;
}
#lang li.start{
	padding:0;
	background:none;
}
#lang li a{
	color:#fff;
	text-decoration:underline;
}
#lang li a:hover{
	color:#7271b8;
	text-decoration:underline;
}
#h-nav{
	margin:0;
	padding:0;
	height:1%;
	list-style:none;
	position:absolute;
	top:36px;
	right:222px;
}
#h-nav li{
	padding:0 0 0 10px;
	float:left;
	color:#fff;
	font-size:86%;
}
#h-nav li a{
	color:#fff;
	text-decoration:underline;
}
#h-nav li a:hover{
	color:#7271b8;
	text-decoration:underline;
}
#h-nav li a.blank{
	padding-right:16px;
	background:url(../img_com/header/icon_blank.gif) no-repeat right center;
}
#search-box{
	position:absolute;
	top:30px;
	right:32px;
	width:182px;
	height:28px;
	background:url(../img_com/header/bg_search.jpg) left top;
}
#search-box input{vertical-align:middle;}
.searchBox{
	border:0;
	background:none;
	width:134px;
	height:27px;
	line-height:27px;
}
#main-image{
	width:100%;
	height:130px;
	background:#fcfcfc url(../img_com/en/header/main_image.jpg) no-repeat center top;
}
#main-image span{visibility:hidden;}


/* ----------------------------------------
 main
---------------------------------------- */
#main{
	padding-bottom:20px;
	width:100%;
	zoom:1;
}
#main:after{
	content: ""; 
	display: block; 
	clear: both;}

/* ----------------------------------------
 contentes
---------------------------------------- */
.mb14{margin-bottom:14px;}
.mb20{margin-bottom:20px;}
.mb32{margin-bottom:32px;}
#contents{
	margin:0 422px 0 32px;
}
#contents-i{
	float:left;
	width:100%;
}
.clm-2{width:100%;}
.clm-2 .box-1{width:48%;}
.clm-3{width:100%;}
.clm-3 .box-1{width:31%;}
.clm-3 .ml{margin-left:3.5%;}
.clm-bnr{
	margin:0;
	padding:0;
	list-style:none;
}
.clm-bnr li{
	margin:0 12px 0 0;
	padding:0 0 14px;
	float:left;
	width:220px;
}
.clm-bnr li img{vertical-align:top;}
.title{
	margin:0 0 8px;
	font-size:0;
}
.title-1{
	margin:0 0 14px;
	font-size:0;
}
.title-1 span{
	padding:15px 0;
	display:block;
}
.title-1 img{
	vertical-align:top;
}
#title-1{
	border:1px #3ba2cc solid;
	background:url(../img/en/title_1_bg.jpg) repeat-x left center;
}
#title-1 span{background:url(../img/en/title_1_ph_bg.jpg) no-repeat right center;}
#title-2{
	border:1px #b53f7e solid;
	background:url(../img/en/title_2_bg.jpg) repeat-x left center;
}
#title-2 span{background:url(../img/en/title_2_ph_bg.jpg) no-repeat right center;}
#title-3{
	border:1px #7355b5 solid;
	background:url(../img/en/title_3_bg.jpg) repeat-x left center;
}
#title-3 span{background:url(../img/en/title_3_ph_bg.jpg) no-repeat right center;}
#title-4{
	border:1px #8c6239 solid;
	background:url(../img/en/title_4_bg.jpg) repeat-x left center;
}
#title-4 span{background:url(../img/en/title_4_ph_bg.jpg) no-repeat right center;}
.box-1 h3{
	margin:0 0 14px;
	background:url(../img/title_line_bg.jpg) repeat-x left bottom;
}
.box-1 h3.title-box{
	width:100%;
	font-size:0;
}
.box-1 h3.title-box .fl{width:142px;}
.box-1 h3.title-box .fr{padding-top:10px;width:36px;}


.box-1 ul{
	margin:0;
	padding:0;
	list-style:none;
}
.box-1 ul li{
	margin:0;
	padding:0 0 8px 12px;
	background:url(../img/icon_list.gif) no-repeat 5px 7px;
	line-height:1.2;
}
.box-1 ul li a{
	color:#4d4d4d;
	text-decoration:none;
}
.box-1 ul li a:hover{
	color:#4d4d4d;
	text-decoration:underline;
}

/* ----------------------------------------
 side
---------------------------------------- */
#side{
	margin-right:32px;
	float:right;
	width:350px;
}
#s-pr-box{
 margin:0 0 26px;
	padding:16px;
	border:4px #d6d6d6 solid;
	background-color:#f7f7f7;
}
.s-pr-box-i{
	width:100%;
}
.s-pr-box-i dl{
	margin:0;
	padding:0;
	width:212px;
}
.s-pr-box-i dt{
	margin:0;
	padding:0;
	line-height:1.2;
	color:#005f96;
	font-weight:bold;
}
.s-pr-box-i dt a{
	color:#005f96;
	text-decoration:underline;
}
.s-pr-box-i dt a:hover{
	color:#f00;
	text-decoration:underline;
}
.s-pr-box-i dd{
	margin:0;
	padding:0;
	line-height:1.4;
	font-size:86%;
}
.s-pr-ph{
	width:82px;
}
.title-s-1{
	margin-bottom:16px;
	padding:0 0 4px;
	border-bottom:1px #e8e8e8 solid;
	font-size:0;
}
.title-s-1 img{vertical-align:top;}
.title-s-1 .ml{margin-left:6px;}
.list-s-1{
	margin:0 0 20px;
	padding:0;
	list-style:none;
}
.list-s-1 li{
	margin:0;
	padding:0 0 12px;
	line-height:1.2;
}
.list-s-1 li a{
	color:#005f96;
	text-decoration:underline;
}
.list-s-1 li a:hover{
	color:#f00;
	text-decoration:underline;
}

/* ----------------------------------------
 footer
---------------------------------------- */
#page-top{
	margin:0 32px 6px;
	text-align:right;
}
#page-top img{vertical-align:top;}
#footer{
	width:100%;
	padding:22px 0;
	color:#fff;
	background-color:#353399;
}
#f-box-l{
	margin-left:32px;
	float:left;
	width:480px;
}
.address-box{
	width:480px;
}
.address-box .fl{
	width:220px;
}
.address-box .fr{
	width:260px;
}
#f-box-l h2{margin-bottom:8px;}
#f-box-l p{
	line-height:1.6;
	font-size:86%;
}
#f-box-l p.f-email{
	font-size:100%;
}
#f-box-l p a{
	color:#fff;
	text-decoration:underline;
}
#f-box-l p a:hover{
	color:#7271b8;
	text-decoration:underline;
}
.icon-email{margin-right:6px;vertical-align:middle;}
#f-box-r{
	margin-right:32px;
	float:right;
	width:430px;
	position:relative;
}
#f-btn{
	margin:0;
	padding:0;
	height:32px;
	list-style:none;
	position:absolute;
	top:0;
	right:0;
}
#f-btn li{
	margin:0 0 0 4px;
	padding:0;
	float:left;
}
#f-btn li img{vertical-align:top;}
#f-nav{
	margin:0;
	padding:0;
	list-style:none;
	position:absolute;
	top:46px;
	right:0;
	height:1%;
}
#f-nav li{
	padding:0 0 0 18px;
	float:left;
	color:#7271b8;
	background:url(../img_com/header/h_line.gif) repeat-y 8px 0;
	font-size:86%;
}
#f-nav li.start{
	padding:0;
	background:none;
}
#f-nav li.no-border{
	background:none;
}
#f-nav li a{
	color:#fff;
	text-decoration:underline;
}
#f-nav li a:hover{
	color:#7271b8;
	text-decoration:underline;
}
#f-nav li a.blank{
	padding-right:16px;
	background:url(../img_com/header/icon_blank.gif) no-repeat right center;
}
#copyright{
	padding:12px 32px;
	color:#000;
	background-color:#eaeaf5;
	font-size:86%;
	text-align:center;
}
#copyright a{
	color:#000;
	text-decoration:underline;
}
#copyright a:hover{
	color:#f00;
	text-decoration:underline;
}

/* ----------------------------------------
 2nd インターフェイス
---------------------------------------- */
/* header */
.wrapper #header{
	margin:0 0 20px;
}

/* contents */
.wrapper #contents{
	margin:0 32px 0 316px;
}
.nav-top{
	height:24px;
	line-height:20px;
	text-align:right;
}
.nav-top a{
	color:#000;
	text-decoration:underline;
}
.nav-top a:hover{
	color:#f00;
	text-decoration:underline;
}
#contents-title{
	margin:0 0 20px;
	padding:12px 18px;
	line-height:1.2;
	font-size:143%;
}

/* side */
.wrapper #side{
	margin:0 0 0 32px;
	float:left;
	width:256px;
}
.s-nav-title{
	margin:0;
	padding:0;
	height:24px;
}
.s-nav-title img{padding-top:8px;}
.s-nav{
	border:1px #ededed solid;
}
.s-nav h3{
	padding:12px 10px;
	line-height:1.2;
	color:#000;
	background-color:#ededed;
	font-size:114%;
}
.s-nav h3 span{
	padding-left:8px;
	display:block;
}
.s-nav ul{
	margin:0;
	padding:12px 14px;
	list-style:none;
}
.s-nav ul li{
	margin:0;
	padding:4px 0 4px 12px;
	background:url(../img/icon_list.gif) no-repeat 5px 11px;
	line-height:1.2;
}
.s-nav ul li a{
	color:#4d4d4d;
	text-decoration:none;
}
.s-nav ul li a:hover{
	color:#4d4d4d;
	text-decoration:underline;
}

/* カラーリング */
/* ptn1 */
.ptn1 #contents-title{
	color:#fff;
	background-color:#3ba2cc;
}
.ptn1 .s-nav h3 span{
	border-left:7px #3ba2cc solid;
}

/* ptn2 */
.ptn2 #contents-title{
	color:#fff;
	background-color:#b53f7e;
}
.ptn2 .s-nav h3 span{
	border-left:7px #b53f7e solid;
}

/* ptn3 */
.ptn3 #contents-title{
	color:#fff;
	background-color:#7355b5;
}
.ptn3 .s-nav h3 span{
	border-left:7px #7355b5 solid;
}

/* ptn4 */
.ptn4 #contents-title{
	color:#fff;
	background-color:#8c6239;
}
.ptn4 .s-nav h3 span{
	border-left:7px #8c6239 solid;
}

/* ptn5 */
.ptn5 #contents-title{
	color:#fff;
	background-color:#fce858;
}
.ptn5 .s-nav h3 span{
	border-left:7px ##fce858 solid;
}

/* ptn6 */
.ptn6 #contents-title{
	color:#fff;
	background-color:#85b1bc;
}
.ptn6 .s-nav h3 span{
	border-left:7px #85b1bc solid;
}

/* ptn7 */
.ptn7 #contents-title{
	color:#fff;
	background-color:#7355b5;
}
.ptn7 .s-nav h3 span{
	border-left:7px #7355b5 solid;
}

/* ptn8 */
.ptn8 #contents-title{
	color:#fff;
	background-color:#85b1bc;
}
.ptn8 .s-nav h3 span{
	border-left:7px #85b1bc solid;
}

/* ptn9 */
.ptn9 #contents-title{
	color:#fff;
	background-color:#808080;
}
.ptn9 .s-nav h3 span{
	border-left:7px #808080 solid;
}

/* ptna */
.ptna #contents-title{
	color:#fff;
	background-color:#54ab97;
}
.ptna #contents-title2{
	color:#fff;
	background-color:#94cbb2;
}
