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




/* -----メイン画像の背景のブルーを無しに----- */

body {
	font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-size: 80%;
	line-height: 1.7;
	color: #4D4D4D;
	background: #FFFFFF;
}

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



.alpha_a a img {
	-webkit-transition: 0.2s ease-in-out;
	   -moz-transition: 0.2s ease-in-out;
	     -o-transition: 0.2s ease-in-out;
	        transition: 0.2s ease-in-out;
}
.alpha_a a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}








.contents {
	width: 950px;
	margin: 0 auto;
	padding-bottom: 65px;
}

.contents .leftcontents {
	float: left;
	width: 672px;
}

.contents .rightcontents {
	float: right;
	width: 250px;
}

div.contents:after {
	font-size: 1px;
	color: #FFFFFF;
	content:".";
	display: block;
	height: 0px;
	clear: both;
}
div.contents{
	zoom: 1;
}


.contents .leftcontents .headerphoto {
	width: 672px;
	margin: 0 auto;
	position: relative;
}


.contents .leftcontents .headerphoto .photo01 {
	position: absolute;
	width: 150px;
	top: 24px;
    left: 20px;
}

.contents .leftcontents .headerphoto .photo02 {
	position: absolute;
	width: 150px;
	top: 62px;
    left: 448px;
}

.contents .leftcontents .headerphoto .photo03 {
	position: absolute;
	width: 150px;
	top: 146px;
    left: 145px;
}

.contents .leftcontents .headerphoto .photo04 {
	position: absolute;
	width: 150px;
	top: 157px;
    left: 448px;
}

.contents .leftcontents .headerphoto .photo05 {
	position: absolute;
	width: 150px;
	top: 248px;
    left: 145px;
}

.contents .leftcontents .headerphoto .photo06 {
	position: absolute;
	width: 150px;
	top: 243px;
    left: 448px;
}









.contents .leftcontents .information {
	width: 672px;
	height: auto;
	background-color: #FFF;
	border: solid 1px #e6e6e6 ;
	border-radius: 20px;
	margin-top: 38px;
}



.contents .leftcontents .information h3 {
	text-align: center;
	padding-top: 20px;
}



.contents .leftcontents .information dl {
	width: 672px;
	height: 200px;
	padding-top: 10px;
	padding-left: 26px;	
}


.contents .leftcontents .information dl dt {
	background-image: url(../images/index_32.gif) ;
	background-repeat: no-repeat;
	background-position: left;
	background-size: 11px 11px;
	
	color: #534741;
	float: left;
	width: 110px;
	padding-left: 17px;
	margin-bottom: 8px;
	margin-top: 8px;
}



.contents .leftcontents .information dl dd  {
	float: left;
	width: 490px;
	padding-left: 10px;
	margin-bottom: 8px;
	margin-top: 8px;
}



.contents .leftcontents .information dl dd p {
	color: #534741;
}

div.information:after {
	font-size: 1px;
	color: #FFFFFF;
	content:".";
	display: block;
	height: 0px;
	clear: both;
}
div.infomation{
	zoom: 1;
}







.chosonnews {
	width: 675px;
	margin-bottom: 35px;
	}

.chosonnews dl {
	width: 675px;
	margin-bottom: 10px;
	}
		
.chosonnews h2 {
	padding-bottom:10px;
	}

.chosonnews dl dt {
	float: left;
	width: 125px;
	padding-left: 17px;
	margin-top: 10px;
	background-image: url(../images/index_32.gif) ;
	background-repeat: no-repeat;
	background-position: left 5px;
	}

.chosonnews dl dd {
	float: left;
	width: 530px;
	margin-top: 10px;
	margin-bottom: 10px;
	}








.contents .leftcontents .information .informationichiran {
	text-align: right;
	font-size: 90%;
	padding: 20px;
}








.contents .leftcontents .matisitelink {
	margin-top: 35px;
}


.contents .leftcontents .matisitelink .maticentercontentstitlebar {
	padding-bottom: 15px;
}

.matilogo li {
	float: left;
	width: 219px;
	margin-bottom: 10px;
}

.matilogo .matilogoleft {
	padding-right: 7px;
}

ul.matilogo:after {
	font-size: 1px;
	color: #FFFFFF;
	content:".";
	display: block;
	height: 0px;
	clear: both;
}
ul.matilogo{
	zoom: 1;
}







.rightcontents.sitelinknewbanner {
	margin-bottom: 30px;
}


.rightcontents .sitelinknewbanner li {
	margin-bottom: 15px;
}



.contents .rightcontents .newbannertitle {
	margin-top: 35px;
	background-color: #3fa9f5;
	background-width: 125px;
	background-height: 15px;
	border-radius: 20px;
	padding: 3px 40px 3px 50px; 
}


.contents .rightcontents .newbannertitle h2 {
	background-image: url(../images/newest_pickup.png) ;
	background-repeat: no-repeat;
	background-position: left;
	background-size: 12px 8px;
	padding-left: 24px;
	color: #FFF;
	font-size: 110%;
}


.contents .rightcontents .rightconnewbanner li {
	margin-top: 17px;
}

.contents .rightcontents .rightconnewbannerline01 {
	margin-top: 17px;
}







.spotcon {
	width: 100%;
	height: 200px;
	margin: 0 auto;
	background-image: url("../images/newest_haikei.jpg") ;
	background-repeat: repeat;
	background-position: center;
	margin-bottom: 30px;
}



/*-------　無限スライド(アニメーションプロパティ) 2020.9　--------*/

.spotcon .wrap {
	display: flex;
	align-items: center;
	overflow: hidden;
}

.spotcon .kankouphoto {
	display: flex;
	animation: loop-slide 120s infinite linear 1s both;
}

@keyframes loop-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}


/*-------　アニメーションプロパティの解説 ------------------------------

animation-name: loop-slide;　　　　　　アニメーション名 
animation-duration: 20s;　　　　　　　　開始から終了までの所要時間
animation-iteration-count: infinite;　アニメーションのループ回数
animation-timing-function: linear;　　動きの加減速
animation-delay: 1s;　　　　　　　　　 　アニメーションが開始するまでの遅延時間
animation-fill-mode: both;           アニメーション開始前・終了後の挙動
 
--------------------------------------------------------------------*/




.spotcon .kankouphoto .photo {
	width: 100%;
	margin-bottom: 25px;
	padding-top: 25px;
	padding-left: 10px;
}