@charset "utf-8";
/* CSS Document */

/* clickpost
----------------------------------------------- */
.h1lead.clickpost .clm.img{
	display:block; text-align:center; padding:30px 0;
}
	.h1lead.clickpost .clm.img .logo img{
		width:310px;
	}
.h1lead.clickpost ul.icon{
	display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center; margin-top:20px;
}
.h1lead.clickpost ul.icon li {
	background: #fff;border: 1px solid #c00;border-radius: 3px;height: 64px;margin-right: 10px;position: relative;width: 64px;
}
.h1lead.clickpost ul.icon li span {
	bottom: 2px;display: block; color:#cc0000;font-family: "Noto Sans Japanese","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Hiragino Sans","ヒラギノ角ゴシック",メイリオ,Meiryo,sans-serif;font-size: 6px;font-size: 12px;font-weight: 400;left: 0;line-height: 1;margin: auto;position: absolute;right: 0;
	-webkit-transform: scale(.9);
	transform: scale(.9);
	-webkit-transform-origin: left center;
	transform-origin: left center;
	width: calc(100%/.9);
}

.h1lead.clickpost ul.icon li span:before {
	display: block; font-size: 50px; font-weight: 400; color:#cc0000;
}
.h1lead.clickpost ul.icon li span.tokan:before {content: "\e980";font-family: yubin;}
.h1lead.clickpost ul.icon li span.tsuiseki:before {content: "\e944";font-family: yubin;}
.h1lead.clickpost ul.icon li span.syuka:before {content: "\e93e";font-family: yubin;}
.h1lead.clickpost ul.icon li span.allyear:before {content: "\e9a4";font-family: yubin;}

/* clickpost
----------------------------------------------- */
.mainArea.clickpost{}
.mainArea.clickpost ol.point li{list-style-type:none; display:inline-block; width:33%; text-align:center; margin-bottom:15px;}
.mainArea.clickpost ul.ableList li {display: inline-block;vertical-align: top;width: 16%;text-align: center;margin: 6px 16px;}
.mainArea.clickpost div.flowBox {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
.mainArea.clickpost div.flowBox .flow {position: relative;flex-basis:24%; max-width:24%; padding-right:20px;text-align: center;margin: 6px 0; justify-content: space-between;}
.mainArea.clickpost div.flowBox .flow img{margin-bottom:10px;}
.mainArea.clickpost div.flowBox .flow:last-child{padding-right:0;}
.mainArea.clickpost div.flowBox .flow:after {display: block;margin: 10px -12px;content: "▲";color: #0180cd;-webkit-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg); position:absolute; right:0; font-size:18px; height:18px; top:0; bottom:0; margin:auto;}
.mainArea.clickpost div.flowBox .flow:last-child:after{content:none;}
	.mainArea.clickpost div.flowBox .flow span{display:block;}

@media screen and (max-width:750px) { 
	.mainArea.clickpost ul.ableList li {display: inline-block;vertical-align: top;width: 33%;text-align: center;margin: 6px 0;}
	.mainArea.clickpost div.flowBox{flex-wrap:wrap;}
	.mainArea.clickpost div.flowBox .flow {flex-basis:100%; max-width:100%;display: block;width: 100%;text-align: center;margin: 6px 0; padding:15px 0 30px 0;}
	.mainArea.clickpost div.flowBox .flow span {display: block;text-align: left;margin: 15px 20px 15px 30px;}
	.mainArea.clickpost div.flowBox .flow:after {display: block;content: "▲";color: #0180cd;-webkit-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg);border-bottom: 1px dashed #0180cd;width:18px; left:auto; right:auto;     bottom: -20px;top: auto;padding: 15px 0;margin: auto; width:100%;}
	.mainArea.clickpost div.flowBox .flow:last-child:after{content:none;}
}/*end*/

	.hover a:hover{
		text-decoration: underline !important;
	}