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

/****************************************
		1. General Setting 
*****************************************/

html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption, 
tbody, tfoot, thead, table, label, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-size: 14px;
	font-family: inherit;
	vertical-align: baseline;
	list-style:none;
	scrollbar-base-color: #563500;
	}
	
body{
	background: url(../images/bg1.gif) 0 0;
}

.main_area{
	width: 100%;
	height: 100%;
}

table.content{
	width: 100%;
	min-width: 640px;
	height: 100%;
	margin: 0 auto;
}

tr.frame_title,tr_frame_menu{
	width: 100%;
	height: 100%;
}

td.frame_left,td.frame_right{
	min-width: 100px;
	height: 100%;
}

.title{
	display: block;
	width: 440px;
	height: 180px;
	margin: 105px auto 0;
}

.title img{
	width: auto;
	height: auto;
	position: relative;
	top: 20%;
}


table.content td div.menu_area{
	display: block;
	width: 508px;
	height: 250px;
	margin: 0 auto;
}

a.hato_button:link{
	display: block;
	width: 164px;
	height: 120px;
	margin-left: 0px;
	float: left;
	background: url(../images/button_hato_18.gif) 0 0 no-repeat;
}

a.hato_button:visited{
	display: block;
	width: 164px;
	height: 120px;
	background: url(../images/button_hato_18.gif) 0 0 no-repeat;
}

a.hato_button:hover{
	display: block;
	width: 164px;
	height: 120px;
	background: url(../images/button_hato_ro.gif) 0 0 no-repeat;
}

a.hato_button:active{
	display: block;
	width: 164px;
	height: 120px;
	background: url(../images/button_hato_18.gif) 0 0 no-repeat;
}

.title,a.hato_button{
	display: block;
	margin: 32px auto;
}

a.asu_chi_button:link{
	display: block;
	width: 300px;
	height: 120px;
	margin-left: 20px;
	float: left;
	background: url(../images/button_asu_chi.gif) 0 0 no-repeat;
}

a.asu_chi_button:visited{
	display: block;
	width: 300px;
	height: 120px;
	background: url(../images/button_asu_chi.gif) 0 0 no-repeat;
}

a.asu_chi_button:hover{
	display: block;
	width: 300px;
	height: 120px;
	background: url(../images/button_asu_chi_ro.gif) 0 0 no-repeat;
}

a.asu_chi_button:active{
	display: block;
	width: 300px;
	height: 120px;
	background: url(../images/button_asu_chi.gif) 0 0 no-repeat;
}

.title,a.asu_chi_button{
	display: block;
	margin: 32px auto;
}

a.seya_button:link{
	display: block;
	width: 164px;
	height: 120px;
	margin-left: 50px;
	float: left;
	background: url(../images/button_seya_18.gif) 0 0 no-repeat;
}

a.seya_button:visited{
	display: block;
	width: 164px;
	height: 120px;
	background: url(../images/button_seya_18.gif) 0 0 no-repeat;
}

a.seya_button:hover{
	display: block;
	width: 164px;
	height: 120px;
	background: url(../images/button_seya_ro.gif) 0 0 no-repeat;
}

a.seya_button:active{
	display: block;
	width: 164px;
	height: 120px;
	background: url(../images/button_seya_18.gif) 0 0 no-repeat;
}

.title,a.seya_button{
	display: block;
	margin: 32px auto;
}

a.tokotoko_button:link{
	display: block;
	width: 164px;
	height: 120px;
	margin-left: 20px;
	float: left;
	background: url(../images/button_tokotoko_18.gif) 0 0 no-repeat;
}

a.tokotoko_button:visited{
	display: block;
	width: 164px;
	height: 120px;
	background: url(../images/button_tokotoko_18.gif) 0 0 no-repeat;
}

a.tokotoko_button:hover{
	display: block;
	width: 164px;
	height: 120px;
	background: url(../images/button_tokotoko_ro.gif) 0 0 no-repeat;
}

