﻿@charset "UTF-8";

/*ボディーに影を付ける（今のところ反映されてない）*/
#bg{
	width:820px;
	background:url(../images/bg.gif) ;*/
	/*background:#773477 ;
	background:url(../images/201508bk.jpg) repeat-y;
	background:url(../images/bg.gif) ;
	background:url(../images/kakiiro.jpg) ;*/
	text-align:center;
	}

body {
	margin: 0 40px;
	/*テキストの色*/
	color: #666666;
	font-size: 75%;
	font-family: sans-serif;
	background:url(../images/bg.gif) 
	/*background:url(../images/kakiiro.jpg) ;
	
	background:url(../images/kakiiro.jpg) ;
	background:url(../images/201508bk.jpg);
	
	background: #2d816a;
	background:url(../images/kakiiro.jpg) ;
	background:#773477 ;
	
	background:url(../images/pinkuwashi.jpg) ;
	

	background:url(../images/kakiiro.jpg) ;
	
	
	 ;
	
	
	
	
	
	
	background: #773577;紫
	background: #82d8d0;全体のバックの色* 2010_04 ピンクに変更　それまではbg.gif
	
	
	
	
	background:url(../images/pinkuwashi.jpg) ;*/
	
}
/* .slideShow
------------------------- */
.slideShow {
	margin: 0 auto;
	text-align: left;
	display: none;
}

/* .mainView
------------------------- */
.slideShow .mainView {
	width: 750px;
	position: relative;
	overflow: hidden;
}
.slideShow .mainView ul {
	width: 750px;
	overflow: hidden;
	position: relative;
}
.slideShow .mainView ul li {
	top: 0;
	left: 0;
	width: 750px;
	position: absolute;
}
.slideShow .mainView ul li img {
	width: 750px;
}

/* .thumbNail
-------------------------  #2d816a;background:url(../images/bg.gif);*/
.slideShow .thumbNail {

	background:url(../images/bg.gif) ;
	/*background:url(../images/kakiiro.jpg) ;
		background:url(../images/201508bk.jpg) repeat-y;

	background: #2d816a;

	
	background:#773477 ;
	
	background:url(../images/pinkuwashi.jpg) ;
	
	background: #2d816a;
	
	
	
	
	
	background:url(../images/pinkuwashi.jpg) ;
	
	
	background:url(../images/kakiiro.jpg) ;
	
	*/
	width: 95%;
	left: 10;
	overflow: hidden;
}

.slideShow .thumbNail ul {
	width: 95%;
	left: 10;
}

.slideShow .thumbNail ul li {
	float: left;
	display: inline;
	overflow: hidden;
	cursor: pointer;
}

.slideShow .thumbNail ul li img {
	width: 100%;
}

.slideShow .thumbNail ul li.active {
	filter: alpha(opacity=100)!important;
	-moz-opacity: 1!important;
	opacity: 1!important;
}

/* sideNavi
------------------------- */
.slideShow .mainView .btnPrev,
.slideShow .mainView .btnNext {
	top: 0;
	width: 5%;
	height: 100%;
	position: absolute;
	z-index: 100;
}
.slideShow .mainView .btnPrev {
	left: 0;
	background: #ccc url(../img/btnPrev.png) no-repeat center center;
}
.slideShow .mainView .btnNext {
	right: 0;
	background: #ccc url(../img/btnNext.png) no-repeat center center;
}


/* =======================================
	ClearFixElements
======================================= */
.slideShow ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.slideShow ul {
	display: inline-block;
	overflow: hidden;
}


/* ------------------------------------------------
	いちよmediaQueriesの指定を入れておきますが
	スライドショー動作には関連しておりません。
------------------------------------------------ */

/* ===========================================
	デスクトップ系 769 - 1024
=========================================== */
@media screen and (max-width: 1024px) {
	.slideShow {
		width: 590px;
	}
}
/* ===========================================
	タブレット系 749 - 768
=========================================== */
@media screen and (max-width: 768px) {
	.slideShow {
		width:100%;
	}
}
/* ===========================================
	スマートフォン系 748 - 
=========================================== */
@media screen and (max-width: 748px) {
	.slideShow {
		width: 100%;
	}
}


