@charset "utf-8";
/*#################################################################################
	pageTtl
#################################################################################*/
#wrap.top{
	padding: 0;
	background-color: #f2f2f2;
}
#pageTtlArea.pageTtlImg{
	background: url("../images/index_main_bg.jpg")center center/cover;
	height: 290px;
	margin-bottom: 37px;
	box-shadow: 0  2px 8px #ccc;
}
#pageTtlArea #pageTtlBox{
	display: flex;
	align-items: center;
	width: 100%;
	justify-content: space-between;
	padding: 40px 0;
	box-sizing: border-box;
}
#pageTtlArea #pageTtlBox>div:first-child{
	max-width: 490px;
	width: 100%;
}
#pageTtlArea #pageTtlBox #pageTtl{
	display: flex;
	align-items: flex-end;
	margin-bottom: 35px;
}
#pageTtlArea #pageTtlBox #pageTtl span{display:block;}
#pageTtlArea #pageTtlBox #pageTtl span:first-child{margin-right: 20px;}
#pageTtlArea #pageTtlBox #pageTtl span:last-child{margin-bottom: 10px;}
#pageTtlArea #pageTtlBox #pageTtl img{width: 100%;}
#pageTtlArea #pageTtlBox #pageTtlAc{
	font-size: 18px;
	background: url("../images/index_main_brackets.png") no-repeat;
	background-size: 328px 120px;
	width: 328px;
	height: 120px;
	padding: 20px 60px;
	box-sizing: border-box;
	text-align: left;
}
#pageTtlArea #pageTtlBox #pageTtlAc li + li{margin-top: 10px;}

/* top-col-2
------------------------------------------------------------------------*/
.top-col-2{
	display: flex;
	flex-wrap: wrap;
	margin-top: 58px;
}
.top-col-2>*{
	box-sizing: border-box;
	margin-top: 20px;
	margin-left: 20px;
}
.top-col-2>*{width:calc((99.9999% - 20px) / 2);}
.top-col-2>*:nth-child(2n+1){margin-left:0;}
.top-col-2>*:nth-child(-n+2){margin-top:0;}
.top-col-2>* a{
	position: relative;
	display: block;
}
.top-col-2>* a img{width: 100%;}

.top-col-2>* .top-message-text{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	padding: 0 37px 0;
	box-sizing: border-box;
	text-align: left;
}
.top-col-2>* .top-message-text.right{right: 0;}
.top-col-2>* .top-message-text h3{
	font-size: 26px;
	line-height: 1.2;
	font-weight: 500;
	position: relative;
	margin-bottom: .5em;
}
@media screen and (min-width:960px) and (max-width:1280px){
.top-col-2>* .top-message-text h3{font-size:	calc(16px + ((1vw - 9.6px) * 2.94118));}
}

.top-col-2>* .top-message-text .top-message-lead{
	font-size: 16px;
	color: #5c6366!important;
	font-weight: 500;
	min-height: 120px;
}
.top-col-2>* .top-message-text .top-message-lead em{
	padding: 0;
	background: linear-gradient(transparent 90%, #00c2df 10%);
}
.top-col-2>* .top-message-text .top-message-title{
	font-size: 13px;
	line-height: 1.2;
	color: #222;
	margin-top: 1.6rem!important;
}
.top-col-2>* .top-message-text .top-message-name{
	font-size: 16px;
	color: #222;
	margin-top: 0!important;
}

/* top-col-3
------------------------------------------------------------------------*/
.top-col-3{
	display: flex;
	flex-wrap: wrap;
	margin-top: 58px;
}
.top-col-3>.top-col-3-item{
	box-sizing: border-box;
	margin-top: 20px;
	margin-left: 20px;
	text-align: center;
}
.top-col-3>*{width:calc((99.9999% - 40px) / 3);}
.top-col-3>*:nth-child(3n+1){margin-left:0;}
.top-col-3>*:nth-child(-n+3){margin-top:0;}
.top-col-3>.top-col-3-item a{
	display: block;
	background: #fff;
	box-shadow: 0px 0px 16px -6px rgb(0 0 0 / 60%);
  transition: all .3s;
}
.top-col-3>.top-col-3-item a img{width: 100%;}
.top-col-3>.top-col-3-item .top-col-3-ttl-box{
	padding: 10px;
	box-sizing: border-box;
}
.top-col-3>.top-col-3-item .top-col-3-ttl-box h3{
	font-size: 22px;
	line-height: 1.4;
	font-weight: 500;
	color: #0075c2;
	position: relative;
}
.top-col-3>.top-col-3-item a>p{
	font-size: 18px;
	line-height: 1.6;
	font-weight: 500;
	color: #5c6366;
	padding: 10px;
	box-sizing: border-box;
}
.top-col-3>.top-col-3-item .top-col-3-ttl-box>p{
	font-size: 19px;
	color: #5c6366;
}
/* top-col-flex
------------------------------------------------------------------------*/
.top-col-flex{
	display: flex;
	margin-top: 60px;
}
.top-col-flex>.top-col-flex-item{width:calc((99.9999%) / 3);}
.top-col-flex>.top-col-flex-item .block{
	display: block;
	position: relative;
}
.top-col-flex>.top-col-flex-item .block img{width: 100%;}
.top-col-flex>.top-col-flex-item .block .text-box01{
	position: absolute;
	top:50%;
	left:50%;
	transform: translateX(-50%) translateY(-50%);
	text-align: center;
	padding: 10px;
	box-sizing: border-box;
	width: 100%;
}
.top-col-flex>.top-col-flex-item .block p{
	font-size: 16px;
	font-weight: 500;
	color: #5c6366;
}
.top-col-flex>.top-col-flex-item .block .link-arw{
	display: inline-block;
	font-size: 22px;
	color: #0075c2;
}
.top-col-flex>.top-col-flex-item .block .text-box02{
	position: absolute;
	bottom: 10px;
	left:10px;
	box-sizing: border-box;
}
.top-col-flex>.top-col-flex-item .block .text-box02 p{
	font-weight: normal;
	color: #fff!important;
	margin-top: 0!important;
}
.top-col-flex>.top-col-flex-item .block .text-box02 p.profile{font-size: 13px;}

/* pdf-index-box
------------------------------------------------------------------------*/
.pdf-index-box{
	background: #fff;
	box-sizing: border-box;
	padding: 30px 50px;
	margin-top: 120px;
}
.pdf-index-box .link-btn-pdf{margin: 0 auto 40px;}
.pdf-index-box .link-arw a{
	font-size: 16px;
	font-weight: 500;
	color:#5c6366;
}
.pdf-index-box .list-circle + .link-arw{margin-top:30px;}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Smartphones
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:959px){

/*#################################################################################
	pageTtl
#################################################################################*/
#pageTtlArea.pageTtlImg{
	background: url("../images/index_main_bg_sp.jpg")center center/cover;
	height: auto;
	margin-top: 60px;
	margin-bottom: 37px;
}
#pageTtlArea #pageTtlBox{
	display: block;
	width: 100%;
	min-height: 510px;
	padding: 40px 0;
	box-sizing: border-box;
}
#pageTtlArea #pageTtlBox>div{
	margin: 0 auto;
	text-align: center;
}
#pageTtlArea #pageTtlBox>div:first-child{max-width: inherit;}
#pageTtlArea #pageTtlBox #pageTtl{
	max-width: 200px;
	display: block;
	margin: 0 auto 40px;
}
#pageTtlArea #pageTtlBox #pageTtl span{display:block;}
#pageTtlArea #pageTtlBox #pageTtl span:first-child{margin: 0 0 10px 0;}
#pageTtlArea #pageTtlBox #pageTtl span:last-child{margin-bottom: 10px;}
#pageTtlArea #pageTtlBox #pageTtlAc{margin: 0 auto;}
#pageTtlArea #pageTtlBox #pageTtlAc li + li{margin-top: 10px;}

