@font-face {
  font-family: TogaliteBold;
  src: url('font/togalite-bold.woff') format('woff');
}

body{
	margin: 0;
	padding: 0;
	width: 100%;
        height:100%;
	color:#eaf0fb;
	font-size: 18px;
	/*font-family: Sawarabigothic;*/
	font-family: TogaliteBold;
	background-color:#CBE6F3;
	border:solid 0px #00ff00;
}

/* ページ上部 */
.header{
	margin: 0 auto;
	padding: 0;
	width: 75%;
	border: solid 0px #000000;
}

/* 内容の表示領域 */
.contents{
	margin: 0 auto;
	padding: 0;
	width: 75%;
	height: auto;
	/* left と　rightの高さを揃える */
	border: solid 0px #ff0000;
	/*background-color:#0260fc;*/
	background-color:#6EB7DB;
}

/* メインタイトルやメインメニューなど */
.contents_top{
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	border: solid 0px #f00f0f;
}

.contents_center{
	margin: 0;
	padding: 0;
	width: 100%;
    letter-spacing: -1em;
	#height: 100%;
	display:block;
	height: auto;
	border: solid 0px #ff0000;
}

/* DINO LAND */
.main_title{
        margin: 0;
        padding: 0;
        padding-left: 2%;
        /* text-indent: 2%; */
        width: 100%;
        height: 15%;
        font-size: 180%;
        font-weight: bold;
        color: #FFE600;
        border: solid 0px #000000;

        /* main_titleの垂直中央寄せ */ 
		position: relative;
}

.contents_title{
	margin: 0 auto;
	padding: 1% 0% 0% 0%;
	width: 97%;
	height: auto;
	color:	#fdfdea;
	border: solid 0px #ff0000;
}

/*   ページナビの下線  */
.menu_border{
	padding: 0% 1% 0% 0%;
	margin: 0 auto;
	width: auto;
	display: block;
	border-style:solid;
	border-color:#b9e5e9;
	border-width:0px 0px 1px 0px;      
	}

.contents_title h1{
	margin: 0.5% 0% 0% 0%;
	padding: 1% 0% 0.5% 1%;
	width: auto;
	height: auto;
	font-size: 120%;
	#border-top: solid 1px #b9e5e9;
	border-bottom: solid 2px #b9e5e9;
}

.contents_title a{
	margin: 0;
	padding: 0% 1% 0% 1%;
}

.contents_title span{
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	font-size: 60%;
	color: #eff9fa;
}

.contents_title p{
	margin: 0;
	padding: 3% 0% 3% 0%;
	width: 100%;
	height: auto;
	font-size: 80%;
}

.image{
	margin: 0 auto;
	padding: 0;
	width: 99%;
	height: 40%;
	position:	relative;
	border: solid 0px #ff0000;
}


/* DINO LANDへようこそ */
h2{
	color: #e6e617;
	font-size: 90%;
	border-style: solid;
	border-width: 0px 0px 3px 0px;
	border-color: #CBE6F3;
	width: 100%;
	line-height: 200%;
	text-align: center;
}


/* コンテンツタイトル */
h3{
	color: #EFF1F2;
	font-size: 90%;
	background-color: #7379AE;
	#background-color: #A4A9CF;
	border-style: solid;
	border-width: 0px 0px 3px 0px;
	border-color: #6EB7DB;
	padding: 0.5% 0% 0.5% 2%;
	margin: 4% 0% 0% 0%;
	width: 98.5%;
}

.clear{
	display: block;
	clear: both;
}


.main_menu{
	margin: 0;
	padding: 0;	
	width: 100%;
    height: auto; 
	#text-align: center;
	border: solid 0px #000000;

    /* display: flex; */
        /* positionの設定で高さがなくなるので仮に設定する */
        /* height: 40%; */

        /* position: relative; */
}


.main_navi{
        margin: 0;
        padding: 0;
        height: auto; 
        width: 100%;
        font-size: 90%;
        border: solid 0px #f00f0f;
        /* position: absolute; */
        /* left: 0; */
        /* top: 60%; */
}

