@charset "utf-8";

/*
======== table of content. =================================

summary:BIG JOHNの歴史ページ用レイアウト定義

-CONTENT

-MAIN
  - MAIN RIGHT
  	

============================================================
div.brandhistory 
*/

div.brandhistory  h3{
	clear:both;
}

div.brandhistory p.intro{
	width:695px;
	margin:30px auto;
}

div.brandhistory div#main{
	width:695px;
	margin:0 auto;
}

div.brandhistory div#main div.history{
	width:695px;
	background:url(../history/images/line.gif) repeat-y 5px top;
	margin-bottom:50px;
}


div.brandhistory div#main div.history ul{
	width:689px;
	margin-left:5px;
}

div.brandhistory div#main div.history ul li{
	float:left;
}

div.brandhistory div#main div.history h4{
	clear:both;
	margin-bottom:15px;
}

div.brandhistory div#main div.history h4.long{
	width:658px;
	padding:40px 0 15px 33px;
	background-image: url(../history/images/bg_red_long.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

div.brandhistory div#main div.history h4.short{
	width:356px;
	padding:40px 0 15px 33px;
	background:url(../history/images/bg_year_short.gif) no-repeat left bottom;
}


div.brandhistory div#main div.history div.section{
	width:658px;
	padding:0 0 15px 33px;
	position:relative;
}

div.brandhistory div#main div.history div.section dl.sec01 dt{
	margin-bottom:30px;
}

div.brandhistory div#main div.history div.section div.jeans{
	width:325px;
	margin:35px 0 0 25px;
	clear:both;
}

div.brandhistory div#main div.history div.section div.jeans p.jeansimg{
	width:150px;
	float:left;
}

div.brandhistory div#main div.history div.section div.jeans dl{
	width:168px;
	float:left;
}

div.brandhistory div#main div.history  div.section div.jeans dl dd{
	font-size:84%;
	padding-top:10px;
}



/* H1940 
------------------------------------------------------
*/

/* H1940 
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1940 {
}
div.brandhistory div#main div.history div.h1940 p.phototxt{
	position:absolute;
	top:392px;
	left:393px;
}
div.brandhistory div#main div.history div.h1940 dl{
}
div.brandhistory div#main div.history div.h1940 dt{
	float: left;
	width: 50px;
}
div.brandhistory div#main div.history div.h1940 dd{
}
div.brandhistory div#main div.history div.h1940 ul{
	clear: both;
}
div.brandhistory div#main div.history div.h1940 li{
	display: inline;
	float: left;
	padding-right: 20px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}
/* H1950 
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1950 {
}
div.brandhistory div#main div.history div.h1950 p.phototxt{
	position:absolute;
	top:392px;
	left:393px;
}
div.brandhistory div#main div.history div.h1950 dl{
}
div.brandhistory div#main div.history div.h1950 dt{
	float: left;
	width: 50px;
}
div.brandhistory div#main div.history div.h1950 dd{
}
div.brandhistory div#main div.history div.h1950 ul{
	clear: both;
}
div.brandhistory div#main div.history div.h1950 li{
	display: inline;
	float: left;
	padding-right: 30px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}

/* H1960 
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1960 {
}
div.brandhistory div#main div.history div.h1960 p.phototxt{
	position:absolute;
	top:392px;
	left:393px;
}
div.brandhistory div#main div.history div.h1960 dl{
	clear: both;
	width: 650px;
	margin-bottom: 10px;
}
div.brandhistory div#main div.history div.h1960 dt{
	float: left;
	width: 50px;
}
div.brandhistory div#main div.history div.h1960 dd{
	float: left;
	width: 600px;
}
div.brandhistory div#main div.history div.h1960 ul{
	clear: both;
	padding-top: 8px;
}
div.brandhistory div#main div.history div.h1960 li{
	display: inline;
	float: left;
	padding-right: 15px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}
div.brandhistory div#main div.history div.h1960 .pic {
	clear: both;
}
div.brandhistory div#main div.history div.h1960 .pic ul{
	clear: both;
}
div.brandhistory div#main div.history div.h1960 .pic  li{
	display: inline;
	float: left;
	padding-right: 100px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}
/* H1970 
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1970 {
}
div.brandhistory div#main div.history div.h1970 p.phototxt{
	position:absolute;
	top:392px;
	left:393px;
}
div.brandhistory div#main div.history div.h1970 dl{
	width: 650px;
	clear: both;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
div.brandhistory div#main div.history div.h1970 dt{
	float: left;
	width: 50px;
}
div.brandhistory div#main div.history div.h1970 dd{
	width: 600px;
	float: left;
}
div.brandhistory div#main div.history div.h1970 ul{
	clear: both;
}
div.brandhistory div#main div.history div.h1970 li{
	display: inline;
	float: left;
	padding-right: 15px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}
div.brandhistory div#main div.history div.h1970 .pic ul{
	clear: both;
}
div.brandhistory div#main div.history div.h1970 .pic  li{
	display: inline;
	float: left;
	padding-right: 100px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}

/* H1980 
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1980 {
}
div.brandhistory div#main div.history div.h1980 p.phototxt{
	position:absolute;
	top:392px;
	left:393px;
}
div.brandhistory div#main div.history div.h1980 dl{
	clear: both;
	padding-bottom: 8px;
}
div.brandhistory div#main div.history div.h1980 dt{
	float: left;
	width: 50px;
}
div.brandhistory div#main div.history div.h1980 dd{
}
div.brandhistory div#main div.history div.h1980 ul{
	clear: both;
}
div.brandhistory div#main div.history div.h1980 li{
	display: inline;
	float: left;
	padding-right: 40px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}
/* H1990 
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1990 {
}
div.brandhistory div#main div.history div.h1990 p.phototxt{
	position:absolute;
	top:392px;
	left:393px;
}
div.brandhistory div#main div.history div.h1990 dl{
	clear: both;
	width: 650px;
}
div.brandhistory div#main div.history div.h1990 dt{
	float: left;
	width: 50px;
}
div.brandhistory div#main div.history div.h1990 dd{
	float: left;
	width: 600px;
}
div.brandhistory div#main div.history div.h1990 ul{
	clear: both;
}
div.brandhistory div#main div.history div.h1990 li{
	display: inline;
	float: left;
	padding-right: 40px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}
div.brandhistory div#main div.history div.h1990 dl img{
	border:0;
	vertical-align:top;
}

/* H2000 
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h2000 {
	background-image: url(../history/images/bg_history_2000.gif);
	background-repeat: no-repeat;
	background-position: right top;
}
div.brandhistory div#main div.history div.h2000 p.phototxt{
	position:absolute;
	top:392px;
	left:393px;
}
div.brandhistory div#main div.history div.h2000 dl{
	clear: both;
	width: 650px;
}
div.brandhistory div#main div.history div.h2000 dt{
	float: left;
	width: 50px;
}
div.brandhistory div#main div.history div.h2000 dd{
	width: 600px;
	float: left;
}
div.brandhistory div#main div.history div.h2000 ul{
	clear: both;
	padding-top: 30px;
}
div.brandhistory div#main div.history div.h2000 li{
	display: inline;
	float: left;
	padding-right: 20px;
	padding-bottom: 20px;
	line-height: 140%;
	font-size: 84%;
}
/* HAW 
------------------------------------------------------
*/

