/* Common */

#contents { 
	text-align: left;
	}

#contents h2 {
	clear: both;
	margin-bottom: 1em;
	padding: 0.5em;
	border: 1px solid #cecece;
	background: url(../../../images/header/h2_bg.png) repeat center right;
	line-height: 1; /* 24px */	
	font-size: 1.5em; /* 24px */
	}

#contents h3 {
	clear: both;
	margin-bottom: 1em;
	padding: 0.5em;
	border-bottom: 1px solid #cecece;
	line-height: 1.5; /* 24px */
	font-size: 1.25em; /* 24px */
	}

#contents h4 {
	clear: both;
	margin-bottom: 1em;
	line-height: 1.5; /* 24px */
	font-size: 1em; /* 24px */
	}

#contents h5 {
	clear: both;
	margin-bottom: 1em;
	padding-left: 1em;
	border-left: 5px solid #0066cc;
	line-height: 1.5; /* 24px */
	font-size: 90%; /* 24px */
	}
	
#contents .section {
	clear: both;
	margin-bottom: 1em;
	padding: 0.5em;
	}

#contents p,
#contents ul,
#contents ol, 
#contents li { 
	margin-bottom: 0;
	}

#contents ul {
	list-style: disc;
	margin-left: 20px;
	}

#contents ol {
	list-style: decimal;
	margin-left: 30px;
	}

#contents dl {
	margin-left: 1em;
	margin-bottom: 1.5em;
	}

#contents dl.info dt{
	float: left;
	}

#contents dl.info dd { 
	margin-left: 2.5em;
	margin-bottom: 1.5em;
	}

#contents dl.info dd dl.info {
	clear: both;
	margin-left: 0;
	}

#contents dl.info dd dl.info dt {
	float: left;
	}

#contents dl.info dd dl.info dd {
	margin-left: 3em;
	margin-bottom: 1.5em;
	}
    
#contents dl.info dd dl.infotel {
	clear: both;
	margin-left: 0;
	}

#contents dl.info dd dl.infotel dt {
	float: left;
	}

#contents dl.info dd dl.infotel dd {
	margin-left: 6em;
	margin-bottom: 1.5em;
	}

#contents a{
	color: #0066cc;	
	}

#contents a:hover{
	color: #92b4dd;
	text-decoration: underline;	
	}

#contents .intro {
	margin-bottom: 1.5em;
	padding: 0.5em;
	border-bottom: 1px dashed #e6e6e6;
	}

#contents .indent {
	margin-left: 20px;
	}

#contents .choice {
	margin-bottom: 1.5em;
	padding: 0.5em;
	}

#contents .choice ul {
	list-style: square;
	margin: 0 0 1em;
	}

#contents .choice li {
	float: left;
	margin: 0 2em 1.5em 0;
	list-style: none;
	}

#contents table {
	width: 100%;
	margin-bottom: 1.5em;
	border: solid 1px #CCC;
	border-bottom: none;
	border-left: none;
	font-size: 90%;
	}

#contents th {
	padding: 0.25em;
	border-top: none;
	border-right: none;
	border-bottom: solid 1px #CCC;
	border-left: solid 1px #CCC;
	background: #EFEFEF;
	font-weight: normal;
	color: #666;
	text-align: center;
	}

#contents td {
	padding: 0.25em;
	border-top: none;
	border-right: none;
	border-bottom: solid 1px #CCC;
	border-left: solid 1px #CCC;
	}

#contents table.specially {
	font-size: 100%;
	}

#contents table.specially td {
	text-align: center;
	}

#contents td p,
#contents td ul,
#contents td ol,
#contents td li {
	margin-bottom: 0;
	}

#contents .section .chui {
	padding-top: 1.5em;
	border-top: 1px dashed #cecece;
	font-size: 90%;
	}

#contents .section .goold {
	padding: 0.5em;
	background: #EFEFEF;
	font-weight: bold;
	}

sup { font-size: 70%; }

