﻿@charset "utf-8";
/* CSS Document */
html {
	overflow: scroll;
	}
body {
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background-image:  url('../images/background-img-03.png'), url(../images/background-img-01.png);
	background-repeat: repeat, no-repeat;
	background-size: auto, contain;
	width: 100%;
	margin: 0 auto;
	color: #6F4724;
	-webkit-text-size-adjust: 100%;
	}
.cf:before,
.cf:after {
	content: " ";
	display: table;
	}
.cf:after{
	clear: both;
	}
.cf {
	*zoom: 1;
	}

@media screen and (max-width: 768px){
/*==================================================
                   header
====================================================*/
#container {
	font-size: 80%;
	line-height: 1.4em;
	margin-top: 60px;
	}
h1 img{
	width: 100%;
	margin: 1% auto;
		}
.head-right dl{
 margin: 0% auto 6%;
 	background: rgba(255,255,255,0.7);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	border: 3px double;
	padding: 1% 0;
	width: 90%;
}
.head-right dl dt{
	font-size: 88%;
	text-align: center;
}
.head-right dl dt span {
	color: #FF0000;
}
.head-right dl dd {
	margin-left: 3%;
	text-align: center;
	padding-right: 2%;
}
.head-right dl dd a {
	text-decoration: none;
}
.head-right dl dd i {
	font-size:240%;
	margin-right: 2%;
}
.head-right dl dd a img {
	width: 60%;
}
/*==================================================
                   navigation
====================================================*/
	#controller {
		position: fixed;
		z-index: 100000;
		top: 0;
		display: block;
		width: 98%;
		height: 40px;
		text-align: right;
		line-height: 30px;
		font-size: 30px;
		filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#99ffffff,EndColorStr=#99ffffff);
		background-color: rgba(255, 255, 255, 0.9);
		padding-right: 2%;
		padding-top: 2%;
		}
	#nav-switcher {
		display: none;
		}
	#nav-switcher:checked {
		}
	#global-navi{
		background-color: #653332;
		}
	#global-navi ul {
		position: fixed;
		z-index: 100000;
		width: 100%;
		text-align: center;
		top: 45px;
		}
	#global-navi ul li a {
		background-image: url('images/line-img-01.png');
		background-repeat: repeat-x;
		background-position: 50% top;
		color: #6F522E;
		text-decoration: none;
		display: block;
		height: 0;
		overflow: hidden;
		-webkit-transform: all ease-in-out 0.2s;
		-moz-transition: all ease-in-out 0.2s;
		transition: all ease-in-out 0.2s;
		filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#99ffffff,EndColorStr=#99ffffff);
		background-color: rgba(255, 255, 255, 0.9);
		}
	#global-navi #nav-switcher:checked + ul li a {
		height: 2.4em;
		overflow: inherit;
		padding-top: 5%;
		}/*【隣接セレクタ】要素と要素が直接隣接(直後の弟)している場合に適用されるセレクタ*/
/*==================================================
                 main-img-01
====================================================*/
#main-navi {
	position: relative;
	padding-top: 15%;
	}
#main-navi .main-img-01 img {
	display: block;
	position: absolute;
	right: 0px;
	top: -46px;
	z-index: 999;
	-moz-transition: -moz-transform 0.8s linear;
    -webkit-transition: -webkit-transform 0.8s linear;
    -o-transition: -o-transform 0.8s linear;
    -ms-transition: -ms-transform 0.8s linear; 
    transition: transform 0.8s linear; 
	}
#main-navi .main-img-01 img:hover {
	-moz-transform: rotateY(50deg);
    -webkit-transform: rotateY(50deg);
    -o-transform: rotateY(50deg);
    -ms-transform: rotateY(50deg);
    transform: rotateY(50deg);
	}
/*==================================================
                 news
====================================================*/
.news {
	width: 80%;
	margin: 5% 5%;
	padding: 2% 5%;
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#99ffffff,EndColorStr=#99ffffff);
	background-color: rgba(255, 255, 255, 0.7);
	}
.news h2 img {
	display: block;
	width: 50%;
	margin: 0 auto;
	}
.news-02 {
	list-style: none;
	overflow-y: scroll;
	border: 1px solid;
	height: 130px;
	}
.news-02 li {
	line-height: 1.6em;
	font-size: 83%;
	}
.news-02 li span{
	color:#B79300;
	font-size: 80%;
	margin-right: 3%;
	}

/*==================================================
                 info
====================================================*/
.info {
width: 100%;
margin: 5% 0;
}
.info ul {
list-style: none;
}
.info ul li {

}
.info ul li a {
display: block;
float: left;
width: 33%;
}
.info ul li a img {
display: block;
width: 100%;
}
/*==================================================
                 school-01
====================================================*/
.school-01 .muryou img {
	width: 100%;
	display: block;
	}

.school-01 {
width: 80%;
margin: 5% auto;
line-height: 1.6em;
font-size: 88%;
}
.school-01 h2 img {
margin: 3% 25%;
width: 50%;
}
.school-01 span {
font-weight: bold;
}
.school-01 .demo {
border: 3px #6F4724 double;
padding: 5%;
	
}
.school-01 marquee {
display: inline-block;
  background-image: url('images/baku-img.png');
  background-repeat: no-repeat;
  background-size: cover;
  padding: 3%;
  margin-bottom: 2%;
  }

