﻿@charset "utf-8";

/************************** 

マナーレッスン
manner/

**************************/
/* 共通スタイル */
div#mainCol div#manner {
	width: 606px;
	height: auto;
	margin: 15px 3px 0 7px;
	padding: 0;
	clear: both;
}

div#manner p {
	width: 570px;
	height: auto;
	margin: 0 auto 1em;
	padding: 0;
	text-align: left;
}

div#manner div.mannerInner p {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
}

div#manner p.lead {
	width: auto;
	height: auto;
	margin: 0 5px 0.5em 10px;
	padding: 0;
	text-align: left;
}

div#manner p.clear {
	clear: both;
}

div#manner p.figBottom {
	margin-bottom: 3em;
}

div#manner h3 {
	width: 606px;
	height: 43px;
	margin: 25px 0 30px;
	padding: 0;
	clear: both;
}

div#manner h3.spB10 {
	margin-bottom: 10px;
}

div#manner h4 {
	width: auto;
	height: 25px;
	margin: 25px 0 15px;
	padding: 0;
	clear: both;
}

div#manner h4.short {
	width: auto;
	height: auto;
	margin: 25px 0 10px 20px;
	padding: 0;
	clear: both;
}

div#manner h5 {
	width: 560px;
	height: auto;
	margin: 20px auto 0.2em;
	padding: 0;
	clear: both;
	color: #3395CE;
	font-size: 13px;
}

/* コンテンツメニュー */
div#manner ul#mannerMenu {
	width: 602px;
	height: 62px;
	margin: 20px auto 10px;
	padding: 0;
	clear: both;
}

div#manner ul#mannerMenu li {
	width: 86px;
	height: 62px;
	margin: 0;
	padding: 0;
	float: left;
}

div#manner ul#mannerMenu li a {
	position: relative;
	width: 86px;
	height: 62px;
	margin: 0;
	padding: 0;
	display: block;
	text-decoration: none;
	font-size: 10px;
	overflow: hidden;
	cursor: pointer;
}

div#manner ul#mannerMenu li a.disable {
	cursor: default;
}

div#manner ul#mannerMenu li a span {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: transparent url(../manner/image/manner_menu_list.jpg) no-repeat 0 0;
}

div#manner ul#mannerMenu li#manner01 a span {
	background-position: 0 0;
}

div#manner ul#mannerMenu li#manner01ON a span {
	background-position: 0 -62px;
}

div#manner ul#mannerMenu li#manner01 a:hover span {
	background-position: 0 -62px;
}

div#manner ul#mannerMenu li#manner02 a span {
	background-position: -86px 0;
}

div#manner ul#mannerMenu li#manner02ON a span {
	background-position: -86px -62px;
}

div#manner ul#mannerMenu li#manner02 a:hover span {
	background-position: -86px -62px;
}

div#manner ul#mannerMenu li#manner03 a span {
	background-position: -172px 0;
}

div#manner ul#mannerMenu li#manner03ON a span {
	background-position: -172px -62px;
}

div#manner ul#mannerMenu li#manner03 a:hover span {
	background-position: -172px -62px;
}

div#manner ul#mannerMenu li#manner04 a span {
	background-position: -258px 0;
}

div#manner ul#mannerMenu li#manner04ON a span {
	background-position: -258px -62px;
}

div#manner ul#mannerMenu li#manner04 a:hover span {
	background-position: -258px -62px;
}

div#manner ul#mannerMenu li#manner05 a span {
	background-position: -344px 0;
}

div#manner ul#mannerMenu li#manner05ON a span {
	background-position: -344px -62px;
}

div#manner ul#mannerMenu li#manner05 a:hover span {
	background-position: -344px -62px;
}


div#manner ul#mannerMenu li#manner06 a span {
	background-position: -430px 0;
}

div#manner ul#mannerMenu li#manner06ON a span {
	background-position: -430px -62px;
}

div#manner ul#mannerMenu li#manner06 a:hover span {
	background-position: -430px -62px;
}

div#manner ul#mannerMenu li#manner07 a span {
	background-position: -516px 0;
}

div#manner ul#mannerMenu li#manner07ON a span {
	background-position: -516px -62px;
}

div#manner ul#mannerMenu li#manner07 a:hover span {
	background-position: -516px -62px;
}

/* 図入りボード */
div#manner div.figBoard {
	width: 560px;
	height: auto;
	margin: 15px auto 10px;
	padding: 0;
	clear: both;
	background: transparent url(../manner/image/manner_bg.jpg) repeat-y 0 0;
}

