/*
Author: SHARP CORPORATION 
Description: style for v40 on web
Tags: HTML5,CSS
*/

/*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
@CHARSET "UTF-8";

html {
	color: #000;
	background: #FFF
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code,
	form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

fieldset, img {
	border: 0
}

address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal
}

ol, ul {
	list-style: none;
}

caption, th {
	text-align: left
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal
}

q:before, q:after {
	content: ''
}

abbr, acronym {
	border: 0;
	font-variant: normal
}

sup {
	vertical-align: text-top
}

sub {
	vertical-align: text-bottom
}

input, textarea, select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
}

legend {
	color: #000
}

#yui3-css-stamp.cssreset {
	display: none
}

html, body {
	height: 100%;
}

body {
	color: #4d4d4d;
	font-size: 14px;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Meiryo',
		'メイリオ', 'Osaka', "ＭＳ Ｐゴシック", 'MS PGothic', 'arial', 'helvetica',
		sans-serif;
	-webkit-text-size-adjust: 100%;
}

a {
	text-decoration: none;
	line-height: 100%;
	opacity: 1;
	color: #333;
}

a, a:hover {
	-webkit-transition: 0.7s;
	-moz-transition: 0.7s;
	-o-transition: 0.7s;
	transition: 0.7s;
}

a img:hover {
	-moz-opacity: 0.75;
	opacity: 0.75;
}

a:hover {
	opacity: 0.5;
}

p, dd, dt {
	line-height: 165%;
}

img {
	vertical-align: bottom;
}

/*------------------------------------------------------
PC, TABLET
------------------------------------------------------*/
body {
	/*font-family: MS UI Gothic, Helvetica, sans-serif;*/
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Meiryo',
		'メイリオ', 'Osaka', "ＭＳ Ｐゴシック", 'MS PGothic', 'arial', 'helvetica',
		sans-serif;
}

p.body-2 {
	margin: 0;
	color: #000;
	font-size: 0.8em;
}

p.image, p.resizeimage, p.resizeimage-rc {
	text-align: center;
}

/* ===== 表示領域が800px以上の場合に適用するスタイル ===== */
div.page { /* ページ全体の領域 */
	width: 90%;
	margin: 0 auto;
	background-color: #FFFFFF;
}

div.menu { /* メニュー */
	float: left;
	width: 20%;
	/*max-width: 270px;*/
	/*height:100%;*/
	background-color: #FFFFFF;
	margin: 0 auto;
	z-index: 500;
	padding-bottom: 30px;
}

iframe.column { /* 本文 */
float:left;
width:80%;
max-width: 1080px;
/*height:100%;*/
background-color:#FFFFFF;
/*border:1px solid;*/
}


div.two-column { /* 2段組み本文 */
	float: left;
	width: 50%;
	/*height:100%;*/
	background-color: #FFFFFF;
	/*border:1px solid;*/
}

p.manual-title { /* メニュースタイル */
	display: none;
}

p.menu-title {
	font-size: 1.5em;
	font-weight: bold;
	margin: 0.5em 0 0 0;
}

ol.cntentslink {
	margin: 0 0 0 0;
	padding: 0;
	list-style: none;
}

ul.cntentslink {
	margin: 0 0 0 2.5em;
	padding: 0;
}

a.cntentslink {
	display: block;
	text-indent: 0;
	font-size: 120%;
	background: #202020;
	padding: 0.6em 0.5em;
	margin: 0.1em 0 0 0;
	border-top: solid 2px #000;
	border-bottom: solid 2px #333;
	border-left: solid 2px #202020;
	border-right: solid 0px #333;
}

a.cntentslink:link {
	color: #e0e0e0
}

a.cntentslink:visited {
	color: #e0e0e0
}

p.resizeimage img {
	width: 70%;
}

p.resizeimage-rc img {
	height: 70%;
}

