@charset "utf-8";

#contact{
	display: none;
}
#gHeader{
	display: none;
}
#gFooter{
	background: #fff;
    margin-top: 0;
    padding-top: 40px;
}
#laboHeader{
	background: #fff;
	text-align: center;
	padding:25px 0 23px;
}
#laboHeader i{
	font-size: 20px;
	color:#03559c;
}
.page{
	background: url(../imgs/bg-contents.gif) center;
}
#container{
	margin-top: 0;
}
@media only screen and (max-width:736px) {
	.page{
		padding-bottom: 0;
	}
}

/*---------------
line
----------------*/
.line{
	width: 1240px;
	height: 30px;
	background: url(../imgs/img-line.svg) no-repeat center;
	margin:0 auto;
}
@media only screen and (max-width:1240px) {
	.line{
		width: 100%;
		background-size: 300%;
	}
	
}


/*------------------------------
diary
-------------------------------*/

/*---------------
diarymainVisual
----------------*/
.diarymainVisual{
	margin-bottom: 55px;
}

@media only screen and (max-width:736px) {
}

/*---------------
diary-title
----------------*/
.diary-title{}
.diary-title .diary-title-date{
	color: #004088;
	font-size: 12px;
	line-height: 1;
	font-weight: 400;
}
.diary-title .diary-title-date span{
	font-weight: 900;
	border-right: solid 1px #004088;
	margin-right: 10px;
	padding-right: 10px;
}
.diary-title .diary-title-txt{
	font-size: 20px;
	margin-top: 10px;
	font-weight: bold;
}
.diary-title .wrap1240{
	margin-top: 50px;
}
@media only screen and (max-width:736px) {
	.diary-title .diary-title-txt{
		font-size: 16px;
	}
}

/*---------------
diary-topic
----------------*/
.diary-topic {
}
.diary-topic .wrap1240{
	position: relative;
	margin-top: 40px;
	padding-bottom: 100px;
}
.diary-topic .wrap1240:before{
	content: '';
	width: 100%;
	height: 100%;
    background: url(../imgs/bg-dashed.png) repeat-y center top;
    position: absolute;
    left: 0;
    top: -43px;
}
.diary-topic .wrap{
	position: relative;
	z-index: 2;
}
.diary-topic .text{
	line-height: 2.8;
}
@media only screen and (max-width:736px) {
	.diary-topic .wrap1240:before{
	    background: url(../imgs/bg-dashed_sp.png) repeat-y center top;
	    top: -30px;
	}
	.diary-topic .text{
		line-height: 2.2;
	}

}

/*---------------
recommendBox
----------------*/
.recommendBox{
	padding: 50px 0 0;
	background: linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,0.9),rgba(255,255,255,1));
}
.recommendBox .wrap{
	margin:100px auto;
}
.recommendBox-ttl{
	color: #004088;
	text-align: center;
	margin-bottom: 55px;
}
.recommendBox-ttl i{
	font-size: 36px;
}
.recommendBox-ttl small{
	display: block;
	font-size: 12px;

}
/*recommendBox-list*/
.recommendBox-list{}
.recommendBox-list .clm{
	width: 30%;
	margin-right: 5%;
}
.recommendBox-list .clm:nth-child(3n){
	margin-right: 0;
}
.recommendBox-list .recommendBox-list-ph{    
	width:100%;
    height:200px;
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
  }
.recommendBox-list .recommendBox-list-ph img{
	width: auto;
	height: 100%;
	max-width: inherit; /* 初期状態にリセット */
	position: absolute;
	top: 50%; /* または200px(heightの半分) */
	left: 50%; /* この値を変更すると左右に位置をずらせる */
	transform: translate(-50%, -50%);
}
.recommendBox-list .recommendBox-list-ph.left img{
	left: 80%;
}
.recommendBox-list .recommendBox-list-ph.right img{
	left: 20%;
}
.recommendBox-list .recommendBox-list-ph span{
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.recommendBox-list .recommendBox-list-ph span:before{
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0,64,136,.3);
	position: absolute;
	left: 0;
	bottom: -100%;
	z-index: 2;
	transition: 0.6s;
}
.recommendBox-list .clm:hover .recommendBox-list-ph span:before{
	bottom: 0;
}
/*.recommendBox-list .recommendBox-list-ph .caption{
	z-index: 3;
}*/
.recommendBox-list .recommendBox-list-date{
	color: #004088;
	font-size: 12px;
	line-height: 1;
	font-weight: 400;
}
.recommendBox-list .recommendBox-list-date span{
	font-weight: 900;
	border-right: solid 1px #004088;
	margin-right: 10px;
	padding-right: 10px;
}
.recommendBox-list .recommendBox-list-txt{
	margin-top: 10px;
	line-height: 1.5;
	font-weight:bold;
}
@media only screen and (max-width:736px) {	
	.recommendBox{
		padding: 0;
	}
	.recommendBox .wrap{
		margin:50px auto;
	}
	.recommendBox-ttl i{
		font-size: 30px;
	}
	.recommendBox-list .clm{
		width: 100%;
		margin-right: 0;
		margin-bottom: 30px;
	}
	.recommendBox-list .clm:last-child{
		margin-bottom: 0;
	}	
	.recommendBox-list .recommendBox-list-ph{    
	    height:100px;
	    margin-bottom: 10px;
    }
    .recommendBox-list .recommendBox-list-ph img{
    	left: 50% !important;
    }
	.recommendBox-list .recommendBox-list-date{
		font-size: 10px;
	}
	.recommendBox-list .recommendBox-list-txt{
		margin-top: 5px;
		font-size: 12px;
	}
}

/*---------------

----------------*/

@media only screen and (max-width:736px) {
	
}