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

h1,h2,h3,h4,h5,h6,p,img,ul,li,td,th	{
	margin:0;
	padding:0;
	border:0;
	}
	
.float-right {
	float:right;
	}
	
.float-left {
	float:left;
	}
	
a:link {
	color:#00F;
	} 

a:hover {
	color:#30F;
	}
	
a:visited {
	color:#60F;
	}

a:active {
	color:#f00;
	}
	
.clearfix:after {
	clear:both;
	content:"";
	display:block;
	}
		
.shadow {
	box-shadow:5px 5px 5px 1px #999;
	overflow:auto;
	}
		
#wrap	{
	width:960px;
	margin:0px auto;
	}
	
#index0 {
	background-image:url(../image/top-back.jpg);
	background-repeat:no-repeat;
	background-position:center;
	background-attachment:scroll;
	background-size:cover;
	height:440px;
	position:relative;
	}
		
.top	{
	height:60px;
	border-top:11px solid #00a0e9;
	border-bottom:11px solid #00a0e9;
	padding:15px 0;
	background-color:#fff799;
	}
	
.top-in {
	width:960px;
	margin:0 auto;
	}
	
.hako-top {
	height:50px;
	float:left;
	margin:auto 20px;
	}
	
.hako-top img {
	height:50px;
	float:left;
	margin:auto 5px;
	}
	
.shamei1 {
	font-size:17px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:500;
	margin:0 3px;
	padding:0;
	}
	
.shamei2 {
	font-size:20px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:800;
	margin:0 3px;
	padding:0;
	}
	
.hako-top a:link {
	color:#009;
	}

.hako-top a:visited {
	color:#009;
	}
	
.eigyoujikan {
	margin-right:20px;
	font-weight:800;
	background-color:#FFF;
	border-radius:10px;
	padding:5px 10px;
	}
	
.blue {
	background-color:#000099;
	height: 52px;
	}

#wrapper {
	width:960px;
	display: block;
	margin: 0 auto;
}

#global-navi {
	list-style:none;
	width:960px;
	margin:0px auto;
	display:inline-block;
}

#global-navi li{
	float:left;
	width:159px;
	height:50px;
	font-size:18px;
	border-spacing:0;
	text-align:center;
	line-height:50px;
	font-weight:600;
	color:#FFF;
	border-bottom:2px solid #FFF;
	list-style: none;
}
		
#global-navi .jump {
	color:#FFF;
	background-color:#009;
	}
	
#global-navi .jump:hover {
	text-decoration:underline;
	color:#000;
	background-color:#FF0;
	border-bottom:2px solid #009;
	transition:0.8s;
	}
		
.border-right {
	border-right:1px solid #Fff;
	}

.navi1 {
	position:relative;
	}
	
.midashi p {
	position:absolute;
	bottom:30px;
	left:5px;
	color:#000;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:13px;
	width:300px;
	background:rgba(255,255,255,0.8);
	line-height:20px;
	text-align:center;
	}
	
.midashi h3 {
	text-align:center;
	margin:5px auto;
	}

.hako {
	width:300px;
	height:250px;
	float:left;
	margin:auto 5px;
	}
	
.position {
	position:relative;
	}
	

.irai {
	margin:10px 15px;
	font-size:20px;
	border-left:10px solid #00f;
	border-bottom:2px solid #00f;
	width:400px;
	padding-left:10px;
	}
	
.main {
	width:690px;
	float:right;
	}
	
.osirase {
	margin:10px 0 10px 10px;
	width:680px;
	}

.osirase li {
	font-size:16px;
	width:600px;
	line-height:25px;
	padding-left:40px;
	list-style:none;
	margin:10px 5px;
	}
	
.osirase h3{
	margin:5px;
	font-size:12px;
	font-weight:500;
	}
	
.infomation {
	margin:20px auto 50px;
	}
	
.koukoku {
	width:680px;
	margin:20px 0 20px 10px;
	}
	
.sidebar {
	width:260px;
	float:left;
	}

.sidebar li {
	list-style: none;
}

.sidelist-meishi .inner {
	display:block;
}
	
.sidelist-meishi {
	width:240px;
	border-radius:5px;
	margin:10px 20px 0 10px;
	}

