@charset "utf-8";
/* CSS Document */





/*---- header setting ----*/


#header .left {width: 65%;}
#logo {width: 25%;}
#header .left p {width: 75%;}
#header .float_r {width: 35%;}

/*-- logo --*/

#logo,
.left p {float: left;}


/*-- search --*/

#header input.txtFld {
	width: 45%;
}



@media screen and (max-width: 768px){
	
	#header .left,
	#header .float_r {width: 100%;}
	
	#header #logo img {margin-left: 5px;}
	
	#header .float_r {
		margin: 10px 0;
		text-align: left;
	}
	
	#header .nav,
	#header .txt_size,
	#header form {display: inline;}
	
	#header .txt_size {margin: 0 10px;}
	
	#header .nav {
		padding: 5px;
		margin: 0 10px;
		font-size: 90%;
	}
	#header .nav a {margin: 0 5px;}
	
	
	#header input.txtFld {width: 15%;}
	
}



/*---- carousel setting ----*/


#carousel {
	background: url(../img/index/bnr_bg.gif);
	padding: 20px 0;
	border-bottom: 1px solid #eee;
}


#carousel:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}


#carousel .outline {max-width: 1020px;padding: 0 20px;}



#mycarousel li {
	margin-right: 20px;
	width: auto;
}

@media screen and (max-width: 1048px){
	#carousel .outline {
		padding: 0 25px;
		}
}

/*---- contents area ----*/


/*-- h2 --*/


#maincontent h2 {
	font-size: 120%;
	color: #fff;
	padding: 13px 10px 13px 45px;
	margin: 20px 0;
}

@media screen and (max-width: 768px){
	#maincontent h2 {
		margin: 20px 5px;
	}
	#maincontent #pictogram {
		margin: 0 5px;
	}
	#maincontent #pictogram h2 {
		margin: 20px 0;
	}
}


/*---- pictogram setting ----*/


#pictogram{
	background: #fef8e2;
	padding-bottom: 3%;
}

#pictogram.open1,
#pictogram.open2,
#pictogram.open3,
#pictogram.open4,
#pictogram.open5 {padding-bottom: 1%;}

#pictogram .menu {margin: 3% 0% 0% 3%;}

#pictogram .menu:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

*+html #pictogram .menu {display: inline-block;}

#pictogram .menu li {
	float: left;
	width: 18%;
	margin-right: 2%;
}

*+html #pictogram .menu li {
	margin-right: 1%;
}

#pictogram .menu li img {
	max-width: 100%;
	position: relative;
	z-index: 1;
}

#pictogram.open1 .menu li img#pict1 {z-index: 3;}
#pictogram.open2 .menu li img#pict2 {z-index: 3;}
#pictogram.open3 .menu li img#pict3 {z-index: 3;}
#pictogram.open4 .menu li img#pict4 {z-index: 3;}
#pictogram.open5 .menu li img#pict5 {z-index: 3;}


#pictogram h2 {background: #3c5fba url(../img/index/icon_search.gif) no-repeat 10px 50%;}


.contents_list #menu1,
.contents_list #menu2,
.contents_list #menu3,
.contents_list #menu4,
.contents_list #menu5 {display: none;}

.contents_list {
	display: none;
	margin: 0 2.6% 0 3%;
	background: #fff;
	padding: 1% 1% 1% 2%;
	position: relative;
	z-index: 2;
	top: -11px;
}

*+html .contents_list {
	padding: 1% 1% 15px 2%;
}

@media screen and (max-width: 768px){
	.contents_list {
		top: -8px;
	}
}


.contents_list h3 {margin: 12px 0 0;}

.contents_list .float_r ul {margin: 12px 15px 20px;}

.contents_list #menu2 .float_r ul,
.contents_list #menu3 .float_r ul,
.contents_list #menu4 .float_r ul {
	margin-bottom: 80px;
}

.contents_list .float_r ul li {
	margin: 0 20px 10px 0;
	background: url(../img/common/arrow02.gif) no-repeat 0 0.1em;
	padding-left: 20px;
	float: left;
}

*+html .contents_list .float_r ul li {
	width: 43%;
}


.contents_list a.lnk1 {
	position: absolute;
	bottom :1%;
	left: 2%;
}

*+html .contents_list #menu2 a.lnk1 {
	position: relative;
}

#maincontent .contents_list .left {width: 22%;}
#maincontent .contents_list .float_r {width: 78%;}

@media screen and (max-width: 768px){
	.contents_list h3 img {max-width: 100%;}
	#maincontent .contents_list .float_r {width: 75%;}
}

/*---- news topics ----*/


#news h2 {
	clear: both;
	position: relative;
	background: #3c5fba url(../img/index/icon_note.gif) no-repeat 10px 50%;
}
#news h2 img {
	top: 12px;
	right: 12px;
	position: absolute;
}

#topics {clear: both;}

#topics h2 {background: #3c5fba url(../img/index/icon_note.gif) no-repeat 10px 50%;}


#news ul {margin: 20px 15px;}

#news .clear_fix {padding-right: 10px;float: right;margin-bottom: 15px;}

#news li {
	padding: 9px 0px 4px 40px;
	margin-bottom: 5px;
	background: url(../img/index/pict0_s.gif) no-repeat 0 0.4em;
}
#news li.keiei {background: url(../img/index/pict1_s.gif) no-repeat 0 0.4em;}
#news li.kinyu {background: url(../img/index/pict2_s.gif) no-repeat 0 0.4em;}
#news li.zaimu {background: url(../img/index/pict3_s.gif) no-repeat 0 0.4em;}
#news li.shogyo {background: url(../img/index/pict4_s.gif) no-repeat 0 0.4em;}
#news li.soudan {background: url(../img/index/pict5_s.gif) no-repeat 0 0.4em;}


#topics ul {margin: 20px 15px;}

#topics li {
	margin-bottom: 10px;
	padding-left: 25px;
	background: url(../img/common/arrow02.gif) no-repeat 0 0.2em;
}



/*---- pickup ----*/


#pickup h2 {
	padding: 13px 10px 13px 40px;
	background: #3c5fba url(../img/index/icon_pickup.gif) no-repeat 7px 50%;
}

#pickup li {
	text-align: center;
	margin: 0px 5px 15px;
}

#pickup li img {
	max-width: 100%;
	height: auto;
}


/*---- link ----*/


#link h2 {background: #3c5fba url(../img/index/icon_lnk.gif) no-repeat 10px 50%;}

#link li {
	text-align: center;
	margin: 0px 5px 10px;
}

#link li img {
	max-width: 100%;
	height: auto;
}


/*-- H3 --*/

#link h3 {
	border-left: 3px solid #3c5fba;
	border-bottom: 1px solid #3c5fba;
	padding: 5px 3px 5px 12px;
	font-size: 110%;
	margin: 15px 0px;
}
