/* homepageのcontentの外側 */
body {
font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif; 

background-color:#edcbfd; 	/* #96e4f6 */   
margin:0;
padding:0;

user-select:none;	/* 選択・ドラッグ　No */
-webkit-user-select:none;
-moz-user-select:none;
-khtml-user-select:none;
-webkit-user-drag:none;
-khtml-user-drag:none;	/* 選択・ドラッグ　No */

}
/* id=outerの中 */
#outer {
/*　margin:10px auto;　*/		/* 周りに10px */
margin-top:10px;
margin-right: auto;
margin-left: auto;
width:900px;
color:#111;
background-color: #86e3fc;
border-radius: 10px;	/* 四隅を丸く面取り */
}

/* id=header(表題)の中 */
#header {
height:500px;    /* 新年の言葉750　通常500 */
padding:10px 30px 0 30px;
 }

#header-inner { 
padding:10px 30px 0 60px;

}

.appImg{
 display: block;
 margin-left: auto;
 margin-right: auto;
}

.descripxion {
font-size:14px;
padding-left:30px;
color:#444;		/* #444444 と同じ */
}

.descripxion-up {
font-size:14px;
padding-left:30px;
color:#444;
position:absolute; 
top:140px;left:170px;	
}

.center {          /*  子要素も一切Center */
    text-align: center;
}
.center * {
  margin-right: auto;
  margin-left: auto;
}

h1 {
font-size:30px;
color: #ce2ed6;
padding:0 0 0 10px;
margin-top:-30px;
}
h1 a{
font-weight:bold;
color: #8c0000;
text-decoration:none;
}
h1 a:hover{			/* <h1>の中の<a> */
text-decoration:underline;
}

h2 {
font-family:cursive;
font-size:25px;
color:#2b21e3;
margin:10px 0 30px 0px;
padding:5px 0 5px 7px;
/* border-bottom:1px solid #999; */
}
h3 {
color:#f80cce;
font-size:20px;
font:Arial ;
font-weight:bold;
font-style:italic;
padding:5px 0 13px 15px;
margin-bottom:15px;
}
h4 {
font-size:15px;
padding-left: 15px;
margin-top:-10px;
}



h5 {			/* 影文字 */
margin-top:10px;
font:23pt 'arial'; 				/* どんなフォントも感じは同じ */
text-shadow: 1px 1px 0px #feba38, 3px 3px 2px #111; 　/* 影の根元色　影の端 */

font-weight:bold;
color:#f80cce;		/* 文字表の色 */		
}

h6 {
margin-top:-10px;
font-size:13px;
color:#1b31e9;
}

h7 {
margin-top:100px;
}
		/* <h1> の色違い・margin-top違い*/
h8 {
font-size:16px;
color: #0b5ff1;
padding:0 0 0 10px;
position:absolute; 
top:130px; 
left:300px;
}

h9 {
font-size:12px;
color: #8c0000;
padding:0 5px 0 0;


}

.sample-separate {         /* 表規定 */
  border-collapse: separate;
  border-spacing: 0px;
  border: 0px;
  margin-top: -3em;
  margin-left:-10px;
}
.sample-separate td {
  width:210px;
  border: 0px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left:1px;
  margin-right:1px;
}

/** 内容部分 **/
#out-content {			/* contentの右外のspace用 */
margin-right:15px;	　	/* contentの右側に10px */
}

#content {
border: 5px;			/* 枠線がつかない!? */
float:right;			/* 右に回り込み？　必要なのか？ */

width:435px;			/* contentの幅=552px */
margin:5px auto;

color:#111;
background-color: #edf6e2;
border-radius: 10px; 

}
.inner {
font-size:13px;
line-height:150%;
padding:5px 0 0 15px;

}

.article {
padding:0 10px 0 0;
}

.rdm-display{
float: left;
margin-left:-50px;
}





.att{                /* 2文字字下げ */
  padding:0 2em 0 2em;
}



.article ol {                               /*リスト文字を円付き数字に*/
  counter-reset: my-counter;
  list-style: none;
  padding: 0;
}
 
.article li {
  margin:10px 10px  0  10px;
  padding-left: 30px;
  position: relative;

}

.article li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  background-color: #bada55;
  color: #222;
  display: block;
  float: left;
  line-height: 22px;
  margin-left: -30px;
  text-align: center;
  height: 22px;
  width: 22px;
  border-radius: 50%;
}　　　　　　　　　　　　　　　　/*ここまで-リスト文字を円付き数字に*/


ul {
margin: 0 -1em 0 5px;
padding: 0;
}


p {
margin: 1em 10px 0 5px;
line-height:150%;

}


img {
border:0;

}
hr {
border-width: 1px 0 0 0;
border-style: solid;
border-color: #ccc;
height: 1px;
}
a {
color:#003366;
}
/* アニメ―ション */
@keyframes myframe {
  from {
    color: #66f;
    font-size: 20pt;
  }
  to {
    color: #f66;
    font-size: 45pt;
  }
}

