@charset "utf-8";

/* ===== import common style ===== */
@import "base.css";
@import "font.css";




/* ===== basic style ===== */
body {
	text-align: center;
	background: url(../img/header_bg.gif) center top repeat-x;
}

.outline {
	margin: 0px auto;
	min-width: 800px;
	background: url(../img/footer_bg.gif) center bottom repeat-x;
}
.section {clear: both; margin: 0px auto; width: 800px; text-align: left; zoom: 1;}
.section:after {
	content: ".";
	display: block;
	clear: both;
	height: 0px;
	visibility: hidden;
}/* for modern browser */




/* ===== menu ===== */
/* head menu */
.headmenu {margin-bottom: 9px; height: 28px; font-size: 11px; line-height: 15px;}
.headmenu li {display: inline;}
.headmenu li a {
	display: -moz-inline-box;
	display: inline-block;
	margin: 6px -1px 0px 0px;
	padding: 0px 20px;
	border: 1px solid #FFB402;
	border-width: 0px 1px;
	color: #FFFFFF;
	zoom: 1;
}
.headmenu li a:visited,
.headmenu li a:hover,
.headmenu li a:active {color: #FFFFFF;}

/* foot menu */
.footmenu {clear: both; margin-top: 18px; padding: 26px 0px 15px; font-size: 12px; line-height: 18px;}
.footmenu li {display: inline;}
.footmenu li a {
	display: -moz-inline-box;
	display: inline-block;
	margin: 0px -1px 0px 0px;
	padding: 0px 12px;
	border: 1px solid #403F32;
	border-width: 0px 1px;
	color: #000000;
	text-decoration: none;
	zoom: 1;
}
.footmenu li a:visited,
.footmenu li a:hover,
.footmenu li a:active {color: #000000;}




/* ===== lead ===== */
#lead {padding-bottom: 10px; position: relative; font-size: 17px;}
#lead h1 {
	margin: 0px 0px 10px;
	height: 104px;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../img/title.png) left top no-repeat;
}
#lead h2 {
	margin: 0px 0px 12px;
	padding: 0px 15px;
	height: 34px;
	color: #FFFFFF;
	font-size: 21px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Mayryo", Arial, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
	line-height: 34px;
	background-color: #3F6187;
}
#lead p {margin: 0px 15px 15px; text-align: justify; text-justify: distribute;}
#lead p.emphasis {margin: 20px 18px 20px 45px; color: #FF3300; font-weight: bold; line-height: 1.4;}

/* main image */
#lead p.mainimage {margin: 0; width: 292px; height: 222px; position: absolute; right: 0px; top: 15px;}
	* html #lead p.mainimage {background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=img/cover.png,sizingMethod=crop);}
	* html #lead p.mainimage img {visibility: hidden;}

/* list */
#lead ul {margin: 0px 0px 15px 3em; color: #3F6187; list-style-type: disc;}
#lead ul li {}
#lead ul li span {color: #333333; font-size: 15px; line-height: 1.5;}




/* ===== example ===== */
#example {padding-bottom: 10px; font-size: 17px;}
#example p {margin: 0px 15px 15px; text-align: justify; text-justify: distribute;}
#example p.emphasis {margin: 20px 18px 20px 45px; color: #FF3300; font-weight: bold; line-height: 1.4;}

#example div {margin-bottom: 20px; padding: 2px; border: 3px solid #3F6187;}
#example div h2 {
	margin: 0px 0px 12px;
	padding: 0px 12px;
	height: 40px;
	color: #FFFFFF;
	font-size: 25px;
	font-weight: normal;
	line-height: 40px;
	letter-spacing: 1px;
	background: #3F6187;
}
#example div ul {margin: 0px 0px 0px 8px;}
#example div ul li {margin-bottom: 12px; padding-left: 104px; min-height: 100px; background: no-repeat left top;}
	* html #example div ul li {height: 100px;}
	#example div ul li.ex1 {background-image: url(../img/ex_face1.png);}
	#example div ul li.ex2 {background-image: url(../img/ex_face2.png);}
	#example div ul li.ex3 {background-image: url(../img/ex_face3.png);}

#example div ul li dl {padding: 2px 0px 0px; background: url(../img/ex_balloon_head.png) no-repeat 0px 2px;}
#example div ul li dl dt {
	display: -moz-inline-box;
	display: inline-block;
	margin-left: 20px;
	padding: 0px 30px 0px 10px;
	height: 36px;
	color: #AD7733;
	font-size: 17px;
	font-weight: bold;
	line-height: 36px;
	background: url(../img/ex_balloon_body.png) no-repeat right top;
}
	* html #example div ul li dl dt {display: inline; zoom: 1;}
	*:first-child+html #example div ul li dl dt {display: inline; zoom: 1;}