/*==================================================
                 school-02
====================================================*/
.school-02 h2 {
background-image:url('images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 3%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
}
.school-02 figure img {
display: block;
width: 90%;
margin: 3% auto;
}
.school-02 figure figcaption {
width: 80%;
margin: 5% auto;
line-height: 1.6em;
font-size: 88%;
}
/*==================================================
                 school-03
====================================================*/
.school-03 h2 {
background-image:url('images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 3%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
}
.school-03 h3 img {
display: block;
width: 70%;
margin: 3% auto;
}
.school-03 ol {
width: 80%;
margin: 5% auto;
line-height: 1.6em;
font-size: 88%;
}
.box1 ol {
counter-reset:li;
	line-height: 1.6em;
	padding: 10% 4%;
}
.box1 ol li, .box2 ol li {
	line-height: 1.4em;
	margin: 3% 0;
	list-style:none; /*デフォルトナンバリングを消す*/
	position:relative;
	padding:0;
	margin-left:25px;
	*list-style-type: decimal; /*IE7*/
}
.box2 h3 img {
	display: block;
}
.box2 ol {
	line-height: 1.6em;
	padding: 10% 4%;
	counter-reset:li;
}
.box1, .box2 {
	clear: both;
}
ol li:before {
  content:counter(li);
  counter-increment:li;
  position:absolute;
  left:-25px;
  width:25px;
  color: #3333FF;
  background-image: url('../images/ol-img.png');
  background-repeat: no-repeat;
  background-size: 100%;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size:110%;
  padding-left:5px;
  }
/*==================================================
                 footer
====================================================*/
footer {
clear:both;
width: 100%;
height: 60px;
font-size: 75%;
margin-top: 15%;
padding-top: 10%;
background-color: #CCFFFF;
}
/*==================================================
              page-top
====================================================*/

#page-top {
	position: fixed;
	bottom: 20px;
	right: 10px;
	padding: 5% 2%;
	background: rgba(0,0,0,0.5);
	}
#page-top a{
	text-decoration: none;
	text-align: center;
	display: block;
	color: #fff;
	font-size: 88%;
	}
#page-top:hover {
	background: rgba(255,255,255,0.3);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	}
#page-top a:hover{
	display: block;
	color: #000;
	}
/*==================================================
                   none
====================================================*/
.right {
display: none;
}
/*==================================================
                  youji
====================================================*/
#youji h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 3%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}
#youji .title-img img {
display: block;
width: 100%;
margin: 3% 0;
}
#youji .point dt,
#youji .point2 dt,
#youji .point3 dt,
#youji .point4 dt {
	display: none;
}
#youji .point dd,
#youji .point2 dd,
#youji .point3 dd,
#youji .point4 dd {
	margin: 3% 0;
	line-height: 1.4em;
	font-size: 88%;
	letter-spacing: 0.1m;
	text-shadow: 2px 2px 3px #ccc;
}
#youji .point {
	background-image: url('../images/background-youji.png');
	background-repeat: no-repeat;
	background-size: cover;
	padding: 1% 10%;
	height: auto;
	margin: 5% 0;
}
#youji .point2 {
	background-image: url('../images/background-youji3.png');
	background-repeat: no-repeat;
	background-size:contain;
	padding: 1% 10%;
	height: auto;
	margin: 5% 0;
}
#youji .point3 {
	background-image: url('../images/background-youji4.png');
	background-repeat: no-repeat;
	background-size:contain;
	padding: 1% 10%;
	height: auto;
	margin: 5% 0;
}
#youji .point4 {
	background-image: url('../images/background-youji5.png');
	background-repeat: no-repeat;
	background-size:contain;
	padding: 1% 10%;
	height: auto;
	margin-bottom: 5%;
	margin: 5% 0;
}
#youji .youji-img {
	display: block;
	width: 100%;
	margin: 5% 0;
}
#youji .youji-img img {
display: block;
	width: 100%;
}
#youji .ryoukin {
	width: 80%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#youji .ryoukin dt {
	line-height: 1.4em;
	}
#youji .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#youji .ryoukin-p {
	text-align: right;
	font-size: 80%;
	margin: 3% 10%;
	width: 80%;
}
#youji .ryoukin-p small {
	color:#826306;
	font-size: 77%;
	margin-left: 1%;
}
/*==================================================
                  shougaku
====================================================*/
#shougaku h2 {
	background-image:url('../images/line-img-02.png');
	background-position: 50% bottom;
	background-repeat: repeat-x;
	padding: 3%;
	display: inline-block;
	margin-left: 2%;
	margin-top: 5%;
	margin-bottom: 2%;
	text-shadow: 3px 3px 4px #ccc;
	}
#shougaku .ryoukin {
	width: 80%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#shougaku .ryoukin dt {
	line-height: 1.4em;
	}
