@charset "utf-8";

/* ---------------------------------------------------------------------- HTML NORMALIZE
----------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; }

html {overflow-y: scroll; -webkit-text-size-adjust: none;}

body { background: #fff; color: #000; font: 100%/1.4 Verdana, Roboto, "Droid Sans", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

h1, h2, h3, h4, h5, h6, strong { font-weight: bold;}

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { vertical-align: super; }

b{ font-weight:bold; color:#FF0000; }

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

button, input { line-height: normal; }

caption, th, td { text-align: left; vertical-align: middle; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }


/* ---------------------------------------------------------------------- CONTAINER
----------------------------------------------------------------------*/

h1{	font-size:120%;}
h2{	font-size:100%; font-weight: bold;}
h3{	font-weight:normal;	font-size:100%; font-weight: bold;}

p {	font-size:100%;}
a {	font-size:100%; text-decoration: underline; outline: none;}
a.extlink { background:url(a/img/icon/link_2.svg) no-repeat right center; padding:0px 27px 0px 0px; -webkit-background-size: auto 15px;	background-size: auto 15px; word-break: break-all;}
.link a.extlink { display: inline-block;}
p a{ font-size:100%; }
a:hover, a:active, a:focus a:visited{ text-decoration: underline;}

img { border: none;	vertical-align: middle;	height: auto; width: auto;	border:0px;	-ms-interpolation-mode: bicubic;}
.img{ text-align: center; margin:15px auto;}
.img img{ width: 100%;}
.img_right{ float: right; margin-left:20px; margin-bottom:20px;}
.img_right img{ width:100px; margin-top:10px;}
.img_left{ float: left; margin-right:20px; margin-bottom:20px;}
.img_left img{ width:100px; margin-top:10px;}
h3 + .img_max img{ margin-top:0px;}
h2 + .img_max img{ margin-top:5px;}
.img_max img{max-width: 100%; margin-top:20px;}
img.img-inline { vertical-align: middle; text-align: center; height:2em; margin:0px 3px; vertical-align:-50%;}
.img img.img-banner{ max-width: 230px;}

ul li { list-style: none; }
.clear{clear:both;}



/*----------------------------------------------------
  wrapper
----------------------------------------------------*/
#wrapper{
	width: 100%;
	background-color:#FFF;
	overflow: hidden;
	zoom: 1;
}


/*----------------------------------------------------
  contents
----------------------------------------------------*/
#content {
	max-width: 640px;
	margin: 0 auto;
	padding:20px;
}
#content p {
	margin-top: 5px;
}

/*----------------------------------------------------
  page_top
----------------------------------------------------*/
#page_top {
    position: fixed;
    bottom: 20px;
    right: 20px;
}
#page_top a {
	font-size: 80%;
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 130px;
    padding: 15px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
	cursor: pointer;
}
#page_top a:hover {
    text-decoration: none;
    background: #999;
}

/*----------------------------------------------------
  footer
----------------------------------------------------*/
#footer{
	border-top:1px solid #CCC;
	margin:30px 0 85px 0;
	padding-top:10px;
}
#footer p{
	font-size:80%;
	text-align:center;
}

/*----------------------------------------------------
  step系
----------------------------------------------------*/
.title + .operation,
.sub_title + .operation {
	padding: 0px;
	margin: 0px;
}
ol p,
ol .memo{
	margin-left:30px;
}
ol li p,
ol .memo p{
	margin-left:0px;
}
ol.operation ol.item_num,
ol.operation ol.sub_step{
	margin-left:30px;
}
ol.operation,
ol.item_num,
ol.sub_step{
	list-style: none;
	padding: 0;
}
ol.operation{
	counter-reset: operation;
}
ol.sub_step{
	counter-reset: step;
}
ol.item_num{
	margin-top:20px;
	counter-reset: item;
}
ol.operation li,
ol.item_num li,
ol.sub_step li{
	font-weight:bold;
	margin-bottom: 5px;
	padding-left: 30px;
	position: relative;
}
ol.operation li{
	margin-top:20px;
}
ol.sub_step li{
	font-weight: normal;
}
ol.operation li:before{
	content: counter(operation)".";
	counter-increment: operation;
	display: block;
	float: left;
	font-weight:bold;
	font-size:24px;
	line-height: 18px;
	margin-left: -30px;
	text-align: center;
	height: 18px;
	width: 18px;
}
ol.item_num li:before {
	content: counter(item);
	counter-increment: item;
	color:#F00;
	border:1px solid;
	display: block;
	float: left;
	font-weight:bold;
	font-size:15px;
	line-height: 18px;
	margin-top:3px;
	margin-left: -30px;
	text-align: center;
	height: 18px;
	width: 18px;
	border-radius: 50%;
}
ol.sub_step li:before {
	content:counter(step)")";
	counter-increment: step;
	float: left;
	font-size:17px;
	line-height: 18px;
	margin-top:3px;
	margin-left: -30px;
	text-align: center;
	height: 18px;
	width: 18px;
}