#example div ul li dl dd {
	margin: 7px 0px 0px 15px;
	height: 50px;
	text-indent: -10000px;
	overflow: hidden;
	background: no-repeat left top;
}
	#example div ul li.ex1 dl dd {background-image: url(../img/ex_ans1.png);}
	#example div ul li.ex2 dl dd {background-image: url(../img/ex_ans2.png);}
	#example div ul li.ex3 dl dd {background-image: url(../img/ex_ans3.png);}




/* ===== contents ===== */
#contents {margin: 18px auto;}


/* ----- item summary ----- */
#contents .summary {float: right; width: 484px;}
#contents .summary h2 {
	margin: 1em 0px 7px;
	padding: 3px 0px 0px 30px;
	color: #995500;
	font-size: 25px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Mayryo", Arial, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
	line-height: 29px;
	letter-spacing: -1px;
	background: url(../img/icon_board.gif) left top no-repeat;
}
	#contents .summary h2.first {margin-top: 0;}
#contents .summary p {margin: 0px 5px 1.2em; text-align: justify; text-justify: distribute;}

/* target link */
#contents .summary p.target {clear: both; margin: 0px 5px; padding-top: 20px; zoom: 1;}
#contents .summary p.target a {
	display: block;
	width: 470px;
	height: 70px;
	color: #000000;
	text-decoration: none;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../img/btn_target_set.png) left top no-repeat;
}


#contents .summary dl {
	display: -moz-inline-box;
	display: inline-block;
	/display: inline;
	float: right;
	text-align: right;
	zoom: 1;
}
#contents .summary dl dt {text-align: left;}
#contents .summary dl dd {padding-left: 10px; text-align: left;}


/* ----- item detail ----- */
#contents .detail {
	float: left;
	border: 2px solid #FFB402;
	border-width: 2px 0px;
	width: 304px;
	background: url(../img/items_bg.png) left bottom repeat-y;
}
#contents .detail h3 {
	margin: 0px 4px 0px;
	padding: 8px 6px 7px 10px;
	border-top: 2px solid #FFFFFF;
	color: #5A2E0A;
	font-size: 15px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Mayryo", Arial, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
	line-height: 20px;
	text-indent: -4px;
	background-color: #FFB402;
}

#contents .detail .set {
	margin: 0px 4px;
	padding: 16px 9px 10px;
	border-bottom: 2px solid #FFFFFF;
	color: #5A2E0A;
	background: url(../img/items_line.gif) center top no-repeat;
	zoom: 1;
}
	#contents .detail .p1 {border: 0; background: none;}

#contents .detail .set h4 {
	margin: 0px 0px 2px;
	font-size: 28px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.1;
	letter-spacing: -1px;
}
	#contents .detail .p1 h4 {color: #FF6B01;}
	#contents .detail .p2 h4 {color: #007B6F;}
#contents .detail .set h4 span {
	/* display: none; */
	display: -moz-inline-box;
	display: inline-block;
	padding-top: 1px;
	width: 82px;
	font-size: 14px;
	line-height: 1;
	text-align: center;
	letter-spacing: 0px;
	vertical-align: -2px;
	zoom: ;
}

#contents .detail .set p {margin: 0;}

/* thumbnail */
#contents .detail .set p.thum {float: left; width: 92px;}
#contents .detail .set p.thum a {color: #000000;}


#contents .detail .set ul {min-height: 92px; font-size: 12px; overflow: auto; zoom: 1;}
	* html #contents .detail .set ul {height: 92px; overflow: visible;}
#contents .detail .set ul li {}
#contents .detail .set ul li.all {text-align: right;}

#contents .detail .set dl {clear: both;}
#contents .detail .set dl dt {font-weight: bold;}
#contents .detail .set dl dd {}
	#contents .detail .set dl dd.format,
	#contents .detail .set dl dd.price {text-align: right;}

#contents .detail .set dl dd ul {margin: 0px 0px 5px; height: auto; min-height: 0px; font-size: 13px; overflow: visible;}
#contents .detail .set dl dd ul li {text-align: right; zoom: 1;}
#contents .detail .set dl dd ul li:after {
	content: ".";
	display: block;
	clear: both;
	height: 0px;
	visibility: hidden;
}/* for modern browser */
#contents .detail .set dl dd ul li span {float: left;}