#shougaku .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#shougaku .ryoukin-p {
	text-align: right;
	font-size: 80%;
	margin: 3% 10%;
	width: 80%;
	
}
#shougaku .ryoukin-p small {
	color:#826306;
	font-size: 77%;
	margin-left: 1%;
}
#shougaku .left {
	background-image: url('../images/shougaku-img-02.png');
	background-size: 100% 70%;
	background-repeat: no-repeat;
	background-position: bottom;
}
#shougaku .left .box-p {
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	line-height: 1.6em;
	font-size: 90%;
	background-image: url('../images/line-img-01.png'),url('../images/line-img-01.png'), url('../images/line-img-03.png'), url('../images/line-img-03.png');
	background-position: bottom, top, left, right;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	padding: 5%;
	margin: 2% 5%;
}
/*==================================================
                  chiteki
====================================================*/
#chiteki h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 3%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}
#chiteki .chiteki-title img {
display: block;
width: 100%;
margin-top: 5%;
}
#chiteki .ryoukin {
	width: 80%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#chiteki .ryoukin dt {
	line-height: 1.4em;
	}
#chiteki .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#chiteki .ryoukin-p {
	text-align: right;
	font-size: 80%;
	margin: 3% 0;
	right: 0;
}
#chiteki .ryoukin-p small {
	color:#826306;
	font-size: 77%;
	margin-left: 1%;
}
#chiteki .left {
background-image: url('../images/hana-tate01.png');
background-position: left bottom;
background-repeat: no-repeat;
background-size: 100% auto;
}
#chiteki .left .box-p {
	line-height: 1.6em;
	font-size: 90%;
	background-image: url('../images/line-img-01.png'),url('../images/line-img-01.png'), url('../images/line-img-03.png'), url('../images/line-img-03.png');
	background-position: bottom, top, left, right;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	padding: 5%;
	margin: 0 5% 3%;
}
#chiteki .left .box-p img {
	width: 100%;
	display: block;
	margin-bottom: 2%;
}
/*==================================================
                  sindan
====================================================*/
#sindan h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 2%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}

#sindan .ryoukin {
	width: 80%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#sindan .ryoukin dt {
	line-height: 1.4em;
	}
#sindan .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#sindan .left .box-p {
	line-height: 1.6em;
	font-size: 90%;
	padding: 5%;
	margin: 0 auto 3%;
}
#sindan .ma {
	line-height: 1.8em;
	background-color: #fff;
	margin: 5%;
	padding: 3% 5%;
	font-size: 90%;
	position: relative;
    background-color: #fff;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    	text-align: center;

}
#sindan .ma:before, #sindan .ma:after
{
    position: absolute;
    width: 40%;
    height: 10px;
    content: ' ';
    left: 12px;
    bottom: 12px;
    background: transparent;
    -webkit-transform: skew(-5deg) rotate(-5deg);
    -moz-transform: skew(-5deg) rotate(-5deg);
    -ms-transform: skew(-5deg) rotate(-5deg);
    -o-transform: skew(-5deg) rotate(-5deg);
    transform: skew(-5deg) rotate(-5deg);
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    z-index: -1;
}
#sindan .ma:after
{
    left: auto;
    right: 12px;
    -webkit-transform: skew(5deg) rotate(5deg);
    -moz-transform: skew(5deg) rotate(5deg);
    -ms-transform: skew(5deg) rotate(5deg);
    -o-transform: skew(5deg) rotate(5deg);
    transform: skew(5deg) rotate(5deg);
	}
#sindan .ma span {
	font-weight: bold;
	}
#sindan ol {
	counter-reset:li;
	line-height: 1.6em;
	width: 80%;
	height: auto;
	margin: 0 10%;
	background-image: url('../images/hatena.png');
	background-repeat: no-repeat;
	background-size:contain;
	background-position: center;
	}
#sindan ol li{
	line-height: 1.4em;
	margin: 3% 0;
	list-style:none; /*デフォルトナンバリングを消す*/
	position:relative;
	padding:0;
	margin-left:25px;
	*list-style-type: decimal; /*IE7*/
	}
#sindan ol li:before {
  content:counter(li);
  counter-increment:li;
  position:absolute;
  left:-25px;
  width:25px;
  color: #3333FF;
  background-image: url('images/ol-img.png');
  background-repeat: no-repeat;
  background-size: 100%;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size:110%;
  padding-left:5px;
  }
