@charset "UTF-8";


/* ---------------------------------
	reset
--------------------------------- */
a	{ color: #003399; }
a[href]:hover, a[href]:focus { text-decoration: underline; }

/* ---------------------------------
	header
--------------------------------- */
.header_inner	{ justify-content: flex-start;}
.header_inner .global { padding: 0; font-size: 1.625rem; }
.header_inner .global .inner { margin: 0 auto; max-width: 83.5rem; }
.header_inner .global .inner a	{ margin-left: 0.9375rem; }

	.global-title, .global-title:visited { color: #D2D2D2; }

@media (max-width: 1000px) {
	.header	{ height: 4.062rem; }
	.header_inner	{ padding-top: 0.375rem; }
	.header_inner .global	{ font-size: 1.1875rem; padding: 0 0 0 0.9375rem; }
	.global-logo { margin: 0.125rem 0 0; max-width: 84%; }
	.header_inner .global .inner	{ padding: 0; } 
	.header_inner .global .inner a	{ margin-left: 0.625rem; }

}

@media all and (min-width:1001px)	{
	.header_inner {
	   padding-top: 0.375rem;
	}
}

.page_header {
	font-size: 1.875rem;
	padding-top: 80px;
	padding-bottom: 92px;
}

@media (max-width: 1000px) {
	.page_header {
		font-size: 1.625rem;
		padding-top: 2.5rem;
		padding-bottom: 1.25rem;
		line-height: 1.4;
	}
}

/* ---------------------------------
	footer
--------------------------------- */
.footer_inner	{ padding-top: 0; }
.btn_page_to_top	{ top:30px; }

@media (max-width: 500px) {
	.footer_inner	{ padding-top: 48px; }
}

/* ---------------------------------
	page-nav
--------------------------------- */
.page-nav {
    display: flex;
    align-items: center;
	justify-content: flex-end;
}
.page-nav {
    margin-left: 21.25rem;
    margin-bottom: 1.4375rem;
    padding-top: 0.0625rem;
    padding-left: 1.8125rem;
}
.page-nav .back > a	{
	background:url("/digital-paper/mobileapp/helpguide/images/icon-back.png") left center no-repeat;
    padding-left: 1.125rem;
    padding-right: 0.5rem;
}
.page-nav .top	{
	border:thin none #8B7254;
	border-left-style:solid;
	padding-left:0.625rem;
}
.page-nav:after	{
	content:"";
	clear:both;
	display:block;
	width:0;
}


@media (max-width: 1000px) {
.page-nav	{ display:none; }
}


/* ---------------------------------
	guidecontainer
--------------------------------- */

#maincontents	{
	width: 90%;
	max-width: 1166px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 3rem;
	line-height: 1.5;
}


/* #main */
.guidecontainer	{ display: flex; }

.guidecontainer	#main	{
	order: 2;
	flex-basis: 74%;
	margin-left: 2rem;
}
	
.guidecontainer	#main a	{ color: #039; }
.guidecontainer	#main a:hover	{ text-decoration: underline; }

.guidecontainer #main h2	{
	display: block;
    margin-bottom: 0.833em;
    border-bottom: 0.0625rem solid #767676;
    padding: 0.3333em 0.5417em 0.5833em 0.4167em;
    font-size: 1.5rem;
    font-weight: bold;
}