/*行間の指定*/
p,dt,dd {
	line-height: 1.5;
}


#wrapper {
	width: 750px;
	max-width: 100%;
	min-width: 534px;
	margin: 10px auto;
	padding-top: 0px;
	background:url(../images/bg.gif) ;
	/*background:url(../images/kakiiro.jpg) ;
	
	
	background:url(../images/201508bk.jpg) repeat-y;
	
	background: #2d816a;
	background:url(../images/kakiiro.jpg) ;
	background:#773477 ;
	
	background:url(../images/pinkuwashi.jpg) ;
	
	
	background:url(../images/kakiiro.jpg) ;
	
	
	
	background: #FFFFFF url(../images/pinkuwashi.jpg) right bottom no-repeat;*/
}
/*どんなところの太字はブルー*/
#wrapper #primary #aboutUs p strong {
	/*color: #0CC;*/
	color: #1395a5;
}
h1#logo {
	height: 500px;
	margin: 0 0 30px 0;
	border-right: 7px solid #FFFFFF;
	border-left: 7px solid #FFFFFF;
	background: #7DD715 url(../images/h1_bg.jpg) no-repeat;
}
#content {
	overflow: auto !important;
	overflow /**/: hidden;
	width: 800px;
	height:222px;	
	background:url(../images/bg.gif);
	/*background:url(../images/kakiiro.jpg) ;
	
	
	background:url(../images/201508bk.jpg) repeat-y;
	
	全体のバックの色* 2010_04 ピンクに変更　それまではbg.gif 			   
	background:url(../images/pinkuwashi.jpg) ;
	
	background:url(../images/kakiiro.jpg) ;
	background:url(../images/bg.gif) ;
	background:url(../images/pinkuwashi.jpg) ;

	
	background:#773477 ;
	background:url(../images/kakiiro.jpg) ;
	background: #2d816a;*/
	padding-bottom: 2px;
	font-size:120%;
}
#content_fla {
	overflow: auto !important;
	overflow /**/: hidden;
	width: 750px;
	height:100%;	
	
	background: #FFFFFF url(../images/bg.gif);
	/*background:url(../images/kakiiro.jpg) repeat-y ;
	background:url(../images/201508bk.jpg) repeat-y;
	
	全体のバックの色* 2010_04 ピンクに変更　それまではbg.gif*/
	/*background: #2d816a;
	background:url(../images/kakiiro.jpg) ;
	background:#773477 ;
	
	background:url(../images/pinkuwashi.jpg) ;

	background: #2d816a;
	background:url(../images/kakiiro.jpg) ;
	background:#773477 ;
	background: #FFFFFF url(../images/bg.gif);
	background: #FFFFFF url(../images/bg.gif);
	↓ピンク和紙
	
	background: #FFFFFF url(../images/kakiiro.jpg);
	*/
	/*background:url(../images/pinkuwashi.jpg) ;
		
	
	background:url(../images/kakiiro.jpg) ;
	background:#773477 ;
	background:url(../images/201508bk.jpg) repeat-y;*/
	
	padding-bottom: 30px;
	font-size:120%;
}
#content2 {
	overflow: auto !important;
	overflow /**/: hidden;
	width: 100%;
	height:50px;
	background:  url(../images/uepop.png) top repeat-x;
	padding-bottom: 10px;
	font-size:120%;
}


/* コンテンツの中の文字のマージンを設定-------------*/
#content2 .section{
	margin: 10px 10px 10px 10px;

}
#design .section{
	margin: 3px 10px 0 10px;
}		






#primary {
	float: left;
	width: 373px; height: 2000px;
	background-color:#FFF;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#primary .section {
	
	margin: 16px 18px 0 18px;
	/*border-bottom: 1px solid #ccc;*/
}


#secondary {
	float: left;
	width:375px; height: 2000px;
	padding-left: 1px;
	background-color:#fff;
}
#secondary .section {
	margin: 16px 18px 10px 18px;
	font-size: 14px;
	/*border-bottom: 1px solid #ccc;*/
	
}
/*メニューの中の文字サイズを大きくする*/
#secondary .sectionm {
	
	margin: 16px 18px 0 18px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:130%;
}

.section h2 {
	margin-bottom: 6px;
	text-align: right;
}