#sindan .bottun{
	display: inline-block;
	border: 4px dotted #3333FF;
	background-color: #fff;
	margin: 5%;
	padding: 3%;
	line-height: 1.2em;
}
#sindan .bottun small {
	color: #0D78B9;
}
#sindan .box-p ul{
	width: 80%;
	margin: 2% auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	height: auto;
	list-style: none;
	border: 3px #6F4724 double;
}
#sindan .box-p ul li{
	background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: center;
	font-weight: bold;
	margin-bottom: 2%;
}
#sindan .box-p p{
	width: 80%;
	margin: 5% 10%;
	line-height: 1.6em;
}
/*==================================================
                  program
====================================================*/
#program h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 2%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}
#program .ma {
	line-height: 1.8em;
	background-color: #fff;
	margin: 5%;
	padding: 3% 5%;
	font-size: 90%;
	position: relative;
    background-color: #fff;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    	text-align: center;

}
#program .ma:before, #program .ma:after
{
    position: absolute;
    width: 40%;
    height: 10px;
    content: ' ';
    left: 12px;
    bottom: 12px;
    background: transparent;
    -webkit-transform: skew(-5deg) rotate(-5deg);
    -moz-transform: skew(-5deg) rotate(-5deg);
    -ms-transform: skew(-5deg) rotate(-5deg);
    -o-transform: skew(-5deg) rotate(-5deg);
    transform: skew(-5deg) rotate(-5deg);
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    z-index: -1;
}
#program .ma:after{
    left: auto;
    right: 12px;
    -webkit-transform: skew(5deg) rotate(5deg);
    -moz-transform: skew(5deg) rotate(5deg);
    -ms-transform: skew(5deg) rotate(5deg);
    -o-transform: skew(5deg) rotate(5deg);
    transform: skew(5deg) rotate(5deg);
	}
#program .ma span {
	display: inline-block;
	border: dotted #6F4724;
	background-color: #fff;
	padding: 10px 0;
	box-shadow;  5px 5px 0px #000;
	margin-top: 5%;
}
#program .naiyou {
	width: 80%;
	margin: 3% auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	border: 3px #6F4724 double;
	}
#program .naiyou dt {
	line-height: 1.4em;
	margin-bottom: 2%;
	font-size: 95%;
	}
#program .naiyou dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	font-size: 88%;
	}
#program .youji-img img {
	display: block;
	width: 100%;
}
/*==================================================
               Counseling
====================================================*/
#Counseling h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 2%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}
#Counseling .ryoukin {
	width: 80%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#Counseling .ryoukin dt {
	line-height: 1.4em;
	}
#Counseling .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#Counseling h3 img{
 width: 100%;
 display: block;
 margin: 6% auto;
}
#Counseling .ma {
	width: 80%;
	margin: 5%;
	padding: 5%;
	letter-spacing: 0.1em;
	line-height: 1.4em;
	border: 3px #6F4724 double;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
}
/*==================================================
                  nyusitu
====================================================*/
#nyusitu .left h2 img {
display: block;
	width: 50%;
	margin: 2% auto;
}
#nyusitu .left .annai {
	list-style: none;
	width: 80%;
	margin: 3% auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	border: 3px #6F4724 double;
	text-align:center;
	line-height: 1.4em;
	font-size: 88%;
}
#nyusitu .left h3 {
	background-image:url('../images/line-img-02.png');
	background-position: 50% bottom;
	background-repeat: repeat-x;
	padding: 2%;
	display: inline-block;
	margin-left: 2%;
	margin-top: 5%;
	margin-bottom: 2%;
	}
#nyusitu .left .nyusitu-annai {
	background-image: url('../images/hana-tate01.png');
	background-position: left bottom;
	background-size: contain;
	background-repeat: no-repeat;
}
#nyusitu .left h4 {
	background-image: url('../images/line-img-01.png');
	background-repeat: repeat-x;
	background-position: bottom;
	display:inline-block;
	padding: 1% 0;
	margin: 2% auto 0 5%;
}
#nyusitu .left .onegai {
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	letter-spacing: 0.1em;
	line-height: 1.4em;
	padding: 5%;
	margin: 3%;
}
#nyusitu .left .okotowari img {
	display:block;
	margin: 2% 0;
	width: 100%;
}
/*==================================================
                  map
====================================================*/
#map .left h2 {
	background-image:url('../images/line-img-02.png');
	background-position: 50% bottom;
	background-repeat: repeat-x;
	padding: 2%;
	display: inline-block;
	margin-left: 2%;
	margin-top: 5%;
	margin-bottom: 2%;
	}
#map .head-right {
	display: none;
}
#map .left ul {
	list-style: none;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	letter-spacing: 0.1em;
	line-height: 1.4em;
	padding: 3%;
	margin: 3% auto;
	border: 3px #6F4724 double;
	width: 80%;
	text-align:center;
	background-image: url('../images/hana-tate01.png'),url('../images/hana-tate02.png');
	background-position: left, right;
	background-repeat: no-repeat;
	background-size: contain;
}
#map .left ul li {
	margin: 1% 0;
}
#map .left ul li i {
	font-size:200%;
	margin-right: 3%;
	}
#map .left ul li a img {
	width: 70%;
	}
}
#map .ggmap iframe{
width: 90%;
height: 300px;
margin: 5%;
}
/*==================================================
                   pc
====================================================*/

@media screen and (min-width:768px){
/*==================================================
                   header
====================================================*/
header {}
#container {
	width: 960px;
	margin: 0 auto;
	font-size: 80%;
	line-height: 1.4em;
	margin-top: 1%;
	}
h1 {
	width: 50%;
	float: left;
	}
h1 img{
	width: 80;
	margin: 3% auto;
	}
.head-right {
	width:30%;
	margin: 1% 5%;
	float: left;
	background: rgba(255,255,255,0.7);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	border: 3px double;
	}