div#manner div.figBoardInner {
	width: 560px;
	height: auto;
	margin: 0;
	padding: 0;
	clear: both;
	background: transparent url(../manner/image/manner_lower.jpg) no-repeat left bottom;
}

div#manner div.figBoardInner dl {
	width: 560px;
	height: auto;
	margin: 0;
	padding: 0 0 20px;
	clear: both;
	background: transparent url(../manner/image/manner_upper.jpg) no-repeat 0 0;
}

div#manner div.figBoardInner dl:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div#manner div.figBoardInner dl dt {
	width: auto;
	height: auto;
	margin: 0;
	padding: 20px 0 10px 30px;
	font-size: 18px;
	font-weight: bold;
	float: left;
}

div#manner div.figBoardInner dl dt img {
	vertical-align: bottom;
}

div#manner div.figBoardInner dl dt.title {
	padding-left: 25px;
	color: #FF9F00;
}

div#manner div.figBoardInner dl dd {
	width: auto;
	height: auto;
	margin: 0 25px 0 30px;
	padding: 0;
	clear: left;
}

div#manner div.figBoardInner dl dd.flList {
	width: auto;
	height: auto;
	margin: 0;
	padding: 10px 0 0 30px;
}

div#manner div.figBoardInner dl dd ul li {
	width: auto;
	height: auto;
	margin: 0 0 1em 0;
	padding: 0;
}

div#manner div.figBoardInner dl dd.flList ul li {
	width: 180px;
	height: auto;
	margin: 1.5em 0 0 0;
	padding: 0;
	float: left;
	clear: none;
}

div#manner div.figBoardInner dl dd.photo {
	width: auto;
	height: auto;
	margin: 0;
	float: right;
	clear: none;
}

div#manner div.figBoardInner dl dd.p01 {
	padding: 20px 50px 0 0;
}

div#manner div.figBoardInner dl dd.p02 {
	padding: 30px 40px 0 0;
}

div#manner div.figBoardInner dl dd.p03 {
	padding: 20px 30px 0 0;
}

div#manner div.figBoardInner dl dd.p04 {
	padding: 23px 15px 0 0;
}

/* IE5,6のみ適用 */
* html div#manner div.figBoardInner dl dd.p03 {
	padding-bottom: 10px;
}

div#manner div.figBoardInner dl dd dl {
	width: 410px;
	height: auto;
	margin: 0;
	padding: 0;
	background: none;
	clear: none;
}

div#manner div.figBoardInner dl dd dl dt {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0 0 0.3em 0;
	font-weight: bold;
	font-size: 100%;
}

div#manner div.figBoardInner dl dd dl dd {
	width: auto;
	height: 100%;
	margin: 0 0 1em;
	padding: 0;
}

div#manner div.figBoardInner dl dd dl dd ol li {
	width: auto;
	height: auto;
	margin: 0 0 0.5em 2em;
	padding: 0;
	list-style-position: outside;
}


div#manner ul.flList {
	width: 560px;
	height: auto;
	margin: 1.5em auto;
	padding: 0;
	clear: both;
}

div#manner ul.flList:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div#manner ul.flList li {
	width: 280px;
	height: auto;
	margin: 0;
	padding: 0;
	float: left;
}

div#manner div.bottom {
	margin-bottom: 40px;
}

/* 段組み用ラッパー */
div#mainCol div.mannerInner {
	width: 606px;
	height: auto;
	margin: 0;
	padding: 0;
	clear: both;
}

div#mainCol div.mannerInner h4 {
	width: auto;
	height: auto;
	margin: 0 0 10px 0;
	padding: 0;
	clear: none;
	float: left;
}

div#manner div.mannerInner div.leftCol {
	margin: 0;
	padding: 0;
	float: left;
}

div#manner div.mannerInner div.rightCol {
	margin: 0;
	padding: 0;
	float: right;
}


/************************** 

マナーレッスン01 言葉づかい
manner.htm

**************************/
div#manner table.mannerTB01 {
	width: 560px;
	height: auto;
	margin: 20px auto 10px;
	padding: 0;
	clear: both;
	border-collapse: collapse;
}

div#manner table.mannerTB01 tr.colored {
	background-color: #F4F4F4;
}

div#manner table.mannerTB01 th {
	margin: 0;
	padding: 5px 10px;
	text-align: center;
	border: 1px solid #999;
	white-space: nowrap;
	background-color: #FFFFF5;
}