a.tokotoko_button:active{
	display: block;
	width: 164px;
	height: 120px;
	background: url("../images/button_tokotoko_18.gif") 0 0 no-repeat;
}

.title,a.tokotoko_button{
	display: block;
	margin: 32px auto;
}


@media only screen and (max-device-width : 480px) {

	.title{
	display: block;
	width: 440px;
	height: 150px;
	margin: 20px 0;
}

table.content td div.menu_area{
		display: block;
		width: 270px;
		height: auto;
		margin: 0 auto;
	}
	
	a.hato_button:link{
		width: 270px;
		height: 198px;
		margin:  10px 0;
		background: url(../images/button_hato_mb_28.gif) 0 0 no-repeat;
	}
	
	a.hato_button:visited{
		width: 270px;
		height: 198px;
		background: url(../images/button_hato_mb_28.gif) 0 0 no-repeat;
	}
	
	a.hato_button:hover{
		width: 270px;
		height: 198px;
		background: url(../images/button_hato_mb_28.gif) 0 0 no-repeat;
	}
	
	a.hato_button:active{
		width: 270px;
		height: 198px;
		background: url(../images/button_hato_mb_28.gif) 0 0 no-repeat;
	}
	
	a.asu_chi_button:link{
		width: 270px;
		height: 294px;
		margin:  10px 0;
		background: url(../images/button_asu_chi_mb_28.gif) 0 0 no-repeat;
	}
	
	a.asu_chi_button:visited{
		width: 270px;
		height: 294px;
		background: url(../images/button_asu_chi_mb_28.gif) 0 0 no-repeat;
	}
	
	a.asu_chi_button:hover{
		width: 270px;
		height: 294px;
		background: url(../images/button_asu_chi_mb_28.gif) 0 0 no-repeat;
	}
	
	a.asu_chi_button:active{
		width: 270px;
		height: 294px;
		background: url(../images/button_asu_chi_mb_28.gif) 0 0 no-repeat;
	}
	
	a.seya_button:link{
		width: 270px;
		height: 294px;
		margin:  10px 0;
		background: url(../images/button_seya_mb_28.gif) 0 0 no-repeat;
	}
	
	a.seya_button:visited{
		width: 270px;
		height: 294px;
		background: url(../images/button_seya_mb_28.gif) 0 0 no-repeat;
	}
	
	a.seya_button:hover{
		width: 270px;
		height: 294px;
		background: url(../images/button_seya_mb_28.gif) 0 0 no-repeat;
	}
	
	a.seya_button:active{
		width: 270px;
		height: 294px;
		background: url(../images/button_seya_mb_28.gif) 0 0 no-repeat;
	}

	
}

td.frame_corner_lu{
	width: 100px;
	height: 100px;
	background: url("../images/frame_lu_01.gif") no-repeat 0 0;
}

td.frame_corner_ru{
	width: 100px;
	height: 100px;
	background: url("../images/frame_ru_05.gif") no-repeat 0 0;
}

td.frame_corner_lb{
	width: 100px;
	height: 100px;
	background: url("../images/frame_lb_21.gif") no-repeat 0 0;
}

td.frame_corner_rb{
	width: 100px;
	height: 100px;
	background: url("../images/frame_rb_23.gif") no-repeat 0 0;
}

td.frame_upper{
	width: auto;
	height: 100px;
	background: url(../images/frame_repeat_u_03.gif) 0 0 repeat-x;
}

td.frame_bottom{
	width: auto;
	height: 100px;
	background: url(../images/frame_repeat_b_22.gif) 0 0 repeat-x;
}

td.frame_left{
	width: 100px;
	height: auto;
	background: url(../images/frame_repeat_l_09.gif) 0 0 repeat-y;
}

td.frame_right{
	width: 100px;
	height: auto;
	background: url(../images/frame_repeat_r_11.gif) 0 0 repeat-y;
}