.head-right dl{
 margin: 3%;
	}
.head-right dl dt{
	font-size: 88%;
	}
.head-right dl dt span {
	color: #FF0000;
	}
.head-right dl dd {
	margin-left: 3%;
	}
.head-right dl dd a {
	text-decoration: none;
	}
.head-right dl dd i {
	font-size:240%;
	margin-right: 3%;
	}
.head-right dl dd a img {
	width: 60%;
	}
/*==================================================
                  navigation
====================================================*/
#controller {
	display: none;
	}
#nav-switcher{
	display: none;
	}
#global-navi {
	clear: both;
	width: 100%;
	height: 70px;
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#99ffffff,EndColorStr=#99ffffff);
	background-color: rgba(255, 255, 255, 0.8);
	}
#global-navi ul {
	width: 960px;
	margin: 0 auto;
	list-style: none;
	}
#global-navi ul li {
	float: left;
	margin: 2%;
	}
#global-navi ul .font {
	border-bottom: 2px #0099CC solid;
	padding-bottom: 4px;
	}

#global-navi ul li a {
	text-decoration: none;
	font-size: 88%;
	color: #6F4724;
	}
/*==================================================
                flexslider
====================================================*/
.flexslider {
	clear: both;
	width: 800px;
	margin: 2% auto;
	}
/*==================================================
                main-img
====================================================*/
#main {
	width: 960px;
	margin: 0 auto;
	}
#main .left {
	width: 70%;
	height: auto;
	float: left;
	}
#main .right {
	width: 30%;
	height: auto;
	float: left;
	margin-bottom: 3%;
	}
#main-navi {
	width: 70%;
	margin: 0 auto;
	position: relative;
	margin-top: -78px;
	} 
.main-img-01 img {
	position: absolute;
	top: -9%;
	right: -50%;
	display: block;
	width: 37%;
	z-index: 999;
	-moz-transition: -moz-transform 0.8s linear;
	-webkit-transition: -webkit-transform 0.8s linear;
	-o-transition: -o-transform 0.8s linear;
	-ms-transition: -ms-transform 0.8s linear; 
	transition: transform 0.8s linear; 
	}
.main-img-01 img:hover {
	-moz-transform: rotateY(50deg);
    -webkit-transform: rotateY(50deg);
    -o-transform: rotateY(50deg);
    -ms-transform: rotateY(50deg);
    transform: rotateY(50deg);
	}
/*==================================================
                 news
====================================================*/
.news {
	margin-top: 100px;
	margin-bottom: 30px;
	width: 100%+
	}
.news h2 img {
	width: 30%;
	margin-left: 38%;
	}
.news-02 {
	list-style: none;
	width: 80%;
	margin-left: 15%;
	overflow-y: scroll;
	height: 120px;
	border: 1px solid;
	padding: 2%;
	background-color: #fff;
	}
.news-02 li {
	line-height: 1.6em;
	}
.news-02 li .news-01 {
	color: #996600;
	font-size: 88%;
	margin-right: 3%;
	}
/*==================================================
                 school-01
====================================================*/
.school-01 .muryou img {
	width: 60%;
	display: block;
	margin: 0 20% 5%;
	}
.school-01 .demo {
	line-height: 1.8em;
	background-color: #fff;
	margin: 0 5%;
	padding: 3% 5%;
	font-size: 90%;
	position: relative;
    background-color: #fff;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
	}
.school-01 .demo:before, .school-01 .demo:after{
    position: absolute;
    width: 40%;
    height: 10px;
    content: ' ';
    left: 12px;
    bottom: 12px;
    background: transparent;
    -webkit-transform: skew(-5deg) rotate(-5deg);
    -moz-transform: skew(-5deg) rotate(-5deg);
    -ms-transform: skew(-5deg) rotate(-5deg);
    -o-transform: skew(-5deg) rotate(-5deg);
    transform: skew(-5deg) rotate(-5deg);
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    z-index: -1;
	}
.school-01 .demo:after{
    left: auto;
    right: 12px;
    -webkit-transform: skew(5deg) rotate(5deg);
    -moz-transform: skew(5deg) rotate(5deg);
    -ms-transform: skew(5deg) rotate(5deg);
    -o-transform: skew(5deg) rotate(5deg);
    transform: skew(5deg) rotate(5deg);
	}
.school-01 .demo span {
	font-weight: bold;
	}