/*----------------------------------------------------
	memo | notice
----------------------------------------------------*/
.memo{
	clear:both;
	margin-top:10px;
	border: 1px solid #000;
	padding:10px 15px 15px 15px;
}
.notice{
	clear:both;
	margin-top:20px;
	background-color:#CCC;
	padding:10px 15px 15px 15px;
}


/*----------------------------------------------------
	table
----------------------------------------------------*/
p + .tablescroll,
h3 + .tablescroll{
	margin-top: 5px;
}
table {
	width: 100%;
	border-collapse:collapse;
	border-spacing:0;
	border: 1px solid #C5C5C5;
	border-top:none;
}
table th  {
	border: 1px solid #C5C5C5;
	background-color:#EFEFEF;
	padding: 5px;
	text-align: center;
}
table th p{
	font-weight:bold;
	margin:0px !important;
	padding:0px !important;
}
table tr td {
	border: 1px solid #C5C5C5;
	background-color:#FFF;
	padding: 0px 5px 5px 5px;
	margin:auto;
	vertical-align: middle;
	text-align: left;
}
table img {
	text-align: center;
	vertical-align: middle;
}
.tablescroll{
	margin-top: 20px;
	overflow-x: auto;
}
.tablescroll::-webkit-scrollbar{
	height: 5px;
}
.tablescroll::-webkit-scrollbar-track{
	background: #F1F1F1;
}
.tablescroll::-webkit-scrollbar-thumb {
	background: #BCBCBC;
}
.tablescroll .hide-table-header th{
	border:none;
	padding:0px;
}

/*----------------------------------------------------
	item_explanation
----------------------------------------------------*/
.item_explanation{
	clear: both;
	overflow: hidden;
	zoom:1;
}
.item_explanation_lead_title{
	margin-left:5px;
	margin-bottom: 0px;
	float: left;
	clear:left;
}
.item_explanation_lead_title_line{
	float: left;
	clear:left;
	background: url(a/img/burette/line_01.svg) no-repeat left 15px;
	padding-left: 10px;
	margin-bottom: 0px;
}
.item_explanation_lead_text{
	float: left;
	padding-left: 0px;
}
.item_explanation_lead_text a{
	font-size: 75%;
	padding-left: 10px;
}
.item_explanation_title{
	margin-left:0px;
}
.item_explanation_text{
	padding-left: 14px;
	
}
/*----------------------------------------------------
	sub_note
----------------------------------------------------*/
.sub_note{
	width: auto;
	margin-left:1em;
}
/*----------------------------------------------------
	accent_box
----------------------------------------------------*/
h3 + .accent_box{
	margin-top:0px;
}
.accent_box{
	clear:both;
	width: auto;
	margin-top:30px;
	padding: 5px 10px 5px 10px;
	border: solid 1px #999999;
}
.accent_box > p{
	margin-top:0px !important;
}
.accent_box p{
	margin-left:0px !important;
}

/*----------------------------------------------------
	text系
----------------------------------------------------*/
h1{
	margin:20px 0 0 0;
	padding:0 0 4px 0;
	border-bottom:1px solid;
}
h1:before {
	content:"■";
}
h2{
	margin:20px 0px 10px 0px;
	padding: 4px 10px;
	border:1px solid;
}
h3{
	margin:20px 0px 10px 0px;
}
p.text_right {
	text-align: right;
}
p.text_center {
	text-align: center;
}
.note{
	padding-left: 15px;
}
.note:before {
	content:"● ";
	margin-left: -15px;
}

.foot_note .note {
	background:none;
	padding-left: 0px;
	margin-left:1em;
	text-indent:-1em;
}
.foot_note .num {
	margin-left:1.95em; 
	text-indent:-1.95em;
}

.link a{
	margin: 5px 0px 10px 19px;
	display:block;
}