div.brandhistory div#main div.history div.haw {
	background:url(../history/images/bg_history_aw.jpg) no-repeat right top;
	padding-bottom:5px;

}


div.brandhistory div#main div.history div.haw p.phototxt{
	position:absolute;
	top:380px;
	left:420px;
}




/* H1963
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1963{
	background:url(../history/images/bg_history_1963.jpg) no-repeat right top;
	padding-bottom:0;
}

div.brandhistory div#main div.history div.h1963 div.jeans{
	margin-top:20px;
}

div.brandhistory div#main div.history div.h1963 div.sec02 p.jeansimg{
	width:153px;
}


div.brandhistory div#main div.history div.h1963 p.phototxt{
	position:absolute;
	top:335px;
	left:420px;
}




/* H1964
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1967 {
	background:url(../history/images/bg_history_1964.jpg) no-repeat right top;
	margin:0 0 15px 0;
}


div.brandhistory div#main div.history div.h1967 dl.sec03{
	position:absolute;
	top:324px;
	left:225px;
}


div.brandhistory div#main div.history div.h1967 dl.sec03 dd{
	width:240px;
	position:absolute;
	top:100px;
	left:192px;
	font-size:84%;
}



/* H1968
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h1968 {
	background:url(../history/images/bg_history_1968.jpg) no-repeat right top;
	padding-bottom:300px;
}

div.brandhistory div#main div.history div.h1968 div.sec02 p.jeans{
	width:140px;
}

div.brandhistory div#main div.history div.h1968 div.sec02 {
	width:400px;
}


div.brandhistory div#main div.history div.h1968 div.sec02 p.label{
	padding-top:45px;

}


div.brandhistory div#main div.history div.h1968 div.sec02 dl{
	margin:0 0 0 15px;
}


div.brandhistory div#main div.history div.h1968 dl.sec03{
	position:absolute;
	top:205px;
	left:477px;
}

div.brandhistory div#main div.history div.h1968 dl.sec03 {
	width:170px;
}

div.brandhistory div#main div.history div.h1968 dl.sec03 dt{
	text-align:center;
}

div.brandhistory div#main div.history div.h1968 dl.sec03 dd{
	font-size:92%;
	line-height:1.4;
	padding-top:10px;
}

div.brandhistory div#main div.history div.h1968 div.sec04{
	width:350px;
	position:absolute;
	top:500px;
	left:30px;
}

div.brandhistory div#main div.history div.h1968 div.sec04 p.jeansimg{
	width:170px;
}

div.brandhistory div#main div.history div.h1968 div.sec05{
	position:absolute;
	top:500px;
	left:400px;
}

div.brandhistory div#main div.history div.h1968 div.sec05 p.jeansimg{
	width:95px;
}



/* H2010
------------------------------------------------------
*/

div.brandhistory div#main div.history div.h2010 {
	background:url(../history/images/line_end.gif) no-repeat 5px bottom;
	padding-bottom:25px;
}

div.brandhistory div#main div.history div.h2010 dl {
	width:645px;
	padding:10px 0 0 0;
}

div.brandhistory div#main div.history div.h2010 p.mark{
	width:140px;
	float:left;
	margin:0;
	padding:0;
}

div.brandhistory div#main div.history div.h2010 dl{
	width:505px;
	float:right;
	paddint:0 0 0 0;
}

div.brandhistory div#main div.history div.h2010 dl dd{
	padding:10px 0 0 2px;
}
.txt_r {
	padding-top: 3px;
	float: left;
}
* html .txt_b {
	padding-top: -3px;
	float: left;
}
.txt_b {
	float: left;
}
div.brandhistory div#main div.history div.h1990 img{
	border:0;
	vertical-align:top;
}