/*==================================================
                 school-02
====================================================*/
.school-02 h2 {
	background-image: url('../images/line-img-02.png');
	background-position: 50% bottom;
	background-repeat: repeat-x;
	margin-top: 3%;
	padding: 2%;
	display: inline-block;
}
.school-02 figure {
}
.school-02 img {
	display: block;
	width: 40%;
	float: left;
	margin: 2% 0;
}
.school-02 figcaption{
	width: 56%;
	float: left;
	line-height: 1.6em;
	padding: 10% 2%;
}
/*==================================================
                 school-03
====================================================*/
.school-03 h2 {
	background-image: url('../images/line-img-02.png');
	background-position: 50% bottom;
	background-repeat: repeat-x;
	margin-top: 3%;
	padding: 2%;
	display: inline-block;
}
.box1 h3 img {
	display: block;
	width: 40%;
	float: left;
	margin: 2% 0;
}
.box1 ol {
counter-reset:li;
	width: 52%;
	float: left;
	line-height: 1.6em;
	padding: 10% 4%;
}
.box1 ol li, .box2 ol li {
	line-height: 1.4em;
	margin: 3% 0;
	list-style:none; /*デフォルトナンバリングを消す*/
	position:relative;
	padding:0;
	margin-left:25px;
	*list-style-type: decimal; /*IE7*/
}
.box2 h3 img {
	display: block;
	width: 40%;
	float: right;
	margin: 2% 0;	
}
.box2 ol {
	width: 52%;
	float: left;
	line-height: 1.6em;
	padding: 10% 4%;
	counter-reset:li;
}
.box1, .box2 {
	clear: both;
}
ol li:before {
  content:counter(li);
  counter-increment:li;
  position:absolute;
  left:-25px;
  width:25px;
  color: #3333FF;
  background-image: url('../images/ol-img.png');
  background-repeat: no-repeat;
  background-size: 100%;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size:110%;
  padding-left:5px;
  }
/*==================================================
                 info
====================================================*/
.left .info {
	display: none;
}
/*==================================================
                 right-info
====================================================*/
.right .info {
	margin-top: 100px;
}
.right .info ul {
	list-style: none;
}
.right .info ul li
.right .info ul li a {
display: block;
	width: 40%;
}
.right .info ul li a img {
	display: block;
	width: 70%;
	margin: 3% auto;
}
.right .blog {
 text-align: center;
}
/*==================================================
                 footer
====================================================*/
footer {
clear: both;
width: 100%;
height: 60px;
font-size: 75%;
margin-top: 15%;
padding-top: 10%;
background-color: #CCFFFF;
}
footer .copyright {
	width: 960px;
	margin: 0 auto;
	text-align: center;
}
/*==================================================
              page-top
====================================================*/

#page-top {
	position: fixed;
	bottom: 20px;
	right: 10px;
	padding: 2%;
	background: rgba(0,0,0,0.5);
	}
#page-top a{
	text-decoration: none;
	text-align: center;
	display: block;
	color: #fff;
	font-size: 88%;
	}
#page-top:hover {
	background: rgba(255,255,255,0.3);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	}
#page-top a:hover{
	display: block;
	color: #000;
	}
/*==================================================
                  youji
====================================================*/
#youji h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 3%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}
#youji #global-navi ul .font {
border-bottom: 2px #0099CC solid;
padding-bottom: 4px;
}
#youji .title-img img {
display: block;
}
#youji .point dt,
#youji .point2 dt,
#youji .point3 dt,
#youji .point4 dt {
	display: none;
}
#youji .point dd,
#youji .point2 dd,
#youji .point3 dd,
#youji .point4 dd {
	margin: 3% 0;
	line-height: 1.4em;
	font-size: 88%;
	letter-spacing: 0.2em;
	text-shadow: 2px 2px 3px #ccc;
}
#youji .point {
	background-image: url('../images/background-youji.png');
	background-repeat: no-repeat;
	background-size: cover;
	width: 46%;
	padding: 1% 2%;
	float: left;
	height: 400px;
}
#youji .point2 {
	background-image: url('../images/background-youji3.png');
	background-repeat: no-repeat;
	background-size:contain;
	width: 46%;
	padding: 1% 2%;
	float: left;
	height: 400px;
}
#youji .point3 {
	clear: left;
	background-image: url('../images/background-youji4.png');
	background-repeat: no-repeat;
	background-size:contain;
	width: 46%;
	padding: 1% 2%;
	float: left;
	height: 500px;
}
#youji .point4 {
	background-image: url('../images/background-youji5.png');
	background-repeat: no-repeat;
	background-size:contain;
	width: 46%;
	padding: 1% 2%;
	float: left;
	height: 400px;
	margin-bottom: 5%;
}
#youji .youji-img {
	display: block;
}
#youji .youji-img img {
	width: 100%;
}
#youji .ryoukin {
	width: 60%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#youji .ryoukin dt {
	line-height: 1.4em;
	}
#youji .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#youji .ryoukin-p {
	text-align: right;
	font-size: 80%;
	margin: 3% 0;
	right: 0;
}
#youji .ryoukin-p small {
	color:#826306;
	font-size: 77%;
	margin-left: 1%;
}
/*==================================================
                  shougaku
====================================================*/
#shougaku h2 {
	background-image:url('../images/line-img-02.png');
	background-position: 50% bottom;
	background-repeat: repeat-x;
	padding: 3%;
	display: inline-block;
	margin-left: 2%;
	margin-top: 5%;
	margin-bottom: 2%;
	text-shadow: 3px 3px 4px #ccc;
	}
#shougaku #global-navi ul .font {
border-bottom: 2px #0099CC solid;
padding-bottom: 4px;
}
#shougaku .ryoukin {
	width: 60%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#shougaku .ryoukin dt {
	line-height: 1.4em;
	}
