/*全体調整*/
h1,h2,h3,h4,p{
	margin:0;
	padding:0;
}

body{
	position:relative;
	margin: 0; 
	background-image: url("../imgs/background01.jpg");
	background-size:300px 300px;
}  

/*ヘッダー*/

#header{
	background: #111111;
	position: fixed;
	width: 100%;
	height: 55px;
	top:0;
	opacity:0.8;
	z-index:9997;
}

body{  
    margin: 0; 
}  

#panel ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#panel ul li a {
	display: block;
	color: #202020;
	padding:15px 8px;
	text-decoration: none;
}

#panel ul li a:hover{
	background-color: #707070;
	border-bottom: solid 1px #DC2B2B
}






/*ボディ*/

/*メインコンテンツ*/
.topimg{
	margin-top:55px;
	width:100%;
	height:250px;
	background-size:cover;
	background-position:center;
}

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

.topimg .topcatch{
	position:relative;
	background-color: rgba(20,20,20,0.5);
	padding: 5px 0 5px 5px;
	top:195px;
	text-align:left;
}



#contents td{
	padding:5px;
}

.plan_topright{
	width: 270px;
}

.plan_topimg{
	width: 250px;
}

.plan_jirei{
	margin:10px 0;
}

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

.plan_jirei ul {
	text-align:center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.plan_jirei ul li a {
	float:left;
	display: block;
	text-decoration: none;
	width:33%;
	color:#000;
	margin-top:15px;
}

.plan_jirei ul li a:nth-child(4){
	width:100%;
}

.plan_jirei ul li a img{
	width:96%;
}

.plan_jirei ul li a:hover{
	opacity:0.8;
}

.plan_jirei p {
	font-size:17px;
	margin: -20px 0 0;
}

.plan_jirei .test{
	display:none;
}


/*フェードアニメ*/

.fadein{
	opacity: 0;
	transition : 1800ms;
	transition-delay:300ms;
	
}



.fadein.imgin{
	opacity : 1;
}

/*フッター*/

#footer {
	position:absolute;
	color:#999999;
	background: rgba(10,10,10,0.6);
	width: 100%;
	padding:5px 0 5px 0;
}

#footer:after{
	content:"";
	display: block;
	clear: both;
}

.copyright{
	float:left;
	width:45%;

}

.information {
	float:right;
	width:auto;
	padding: 0 10px 0 0;
}

.information p{
	font-size:12px;
}


/* ########1200px以上########　*/
@media screen and (min-width: 1200px){

#contents{
	max-width: 1150px;
	margin-left: auto;
	margin-right: auto;
}
}


/* ########603px以上1200以下########　*/
@media screen and (min-width: 600px) and (max-width: 1199px){

.plan_topright{
	width: 220px;
}

.plan_topimg{
	width: 200px;
}

.plan_jirei ul li a {
	width:50%;
}

.plan_jirei ul li a img{
	width:90%;
}

}
/* ########603px以上########　*/
@media screen and (min-width: 760px){



#headtitle{
	float:left;
	width:auto;
	padding:3px 0 3px 25px;
}

#panel{
	float:right;
	width:auto;
	display: block !important;
}


#panel ul li a {
	display: block;
	color: #ffffff;
	font-size: 16px;
	text-decoration: none;
}

#panel ul li a:hover{
	background-color: #707070
}


#panel ul li:after{
	content: "";
	display: block;
	clear: both
}

#panel ul li{
	float:left;
	width:auto;
}
}
/* ########759px以下########　*/
@media screen and (max-width: 759px){

#headtitle{
	margin-top:5px;
	margin-left: auto;
	margin-right: auto;
}

#header{text-align: center;}


/* toggle-panel */
#panel-btn { display: inline-block; position: relative; width: 35px; height: 35px; margin:-50px 10px 0px; border-radius: 3px; background: #404040; float:right;}
#panel-btn:hover { background: #888888; }
#panel-btn-icon { display: block; position: absolute; top: 50%; left: 50%; width: 14px; height: 2px; margin: -1px 0 0 -7px; background: #000000; transition: .2s; }
#panel-btn-icon:before, #panel-btn-icon:after { display: block; content: ""; position: absolute; top: 50%; left: 50%; width: 14px; height: 2px; margin-left: -7px; background: #000000; transition: .3s; }
#panel-btn-icon:before { margin-top: -6px; }
#panel-btn-icon:after { margin-top: 4px; }

#panel-btn .close { background: transparent; }
#panel-btn .close:before, #panel-btn .close:after { margin-top: 0; }
#panel-btn .close:before { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }
#panel-btn .close:after { transform: rotate(-135deg); -webkit-transform: rotate(-135deg); }

#panel { display: none; width: 170px; margin: 0; background: #dddddd; position: fixed; top:55px; right:0; z-index:9999; opacity:1;
}
}

/* ########600px以下########　*/
@media screen and (max-width: 600px){

/*メイン*/

.topimg{
	height:170px;
}

.topimg .topcatch{
	top:120px;
	text-align:left;
}

.topimg .topcatch img{
	height:35px;
}

.plan_topright{
	display:none;
}

.plan_jirei ul li a {
	width:100%;
}

.plan_jirei ul li a img{
	width:99%;
}

/*フッター*/

.copyright{
	float:left;
	width:100%;
	font-size:12px;
}

.information {
	float:left;
	width:auto;
}

.information p{
	font-size:12px;

}
}