.main_navi ul{
			margin: 0;
			padding: 0;
			/* display: inline-block; */
			width: 100%;
			height: auto;
			list-style: none; 
			text-align: center; 
			border:solid 0px #ffffff;
}

.main_navi li{
        margin: 0;
        padding: 0;
        /* padding: 0% 0.5% 0% 0.5% ; */
        width: 11.8%;
        height: auto;
        /* vertical-align: top; */
        display: inline-block;
        text-align: center;
        border:solid 0px #ffffff;
}


.main_navi span{
	font-size: 60%;
}

/* 未訪問 */
.main_navi li a:link{
	display:block;  
	width: auto;
	margin: 0;
	padding: 0;
	color: #1D1F33;
	text-decoration: none;
	border-style:solid;
	border-width: 3px;
	border-color: #EFF1F2 #1a3259 #1a3259 #EFF1F2;
	#background-color: #5cbfd8;
	background-color:#CBE6F3;
}


/* 訪問済みのリンク */
.main_navi li a:visited{
	color: #1D1F33;
	border-style:solid;
	border-width: 3px;
	border-color: #EFF1F2 #1a3259 #1a3259 #EFF1F2;
	background-color: #CBE6F3;
}


/* ポイント時のリンク */
.main_navi li a:hover{
	color: #1D1F33;
	border-style:solid;
	border-width: 3px;
	border-color: #27577e #2d456f #2d456f #27577e;
	background-color: #1a3259;
}

/* 選択中のリンク */
.main_navi li a:active{
	color: #1D1F33;
	border-style:solid;
	border-width: 3px;
	border-color: #27577e #2d456f #2d456f #27577e;
	background-color: #1a3259;
}

/*
.left_menu{
	margin: 0;
	padding: 0;
	width: 18%;
float: left;
	border:solid 1px #ffffff;
}
*/
 
 .left_menu{
	margin: 8% 0% 0% 0%;
	padding: 0;
	width: 18%;
   letter-spacing: normal;
   display: inline-block;
   vertical-align: top;
	border:solid 0px #ffffff;
}
 
.left_navi{
	margin: 0 auto;
	padding: 0;
	width: 90%;
	list-style: none;
	border:solid 0px #ffffff;
} 

.left_navi ul{
	margin: 0;
	padding: 0;
	padding-left: 1%;
	width: 100%;
	list-style: none;
} 

.left_navi li{
	margin: 0;
	padding: 0% 0% 6% 0%;
	width: 100%;
	border: solid 0px #000000;
}

.left_navi span{
	font-size: 75%;
}

/* 未訪問 */
.left_navi li a:link{
	display:block;  
	width: 95%;
	margin: 0;
	padding: 1% -5% 1% 10%;
	color: #eaf0fb;
	text-decoration: none;
	border-style:solid;
	border-width: 3px;
	border-color: #4d5ffe #1a3259 #1a3259 #4d5ffe;
	#background-color: #5cbfd8;
	background-color:#401aff;
}

/* 訪問済みのリンク */
.left_navi li a:visited{
	color: #eaf0fb;
	border-style:solid;
	border-width: 3px;
	border-color: #4d5ffe #1a3259 #1a3259 #4d5ffe;
	background-color: #401aff;
}


/* ポイント時のリンク */
.left_navi li a:hover{
	color: #eaf0fb;
	border-style:solid;
	border-width: 3px;
	border-color: #27577e #2d456f #2d456f #27577e;
	background-color: #1a3259;
}

/* 選択中のリンク */
.left_navi li a:active{
	color: #eaf0fb;
	border-style:solid;
	border-width: 3px;
	border-color: #27577e #2d456f #2d456f #27577e;
	background-color: #1a3259;
}

/*
.contents_indicate{
margin: 0;
padding: 0;
        width: 81%;
        float: left;
        border:solid 0px #ffffff;
}
*/

.contents_indicate{
			margin: 0 auto;
			margin-bottom: 2.5%;
			padding: 0;
			width: 81.5%;
			height: auto;
			letter-spacing: normal;
			display: inline-block;
			border:solid 0px #ffffff;
}