#shougaku .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#shougaku .ryoukin-p {
	text-align: right;
	font-size: 80%;
	margin: 3% 0;
	right: 0;
}
#shougaku .ryoukin-p small {
	color:#826306;
	font-size: 77%;
	margin-left: 1%;
}
#shougaku .left {
	background-image: url('../images/shougaku-img-02.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom;
}
#shougaku .left .box-p {
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	line-height: 1.6em;
	font-size: 90%;
	background-image: url('../images/line-img-01.png'),url('../images/line-img-01.png'), url('../images/line-img-03.png'), url('../images/line-img-03.png');
	background-position: bottom, top, left, right;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	padding: 5%;
	margin: 2% 5%;
}
/*==================================================
                  chiteki
====================================================*/
#chiteki h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 3%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}
#chiteki .chiteki-title img {
display: block;
}
#chiteki .ryoukin {
	width: 60%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#chiteki .ryoukin dt {
	line-height: 1.4em;
	}
#chiteki .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#chiteki .ryoukin-p {
	text-align: right;
	font-size: 80%;
	margin: 3% 0;
	right: 0;
}
#chiteki .ryoukin-p small {
	color:#826306;
	font-size: 77%;
	margin-left: 1%;
}
#chiteki .left {
background-image: url('../images/hana-tate01.png'),url('../images/hana-tate02.png');
background-position: left bottom,right bottom;
background-repeat: no-repeat;
background-size: 30% 60%;
}
#chiteki .left .box-p {
	line-height: 1.6em;
	font-size: 90%;
	background-image: url('../images/line-img-01.png'),url('../images/line-img-01.png'), url('../images/line-img-03.png'), url('../images/line-img-03.png');
	background-position: bottom, top, left, right;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	padding: 5%;
	margin: 0 auto 3%;
}
#chiteki .left .box-p img {
	width: 60%;
	display: block;
	margin: 0 auto 5%
}
/*==================================================
                  sindan
====================================================*/
#sindan h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 2%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}

#sindan .ryoukin {
	width: 60%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#sindan .ryoukin dt {
	line-height: 1.4em;
	}
#sindan .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#sindan .left .box-p {
	line-height: 1.6em;
	font-size: 90%;
	padding: 5%;
	margin: 0 auto 3%;
}
#sindan .ma {
	line-height: 1.8em;
	background-color: #fff;
	margin: 5%;
	padding: 3% 5%;
	font-size: 90%;
	position: relative;
    background-color: #fff;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    	text-align: center;

}
#sindan .ma:before, #sindan .ma:after
{
    position: absolute;
    width: 40%;
    height: 10px;
    content: ' ';
    left: 12px;
    bottom: 12px;
    background: transparent;
    -webkit-transform: skew(-5deg) rotate(-5deg);
    -moz-transform: skew(-5deg) rotate(-5deg);
    -ms-transform: skew(-5deg) rotate(-5deg);
    -o-transform: skew(-5deg) rotate(-5deg);
    transform: skew(-5deg) rotate(-5deg);
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    z-index: -1;
}
#sindan .ma:after
{
    left: auto;
    right: 12px;
    -webkit-transform: skew(5deg) rotate(5deg);
    -moz-transform: skew(5deg) rotate(5deg);
    -ms-transform: skew(5deg) rotate(5deg);
    -o-transform: skew(5deg) rotate(5deg);
    transform: skew(5deg) rotate(5deg);
	}
#sindan .ma span {
	font-weight: bold;
	}
#sindan ol {
	counter-reset:li;
	line-height: 1.6em;
	width: 80%;
	height: auto;
	margin: 0 10%;
	background-image: url('../images/hatena.png');
	background-repeat: no-repeat;
	background-size:contain;
	background-position: center;
	}
#sindan ol li{
	line-height: 1.4em;
	margin: 3% 0;
	list-style:none; /*デフォルトナンバリングを消す*/
	position:relative;
	padding:0;
	margin-left:25px;
	*list-style-type: decimal; /*IE7*/
	}
#sindan ol li:before {
  content:counter(li);
  counter-increment:li;
  position:absolute;
  left:-25px;
  width:25px;
  color: #3333FF;
  background-image: url('images/ol-img.png');
  background-repeat: no-repeat;
  background-size: 100%;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size:110%;
  padding-left:5px;
  }