/* top-col-2
------------------------------------------------------------------------*/
.top-col-2{
	display: block;
	margin-top: 58px;
	margin-left: -4%;
	margin-right: -4%;
}
.top-col-2>*{
	margin-top: 30px;
	margin-left: 0;
	background: #fff;
}
.top-col-2>*{width:100%;}
.top-col-2>*:nth-child(-n+2){margin-top:30px;}
.top-col-2>* a{
	display: flex;
	flex-direction: column;
	position: static;
	padding-bottom: 30px;
}
.top-col-2>* a>figure{order: 1;}
.top-col-2>* a>.top-message-box{	}
.top-col-2>* .top-message-text{
	order: 2;
	position: static;
	top:inherit;
	transform: none;
	padding: 0 50px 0;
}

.top-col-2>* .top-message-text.right{right: 0;}
.top-col-2>* .top-message-text h3{
	font-size: 28px;
	line-height: 1.2;
	text-align: center;
}
.top-col-2>* .top-message-text .top-message-lead{
	font-size: 20px;
	min-height: inherit;
}
.top-col-2>* .top-message-text .top-message-title,
.top-col-2>* .top-message-text .top-message-name{
	display: inline-block;
	margin-top: 1.6rem!important;
}
/* top-col-3
------------------------------------------------------------------------*/
.top-col-3{
	display: block;
	margin-top: 30px;
}
.top-col-3>.top-col-3-item{
	margin-top: 30px;
	margin-left: 0;
}
.top-col-3>*{width:100%;}
.top-col-3>*:nth-child(-n+3){margin-top:30px;}
.top-col-3>.top-col-3-item .top-col-3-ttl-box h3{font-size: 20px;}
.top-col-3>.top-col-3-item a>p{font-size: 16px;}
.top-col-3>.top-col-3-item .top-col-3-ttl-box>p{font-size: 16px;}

/* top-col-flex
------------------------------------------------------------------------*/
.top-col-flex{
	flex-wrap: wrap;
	margin-top: 40px;
}
.top-col-flex>.top-col-flex-item{width:calc((99.9999%) / 2);}
.top-col-flex>.top-col-flex-item:first-child{
	/*order: 3;*/
	width: 100%;
}
.top-col-flex>.top-col-flex-item .block .text-box01{
	position: absolute;
	top:50%;
	left:50%;
	transform: translateX(-50%) translateY(-50%);
	text-align: center;
	padding: 10px;
	box-sizing: border-box;
	width: 100%;
}
.top-col-flex>.top-col-flex-item .block .text-box02{
	position: static;
	box-sizing: border-box;
	padding: 10px;
	background: #fff;
	min-height: 100px;
}
.top-col-flex>.top-col-flex-item .block .text-box02 p{
	color: #606060!important;
	text-align: center;
}
.top-col-flex>.top-col-flex-item .block .text-box02 p.profile{font-size: 13px;}
}