.test {
  position: absolute;
  animation: myframe 0.5s ease-in 1s infinite alternate both;
  animation-iteration-count: 3;
}

.ball-to-hole{
	margin-left:380px;
}

.address{
	margin-left:140px;
        margin-top:-150px;
}

.img-wrap{	/*飛び出すボール*/
  width:200px;
  height:200px;
  margin:50px auto;
  position: relative;
  margin-top:-40px;
}

.img-wrap img {
  width:20%; 
  max-width:20%; 
  height:auto;
  margin: 0 auto;
  transition: all 600ms ease-out;
  -webkit-transition:all 600ms ease-out;
  -moz-transition:all 600ms ease-out;
  -o-transition:all 600ms ease-out;
  -ms-transition:all 600ms ease-out;
}
.img-wrap:hover img {

  width:100%; 
  max-width: 100%; 
  height:auto;
}
				/* positionとtop指定で下に移動 */
.image-chara{
 	position:relative;
     	top:6px;
}


.img-good{
   border:0px solid gray; margin:1em;
}

.clear-left{clear:left;}

p.indentfront{
  text-indent: 1em;
  padding-left: 1em;
}

p.indentback{
  text-indent: -1em;
  padding-left: 2em;
}
                         

.wcb-chan {         /* 球を追っかけて */
    animation: img-move 6s steps(6, start) infinite;
}
.wcb-chan-nostep {
    animation: img-move 6s infinite;
}
@keyframes img-move {
  to {
    transform: translateX(600px);
  }
}

.video-right {
float:right;
margin-left:10px;
margin-right:15px;
}


.video-left {
float:left;
margin-left:15px;
margin-right:10px;
}

.scroll{                     /* 横スクロールの領域 */
font-size:13px;
line-height:150%;
padding:5px 0 0 15px;
}
   .scroll ul,li {
		list-style: none;
		margin: 0;
		padding: 0;
	}			  /* ここまで横スクロールの領域 */

.blinking{
animation-name: blink; /* アニメーションの名前を設定 */
animation-duration: 1.2s; /* アニメーションの秒数を設定 */
animation-iteration-count: infinite; /* 繰り返しを設定（１回だけなら不要） */
}

@keyframes blink{ /*上記で設定したアニメーションの動作を指定 */
    0% {opacity:1;} /* 1.2s中の動作開始時間を%で指示 */
    50% {opacity:0;} /* 同上 */
}

/* 左欄 */


#left-top {
width:410px;			/* 左欄の幅は170px */
float:left;
margin-left:15px;
margin-right:10px;
}

.guide {
font-size:12px;
padding-left:30px;
color:#444;		/* #444444 と同じ */
}

#left {
color:#111;
font-size:18px;
width:425px;			/* 左欄の幅は170px */
float:left;

border: 5px;			/* 枠線がつかない!? */
width:430px;			/* contentの幅=552px */
margin:5px auto;
background-color: #97fdb8;		/* #dbf2fb b8e5f8 */
border-radius: 10px; 

margin-left:10px;
}
.side-title {
padding:4px 20px;
margin:0 0 0 15px;
font-weight:bold;
color: #E3E3E2;
background:#054197;
border-top: 1px #CCCACB solid;
border-right: 1px #CCCACB solid;
border-ledt: 1px #CCCACB solid;
border-radius: 5px 5px 0 0;
}

.side {
color:#e8124e;
background-color:#b8e5f8;
line-height:170%;
padding:4px 10px 0 10px;
margin:0 0 7px 15px;
font-weight:bold;
border-bottom: 1px #CCCACB solid;
border-right: 1px #CCCACB solid;
border-left: 1px #CCCACB solid;
border-radius: 0 0 5px 5px;
}






				/* 最初に　 text-decoration:none; がないかぎりﾘﾝｸは下線付き　*/
							/* ★☆なぜ下線がつない？★☆ */

.side a:link {color: #0000ff; text-decoration:none; } a:visited {color: #036; } a:hover{color: #22ea12; text-decoration:underline;} a:active {color: #ff8000;}




.side ul {
margin: 0 0 0.5em 0;
padding: 0;
}
.side li {
padding:0 0 0 4px;
margin:0.6em 0 0 0;
list-style:none; 
}

					/*　連絡先を下げる  */
.mihari {
margin-top:500px;
}




#footer {
padding-top:20px;
font-size:12px;
height:100px;
clear:both;
text-align:center;
color:#444;
}
#footer a{
color:#444;
}
blockquote{
border:1px solid #ccc;
padding:5px;
margin:10px;
}

.fotter-Table {                      /*Tableの広さを固定*/
border-collapse: collapse;
table-layout: fixed;
}

.fotter- th,
.fotter- td {
border: 1px solid #CCCCCC;
padding: 5px 10px;
text-align: left;
}

.fotter- th {
background-color: #FFFFFF;