@charset "EUC-JP";

.column-desc { font-size: 1.225em; padding: 15px 0 40px 0; }

.column-title { background: url(../image/title_icon.png) no-repeat 0 28px; background-size: 38px auto; font-size: 2.25em; line-height: 1.7em; color: #253494; font-weight: bold; padding: 25px 0 25px 52px; border-top: #253494 solid 3px; border-bottom: #ccc solid 1px; position: relative; margin-bottom: 20px; }
.column-title:after { content: ''; height: 3px; width: 30%; background-color: #fff100; position: absolute; right: 0; top: -3px; }

.column-list { margin-bottom: 20px; padding-bottom: 10px; }
.column-list > div { border-bottom: #ccc solid 1px; padding-bottom: 20px; margin-bottom: 20px; }
.column-list > div:last-child { border-bottom: none; }
.column-list a { display: block; }
.column-list a:after { content: ''; display: block; clear: both; }
.column-list a > div:nth-child(1) { float: left; width: 240px; }
.column-list a > div:nth-child(1) img { width: 100%; height: auto; }
.column-list a > div:nth-child(1) span.c, .column-detail-head > div:nth-child(1) span.c { float: left; background-color: #fff996; color: #333333; padding: 2px 10px; margin-top: 9px; font-size: 0.99em; }
.column-list a > div:nth-child(1) span.d, .column-detail-head > div:nth-child(1) span.d { float: right; background: url(../image/date_icon.png) no-repeat 0 4px; background-size: 15px auto; color: #666666; padding: 2px 0 2px 20px; margin-top: 9px; font-size: 1.05em; }
.column-list a > div:nth-child(2) { float: right; width: calc(100% - 260px); }
.column-list a > div:nth-child(2) h3 { color: #253494; font-weight: bold; font-size: 1.627em; line-height: 1.6em; }
.page-width #contents .column-list a > div:nth-child(2) p { font-size: 1.05em; color: #333333; line-height: 1.8em; padding-top: 10px; }
.column-list a:hover { text-decoration: none; }
.column-list a:hover img { opacity: 0.8; }
.column-list a:hover h3 { text-decoration: underline; }

.column-list-set { margin: 0 -13px 20px -12px; }
.column-list-set:after { content: ''; display: block; clear: both; }
.column-list-set > div { float: left; border: none; width: calc(33.33% - 25px); margin: 0 12px 20px 13px; padding: 0; }
.column-list-set > div:nth-child(3n + 1) { clear: both; }
.column-list-set a > div:nth-child(1) { float: none; width: auto; }
.column-list-set a h3 { clear: both; color: #253494; padding-top: 8px; font-size: 1.21em; line-height: 1.6em; }

.column-detail-title { font-size: 2.32em; line-height: 1.5em; color: #253494; font-weight: bold; padding: 25px 0; border-top: #253494 solid 3px; position: relative; }
.column-detail-title:after { content: ''; height: 3px; width: 30%; background-color: #fff100; position: absolute; right: 0; top: -3px; }

.column-detail-head { margin-bottom: 30px; }
.column-detail-head:after { content: ''; display: block; clear: both; }
.column-detail-head > div:nth-child(1) { float: left; }
.column-detail-head > div:nth-child(1) span.c { margin: 0; padding: 0; }
.column-detail-head > div:nth-child(1) span.c a { display: block; border: #feef00 solid 1px; padding: 3px 10px; color: #333333; }
.column-detail-head > div:nth-child(1) span.d { float: left; font-size: 1.225em; background-position: 0 5px; margin: 0 15px 0 0; }
.column-detail-head > div:nth-child(2) { float: right; }
.column-detail-head > div:nth-child(2) > div { float: left; padding: 3px 0 3px 10px; height: 26px; }

#contents .column-detail p, #contents .column-detail li, #contents .column-detail th, #contents .column-detail td, #contents .column-detail dt, #contents .column-detail dd { line-height: 1.8em; }
.column-detail { font-size: 1.225em; padding-bottom: 20px; }
.column-detail:after { content: ''; display: block; clear: both; }
.column-detail .center { text-align: center; }
.column-detail .img { text-align: center; margin-bottom: 30px; }
.column-detail p, .column-detail .p { margin-bottom: 20px; }
#contents .column-detail .b { font-weight: bold; /*color: #253494;*/ }
.column-detail h2 { font-size: 1.64em; font-weight: bold; color: #253494; border-bottom: #253494 solid 2px; padding: 0 0 8px 15px; margin-bottom: 20px; margin-top: 30px; position: relative; }
.column-detail h2:before, .column-detail h2:after, .column-detail h3:before, .column-detail h3:after, .column-detail h4:before, .column-detail h4:after { content: ''; width: 4px; height: 20px; background-color: #fff100; position: absolute; left: 0; top: 6px; }
.column-detail h2:after, .column-detail h3:after, .column-detail h4:after { background-color: #253494; height: 10px; }
.column-detail h3 { font-size: 1.5em; border-bottom: #ccc solid 1px; margin-bottom: 20px; margin-top: 30px; padding: 0 0 6px 15px; position: relative; font-weight: bold; }
.column-detail h3:before, .column-detail h3:after { top: 5px; }
.column-detail h4 { font-size: 1.365em; margin-bottom: 15px; padding: 0 0 0 15px; position: relative; }
.column-detail h4:before, .column-detail h4:after { top: 4px; }
.column-detail h5 { font-size: 1.155em; margin-bottom: 15px; padding: 0 0 0 15px; position: relative; }
.column-detail h5:before { content: ''; width: 4px; height: 18px; background-color: #ccc; position: absolute; left: 0; top: 3px; }
.column-detail figure.limg { float: left; margin: 0 25px 20px 0; }
.column-detail figure.rimg { float: right; margin: 0 0 20px 25px; }
.column-detail figure { display: table; width: 1px; padding-top: 5px; }
.column-detail figure img { display: table-row; }
.column-detail figure figcaption { display: table-row; color: #707070; font-style: italic; padding-top: 5px; font-size: 0.885em; }
.column-detail a { color: #253494; text-decoration: underline; }
.column-detail ul, .column-detail ol { margin-bottom: 20px; }
.column-detail li { position: relative; padding-left: 25px; }
.column-detail ul li:before { content: 'ąŁ'; color: #253494; position: absolute; left: 2px; font-size: 0.8em; }
.column-detail ol { counter-reset: olli; }
.column-detail ol li:before { counter-increment: olli; content: counter(olli); background-color: #253494; color: #fff; font-weight: bold; position: absolute; left: 0; top: 5px; font-size: 0.8em; width: 16px; text-align: center; line-height: 16px; }
.column-detail dl { margin-bottom: 10px; padding-bottom: 5px; }
.column-detail dt { font-weight: bold; }
.column-detail dd { margin-bottom: 10px; }
.column-detail table { width: 100%; border-collapse: collapse; margin-bottom: 30px; }
.column-detail th, .column-detail td { border: #ccc solid 1px; padding: 8px 10px; }
.column-detail th { background-color: #eee; }
.column-detail blockquote { margin: 0 0 30px 0; background:#f7f7f7 url(../image/quote.png) no-repeat 20px 20px; padding: 30px 30px 30px 80px; }
.column-detail pre { border: #e1e1e1 solid 1px; margin: 0 0 30px 0; width: auto; background-color: #fff; padding: 20px; }
.column-detail .matomeBox{ background: #f9f9f9; padding: 15px; border: solid 1px #eee; margin-bottom: 15px;}
.column-detail .matomeBox p:last-child,
.column-detail .matomeBox ul{ margin-bottom: 0;}
.column-detail .questionTitle{font-size: 1.2em; font-weight: bold;}

.column-detail span.b{font-weight: bold; color: #444444; background: linear-gradient(transparent 60%, #fffe95 0%);}


.column-detail .dataBox{ background: #FFF; border: solid 1px #eee; font-size: 12px;}
.column-detail .dataBox.mb {margin-bottom: 20px;}
.column-detail .dataBox .title{ font-weight: bold; font-size: 14px; background: #eee;padding: 5px 15px;}
.column-detail .dataBox dl{ overflow: hidden; margin: 0;  padding: 15px;}
.column-detail .dataBox dl dt{ float: left; width: 9em; clear: left; }
.column-detail .dataBox dl dd{ float: left; margin-bottom: 0;}



@media screen and (max-width: 640px) {

.column-desc { padding: 15px 0 25px 0; }

.column-title { background-position: 0 18px; background-size: 25px auto; font-size: 1.68em; padding: 15px 0 15px 35px; margin-bottom: 10px; }

.column-list { margin-bottom: 10px; }
.column-list > div { padding-bottom: 10px; margin-bottom: 10px; }
.column-list > div:last-child { border-bottom: #ccc solid 1px; }
.column-list a > div:nth-child(1) { width: 105px; }
.column-list a > div:nth-child(1) img { width: 100%; height: auto; }
.column-list a > div:nth-child(1) span { display: none; }
.column-list a > div:nth-child(1) span.c, .column-detail-head > div:nth-child(1) span.c { padding: 2px 5px; margin-top: 5px; font-size: 0.71em; }
.column-list a > div:nth-child(1) span.d, .column-detail-head > div:nth-child(1) span.d { background-position: 0 5px; background-size: 10px auto; padding: 2px 0 2px 13px; margin-top: 4px; font-size: 0.8em; }
.column-list a > div:nth-child(2) { width: calc(100% - 115px); }
.column-list a > div:nth-child(2) h3 { font-size: 1.25em; line-height: 1.4em; }
.page-width #contents .column-list a > div:nth-child(2) p { display: none; }
.column-list a:hover img { opacity: 1; }
.column-list a:hover h3 { text-decoration: none; }

.column-list-set { margin: 0 -5px 5px -5px; }
.column-list-set > div { width: calc(50% - 10px); margin: 0 5px 15px 5px; padding: 0; }
.column-list-set > div:last-child { border: none; }
.column-list-set > div:nth-child(3n + 1) { clear: none; }
.column-list-set > div:nth-child(2n + 1) { clear: both; }
.column-list-set a > div:nth-child(1) { float: none; width: auto; }
.column-list-set a > div:nth-child(1) span { display: block; }
.column-list-set a h3 { padding-top: 5px; font-size: 1.06em; }

.column-detail-title { font-size: 1.72em; padding: 15px 0; }

.column-detail-head { margin-bottom: 15px; }
.column-detail-head > div:nth-child(1) span.c { margin: 0; padding: 0; }
.column-detail-head > div:nth-child(1) span.c a { font-size: 0.92em; padding: 4px 6px; }
.column-detail-head > div:nth-child(1) span.d { font-size: 0.92em; background-position: 0 4px; margin: 0 3px 0 0; }
.column-detail-head > div:nth-child(2) > div { padding: 0 0 0 3px; height: 20px; }

.column-detail { font-size: 1.18em; padding-bottom: 1px; }
.column-detail .img { margin-bottom: 15px; }
.column-detail p, .column-detail .p { margin-bottom: 15px; }
.column-detail h2 { font-size: 1.4em; margin-bottom: 10px; padding-bottom: 5px; }
.column-detail h2:before, .column-detail h2:after, .column-detail h3:before, .column-detail h3:after, .column-detail h4:before, .column-detail h4:after { top: 3px; }
.column-detail h3 { font-size: 1.25em; margin-bottom: 10px; padding: 0 0 4px 15px; }
.column-detail h3:before, .column-detail h3:after { top: 2px; }
.column-detail h4 { font-size: 1.23em; margin-bottom: 10px; }
.column-detail h4:before, .column-detail h4:after { top: 2px; }
.column-detail h5 { font-size: 1.2em; margin-bottom: 10px; }
.column-detail h5:before { height: 18px; top: 2px; }
.column-detail figure.limg, .column-detail figure.rimg { float: none; margin: 0 0 10px 0; }
.column-detail figure { display: block; width: 100%; padding-top: 0; }
.column-detail figure img { display: block; width: 100%; height: auto; }
.column-detail figure figcaption { display: block; }
.column-detail ul, .column-detail ol { margin-bottom: 15px; }
.column-detail li { padding-left: 20px; }
.column-detail ol li:before { top: 3px; }
.column-detail dl { margin-bottom: 5px; }
.column-detail dd { margin-bottom: 5px; }
.column-detail table { margin-bottom: 15px; }
.column-detail th, .column-detail td { padding: 5px; }
.column-detail blockquote { margin: 0 0 15px 0; background-position: 10px 10px; background-size: 25px auto; padding: 20px 20px 20px 45px; }
.column-detail pre { margin: 0 0 15px 0; padding: 10px; }

.column-detail .dataBox{ font-size: 10px; }
.column-detail .dataBox.mb {margin-bottom: 15px;}
.column-detail .dataBox .title{ font-size: 12px;}

.column-detail .questionTitle{font-size: 1.15em; font-weight: bold;}

}




/*201911 add*/
.recommendBox{
	display: block;
	clear: both;
	border: solid 1px #DDD;
	background: #EEE;
	padding: 20px;
	overflow: hidden;
	margin: 0 0 30px 0;
}
.recommendBox p:last-child,.recommendBox ol:last-child,.recommendBox ol li:last-child{
	margin-bottom: 0 !important;
}
.recommendBox .subImage{
	float: left;
	max-width: 20%;
	margin: 0 20px 0 0 !important;
}
.recommendBox .subImage img{
	width: 100%;
	display: block;
}
.recommendBox .serviceLink{
	float: right;
	position: relative;
	display: inline-block;
	padding: 0 0 0 16px;
	color: #000;
	vertical-align: middle;
	text-decoration: none;
}
.recommendBox .serviceLink::before,
.recommendBox .serviceLink::after{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.recommendBox .serviceLink::before{
	left: 4px;
	width: 5px;
	height: 1px;
	background: #253494;
}
.recommendBox .serviceLink::after{ left: 4px;	width: 4px;	height: 4px; border-top: 1px solid #253494; border-right: 1px solid #253494; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.recommendBox h4:before, .recommendBox h4:after { content: ''; width: 4px; height: 20px; background-color: #fff100; position: absolute; left: 0; top: 4px; }
.recommendBox h4:after { background-color: #253494; height: 10px; }

.recommendBox h4{ font-size: 120%; line-height: 120%; letter-spacing: 0.05em; color:#FFFFFF; padding: 10px 15px 7px 15px; margin-bottom:20px;	background:#253494;	-webkit-border-radius: 3px;	-moz-border-radius: 3px;	border-radius: 3px;	position:relative;}
.recommendBox.recommendBox2 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 15px; border-radius: 3px; background: #253494;}
.recommendBox2 h4 {margin-bottom: 0; width: 200px;}
.recommendBox2 p {margin: 0; padding: 10px 30px 7px 30px; width: calc(100% - 200px); box-sizing: border-box; background: #eee;}
.recommendBox2 p a { display: block;}
.recommendBox2 p a:hover {opacity: 0.7;}
.section .checklist ol li:before { top: 0; }
@media screen and (max-width: 640px) {
	.recommendBox .subImage{ max-width: 40%; }
  .recommendBox2 h4 { width: 100%;}
  .recommendBox2 p { width: 100%; margin: 0; padding: 10px;}
}

.table-list th { font-size: 14px; font-weight: bold; padding: 5px 15px; line-height: 1.5!important;}
.table-list td { font-size: 0.8em; }
@media screen and (max-width: 640px){
  .table-list th { font-size: 12px; padding: 5px; }
  .table-list td { font-size: 10px; }
}