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

html {
/*	background:url(img/html.jpg) no-repeat top center;*/
	background:url(/css/img/html2.jpg) no-repeat top center;
	background-position-y: 73px;
}

.cf::after{
content: "";
display: block;
clear: both;
}

#hd #logo a {
	padding-bottom:61px;
	width:195px;
	height:61px;
	display:block;
	background:url(img/logo.jpg) no-repeat bottom center;
}

#bd h2{
}

#bd ul.newsArea{
	padding: 0 0 10px;
	width:700px;
}

	#bd ul.newsArea li{
		padding:7px 0 ;
		border-bottom:1px dotted #CCCCCC;
	}
	
	#bd ul.newsArea li .news_text{
		float:left;
		margin: 0 50px 0 0;
	}
	
	#bd ul.newsArea li span{
		margin-right: 15px;
	}
	
	#bd ul.newsArea li .sns_btn_area{
		overflow:visible;
		vertical-align:middle;
		display:inline-block;
	}
	
	#bd ul.newsArea li .sns_btn{
		float:left;
	}
	
	#bd .goInfo{
		text-align: right;
		padding: 0 20px 0 0;
	}
	
#bd .messageArea{
	padding:0 0 30px;
}
	
#bd .messageArea .message_p{
	padding:0 0 2em;
}

#bd .messageArea .message_p02{
	padding:0 0 2em;
}

#bd .messageArea .message_p02 img{
	padding:15px 0 0 15px;
}


#bd .messageArea .message_name{
	padding: 0 0 0 340px;
}

#bd .messageArea .message_img{
	float:right;
	padding:5px 0 0 25px;
}

#bd .top_box{
	width:224px;
	height:245px;
	border-left: 1px solid #CCCCCC;
	border-right:1px solid #CCCCCC;
	float:left;
	margin:0 10px 30px 0;
}

.top_box a:hover img{
	opacity: 0.6;
	filter: alpha(opacity=60);
}

#bd .top_box.last{
	margin:0;
}

#bd .top_box h3{
	background:url(img/box_title_bg.jpg) no-repeat;
	width:224px;
	height:37px;
	border-top:1px solid #CCCCCC;
	margin: 0 0 85px;
}

#bd .top_box h3 img{
	padding:3px 0 0 3px;
}

#bd .top_box p{
	padding:0 10px;
	line-height:1.4;
}

#bd .top_box.sec01{
	background:url(img/box01_bg.jpg) no-repeat;
}

#bd .top_box.sec02{
	background:url(img/box02_bg.jpg) no-repeat;
}

#bd .top_box.sec03{
	background:url(img/box03_bg.jpg) no-repeat;
}

#bd .meritArea{
	background:url(img/merit_bg.jpg) no-repeat;
	width:700px;
	clear:both;
}

#bd .meritArea h2{
	margin:0 0 0 122px;
	padding: 20px 0 0 0;
background:none;
border:none;
}

#bd .meritArea ol{
	margin: 30px 0 0 30px;
}

#bd .meritArea ol span{
	color:#FF3366;
	font-weight:bold;
}

#bd .meritArea .merit01{
	background:url(img/merit_1.jpg) no-repeat;
	padding:3px 0 3px 30px;
	margin:0 0 15px;
}

#bd .meritArea .merit02{
	background:url(img/merit_2.jpg) no-repeat;
	padding:3px 0 3px 30px;
	margin:0 0 15px;
}

#bd .meritArea .merit03{
	background:url(img/merit_3.jpg) no-repeat;
	padding:0 0 3px 30px;
	margin:0 0 15px;
}

#bd .meritArea .merit04{
	background:url(img/merit_4.jpg) no-repeat;
	padding:3px 0 3px 30px;
	margin:0 0 15px;
}

#bd .meritArea .merit05{
	background:url(img/merit_5.jpg) no-repeat;
	padding:3px 0 3px 30px;
	margin:0 0 15px;
}

#nv p{
	padding:0 0 15px;
}

#bd .news_top{
	margin:60px 0 60px;
	overflow:hidden;
	clear:both;
}

/***********************************************新着コラム*/

ul.news_column{
margin-bottom: 1rem;
}
li.columBox{
width: 32%;
float: left;
margin-right: 2%;
position: relative;
border: 1px solid #F3F3F3;
box-sizing: border-box;


}
li.columBox:last-child{
margin-right: 0;
}

li.columBox img{
width: 100%;
vertical-align: bottom;
}
li.columBox:first-child::before{
	content: "";
    display: block;
    width: 50px;
    height: 50px;
    position: absolute;
    right: 0;
    top: 0;
    background: url(../img/new.png)no-repeat 0 0;
    background-size: 100% auto;
    overflow: hidden;
}
li.columBox a{
text-decoration: none;
}

li.columBox p.column_title{
background: rgba(255,255,255,0.8);
color: #000;
padding: 5px;
height: 60px;

}


li.columBox a:hover{
opacity: 0.6;
}






/***********************************************インフォバナー*/
.infoBox{
	background:url(../img/share/info_b_bg.jpg);
	width:700px;
	height:194px;
	clear:both;
	margin:30px 0 0;
}

.infoBox a:hover img{
	opacity: 0.6;
	filter: alpha(opacity=60);
}

.infoBox .text{
	padding: 10px 0 0 67px;
}

.infoBox ul{
	padding: 12px 0 0 65px;
}

.infoBox ul li{
	float:left;
	margin:0 10px 0 0;
}

.infoBox .logo{
	float:left;
	padding: 10px 0 0 65px;
}

.infoBox .tel{
	float: left;
	padding: 7px 0 0 28px;
	font-size:14px;
	font-weight:bold;
}

.infoBox .tel span{
	color:#FF2587;
}


/***********************************************サイドナビ*/