p.cover {
	display: block; /* 表紙スタイル */
	width: 95%;
	height: 30%;
	text-indent: 0;
	color: #FFFFFF;
	background: #000000;
	padding: 2em 0 0 2em;
	margin: 0 auto 0.5em auto;
}
/*}*/
.list-disc {
	color: #000;
	font-size: 0.8em;
	margin: 0.5em 0 0 0;
	list-style: disc;
}

li.step {
	margin: 1em 0 0.5em 0em;
}

div.text-right { /* 次のページへ */
	clear: both;
	width: 100%;
	text-align: right;
	/*border: 1px solid;*/
}

/* ===== ご注意・おしらせマーク ===== */
p.caution-icon, p.note-icon {
	margin-left: 1em;
	padding: 0;
	color: #000;
	font-size: 1em;
	font-weight: bold;
}

span.caution-icon, span.note-icon {
	background-color: #ff8;
	padding: 2px 5px;
}

/* ===== STYLE FOR "H1-TITLES" ===== */
h1 {
	display: block;
	text-indent: 0;
	color: #FFFFFF;
	background: #000000;
	padding: 0.2em;
	margin: 0 0 0.2em 0;
}

/* ===== STYLE FOR "H3-TITLES" ===== */
h3 {
	display: block;
	text-indent: 0;
	font-size: 1.3em;
	color: #FFFFFF;
	background: #525252;
	padding: 0.5em;
	margin: 0 0 0.2em 0;
}

/* ===== STYLE FOR "H4-TITLES" ===== */
h4 {
	font-weight: lighter;
}

/* ===== STYLE FOR "H5-TITLES" ===== */
h5 {
	font-weight: lighter;
}

/* ===== TABLE STYLE ===== */
.tbl {
	width: 100%;
	border-collapse: collapse;
}

.tbl th {
	text-align: center;
	padding: 3px;
	border: 1px solid #000000;
	font-size: 0.8em;
	background: #ddd;
	white-space: nowrap;
}

.tbl td {
	padding: 3px;
	font-size: 0.8em;
	border: 1px solid #000000;
}

.tbl td span {
	padding: 1px;
	background: #ddd;
}

.ctr {
	text-align: center;
}

a:link {
	color: #e0e0e0
}

a:visited {
	color: #e0e0e0
}

a.link:link {
	color: #0000ff
}

a.link:visited {
	color: #0000ff
}

/* ===== TEXT STYLE ===== */
p.x51-notice-t6 {
	font-size: 0.8em;
}

p.x51-notice-t6_2 {
	font-size: 0.8em;
	font-weight:bold;
}

#menu_cnt{
	clear:both;
	width: 100px;
	height: 40px;
	margin: 5px auto 5px auto;
	padding: 0px 0px 0px 0px;
	text-align:left;
	float:left;
	z-index: 500;
	display: none;
	cursor: pointer;
}
#right_content {
	width: 79%;
	height: auto;
	display: block;
	float: right;
	z-index: 500;
}

.rcontent {
	display:block;
}

#viewportsizechecked {
	clear: both;
	width: 100%;
	height: 1px;
	content: '';
	display: block;
	overflow: hidden;
}