.section p {
	margin-bottom: 10px;
}
.section dd {
	margin-bottom: 10px;
	border-bottom: 1px solid #ECECEC;
}
#copyright {
	clear: both;
	width: 100%; /* for WinIE6,7 */
	padding-top: 28px;
	text-align: center;
	background: #ffffff;
}


#aspslide{ 
       position: relative;       
       width: 700px; 
       height: 400px; 
       overflow:hidden; 
       padding:0!important; 
 } 
 
 
 .asnakami{ 
       position: absolute; 
       top: 0; 
       left: 0; 
       width: 100%; 
       height: 100%; 
       padding:0!important; 
 }    
 
 
 
 
 #asnakami1{ 
       -moz-animation: fadeinout 35s 0s infinite; 
       -webkit-animation: fadeinout 35s 0s infinite; 
       -o-animation: fadeinout 35s 0s infinite; 
       animation: fadeinout 35s 0s infinite; 
 } 
 
 
 #asnakami2{ 
       -moz-animation: fadeinout 35s 5s infinite; 
       -webkit-animation: fadeinout 35s 5s infinite; 
       -o-animation: fadeinout 35s 5s infinite; 
      animation: fadeinout 35s 5s infinite; 
 } 
 
 
 #asnakami3{ 
       -moz-animation: fadeinout 35s 10s infinite; 
       -webkit-animation: fadeinout 35s 10s infinite; 
       -o-animation: fadeinout 35s 10s infinite; 
       animation: fadeinout 35s 10s infinite; 
 } 
 
 
 #asnakami4{ 
       -moz-animation: fadeinout 35s 15s infinite; 
       -webkit-animation: fadeinout 35s 15s infinite; 
       -o-animation: fadeinout 35s 15s infinite; 
       animation: fadeinout 35s 15s infinite; 
 } 
 
 
 #asnakami5{ 
       -moz-animation: fadeinout 35s 20s infinite; 
       -webkit-animation: fadeinout 35s 20s infinite; 
       -o-animation: fadeinout 35s 20s infinite; 
       animation: fadeinout 35s 20s infinite; 
 } 
 
 
 #asnakami6{ 
       -moz-animation: fadeinout 35s 25s infinite; 
       -webkit-animation: fadeinout 35s 25s infinite; 
       -o-animation: fadeinout 35s 25s infinite; 
       animation: fadeinout 35s 25s infinite; 
 }

#asnakami7{ 
       -moz-animation: fadeinout 35s 30s infinite; 
       -webkit-animation: fadeinout 35s 30s infinite; 
       -o-animation: fadeinout 35s 30s infinite; 
       animation: fadeinout 35s 30s infinite; 
 } 
 
 @-moz-keyframes fadeinout { 
  0% { left:0%; opacity:0;} 
  5% { left:0%;opacity:1; } 
  20% { left:0%; opacity:1;} 
  25% { left:0%;opacity:0; } 
  26% { opacity:0;left:100%; } 
  99.99% { opacity:0;left:100%; } 
  100% { opacity:0;left:0%; } 
 } 
 
 
 @-webkit-keyframes fadeinout { 
  0% { left:0%; opacity:0;} 
  5% { left:0%;opacity:1; } 
  20% { left:0%; opacity:1;} 
  25% { left:0%;opacity:0; } 
  26% { opacity:0;left:100%; } 
  99.99% { opacity:0;left:100%; } 
  100% { opacity:0;left:0%; } 
 } 
 
 
 @-o-keyframes fadeinout { 
  0% { left:0%; opacity:0;} 
  5% { left:0%;opacity:1; } 
  20% { left:0%; opacity:1;} 
  25% { left:0%;opacity:0; } 
  26% { opacity:0;left:100%; } 
  99.99% { opacity:0;left:100%; } 
  100% { opacity:0;left:0%; } 
 } 
 
 
 @keyframes fadeinout { 
  0% { left:0%; opacity:0;} 
  5% { left:0%;opacity:1; } 
  20% { left:0%; opacity:1;} 
  25% { left:0%;opacity:0; } 
  26% { opacity:0;left:100%; } 
  99.99% { opacity:0;left:100%; } 
  100% { opacity:0;left:0%; } 
 } 
