@import url('https://fonts.googleapis.com/css?family=M+PLUS+1p');
body {
font-size:13px;
background-image:url(../website/images/bg.png);
background-repeat:repeat-x;
background-color:#BDD1EA;
font-family: 'M PLUS 1p', sans-serif;
}
h2{text-align:center;}
h3{
background: linear-gradient(transparent 70%, #ff8000 70%);
width:50%;
}
h4{
background: linear-gradient(transparent 70%, #a7d6ff 70%);
width:50%;
margin-top:1em;
margin-bottom:0.5em;
}
h5{background: linear-gradient(transparent 70%, #c5ffa7 70%);
width:50%;
}

a:link { color: #FF0000; }
a:visited { color: #FF0000; }
a:hover { color: #69F;}
a:active { color: #FF0000; }
.center {text-align: center;}
.left {text-align: left;}
.leftlong{
text-align: left;
letter-spacing: -1px;
line-height: 1.35em;
width:80%;
margin:auto;
}
.centerlong{
text-align: center;
letter-spacing: -1px;
font-size:1.2em;
}
.small {font-size:12px;}

/*夏の配色*/
p.line{
    border-bottom: 2px dashed;
    margin-bottom 2em;
}
p.line2 {
	height: 5px;
	border-width: 0;
	background-image: -webkit-linear-gradient(right,
	#c2185b 0px,#c2185b 5px,#1976d2 5px,#1976d2 10px,
	#388e3c 10px,#388e3c 15px,#fbc02d 15px,#fbc02d 20px,
	#e64a19 20px,#e64a19 25px);
	background-image:         linear-gradient(-90deg,
	#c2185b 0px,#c2185b 5px,#1976d2 5px,#1976d2 10px,
	#388e3c 10px,#388e3c 15px,#fbc02d 15px,#fbc02d 20px,
	#e64a19 20px,#e64a19 25px);
	background-size: 25px 25px;
    margin-top:1em;
    margin-bottom:1em;
}
/*秋冬の配色*/
p.line3{
border-top: 7px dotted #E06040;
}
p.line4{
border-top: 7px dotted #C0C0A0;
margin-bottom 4em;
}
p.line5{
border-top: 7px dotted #E0C0A0;
}
p.line6{
border-top: 7px dotted #A08060;
}
p.line7{
border-top: 7px dotted #804020;
}

/*img {
max-width: 100%;
height: auto;
}*/
#wrapper {
	width: 920px;
	background-color:#FFF;
	margin-top: 30px;
	margin-bottom:30px;
	margin-right: auto;
	margin-left: auto;
	padding-right: 40px;
	padding-left: 40px;
}
/* ----- ヘッダー ----- */
#header {
background-image:http://www.shibuyagakki.com/website/images/toplogo.gif;
width:920px;
/*background-color:#009b9f;  ----テスト用色付タグ*/
}
/* ----- 左サイド ----- */
#left {
width:230px;
height:637px;
float:left;
margin-top:20px;
font-size:13px;
background-image:url(../website/images/sideleftbg9.png);
background-repeat:no-repeat;
}
#leftimg{
width:60px;
height:500px;
padding-left:10px;
padding-top:35px;
float:left;
}
#leftimg img{
padding-top:10px;	
padding-left:10px;
}
#lefttext{
width:120px;
height:485px;
padding-right:10px;
padding-top:38px;	
float:right;
font-size:13px;	
text-align: left;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#lefttext td a{
text-decoration:none;
color:black;
}
/* ----- 右サイド ----- */
#right {
width:auto;
min-height:550px;
height:auto;
/*background-color:#009b9f;  ----テスト用色付タグ*/
float:right;
margin-top:20px;
}
/* ----- メイン ----- */
#content { 
margin-left:270px;
/*width:460px;*/
min-height:500px;
height:auto;
/*background-color:#009b9f;  ----テスト用色付タグ*/
margin-top:20px;
margin-bottom:30px;
font-size:16px;
font-family: 'M PLUS 1p', sans-serif;
font-weight:700;
}

/* ----- はじめに -----*/
.contenthead{
font-size:1.25em;
text-align:center;
}
/* ----- エントリー ----- */
.entry{
width:100%;
}
.entry p{
line-height:1.5em;
margin:0.5em;
padding:none;
}
/* ----- 参加資格 -----*/
.tokuten{
width:100%
}
.tokuten p{
line-height:1.5em;
margin:0.5em;
padding:none;}
/* ----- イベント会場 -----*/
.place{
width:100%
}
.place p.container{
line-height:2em;
font-size:1.2em;
}
/* ----- 開催にあたって -----*/
.about{
width:100%;
}



/* ----- フッター ----- */
#footer { 
margin-top:10px;
/*background-color:#009b9f;  ----テスト用色付タグ*/
text-align:center;
width:920px;
}
.imgcenter{
  display: block;
  margin-left: auto;
  margin-right: auto;
}
/* ----- テーブル用 ----- */ 
td.leftmenu{
height: 59px;
border: none;
}
table.leftmenu{
border: none;
padding: none;
border-collapse:collapse ;
}
#containt table , td, th {
border: 0.5px ;
border-collapse: collapse;
border-style: groove;
text-align: center;
}
#containt td{
width: 25%;
height: auto;
}
#containt th{
width: 25%;
height: auto;
background: #CCCCFF;
}
.button {
  display       : inline-block;
  border-radius : 0%;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 20px 56px;   /* 余白       */
  background    : #ff8000;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 2px solid #ff8000;    /* 枠の指定 */
  text-align    : center;
  width         : 100%;
    
}
.button:hover {
  color         : #ff8000;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
.linkbox {
    position: relative;
}
.linkbox a {
    position: absolute;
    top: 0;
    left: 0;
    height:100%;
    width: 100%;
}
/* 以下見た目をわかりやすくするための設定*/
.dis-linkbox {
  display       : inline-block;
  border-radius : 0%;          /* 角丸       */
  font-size     : 12pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 20px 56px;   /* 余白       */
  background    : #ff8000;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  border        : 5px solid #ff8000;    /* 枠の指定 */
  text-align    : center;
  width         : 80%;
}
.dis-linkbox a:hover{/* マウスオーバー時に色変更*/
  background    : #ffffff;     /* 背景色     */
  color         : #ff8000;     /* 文字食     */
}

.undery {
background:linear-gradient(transparent 50%, #FFFF00 0%);
}
.attention{
    padding: 3px 19px;
    margin: 0.5em auto;
    color: #1d1d1d;
    background: #ffa6a6;
    border-top: solid 5px #ff5757;
    border-bottom: solid 5px #ff5757;
    width: 100%;
    font-weight: bold;
    text-align: center;
}
.attention p {
    margin: 0; 
    padding: 0;
}
.red {color: #FF0000;}
.redbig{
  color:#FF0000;
  font-size:2.0em;}
.blue {color:#0093ff;}
.bluebig{
  color:#0093ff;
  font-size:2.0em;}
.powerredmargin0{
  color:#FF0000;
  font-size:2.0em;
  margin:0;
  text-shadow:
    -2px -2px 0 #000000,
    2px -2px 0 #000000,
    -2px 2px 0 #000000,
    2px 2px 0 #000;}
.powerbluemargin0{
  color:#31c0ff;
  font-size:2.0em;
  margin:0;
  text-shadow:
    -2px -2px 0 #000000,
    2px -2px 0 #000000,
    -2px 2px 0 #000000,
    2px 2px 0 #000;}
.power{
color: #31c0ff;
text-shadow:
    -2px -2px 0 #000000,
    2px -2px 0 #000000,
    -2px 2px 0 #000000,
    2px 2px 0 #000;
font-size:2.0em;
margin-bottom:1em;
margin-top:1em;
}
.powerred{
    color: #ff0000;
text-shadow:
    -2px -2px 0 #000000,
    2px -2px 0 #000000,
    -2px 2px 0 #000000,
    2px 2px 0 #000;
font-size:2.0em;
margin-bottom:1em;
margin-top:1em;

}

.reservebutton{
  width:100%;
  height:100px;
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  font-size:1.5em;
  color: #FFF;
  background: #E06040;/*背景色*/
  border-bottom: solid 2px #d27d00;/*少し濃い目の色に*/
  border-radius: 4px;/*角の丸み*/
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
  font-weight: bold;
}

.reservebutton:active {
  border-bottom: solid 2px #fd9535;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

@media screen and (max-width: 640px){
#content{
margin-left:270px;
/*width:460px;*/
min-height:500px;
height:auto;
/*background-color:#009b9f;  ----テスト用色付タグ*/
margin-top:20px;
margin-bottom:30px;
font-size:16px;
font-family: 'M PLUS 1p', sans-serif;
font-weight:500;
letter-spacing: -2px;
}
div.entry p{
margin-bottom:20px;
margin-top:20px;
}
}