#sindan .bottun{
	display: inline-block;
	border-bottom: dotted #3333FF;
	background-color: #fff;
	padding: 10px 0;
	box-shadow;  5px 5px 0px #000;
	margin-left: 30%;
	margin-top: 5%;
}
#sindan .bottun small {
	color: #0D78B9;
}
#sindan .box-p ul{
	width: 76%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	height: auto;
	list-style: none;
	border: 3px #6F4724 double;
}
#sindan .box-p ul li{
	background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: center;
	font-weight: bold;
	margin-bottom: 2%;
}
#sindan .box-p p{
	width: 76%;
	margin: 5% 12%;
	line-height: 1.6em;
}
/*==================================================
                  program
====================================================*/
#program h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 2%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}
#program .ma {
	line-height: 1.8em;
	background-color: #fff;
	margin: 5%;
	padding: 3% 5%;
	font-size: 90%;
	position: relative;
    background-color: #fff;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
    	text-align: center;

}
#program .ma:before, #program .ma:after
{
    position: absolute;
    width: 40%;
    height: 10px;
    content: ' ';
    left: 12px;
    bottom: 12px;
    background: transparent;
    -webkit-transform: skew(-5deg) rotate(-5deg);
    -moz-transform: skew(-5deg) rotate(-5deg);
    -ms-transform: skew(-5deg) rotate(-5deg);
    -o-transform: skew(-5deg) rotate(-5deg);
    transform: skew(-5deg) rotate(-5deg);
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    z-index: -1;
}
#program .ma:after{
    left: auto;
    right: 12px;
    -webkit-transform: skew(5deg) rotate(5deg);
    -moz-transform: skew(5deg) rotate(5deg);
    -ms-transform: skew(5deg) rotate(5deg);
    -o-transform: skew(5deg) rotate(5deg);
    transform: skew(5deg) rotate(5deg);
	}
#program .ma span {
	display: inline-block;
	border-bottom: dotted #6F4724;
	background-color: #fff;
	padding: 10px 0;
	box-shadow;  5px 5px 0px #000;
	margin-top: 5%;
}
#program .naiyou {
	width: 60%;
	margin: 3% auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	border: 3px #6F4724 double;
	}
#program .naiyou dt {
	line-height: 1.4em;
	margin-bottom: 2%;
	}
#program .naiyou dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#program .youji-img img {
	display: block;
	width: 100%;
}
/*==================================================
               Counseling
====================================================*/
#Counseling h2 {
background-image:url('../images/line-img-02.png');
background-position: 50% bottom;
background-repeat: repeat-x;
padding: 2%;
display: inline-block;
margin-left: 2%;
margin-top: 5%;
margin-bottom: 2%;
}
#Counseling .ryoukin {
	width: 60%;
	margin: 0 auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	}
#Counseling .ryoukin dt {
	line-height: 1.4em;
	}
#Counseling .ryoukin dd {
    background-image: url(../images/line-img-01.png);
	background-repeat: no-repeat;
	background-position: bottom;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2%;
	}
#Counseling h3 img{
 width: 80%;
 display: block;
 margin: 6% 10% 0;
}
#Counseling .ma {
	width: 80%;
	margin: 5%;
	padding: 5%;
	letter-spacing: 0.1em;
	line-height: 1.4em;
	border: 3px #6F4724 double;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
}
/*==================================================
                  nyusitu
====================================================*/
#nyusitu .left h2 img {
	width: 25%;
	margin: 2% 35%;
}
#nyusitu .left ul {
	list-style: none;
	width: 60%;
	margin: 3% auto;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	padding: 3%;
	border: 3px #6F4724 double;
	text-align:center;
	line-height: 1.4em;
}
#nyusitu .left ul li {}
#nyusitu .left h3 {
	background-image:url('../images/line-img-02.png');
	background-position: 50% bottom;
	background-repeat: repeat-x;
	padding: 2%;
	display: inline-block;
	margin-left: 2%;
	margin-top: 5%;
	margin-bottom: 2%;
	}
#nyusitu .left .nyusitu-annai {
	background-image: url('../images/hana-tate01.png'), url('../images/hana-tate02.png');
	background-position: left bottom, right bottom;
	background-size: contain;
	background-repeat: no-repeat;
}
#nyusitu .left h4 {
	background-image: url('../images/line-img-01.png');
	background-repeat: repeat-x;
	background-position: bottom;
	display:inline-block;
	padding: 1% 0;
	margin: 2% auto 0 5%;
}
#nyusitu .left .onegai {
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	letter-spacing: 0.1em;
	line-height: 1.4em;
	padding: 5%;
	margin: 3%;
}
#nyusitu .left .okotowari img {
	display:block;
	margin: 2% 0;
}
/*==================================================
                  map
====================================================*/
#map .left h2 {
	background-image:url('../images/line-img-02.png');
	background-position: 50% bottom;
	background-repeat: repeat-x;
	padding: 2%;
	display: inline-block;
	margin-left: 2%;
	margin-top: 5%;
	margin-bottom: 2%;
	}
#map .left ul {
	list-style: none;
	background: rgba(255,255,255,0.5);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#33ffffff', endColorstr='#33ffffff');
	letter-spacing: 0.1em;
	line-height: 1.4em;
	padding: 3%;
	margin: 3% auto;
	border: 3px #6F4724 double;
	width: 60%;
	text-align:center;
	background-image: url('../images/hana-tate01.png'),url('../images/hana-tate02.png');
	background-position: left, right;
	background-repeat: no-repeat;
	background-size: contain;
}
#map .left ul li {
	margin: 1% 0;
}
#map .left ul li i {
	font-size:200%;
	margin-right: 3%;
	}
#map .left ul li a img {
	width: 40%;
	}
#map .ggmap iframe{
width: 90%;
height: 500px;
margin: 5%;
}

}