/* more link */
#contents .detail .set p.more {margin: 0; text-align: right;}
#contents .detail .set p.more a {
	display: block;
	margin: 5px 0px 0px auto;
	width: 142px;
	height: 33px;
	color: #000000;
	text-align: left;
	text-decoration: none;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../img/btn_target_off.png) left top no-repeat;
	cursor: pointer;
	zoom: 1;
}
	* html #contents .detail .set p.more a {
		background: none;
		filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=img/btn_target_off.png,sizingMethod=crop);
	}
#contents .detail .set p.more a:hover {background-image: url(../img/btn_target_on.png);}
	* html #contents .detail .set p.more a:hover {
		background: none;
		filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=img/btn_target_on.png,sizingMethod=crop);
	}


/* ----- item detail ----- */
#contents .target {clear: both;}
#contents .target p {margin: 0; padding: 20px 0px 10px; text-align: center; zoom: 1;}
#contents .target p a {
	display: block;
	margin: 0px auto;
	width: 600px;
	height: 80px;
	color: #000000;
	text-decoration: none;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../img/btn_target_set_l.png) left top no-repeat;
}




/* ===== few content ===== */
#few {margin-bottom: 25px; border-bottom: 1px solid #000000; background: url(../img/few_bg.png) 585px 142px no-repeat;}
#few h3 {
	height: 30px;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../img/few_head.gif) left top no-repeat;
}

#few div.inner {
	border-left: 1px solid #000000;
	height: 290px;
	position: relative;
	overflow-y: scroll;
}
#few div.inner h4 {
	margin: 0px 0px 5px;
	padding: 0px 7px;
	height: 21px;
	font-size: 13px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Mayryo", Verdana, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
	line-height: 21px;
	background-color: #E5E5E5;
}

#few div.inner dl {padding: 0px 10px 10px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Mayryo", Verdana, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;}
#few div.inner dl dt {margin: 0px 0px -20px; height: 20px;}
#few div.inner dl dd {margin: 0px 0px 5px 105px; padding: 0px 0px 0px 160px; position: relative; color: #373535; zoom: 1;}

#few div.inner dl dd em {width: 145px; position: absolute; left: 0px; top: 0px; text-align: right;}
#few div.inner dl dd a img {display: none;/* position: absolute; bottom: -5000px; */}

/* scroll panel */
.jScrollPaneContainer {
/*
	border: 1px solid #000000;
	border-top: 0;
*/
	width: auto !important;
	position: relative;
	overflow: hidden;
	background: url(../img/sb_bg.gif) right top repeat-y;
	z-index: 1;
}

.jScrollPaneTrack {
	height: 100%;
	position: absolute;
	right: 0;
	top: 0;
	/* background: #aaa; */
	cursor: pointer;
}
.jScrollPaneDrag {
	position: absolute;
	overflow: hidden;
	background: url(../img/sb_panel.gif) center center no-repeat;
	cursor: pointer;
}
.jScrollPaneDragTop {
	height: 5px;
	position: absolute;
	left: 0;
	top: 0;
	overflow: hidden;
	background: url(../img/sb_panel.gif) center top no-repeat;
}
.jScrollPaneDragBottom {
	height: 5px;
	position: absolute;
	left: 0;
	bottom: 0;
	vertical-align: bottom;
	overflow: hidden;
	background: url(../img/sb_panel.gif) center bottom no-repeat;
}
	* html .jScrollPaneDragBottom {overflow: visible; bottom: -1px;}
	*:first-child+html .jScrollPaneDragBottom {overflow: visible;}
a.jScrollArrowUp {
	display: block;
	height: 20px;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../img/sb_arrow.gif) left top no-repeat;
	/*background-color: #666;*/
	outline: none;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	height: 20px;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../img/sb_arrow.gif) left bottom no-repeat;
	/*background-color: #666;*/
	outline: none;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}




