﻿@charset "utf-8";

/* =======================================

	CommonElements

======================================= */
body {
	font-size: 100%;
	line-height: 140%;
	font-family: meiryo,Arial,Helvetica,sans-serif;
	color: #000;
	text-align: center;
	background:url(../img/bg_body.png) repeat-x top #d9e3eb;
	border-top:3px solid #e97bb1;
		margin:0;
		padding:0;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
		margin:0;
		padding:0;
}
.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}



a:link { text-decoration:none; color: #000;}
a:visited { text-decoration:none; color: #000;}
a:active { text-decoration:none; color: #000;}
a:hover { text-decoration:none; color: #000;}

h1 {
margin:0 auto 20px 0;
padding: 0 0;
color: #fff;
font-size: 12px;
font-weight: bold;
text-align: center;
background:url(../img/logo.png) no-repeat left top;
display: inline-block;
width: 480px;
height: 100px;
}

nav{
display: inline-block;
text-align:right;
}
nav ul {
	margin:0;
padding:0;
}
nav ul li{
	padding:0;
	margin:0;
display:inline-block;
width:180px;
border-right:#ccc 1px dotted;
text-align:center;}

nav ul li:first-child{
	border-left:#ccc 1px dotted;
}
nav ul li a{
display:block;
width:180px;
height:30px;
padding:20px 0 0 0;
}

h2 {
padding: 10px 0 10px 25px;
width: 100%;
font-size: 120%;
background:url(../img/icon_arrow2.png) no-repeat left center;
text-align: left;
margin-left:5px;
}

#container {
	margin:0 auto;
	text-align: center;
	background:url(../img/bg_container.png) no-repeat center top #FFFFFF;
}
#admin #container{
	}
	
	
@media only screen and (min-width: 1401px) {
#container {
	width: 1060px;
}
h1{width: 48%;
height: 100px;
}
nav{
width: 40%;
height: 50px;
}
.multiple.first{float:none;
float:left}
}

@media only screen and (max-width: 1400px) {
#container {
	width: 1060px;
}
h1{width: 48%;
height: 80px;
}
nav{
width: 40%;
height: 50px;
}

}
@media only screen and (max-width: 1000px) {
#container {
	width: 90%;
}
h1{width: 48%;
height: 80px;
}
nav{
width: 40%;
height: 40px;
}

}
@media only screen and (max-width: 800px) {
	#container {
		width: 95%;
		padding:0 5px;
	}
	nav{width:100px !important;
	}
	nav ul{
	width:100px !important;
	}
	nav ul li{
	width:100px;
	height:30px;
	padding:0;
	margin:0;
	}
	nav ul li a{
	display:block;
	width:100px;
	height:20px;
	padding:10px 0 0 0;
	}

	h1{
		width:55%;
		background-image:url(../img/logo.png);
		background-repeat: no-repeat;
		background-position: left 0;
		background-size: 100% auto;
		-o-background-size: 100% auto;
		-webkit-background-size:100% auto;
	}
	.multiple{
		margin: 5px auto !important;
		display:block;
		float:none !important;
	}
	#admin #container .notes{
		width:80% !important;
	}
}


/* multiple
----------------------- */
.multiple {
margin: 0 -55px 0 65px;
width:305px;
display:block;
float:left;
text-align: center;
overflow: hidden;
background:url(../img/bg_arrow_dn.png) repeat-x center top;
padding:41px 0 0 0;
}
.multiple.first{
	clear:both;}
.multiple ul {
width:310px;
height:350px;
display:block;
padding:0;
margin:0;
text-align: left;
overflow: hidden;
position: relative;
}

.multiple ul li {
	top: 0;
	left: 0;
	width:305px;
height:350px;
display: none;
	position: absolute;
padding:0;
margin:0;
}
.multiple ul li img{
margin-top:-1px;}

.multiple ul li span {
	padding: 0 10px;
	height: 150px;
	line-height: 30px;
	color: #fff;
	display: block;
}
.multiple ul li a:hover {
opacity:0.7; 
filter: alpha(opacity=70);        /* ie lt 8 */
-ms-filter: "alpha(opacity=70)";  /* ie 8 */
-moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.7;              /* Safari 1.x */ 

}

body p {
clear: left;
}

footer {
	clear:both;
background-color: #717171;
height: 100px;
}

footer #copy{
padding:10px 0 10px 0;
}
footer #copy,
footer #copy a{
color:#fff;
}

#container .notes {
margin-bottom: 20px;
}
#admin #container .notes{
width:60%;
margin:0 auto 100px auto;
min-height:380px;
}
	
#container .multiple .notes p,
#admin #container .notes p {
margin: 0px;
padding: 0 20px 20px 20px;
text-align:left;
}

#container .multiple .notes dl dt,
#admin #container .notes dl dt {
font-weight: bold;
margin: 5px 0 2px 10px;
}

#container .multiple .notes dl dd {
margin: 0 0 20px 10px;
}
#admin #container .notes dl dd {
margin: 5px 0 30px 10px;
}

#container .multiple .notes dl,
#admin #container .notes dl {
margin: 5px 10px 10px 5px;
text-align: left;
}

#copy a.admin {
border-left-width: 1px;
border-left-style: solid;
border-left-color: #CCCCCC;
display: inline-block;
padding: 0 0 0 10px ;
color: #CCCCCC;
}

p#pagetop {
padding: 0;
margin:0;
}

#pagetop a {
text-align: center;
display: block;
width:100%;
padding: 10px 0;
margin:0 auto;
}

a.link {
	display:block;
	color:#4a8cb2;
text-align: right;
padding:0 10px 1px 34px;
background:url(../img/icon_link2_nega.png) no-repeat 5px 50%;
border:1px solid #CCCCCC;
}
a.link:hover {
color:#e45ea0;
background:url(../img/icon_link2_pink.png) no-repeat 5px 50%;
}
#admin a.link{
	padding:3px 10px 4px 34px;
}

#container .multiple .notes h2 a {
color: #003399;
background:url(../img/icon_link2.png) no-repeat right 50%;
padding-right:20px;
text-decoration:underline;

}
#container .multiple .notes h2 a:hover {
color:#a0d8ef;
background:url(../img/icon_link2_nega.png) no-repeat right 50%;
}