.contents_indicate_top{
        margin: 0% 0% 1% 0%;
        padding: 0;
        width: 99%;
        height: auto;
        border:solid 0px #ffffff;
}

.welcome_dinoland{
			width: auto;
			height: auto;
			margin: 0% 0% 0% 0%;
			padding: 0% 0% 0% 0%;
			color: #7379ae;
			text-indent: 1%;
}

/* DINOLANDへようこその下線 */
.border{
			width: auto;
			height: auto;
			margin: 0.5% 0% 0% 0%;
			padding: 0;
			display: block;
			border-style:solid;
			border-color:#7379ae;
			border-width:0px 0px 2px 0px;
}

.about_dinoland{
			width: auto;
			height: auto;
			margin: 1% 0% 0% 0%;
			padding: 0;
			text-indent: 2%;
			color:#cbe6f3;
			border:solid 0px #000000;
			background-color:#7379ae;
}

.text{
			width: auto;
			height: auto;
			margin: 0.5% 0% 0% 0%;
			padding: 0% 0% 0% 0%;
			display: block;
			#color:#cbe6f3;
			color:#e6f7ff;
			border:solid 1px #b3c3ff;
			background-color:#6eb7db;
}

.contents_indicate_left{
        width: 59%;
        height: 118%;
        margin: 0;
        padding: 0;
        border: solid 0px #000000;
        display: inline-block;
        vertical-align: top;
}

.contents_indicate_right{
        width: 39%;
        height: 118%;
        margin: 0;
        padding: 0;
        border: solid 0px #000000;
        display: inline-block;
}

/* ピックアップ */
.pickup,
.profile,
.lastupdate{
		width: 100%;
		height: 5.2 %;
		margin: 1% 0% 0% 0%;
		padding: 0;
		text-indent: 2%;
		color:#cbe6f3;
		display:inline-block;
		border:solid 0px #000000;
		background-color:#7379ae;	
}

.pickup_text,
.profile_text,
.lastupdate_text{
		width: 100%;
		height: auto;
		margin: 0;
		padding: 0;
		display: inline-block;
		#color:#cbe6f3;
		color:#e6f7ff;
		border-style:solid;
		border-color:#b3c3ff;
		#border-color:#e6f7ff;
		border-width:0px 1px 1px 1px;
		background-color:#6eb7db;
}

/*  heightの設定(上書き) */
.pickup_text{
	/* height: 24.38%; */
	/* height: 27%; */
	height: 31.5%; 
}

.profile_text{
	/* height: 64.78%; */
	height: 59.5%;
}

.lastupdate_text{
	/* height: 52.14%; */
	height: 95.7%;
		/* height: 100%; */
}

/* DINO LANDへようこそ */
.sub_title h2{
	color: #eaf0fb;
	font-size: 100%;
	border-style: solid;
	border-width: 0px 0px 3px 0px;
	border-color: #1717e6 ;
	padding: 0% 0% 0% 0.2%;
	margin: 0 auto;
	width: 98%;
	text-align: left;
}

.sub_title p{
	font-size: 70%;
	padding-left: 1%;
	text-align: left;
}

.sub_title h2 span{
	font-size: 70%;
	padding-left: 0.5%;
}


.welcome_dinoland{
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	border:solid 0px #ffffff;
}


/* コピーライト記述 */
.copyright{
	margin: 0 auto;
	padding: 0;
	width: 75%;
	text-align: center;
	font-size: 60%;
	border: solid 0px #ff0000;
}

@media screen and (min-width: 200px)  { 
  .body {
	width: 95%;
	font-size: 23%;
  }
 
  .title{
	 font-size: 150%;
  }
}

@media screen and (min-width: 400px)  { 
  .body {
	width: 95%;
	font-size: 23%;
  }
 
   .title{
	font-size: 140%;
  }
}

@media screen and (min-width: 600px)  { 
  .body {
	width: auto;
	font-size: 36%;
  }
    .title{
	font-size:180%;
  }
}

@media screen and (min-width: 960px) and (max-width: 1280px)  { 
  .body {
	width: auto;
	font-size: 37%;
  }
  
  .title{
	font-size:180%;
  }
}