.red { color: #ff0000; font-weight: bold; }
.orange { color: #ff9900; font-weight: bold; }
.yellow { color: #ffcc33; font-weight: bold; }
.green { color: #009900; font-weight: bold; }
.blue { color: #0000ff; font-weight: bold; }
.black { color: #333333; font-weight: bold; }

.rgt { text-align: right; }
.cnt { text-align: center; }

.small-p { font-size: 80%; }

tr.retire { background-color: #F1F1F1; }

/*--------- テキストインデント　---------*/
/*--- 1字ぶら下げ インデントなし　---*/
.br10m {
text-indent: -1em;
margin-left: 1em;
}
.br3m {
text-indent: -3em;
margin-left: 3em;
}
/*--- 米印用ぶら下げ　---*/
.brkm {
text-indent: -1.3em;
margin-left: 1.3em;
}
.brkm2 {
margin-left: 1em;
text-indent: -0.9em;
}

/* 間隔 */
.mt0 {
margin-top: 0px !important;
}
.mt05 {
margin-top: 5px !important;
}
.mt10 {
margin-top: 10px !important;
}
.mt40 {
margin-top: 40px !important;
}
.ml0 {
margin-left: 0px !important;
}
.ml05 {
margin-left: 5px !important;
}
.ml10 {
margin-left: 10px !important;
}
.ml20 {
margin-left: 20px !important;
}
.ml40 {
margin-left: 40px !important;
}
.ml1m {
margin-left: 1em !important;
}
.ml1_5m {
margin-left: 1.5em !important;
}
.ml2m {
margin-left: 2em !important;
}
.ml3m {
margin-left: 3em !important;
}
.ml4m {
margin-left: 4em !important;
}
.ml5m {
margin-left: 5em !important;
}
.mr05 {
margin-right: 5px !important;
}
.mr20 {
margin-right: 20px !important;
}
.mb0 {
margin-bottom: 0 !important;
}
.mb5 {
margin-bottom: 5px !important;
}
.mb10 {
margin-bottom: 10px !important;
}
.mb20 {
margin-bottom: 20px !important;
}
.mb40 {
margin-bottom: 40px !important;
}
.mb1m {
margin-bottom: 1em !important;
}
.pb0 {
padding-bottom: 0 !important;
}
.pb5 {
padding-bottom: 5px !important;
}
.pb0_3m {
padding-bottom:0.3em;
}
.pb10 {
padding-bottom: 10px !important;
}

/*--- ボックス　---*/
#contents div.wh-box {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 10px;
	border: solid 2px #555555;
	border-radius: 10px;
	padding: 5px;
	font-size: 120%;
}

#contents div.yellow-box {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 10px;
	border: solid 2px #555555;
	border-radius: 10px;	
background-color: #FFFF66;
	font-size: 120%;
}

#contents div.l-yellow-box {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 10px;
	border: solid 2px #555555;
	border-radius: 10px;
	padding: 5px;
background-color: #FFFFcc;
	font-size: 120%;
}

#contents div.pink-box {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 15px;
	border: solid 2px #555555;
	border-radius: 10px;	
background-color: #ffc0cb;
	font-size: 120%;
}

#contents div.green-box {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 15px;
	border: solid 2px #555555;
	border-radius: 10px;	
background-color: #99ff99;
	font-size: 120%;
}

#contents div.blue-box {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 10px;
	border: solid 2px #003399;
	border-radius: 10px;
	padding: 5px;
background-color: #f0ffff;
	font-size: 120%;
}

#contents div.blue-box2 {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 15px;
	border: solid 2px #000000;
	border-radius: 10px;
	padding: 5px;
background-color: #f0ffff;
	font-size: 120%;
}

#contents div.reddot-box1 {
	float: left;
	width: 50%;
	margin-bottom: 10px;
	margin-left: 15px;
	border: dotted 3px #ff0000;
	border-radius: 10px;
	padding: 5px;
	overflow: visible;
	font-size: 120%;
}

#contents div.reddot-box2 {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 15px;
	border: dotted 3px #ff0000;
	border-radius: 10px;
	padding: 5px;
	overflow: visible;
	font-size: 120%;
}

#contents div.bluedot-box {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 15px;
	border: dotted 3px #0000ff;
	border-radius: 10px;
	padding: 5px;
	overflow: visible;
	font-size: 120%;
}

#contents div.c-box {
	float: left;
	width: 30%;
	margin-bottom: 10px;
	margin-left: 10px;
}

#contents div.c-box1 {
	float: left;
	width: 20%;
	margin-bottom: 10px;
	margin-left: 10px;
}

/*--- 矢印　---*/
.arrow1 {
	text-align: center;
	font-size: 55px;
	color: #ff0000;
}

.arrow1b {
	text-align: center;
	font-size: 55px;
	color: #000000;
}

.arrow2 {
	line-height: 30px;
	font-size: 55px;
	color: #0000ff;
}

.arrow2b {
	line-height: 30px;
	font-size: 55px;
	color: #000000;
}

.arrow3 {
	line-height: 35px;
	font-size: 55px;
	color: #ff0000;
}

.arrow3b {
	line-height: 35px;
	font-size: 55px;
	color: #000000;
}

.arrow4 {
	font-size: 55px;
	color: #0000ff;
	margin-left: -15px;
}

.arrow4b {
	font-size: 55px;
	color: #000000;
	margin-left: -15px;
}

.fs {
	font-size: 20px;
}

.fs1 {
	font-size: 20px;
	margin-left: -7px;
}

.toolTipIcon {
	display: block;
	width: 20px;
	height: 20px;
	background: url(../images/icn_mode_help.svg) no-repeat;
	background-size: 20px 20px;
	margin-top: 1px;
	margin-left: 3px;
	flex-shrink: 0;
}

.toolTipWrapper {
	padding-top: 250px;
	margin-top: -250px;
}

.toolTipWrapper:not(:target) {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.5s, visibility 0.5s;
}

.toolTipWrapper:not(:target) img {
	height: 0 !important;
}

.toolTipWrapper:target {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.5s, visibility 0.5s;
}

.toolTipWrapper:target img {
	height: auto;
}

.toolTipContent {
	position: absolute;
	max-width: 550px;
	left: 0;
  	right: 0;
	top: 87px;
  	margin: auto;
	box-sizing: border-box;
	padding: 30px;
	background: #fff;
	border-radius: 15px;
	box-shadow: 0 5px 10px 1px rgba(0,0,0,0.4);
}

.toolTipClose {
	position: absolute;
  	top: 15px;
  	right: 15px;
	text-decoration: none !important;
	font-size: 30px;
}

.toolTipContent img {
	width: 100%;
}

@media screen and (max-width: 568px) {
	.toolTipWrapper {
		padding-top: 300px;
		margin-top: -300px;
	}

	.toolTipContent {
		width: 100%;
		padding: 30px 10px;
		top: 100px;
	}
}

/*768px*/
@media screen and (min-width : 768px){
	
}

/*1024px*/
@media screen and (min-width : 1024px){
	
#contents h2,
#contents h3,
#contents .intro,
#contents .choice,
#contents .section {
	margin: 0 2.08333%; /*20/960*/
	margin-bottom: 1em;
	}
}