div#manner table.mannerTB01 td {
	margin: 0;
	padding: 5px 10px;
	text-align: center;
	border: 1px solid #999;
}

div#manner table.mannerTB01 td.word {
	font-weight: bold;
}


/************************** 

マナーレッスン02 電話
manner_01.htm

**************************/
/* 電話フロー図 */
div#manner div#manner02Flow {
	width: 560px;
	height: 364px;
	margin: 10px auto 30px;
	padding: 57px 0 0 0;
	clear: both;
	background: transparent url(../manner/image/manner02Flow_bg.jpg) no-repeat 0 0;
}

div#manner div#manner02Flow ul li {
	width: auto;
	height: auto;
	margin: 0 0 48px;
	padding: 0;
	float: left;
}

div#manner div#manner02Flow ul li.bottom {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	float: none;
	clear: both;
}


/************************** 

マナーレッスン03 メール
manner_02.htm

**************************/
div#manner div.mailCaption {
	width: 580px;
	height: auto;
	margin: 10px auto 30px;
	padding: 0 0 0 26px;
	clear: both;
}

/* IE5,6のみ適用 */
* html div#manner div.mailCaption {
	margin-bottom: 30px;
}

div#manner div#cap01 {
	background: transparent url(../manner/image/figure03_02.jpg) no-repeat right 35px;
}

div#manner div.mailCaption dl {
	width: 450px;	
	height: auto;
	margin: 0;
	padding: 0;
}

div#manner div.mailCaption dl dt {
	width: auto;	
	height: auto;
	margin: 0 0 0.3em;
	padding: 0;
	font-weight: bold;
	color: #666;
}

div#manner div.mailCaption dl dd {
	width: auto;
	height: auto;
	margin: 0 0 0.5em;
	padding: 0;
	line-height: 1.5;
}


div#manner div.mailCaption ul {
	width: auto;	
	height: auto;
	margin: 0;
	padding: 0;
}

div#manner div.mailCaption ul li {
	width: auto;
	height: auto;
	margin: 0 0 0.3em;
	padding: 0;
	line-height: 1.6;
}


/************************** 

マナーレッスン04 手紙
manner_03.htm

**************************/
div#manner div.letterCaption {
	width: 580px;
	height: auto;
	margin: 10px auto 30px;
	padding: 0 0 0 26px;
	clear: both;
}

/* IE5,6のみ適用 */
* html div#manner div.letterCaption {
	margin-bottom: 30px;
}

div#manner div#cap03_01 {
	background: transparent url(../manner/image/figure04_02.jpg) no-repeat 410px 0;
}

div#manner div.letterCaption dl {
	width: 450px;	
	height: auto;
	margin: 0;
	padding: 0;
}

div#manner div.letterCaption dl dt {
	width: auto;	
	height: auto;
	margin: 0 0 0.5em;
	padding: 0;
}

div#manner div.letterCaption dl dd {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
}

div#manner div.letterCaption ol {
	width: auto;	
	height: auto;
	margin: 0;
	padding: 0;
	list-style: none;
}

div#manner div.letterCaption ol li {
	width: auto;
	height: auto;
	margin: 0 0 0.3em;
	padding: 0;
	line-height: 1.6;
	font-weight: bold;
}

div#manner table#manner03 {
	margin: 10px auto 20px;
}

div#manner table#manner03 .month {
	width: 5em;
	text-align: left;
}


/************************** 

マナーレッスン05 履歴書
manner_04.htm

**************************/
div#manner div.rirekiCaption {
	width: 540px;
	height: auto;
	margin: 10px auto 30px;
	padding: 0;
	clear: both;
}

/* IE5,6のみ適用 */
* html div#manner div.rirekiCaption {
	margin-bottom: 30px;
}

div#manner div.rirekiCaption dl {
	width: auto;	
	height: auto;
	margin: 0;
	padding: 0;
}

div#manner div.rirekiCaption dl dt {
	width: auto;	
	height: auto;
	margin: 0 0 0.3em;
	padding: 0;
	color: #FF9F00;
	font-weight: bold;
}

div#manner div.rirekiCaption dl dd {
	width: auto;
	height: auto;
	margin: 0 0 0.8em;
	padding: 0;
}

div#manner table#manner03 {
	margin: 10px auto 20px;
}

div#manner table#manner03 .month {
	width: 5em;
	text-align: left;
}


