@charset "utf-8";
/* CSS Document */

body {
	background:#F3F3F3;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	line-height: 1.6;
}
.container {
	width:auto;
	padding:0;
}
#oracle {
}
#oracle .logo {
	background: #fff none repeat scroll 0 0;
	padding:10px 0;
}
#oracle .main {
	background:url(/static/images/freepage/22/images/back.png), #ddd;
	background-repeat: no-repeat;
	background-position:top right;
	background-size:100%;
}

#oracle .main2 {
	background:url(/static/images/freepage/22/images/back2.png), #356DB0;
	background-repeat: no-repeat;
	background-position:top right;
	background-size:100%;
}

#oracle .title {
	padding:0 0;
}
#oracle .title h1 {
	margin:100px 0 80px;
}
#oracle section {
	margin:30px 0 50px;
}
.heading01 {
	position:relative;
	margin:0 -15px 0 -15px;
	padding:15px 20px;
	background:#E8050D;
	box-shadow:
 0 3px 3px 0 rgba(0, 0, 0, 0.1);
}
.heading01:before {
	content:" ";
	position:absolute;
	top:100%;
	left:0;
	width:0;
	height:0;
	border-width:0 15px 15px 0;
	border-style:solid;
	border-color:transparent;
	border-right-color:#AF1014;
}
.heading01:after {
	content:" ";
	position:absolute;
	top:100%;
	right:0;
	width:0;
	height:0;
	border-width:15px 15px 0 0;
	border-style:solid;
	border-color:transparent;
	border-top-color:#AF1014;
}
.heading02 {
	position:relative;
	margin:0 -15px 0 -15px;
	padding:15px 20px;
	background:#333333;
	box-shadow:
 0 3px 3px 0 rgba(0, 0, 0, 0.1);
}
.heading02:before {
	content:" ";
	position:absolute;
	top:100%;
	left:0;
	width:0;
	height:0;
	border-width:0 15px 15px 0;
	border-style:solid;
	border-color:transparent;
	border-right-color:#000;
}
.heading02:after {
	content:" ";
	position:absolute;
	top:100%;
	right:0;
	width:0;
	height:0;
	border-width:15px 15px 0 0;
	border-style:solid;
	border-color:transparent;
	border-top-color:#000;
}
#oracle .block {
	background:#fff;
	padding:100px 15px 15px 15px;
	margin-top:-90px;
}
#oracle h2 {
	font-weight:bold;
}
.catTopList, .catTopList > li:first-child {
	width: 100%;
}
.catList li figure {
	margin-right: 2%;
	width: 20%;
}
.catList h2 {
	font-size: 16px;
	line-height: 1.3;
	margin: 0 0 10px;
	font-weight:bold;
}
#oracle .container {
	margin: auto;
	width: 970px;
}
footer .container {
	width:1000px;
}
#oracle .date {
	background:#00ABEC;
	border-radius:5px;
	text-align:center;
	line-height:50px;
	height:50px;
	width:50px;
	color:#fff;
	float: left;
	margin-right: 2%;
}
#oracle section.news {
	padding:15px;
	border:4px solid #a5ce00;
	border-radius:15px;
	background-color: rgba(255, 255, 255, 1);
}
#oracle .catList {
	border-bottom:none;
}
#oracle .catList figure img {
display: block;
max-width: 100%;
height: auto;
}

#oracle  ul.kanren {
  list-style: none;
  margin-top:15px;
}
#oracle  ul.kanren li:before {
  font-family: FontAwesome;
  content: '\f0da'; 
}
#oracle  ul.kanren li {
	margin-bottom:10px;
}
/* Sサイズ、タブレット : Small Devices, Tablets */
@media only screen and (max-width : 768px) {
 #oracle .container {
 width:auto;
}
footer .container {
width:auto;
}
 main {
 border-top: none;
 padding-top:0;
 position: relative;
}
#oracle .logo {
 padding:10px;
}
}

/* XSサイズ : Extra Small Devices, Phones */  
@media only screen and (max-width : 480px) {
#oracle .title {
}

#oracle .title h1 {
	margin: 15px;
}
.heading01 , .heading02 {
	padding: 10px;
}
 #oracle .h3, h3 {
 font-size: 20px;
 line-height:1.4;
}
 #oracle .block {
 padding: 15px 0px 15px;
 margin-top:0;
}
 #oracle section:last-child {
 margin-bottom:0;
}
}