/* ===== item set ===== */
.itemset {margin: 0px auto; padding: 15px 5px 12px; background-color: #D9F0F9;}

.itemset ul {margin: 0px auto; width: 790px; text-align: left; zoom: 1;}
.itemset ul:after {
	content: ".";
	display: block;
	clear: both;
	height: 0px;
	visibility: hidden;
}/* for modern browser */
.itemset ul li {float: left; width: 250px;}
	.itemset ul li.ps {width: 290px;}

.itemset ul li p.thum {float: left; margin-right: 5px; width: 92px;}
	.itemset ul li.ps p.thum {width: 105px;}

.itemset ul li dl {overflow: hidden; zoom: 1;}
.itemset ul li dl dt {
	font-size: 28px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.1;
	letter-spacing: -1px;
}
	.itemset ul li.p1 dl dt {color: #FF6B01;}
	.itemset ul li.p2 dl dt {color: #007B6F;}
	.itemset ul li.ps dl dt {color: #0066FF; font-size: 26px; line-height: 1.2;}
.itemset ul li dl dt span {display: none;}
.itemset ul li dl dd {font-size: 15px;}

/* item exp */
.itemset ul li dl dd.price {
	margin: 0px 0px 5px;
	padding-left: 3px;
	font-size: 15px;
	font-weight: bold;
}
	.itemset ul li.ps dl dd.price {color: #FF0000;}
.itemset ul li dl dd.price span {
	margin-left: -3px;
	font-size: 18px;
	font-weight: normal;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
}
.itemset ul li dl dd.price em {margin-right: 5px; color: #000000; font-size: 15px;}

/* more link */
.itemset ul li dl dd.more {}
.itemset ul li dl dd.more a {
	display: block;
	width: 142px;
	height: 33px;
	color: #000000;
	text-decoration: none;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../img/btn_target_off.png) left top no-repeat;
	cursor: pointer;
}
	* html .itemset ul li dl dd.more a {
		background: none;
		filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=img/btn_target_off.png,sizingMethod=crop);
	}
.itemset ul li dl dd.more a:hover {background-image: url(../img/btn_target_on.png);}
	* html .itemset ul li dl dd.more a:hover {
		background: none;
		filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=img/btn_target_on.png,sizingMethod=crop);
	}



/* ===== inquiry form ===== */
#form {margin-top: 25px; padding-bottom: 80px;}
#form h1 {
	margin: 0px 0px 12px;
	padding: 0px 15px;
	height: 34px;
	color: #FFFFFF;
	font-size: 21px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Mayryo", Arial, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
	line-height: 34px;
	background-color: #3F6187;
}
#form p {margin: 0px 15px 25px; font-size: 15px;}
#form p.back {margin-bottom: 100px;}
#form p.flow {margin: 0px 0px 25px;}

#form form {background: url(../img/few_bg.png) 585px 20px no-repeat;}
#form form p {margin: 0px 0px 0px 155px; font-size: 13px;}
#form form p.send {margin: 0px 0px 0px 15px;}

#form form p input.edit {
	margin: 0px 5px 2px 0px;
	padding: 3px 5px;
	border: 2px solid #999999;
	width: auto;
	color: #666666;
	font-size: 15px;
	background-color: #FFFFFF;
	vertical-align: text-bottom;
}

#form dl {margin: 0px 0px 0px 15px; font-size: 15px;}
#form dl dt {margin: 0px 0px -23px 0px; padding: 3px 0px 0px 7px; border-left: 5px solid #3F6187; line-height: 22px;}
#form dl dd {margin: 0px 0px 20px 150px; line-height: 24px;}
#form dl dd p {margin: 2px 0px 0px; font-size: 13px; line-height: 1.3;}

#form dl dd input {padding: 3px; border: 1px solid #CCCCCC; width: 200px; font-size: 13px;}
	#form dl dd input#old {width: 40px;}
	#form dl dd input.chk_box {margin-top: 2px; margin-bottom: 4px; padding: auto; border: 0; width: auto; vertical-align: -2px;}
#form dl dd textarea {padding: 3px; border: 1px solid #CCCCCC; width: 400px; font-size: 13px; overflow-y: auto;}

#form dl dd span {margin-left: 5px; color: #FF3300;}



/* ===== legal & privacy ===== */
#legal {margin-top: 25px;}
#legal h1 {
	margin: 0px 0px 12px;
	padding: 0px 15px;
	height: 34px;
	color: #FFFFFF;
	font-size: 21px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Mayryo", Arial, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
	line-height: 34px;
	background-color: #3F6187;
}
#legal p {margin-bottom: 25px; text-align: center;}

/* privacy */
#privacy {margin-bottom: 25px;}
#privacy h2 {
	margin: 0px 0px 12px;
	padding: 0px 15px;
	height: 34px;
	color: #FFFFFF;
	font-size: 21px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Mayryo", Arial, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
	line-height: 34px;
	background-color: #3C8279;
}
#privacy p {margin: 0px 12px 20px; font-size: 15px;}

#privacy ol {margin: 0px 0px 0px 18px; font-size: 15px; list-style-position: inside;}
#privacy ol li {margin: 0px 0px 18px;}

#privacy ol li p {margin: 5px 0px 5px 10px;}

#privacy ol li ul {margin: 0px 0px 5px 17px; list-style-type: disc;}
#privacy ol li ul li {margin: 0px 0px 2px;}