@media (max-width: 1000px) {
	.guidecontainer	{ display: block; }
	.guidecontainer	#main	{ margin-left: 0; }
	.guidecontainer #main h2 {
		margin-bottom: 0.3125em;
		padding: 0.875rem 0;
		font-size: 1.3125rem;
	}
}



	#id_content{
		padding:0 0.8125em 0 0.625em;
		margin-bottom:3.125em;
	}

	#id_content h3	{
		margin:1.8182em 0 1.36em;
		border:0.2273em none #a5a5a5;
		border-left-style:solid;
		padding:0.1818em 0 0.1818em 0.4545em;
		font-size:1.375em;
		font-weight:bold;
	}

	#id_content h4	{
		margin-bottom:0.389em;
		font-size:1.125em;
		font-weight:bold;
	}

	#id_content p	{ margin-bottom: 1.25em; }
	#id_content p + p	{ margin-top: -1.25em; }

	#id_content ul.list,
	#id_content ul.choices {
		margin-top: .3125em;
		padding-left: 0.625em;
		margin-bottom: 1.3125em;
	}
	#id_content ul.list > li,
	#id_content ul.choices > li	{
		position: relative;
		margin-left: 2rem;
	}
	#id_content ul.list > li:after,
	#id_content ul.choices > li:after	{
		display: block;
		content: '';
		position: absolute;
		top: .5em;
		left: -1em;
		width: 6px;
		height: 6px;
		background-color: #8B7254;
		border-radius: 100%;
	}
	#id_content .note, #id_content .hint {
		margin-bottom: 1.429em;
		border: thin solid #F0F0F0;
		border-radius: 0.5714285714285714em;
		padding: 0.786em 1.28em 0;
		background: #F0F0F0;
		font-size: 0.875em;
	}
	#id_content .note h4 { color: #bb0000; }
	#id_content .note h4, #id_content .hint h4 {
		margin-bottom: 0.5714285714285714em;
		font-size: 1.143em;
		font-weight: bold;
	}
	#id_content .note ul, #id_content .hint ul {
		padding-left: 0.429em;
	}
	#id_content .note ul > li, #id_content .hint ul > li {
		position: relative;
		margin-bottom: 1em;
			margin-left: 1rem;
	}
	#id_content .note ul > li:after, #id_content .hint ul > li:after {
		display: block;
		content: '';
		position: absolute;
		top: .5em;
		left: -1em;
		width: 6px;
		height: 6px;
		background-color: #8B7254;
		border-radius: 100%;
	}

	#id_content .main-visual	{
		padding : 0;
		text-align: center;
		line-height: 1;
	}
	#id_content .main-visual img	{
		max-width: 100%;
		max-height: none;
	}
	#id_content img {
		max-height: 1.2em;
		vertical-align: middle;
	}
	#id_content p.img-left,
	#id_content p.img-center,
	#id_content p.img-right	{
		margin:1em 0;
		line-height:1;
	}
	#id_content p.img-left img,
	#id_content p.img-center img,
	#id_content p.img-right img{
		display:inline !important;
		max-height:none;
		max-width:100%;
		margin: 0.6em;
	}
	#id_content p.img-left	{ text-align:left;}
	#id_content p.img-center{ text-align:center; }
	#id_content p.img-right	{ text-align:right; }	

	#id_content p.img-left + p,
	#id_content p.img-center + p,
	#id_content p.img-right + p	{ margin-top: 0; }	
		
		/* .step-list */
		#id_content .step-list	{
			margin-bottom: 3.125em;
			padding-top: 0;
			padding-left: 2.5em;
			counter-reset :step;
			list-style: none;
		}
		#id_content .step-list > li	{
			position: relative;
			border-bottom: 0.0625rem solid transparent;
			margin: 0;
			padding: 0;
		}
		#id_content .step-list > li:before	{
			content: "";
			position: absolute;
			height: 100%;
			width: 0.0625em;
			background: #443936;
			left: -1.5em;
		}
		#id_content .step-list > li:after	{
			content: "";
			display: block;
			margin-bottom: 2.3125em;
		}
		#id_content .step-list > li:last-child:after	{
			content: none;
			display: none;
		}
		#id_content .step-list .step-desc	{
			margin-bottom: 0.4em;
			font-size: 1.25em;
			font-weight: bold;
		}
		#id_content .step-list .step-desc:only-child	{　margin-bottom: 0;	}
		#id_content .step-list .step-desc:before	{
			position: absolute;
			display: block;
			top: -0.1em;
			left :-2.0em;
			width: 1.6em;
			height: 1.6em;
			content: counter(step);
			counter-increment: step;
			background: #443936;
			border-radius: 50%;
			text-align: center;
			color: #fff;
			line-height:1.6;
		}

		#id_content .step-list .maru {
			display: inline-flex;
			justify-content: center;
			align-items: center;
			border-radius: 50%;
			flex-flow: column; 
			vertical-align: top;
			width: 1.5em;
			height: 1.5em;
			line-height: 1.5em;
			color: #fff;
			background: #443936;
			margin: 0 0.2em;
		}

		@media (max-width: 1000px) {
			#id_content .step-list .step-desc {
				font-size: 1em;
				margin-bottom: 0.75em;
			}
			#id_content .step-list {
				padding-left: 2.3125em;
				margin-bottom: 2.5em;
			}
		}
	
		/* .substeps */
		#id_content .substeps	{
			counter-reset: substep;
			padding-top: 0.3125em;
		}
		#id_content .substeps > li	{
			position: relative;
			margin-bottom: 0.5625em;
			padding-left: 1.875em;
		}
		#id_content .substeps > li:before	{
			position: absolute;
			top: 0;
			left :0;
			content: counter(substep) ".";
			counter-increment: substep;
			color: #443936;
			font-weight: bold;
			font-size: 1.125em;
			vertical-align: middle;
		}


/* #aside */
.guidecontainer	#aside	{
	order: 1;
	flex-basis: 26%;
	}


	#menu .level1 > li > p	{
		border: thin solid #BABABA;
		border-bottom-style:none;
		background:#EDEFE1;
		padding:0.8125rem 0.875rem;
		font-weight:bold;
	}

	#menu .level2	{
		padding: 0 0.625rem 0 0.625rem;
		border: thin solid #BABABA;
		border-bottom-style: none;
		background: #fff;
		position: relative;
	}

	#menu :last-child > .level2	{
		border-bottom-left-radius: 0.125rem;
		border-bottom-right-radius: 0.125rem;
		border-bottom-style: solid;
	}

	#menu .level2 > li	{ 
		position: relative;
		display: block;
		padding: 0.6rem 0 0.6rem 1rem;
		color: #000;
		text-decoration: none;
		border-bottom: thin dotted #BABABA;
	}
	#menu .level2 > li:last-child	{ border-bottom: none; } 
	#menu .level2 > li:before,
	#menu .level2 > li:after	{
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		margin: auto;
		content: "";
		vertical-align: middle;
	}
	#menu .level2 > li:before	{
		left: 4px;
		box-sizing: border-box;
		width: 4px;
		height: 4px;
		border: 4px solid transparent;
		border-left: 4px solid #8B7254;
	}
	#menu .level2 > li > a	{
		display: block;
		border-radius: 0.3125rem;
		padding: 0.375rem ;
		overflow: visible;
	}
	#menu .level2 > li > a:hover	{ text-decoration: underline; }

	#menu .level2 > li > .active	{ background: #E2ECDB; }