/************************** 

マナーレッスン06 身だしなみ
manner_05.htm

**************************/
div#mainCol div.mannerInner {
	margin: 30px 0 50px;
}

/* IE5,6のみ適用 */
* html div#mainCol div.mannerInner {
	margin-bottom: 40px;
}

/* IE7のみ適用 */
*:first-child+html div#mainCol div.mannerInner {
	margin-bottom: 50px;
} 

div#manner div.mannerInner div.leftCol {
	width: 341px;
	margin: 0;
	padding: 0 0 0 20px;
	float: left;
}

div#manner div.mannerInner div.rightCol {
	margin: 0;
	padding: 0;
	float: right;
}

div#manner div.mannerInner div.figBoard {
	width: 226px;
	height: auto;
	margin: 0;
	padding: 0;
	clear: none;
}

div#manner div.mannerInner div.figBoardInner {
	width: 226px;
	height: auto;
	margin: 0;
	padding: 0;
	clear: none;
}

div#manner div.mannerInner div.figBoardInner dl {
	width: 186px;
	height: auto;
	margin: 0;
	padding: 20px;
	clear: none;
}

div#manner div.mannerInner div.figBoardInner dl:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* IE5,6のみ適用 */
* html div#manner div.mannerInner div.figBoardInner dl {
	padding-bottom: 10px;
}

div#manner div.mannerInner div.figBoardInner dl dt {
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-weight: bold;
	float: none;
}

div#manner div.mannerInner div.figBoardInner dl dd {
	width: auto;
	height: auto;
	margin: 0 0 1em 0.5em;
	padding: 0;
}

/* IE5,6のみ適用 */
* html div#manner div.figBoardInner dl dd {
	margin-bottom: 0;
}

div#manner div.mannerInner div#fbMale {
	background: transparent url(../manner/image/manner06_bg01.jpg) repeat-y 0 0;
}

div#manner div.mannerInner div#fbMaleInner {
	background: transparent url(../manner/image/manner06_lower01.jpg) no-repeat left bottom;
}

div#manner div.mannerInner div#fbMaleInner dl {
	background: transparent url(../manner/image/manner06_upper01.jpg) no-repeat 0 0;
}

div#manner div.mannerInner div#fbFemale {
	background: transparent url(../manner/image/manner06_bg02.jpg) repeat-y 0 0;
}

div#manner div.mannerInner div#fbFemaleInner {
	background: transparent url(../manner/image/manner06_lower02.jpg) no-repeat left bottom;
}

div#manner div.mannerInner div#fbFemaleInner dl {
	background: transparent url(../manner/image/manner06_upper02.jpg) no-repeat 0 0;
}


/************************** 

マナーレッスン07 面接
manner_06.htm

**************************/
/* 必須アイテムリスト */
div#manner div#itemList {
	width: 568px;
	height: auto;
	margin: 15px 0 40px 6px;
	padding: 0;
	clear: both;
	background: transparent url(../manner/image/itemlist_bg.jpg) repeat-y 0 0;
}

div#itemList div#itemListInner {
	width: 568px;
	height: auto;
	margin: 0;
	padding: 0 0 40px;
	clear: both;
	background: transparent url(../manner/image/itemlist_lower.jpg) no-repeat left bottom;
}

div#itemList div#itemListInner dl {
	width: 492px;
	height: auto;
	margin: 0;
	padding: 36px 40px 20px 36px;
	clear: both;
	background: transparent url(../manner/image/itemlist_upper.jpg) no-repeat 0 0;
}

/* IE5,6のみ適用 */
* html div#manner div.figBoardInner dl {
	padding-bottom: 10px;
}

div#itemList div#itemListInner dl dt {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0 0 15px;
}

div#itemList div#itemListInner dl dd {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
}

div#itemList div#itemListInner dl dd dl {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	background-image: none;
}

div#itemList div#itemListInner dl dd dl dt {
	width: auto;
	height: 18px;
	margin: 0;
	padding: 0 0 3px;
}

div#itemList div#itemListInner dl dd dl dt img {
	vertical-align: bottom;
}

div#itemList div#itemListInner dl dd dl dd {
	width: auto;
	height: auto;
	margin: 0 0 14px 20px;
	padding: 0;
}

div#manner div#cap07_01 {
	width: 580px;
	height: auto;
	margin: 0 auto 30px;
	padding: 0;
	clear: both;
	background: transparent url(../manner/image/illust07_01.jpg) no-repeat 480px 0;
}