.sidelist-meishi li {
	list-style:none;
	border-radius:2px;
	margin:3px auto;
	border:2px solid;
	border-image:linear-gradient(135deg,#0000ff,#00ffff);
	border-image-slice: 2;
	}
	
.sidelist-meishi img {
	display:block;
	margin:auto 0; 
	}
	
.sidelist-meishi h3 {
	text-align:center;
	border-radius:7px;
	background:linear-gradient(135deg,#0000ff,#00ffff);
	color:#fff;
	line-height:40px;
	}

.sidelist {
	width:240px;
	border-radius:5px;
	margin:10px 20px 0 10px;
	}

.sidelist .inner {
	display:block;
}
	
.sidelist li {
	list-style:none;
	border-radius:2px;
	margin:3px auto;
	border:2px solid;
	border-image: linear-gradient(135deg,#056310,#00ff00);
	border-image-slice: 2;
	}
	
.sidelist img {
	display:block;
	margin:auto 0; 
	}
	
.sidelist h3 {
	text-align:center;
	border-radius:7px;
	background:linear-gradient(135deg,#056310,#00ff00);
	color:#fff;
	line-height:40px;
	}

.sidelist2 {
	width:240px;
	border-radius:5px;
	margin:10px 20px 20px 10px;
	}

.sidelist2 li {
	list-style:none;
	border-radius:2px;
	margin:5px auto;
	text-align:center;
	height:35px;
	line-height:35px;
	}
	
.sidelist2 li:nth-child(1) {
	background-image: url("../image/home.jpg");
	background-size: cover;
}

.sidelist2 li:nth-child(2) {
	background-image: url("../image/access.jpg");
	background-size: cover;
}

.sidelist2 li:nth-child(3) {
	background-image: url("../image/privacy.jpg");
	background-size: cover;
}
	
.sidelist2 li a {
  position: relative;
  text-decoration: none;
  color: white;
  font-weight: 600;
}

.sidelist2 li:hover {
	opacity: 0.7;
}
	
.inf-waku {
	width:230px;
	background-color:#00F;
	margin:20px auto;
	padding:10px 5px ;
	border-radius:7px;
	}
	
footer {
	margin-top:100px;
	background-image:url(../image/footer2.gif);
	background-position:center;
	background-size:1300px;
	background-repeat:no-repeat;
	}
	
.juusho-waku {
	padding:20px;
	}

.juusho {
	width:960px;
	margin:0 auto;
	}
	
.juusho p {
	font-size:16px;
	font-weight:600;
	color:#333;
	float:left;
	line-height:30px;
	margin:150px 0 10px;
	padding:5px 10px;
	background:rgba(255,255,255,0.3);
	text-shadow: 3px 4px 0px #87ceeb;
	}
	
.juusho img {
	margin:150px 20px 10px;
	float:left;
	}


.copy-right {
	background-color:#00F;
	color:#ddd;
	text-align:center;
	font-size:14px;
	font-weight:600;
	line-height:40px;
	}

.normal {
	display:block;
}
	
.responsive {
	display:none;
}



/*以下動的プログラムの為変更不要
-------------------------------------------------------------------------*/

/*ＤＴＰのボタン*/
.button-dtp {
	border-radius:15px;
	display:block;
	width:300px;
	height:200px;
	position:relative;
	text-decoration:none;
	text-align:center;
	color:#fff;
	z-index:0;
	float:left;
	margin:auto 5px;
	}
 
.button-dtp:before{
	content:"";
	border-radius:15px;
	width:100%;
	height:100%;
	position:absolute;
	z-index:-1;
	left:0;
	transition:0.5s;
	background-image:url(../image/dtp.jpg);
	background-size:cover;
	}
 
.button-dtp:after {
	content:"";
	border-radius:15px;
	width:100%;
	height:100%;
	position:absolute;
	z-index:-2;
	left:0;
	background:linear-gradient(45deg,rgba(159,217,246,0.5),rgba(29,32,136,0.5)), url(../image/dtp.jpg);
	background-size:cover;
	box-shadow: 5px 5px;
	}
 
.button-dtp:hover:before {
	opacity:0;
	}
/*ＤＴＰのボタン*/


/*ＷＥＢのボタン*/
.button-web {
	display:block;
	border-radius:15px;
	width:300px;
	height:200px;
	position:relative;
	text-decoration:none;
	text-align:center;
	color:#fff;
	z-index:0;
	float:left;
	margin:auto 5px;
	}
 
.button-web:before{
	content:"";
	border-radius:15px;
	width:100%;
	height:100%;
	position:absolute;
	z-index:-1;
	left:0;
	transition:0.5s;
	background-image:url(../image/web.jpg);
	background-size:cover;
	}
 
.button-web:after {
	content:"";
	border-radius:15px;
	width:100%;
	height:100%;
	position:absolute;
	z-index:-2;
	left:0;
	background:linear-gradient(45deg,rgba(243,152,0,0.5),rgba(228,0,127,0.5)), url(../image/web.jpg);
	background-size:cover;
	}
 
.button-web:hover:before {
	opacity:0;
	}
/*ＷＥＢのボタン*/

/*ＰＣのボタン*/
.button-pc {
	display:block;
	border-radius:15px;
	width:300px;
	height:200px;
	position:relative;
	text-decoration:none;
	text-align:center;
	color:#fff;
	z-index:0;
	float:left;
	margin:auto 5px;
	}
 
.button-pc:before{
	content:"";
	border-radius:15px;
	width:100%;
	height:100%;
	position:absolute;
	z-index:-1;
	left:0;
	transition:0.5s;
	background-image:url(../image/pc.jpg);
/*	background-image:url(../image/pc-kyuushi.jpg);*/
	background-size:cover;
	}
 
.button-pc:after {
	content:"";
	border-radius:15px;
	width:100%;
	height:100%;
	position:absolute;
	z-index:-2;
	left:0;
/*	background:linear-gradient(45deg,rgba(218,224,0,0.5),rgba(0,105,52,0.5)), url(../image/pc.jpg);*/
/*	background:linear-gradient(45deg,rgba(218,224,0,0.5),rgba(0,105,52,0.5)), url(../image/pc-kyuushi.jpg);*/
	background-size:cover;
	}
 
.button-pc:hover:before {
    opacity:1;
/*    opacity:0;*/
	}
/*ＰＣのボタン*/

/*トップ画像のフェードインとフェードアウト
----------------------------------------------------*/
.fadeout {
	opacity: 0;
	transition: 3s ease-in-out;
	-webkit-transition: 3s ease-in-out;
	}

.fadein {
	opacity: 1;
	transition: 3s ease-in-out;
	-webkit-transition: 3s ease-in-out;
	position:absolute;
	top:0;
	left:0;
	}




/*練習*/

.shake:hover{
  animation: shake-move 10s ease-in-out 0s infinite normal;
  background:#0091EA;
  margin:auto 20px;
}


@keyframes shake {
   0% {transform: translate(0px, 0px) rotateZ(0deg)}
    25% {transform: translate(2px, 2px) rotateZ(10deg)}
    50% {transform: translate(0px, 2px) rotateZ(120deg)}
    75% {transform: translate(2px, 0px) rotateZ(-1deg)}
    100% {transform: translate(0px, 0px) rotateZ(0deg)}

}