/*------------------------------------------------------
SMARTPHONE
------------------------------------------------------*/
@media screen and (max-width: 600px) {
	#viewportsizechecked{
		display: none;
	}
	#menu_cnt{
		display: block;
	}
	#right_content {
		width: 100%;
		height: 100%;
		float: right;
	}
	p.body-2 {
		margin: 0;
		color: #000;
		font-size: 0.8em;
	}
	p.image, p.resizeimage, p.resizeimage-rc {
		text-align: center;
	}
	div.menu { /* メニュー */
		width: 100%;
		/*max-width: 450px;*/
		/*height:100%;*/
		background-color: #FFFFFF;
		margin: 0 auto;
	}
	iframe {
		width: 100%
	}
	div.two-column { /* 2段組み本文 */
		width: 100%;
		/*height:100%;*/
		background-color: #FFFFFF;
		/*border:1px solid;*/
		margin: 0 auto;
	}
	p.manual-title { /* メニュースタイル */
		display: block;
		text-indent: 0;
		font-size: 2em;
		color: #e0e0e0;
		background: #202020;
		padding: 1em 0.5em;
	}
	p.menu-title {
		font-size: 1.5em;
		font-weight: bold;
		margin: 2em 0 0.5em 0;
	}
	ol.cntentslink {
		margin: 0 0 0 0;
		padding: 0;
		list-style: none;
	}
	ul.cntentslink {
		margin: 0 0 0 2.5em;
		padding: 0;
	}
	a.cntentslink {
		display: block;
		text-indent: 0;
		font-size: 1.8em;
		background: #202020;
		padding: 0.5em 0.5em;
		margin: 0.1em 0 0 0;
		border-top: solid 2px #000;
		border-bottom: solid 2px #333;
		border-left: solid 2px #202020;
		border-right: solid 0px #333;
	}
	a.cntentslink:link {
		color: #e0e0e0
	}
	a.cntentslink:visited {
		color: #e0e0e0
	}
	p.resizeimage img {
		width: 90%;
	}
	p.resizeimage-rc img {
		height: 80%;
	}
	p.image img {
		width: 100%
	}
	p.cover {
		/*display: none;*/
	} /* 表紙スタイル */
	li.list-disc {
		color: #000;
		font-size: 10em;
		margin: 0.5em 0 0 0;
		list-style: disc;
	}
	li.step {
		margin: 1em 0 0.5em 0em;
	}

	.list-mokuji {
		margin: 1em 0 0 -2em;
		list-style-type:none;
	}

	div.text-right { /* 次のページへ */
		clear: both;
		width: 100%;
		text-align: right;
		/*border: 1px solid;*/
	}

	/* ===== ご注意・おしらせマーク ===== */
	p.caution-icon, p.note-icon {
		margin-left: 1em;
		padding: 0;
		color: #000;
		font-size: 1em;
		font-weight: bold;
	}
	span.caution-icon, span.note-icon {
		background-color: #ff8;
		padding: 2px 5px;
	}

	/* ===== STYLE FOR "H1-TITLES" ===== */
	h1 {
		display: block;
		text-indent: 0;
		color: #FFFFFF;
		background: #000000;
		padding: 0.2em;
		margin: 0 0 0.2em 0;
	}

	/* ===== STYLE FOR "H3-TITLES" ===== */
	h3 {
		display: block;
		text-indent: 0;
		font-size: 1em;
		color: #FFFFFF;
		background: #525252;
		padding: 0.5em;
		margin: 0 0 0.2em 0;
	}

	/* ===== STYLE FOR "H4-TITLES" ===== */
	h4 {
		font-weight: lighter;
	}

	/* ===== STYLE FOR "H5-TITLES" ===== */
	h5 {
		font-weight: lighter;
	}

	/* ===== TABLE STYLE ===== */
	.tbl {
		width: 100%;
		border-collapse: collapse;
	}
	.tbl th {
		text-align: center;
		padding: 3px;
		border: 1px solid #000000;
		font-size: 1em;
		background: #ddd;
		white-space: nowrap;
	}
	.tbl td {
		padding: 3px;
		font-size: 1em;
		border: 1px solid #000000;
	}
	.tbl td span {
		padding: 1px;
		background: #ddd;
	}
	.ctr {
		text-align: center;
	}
	a:link {
		color: #e0e0e0
	}
	a:visited {
		color: #e0e0e0
	}
	a.link:link {
		color: #0000ff
	}
	a.link:visited {
		color: #0000ff
	}

	/* ===== TEXT STYLE ===== */
	p.x51-notice-t6 {
		font-size: 2em;
	}

	p.x51-notice-t6_2 {
		font-size: 2em;
		font-weight:bold;
	}
}