div#manner div#cap07_01 h4 {
	margin-bottom: 10px;
}

div#manner div#cap07_01 p {
	margin: 0 0 15px 5px;
	padding: 0;
}

div#manner div#cap07_01 p.left {
	width: 460px;
	padding: 10px 0 0;
}

div#manner div#cap07_01 ol {
	margin: 0 10px 15px 25px;
	padding: 0;
}

div#manner div#cap07_01 ol li {
	margin: 0 0 3px 0;
	padding: 0;
}

/* 図入りボード青大 */
div#manner div.fb0701 {
	width: 566px;
	background: transparent url(../manner/image/manner07_bg01.jpg) repeat-y 0 0;
}

div#manner div.fb0701inner {
	width: 566px;
	background: transparent url(../manner/image/manner07_lower01.jpg) no-repeat left bottom;
}

div#manner div.fb0701inner dl {
	width: 566px;
	height: auto;
	margin: 0;
	padding: 0 0 10px;
	background: transparent url(../manner/image/manner07_upper01.jpg) no-repeat 0 0;
}

div#manner div.fbFAQ dl dt {
	width: auto;
	height: auto;
	margin: 0;
	padding: 20px 0 10px 20px;
	float: left;
}

div#manner div.fbFAQ dl dd {
	width: 365px;
	height: auto;
	margin: 20px 0 0 0;
	padding: 0 20px 0 0;
	float: right;
	clear: none;
}

div#manner div.fbFAQ dl dd dl {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	clear: none;
	background-image: none;
}

div#manner div.fbFAQ dl dd dl dt {
	width: 27px;
	height: auto;
	margin: 0;
	padding: 0 0 6px;
	float: left;
	clear: left;
	font-size: 11px;
}

div#manner div.fbFAQ dl dd dl dd {
	width: auto;
	height: auto;
	margin: 0 0 6px 27px;
	padding: 0 0 0 10px;
	float: none;
	font-size: 11px;
}

/* IE5,6のみ適用 */
* html div#manner div.fbFAQ dl dd dl dd {
	margin-bottom: 4px;
}

div#manner div.fbFAQ dl dd dl dd.question {
	font-weight: bold;
	color: #3395CE;
	border-left: 3px solid #81B8D7;
}

div#manner div.fbFAQ dl dd dl dd.answer {
	margin-bottom: 12px;
	border-left: 3px solid #E6968A;
}

/* 図入りボード青小 */
div#manner div.fb0702 {
	width: 403px;
	margin-left: 0;
	background: transparent url(../manner/image/manner07_bg02.jpg) repeat-y 0 0;
}

div#manner div.fb0702inner {
	width: 403px;
	background: transparent url(../manner/image/manner07_lower02.jpg) no-repeat left bottom;
}

div#manner div.fb0702inner dl {
	width: 403px;
	height: auto;
	margin: 0;
	padding: 0 0 20px;
	background: transparent url(../manner/image/manner07_upper02.jpg) no-repeat 0 0;
}

div#manner div.fb0702inner dl dt {
	width: auto;
	height: auto;
	margin: 0;
	padding: 20px 0 5px 15px;
}

div#manner div.fb0702inner dl dd {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0 10px 0 35px;
	font-size: 11px;
}

/* IE5,6のみ適用 */
* html div#manner div.fb0702inner dl dd {
	padding-bottom: 10px;
}

/* 図入りボード青中 */
div#manner div.fb0703 {
	width: 501px;
	margin: 0 0 30px 15px;
	background: transparent url(../manner/image/manner07_bg03.jpg) repeat-y 0 0;
}

div#manner div.fb0703inner {
	width: 501px;
	background: transparent url(../manner/image/manner07_lower03.jpg) no-repeat left bottom;
}

div#manner div.fb0703inner dl {
	width: 501px;
	height: auto;
	margin: 0;
	padding: 0 0 10px;
	background: transparent url(../manner/image/manner07_upper03.jpg) no-repeat 0 0;
}

div#manner div.fb0703inner dl dd {
	margin-top: 60px;
}

div#manner ul.graphList {
	width: auto;
	height: auto;
	margin: 20px 0 0 25px;
	padding: 0;
}

div#manner ul.graphList li {
	margin: 0 16px 30px 0;
	padding: 0;
	float: left;
}

div#manner ul.graphList li dl dt {
	margin: 0 0 10px 0;
}



