html{
margin:0;padding:0;
}
body{
margin:0;padding:0;
position: relative;
color: #000;
line-height:1.5em;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
}
#suma{
display:none;
}
#bira{
position:fixed;
top:-5px;right:-30px; width:50%;
transform: rotate( 15deg );
}
a{
color:#000;
text-decoration: none;
}
#warapper{
width: 100%;
height:auto;
background-size: cover;
background-position: 50% 50%;
}
#warapper2{
width: 100%;
height:auto;
}
h4 {font-size:1.5em;
border-left: 10px solid #ff5cd9;
border-radius:5px;
border-bottom:1px solid #a3a3a3;
border-top:1px solid #a3a3a3;
border-right:1px solid #a3a3a3;
border-radius:10px;
margin:10px 0 0 20px;
text-align:left;
padding:0.5em 0 0.4em 0.5em; height:24px;
background:#feffed; color:gray;font-weight:100;
}
h4 span {
position: relative;
top: -50%;
padding: 0 20px;
background:white;
font-size: 16px;
font-weight: 100;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
color: gray;
margin: 0;
}
h5{
padding: 0; font-weight:600; width:50%; font-size:1em; color:green;
margin:20px 0 0 30px; border-bottom:1px dotted gray;
}
.att {
margin:1em -4em 0 4em;
padding:0 0 0 2em;
text-indent: -2.5em;
}
input{
width:40%; padding:10px 0 10px 1em; margin: 0;
}
textarea
{
width:70%; padding:10px 0 10px 1em;
}
#warap{
width:100%;
height:auto;
}
#warap2{
width:100%;
height:auto;
}
#left{
float:left;
width: 200px;
height:600px;
}
#right{
float:right;
background:#fff;
padding:0 5% 0 5%;
height: 500px;
width:60%; min-width:200px;
max-width:1900px;
}
#right h3{
text-align: left;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-weight:100;
letter-spacing: 0.1em;
color: gray;
font-size: 1.5em;
margin: 40px auto 30px auto;
border-bottom: 1px solid gray;
border-left:10px gray solid;
padding:10px 0 10px 20px;
}
#right p{
font-size: 1em;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
letter-spacing: 0.2em;
font-weight: 100;
padding:0 20px 0 30px;
line-height: 1.5em;
color: #000;
}
#warap2{
width:100%;
}
#talef{
float:left;
width:20%;
}
#taright{
float:right;
width:70%;
height:auto;
margin:0 5% 0 0;
}
.kojin{
width:auto;
text-align:right;
font-size: 12px;
font-weight: 100;
margin:35px 0 0 90px;
font-family: "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, Meiryo, sans-serif;
color: #000;
}
table{
border-collapse:collapse;
}
.konda{
margin:2% 0 0 2%; width:90%;
}
.konda th{
border:1px solid #D3D3D3;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 1.2em;
font-weight:100;
width:20%;
background:url(../images/maru2.png);
line-height: 1.5em; text-align:left; padding:0 0 0 2%;
}
.hi{
border:1px solid gray;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
font-weight:100;
width: 100%;
padding:10px;
text-align: center;
}
.he{
border:1px solid #D3D3D3;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 1em;
font-weight:100;
width: 80%;
padding:10px;
text-align: left;
text-indent: 20px;
}
.gaku{
border:1px solid gray;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
font-weight:100;
width: 120px;
padding:5px 30px 5px 5px;
text-align: right;
}
.kingaku{
margin: 20px 0 0 15%;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
border-collapse:collapse;
}
.table-ul {
display: table;
width:100%;
margin:0 0 0 50px;
}
.table-ul a li {
float:left;
width:360px;
padding: 20px;
margin: 0;
list-style: none;
}
.man{
float:left;
margin:0 20px 0 0;
width:100px;
height:160px;
border:1px solid #fff;
}
/**--左固定NAVI--**/
#koteileft{
background:url("../img/tes.png");
float:left;
position:fixed;
width:200px;
height:100%;
margin:0;
padding:10px 5px 0 15px;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
color:gray;
font-size:14px;
line-height:1.5em;
}
/**--左固定NAVIend--**/
.lab{
margin: 0 0 0 50px;
}
.lab th{
font-size: 14px;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
letter-spacing: 0.2em;
line-height:1.5em;
list-style: none;
text-align: left;
width: 100px;
background: #fff;
border: none;
}
.lab td{
font-size: 14px;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
letter-spacing: 0.2em;
line-height:1.5em;
list-style: none;
text-align: left;
background: #fff;
border: none;
}
.lobtable{
margin:0 0 0 50px;
}
.lobtable th{
width:200px;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
padding: 10px;
line-height: 1.5em;
}
.lobtable .ue{
border:1px solid gray;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
font-weight:100;
width: 400px;
background: #EEEEEE;
text-align:center;
padding: 10px;
}
.lobtable .naka{
border:1px solid gray;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
font-weight:100;
width: 300px;
background: #EEEEEE;
text-align: left;
padding:10px 0 10px 20px;
}
.gaku2{
border:1px solid gray;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
font-weight:100;
width: 160px;
padding: 5px 0;
text-align: center;
}
a.hoge {
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN"; font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 14px;
background-image: linear-gradient(to top left, #A5A5A5, #BABAC2, #E8E8E8, #A5A5A5, #BABAC2);
border-radius:5px;
float: left;
color: #000;
padding: 20px;
width: 230px;
margin:10px 0 0 30px;
vertical-align:middle;
text-align: center;
text-decoration: none;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a.hoge:hover {
background-image: linear-gradient(to top left, #A5A5A5, #fff,#BABAC2, #E8E8E8, #A5A5A5, #BABAC2);
}
a.gold{
font-family: "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, Meiryo, sans-serif;
font-size: 14px;
background-image: linear-gradient(to top left, #F7DE05, #DA8E00, #EDAC06, #F7DE05, #ECB802, #DAAF08, #B67B03);
border-radius:5px;
float: left;
color: #000;
padding: 20px;
width: 230px;
margin:10px 0 0 30px;
vertical-align:middle;
text-align: center;
text-decoration: none;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a.gold:hover {
background-image: linear-gradient(to top left, #F7DE05, #DA8E00, #fff,#EDAC06, #F7DE05, #fff,#ECB802, #DAAF08, #B67B03);
}
.imcenter{
text-align: center;
}
.pagetop {
display: none;
position: fixed;
bottom: 30px;
right: 15px;
}
.pagetop a {
display: block;
background-color: #ccc;
text-align: center;
color: #222;
font-size: 12px;
text-decoration: none;
padding: 5px 10px;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}
.pagetop a:hover {
display: block;
background-color: #b2d1fb;
text-align: center;
color: #fff;
font-size: 12px;
text-decoration: none;
padding:5px 10px;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}
/*--パンクズnav--*/
/* simple
----------------------------------*/
.simple {
list-style: none;
overflow: hidden;
color: #777;
font: 10px Verdana, sans-serif;
background: #fff;
border: 1px solid #dedede;
}
.simple li {
float: left;
line-height: 30px;
text-shadow: 0 1px 0 white;
}
.simple li a {
color: #666;
text-decoration: none;
padding: 0 10px 0 20px;
background: #eee;
background: -webkit-gradient(linear, left top, right top,
from(#fff),
color-stop(0.85,#efefef),
to(#efefef));
display: block;
float: left;
}
.simple li a::after {
position: relative;
display: block;
margin-top: -15px;
margin-left: auto;
margin-right: -15px;
height: 15px;
width: 10px;
content: " ";
-webkit-transform: skew(-30deg);
background: #efefef;
border-right: 1px solid #d6d6d6;
}
.simple li a::before {
float: right;
display: block;
margin-bottom: -15px;
margin-left: auto;
margin-right: -15px;
height: 15px;
width: 10px;
content: " ";
-webkit-transform: skew(30deg);
background: #efefef;
border-right: 1px solid #d6d6d6;
}
.simple li:first-child a {padding-left: 10px;}
.simple li:last-child {
padding-left: 20px;
background: transparent !important;
color: black;
}
.simple li a:hover {color: #d31;}
/*--パンクズnavend--*/
/*--動くプロフ--*/
#prof{
width:100%;
height:auto;
position:relative;
}
.img{
position:absolute;
top:0;left:0;
width:20%;
}
.kmg{
position:absolute;
top:0;left:0;
width:40%;
}
.pp{
position:absolute;
top:0;left:25%;
width:70%;
font-size:16px;
}
/*--動くend--*/
.but {
width: 250px;
height: 54px;
text-align: center;
text-decoration: none;
line-height: 54px;
outline: none;
background-color:#59b1eb; padding:10px 20px; border-color: #59b1eb;
color:#fff;
margin:10px 0 10px 30px;
}
.but:hover {
background:#000;
color: #fff;
transition: all .3s;
}
.but::before,
.but::after {
left: 0;
width: 100%;
height: 50%;
background-color: #333;
}
.but::before {
top: 0;
}
.but::after {
bottom: 0;
}
.but:hover::before,
.but:hover::after {
height: 0;
background-color: #59b1eb;
}
.sita{ clear:both;
margin:0 0 50px 0;
}
/**--こども園での過ごし方ボタン--**/
.btn01 {
text-align: center;
font-size:1.2em;
font-weight:bold;
color:#fff;
text-decoration: none;
background:url(../images/maru1.png) center center;
display: block;
width:150px;
height:150px;
line-height: 150px;
border:5px double yellow;
border-radius: 50%;
transition: all 1s ease;
-webkit-transition: all 1s ease;
}
.btn01:hover {
transform: rotate(720deg);
-webkit-transform: rotate(720deg);
}
.kaiten {
overflow: hidden; margin:0 auto;
}
.kaiten li{
float:left; ;
list-style:none;
margin:0 0 0 3em;
}
#menu {
display:none;
}
.slicknav_menu {
display:none;
}
/**--ボタンＥＮＤ--**/
@media screen and ( max-width:479px )
{
body{
}
#left{
display:none;
}
#suma{
display:inline; margin:0;padding:0; height:90px;
}
#suma img{
margin:0 0 0 0;padding:0;
}
#warap{
width:96%;
height:auto; margin:0 10px 0 20px;
}
#koteileft{
display:none;
}
.kaiten{
margin:0 auto;padding:0;
}
.kaiten li{margin:10px 5px 0 0;}
/**--こども園での過ごし方ボタン--**/
.btn01 {
text-align: center; padding:36px 0 0 0;
font-size:0.8em;
font-weight:bold;
color:#fff;
text-decoration: none;
background:url(../images/maru1.png) center center;
display: block;
width:92px;
height:56px;
line-height:20px;
border:5px double yellow;
border-radius: 50%;
transition: all 1s ease;
-webkit-transition: all 1s ease;
}
.btn01:hover {
transform: rotate(720deg);
-webkit-transform: rotate(720deg);
}
#right{ clear:both;
margin:0 0 0 20px;
background:#fff;
padding:10px;
width:100%;
}
#right p{
font-size:14px;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
letter-spacing: 0.2em;
font-weight: 100;
padding:0 10px 0 10px;
line-height: 1.5em;
color: #000;
}
#right h3{
font-size:16px;
}
h4{
margin:0;
font-size:16px;
}
h5{
margin:20px 10px 10px 10px;width:96%;
font-size:14px;
}
.konda{
margin:0; width:100%;
}
.konda th{
border:1px solid #D3D3D3;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
font-weight:100;
width:20%;
background:url(../images/maru2.png);
line-height: 1.5em; text-align:left; padding:0 0 0 2%;
}
.hi{
border:1px solid gray;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
font-weight:100;
width: 100%;
padding:10px;
text-align: center;
}
.he{
border:1px solid #D3D3D3;color:#000;
font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN";
font-size: 12px;
font-weight:100;
width: 80%;
padding:10px 0 0 2px;
text-align: left;
padding-left:1.2em; text-indent:0;
}
.he a{
color:#000;
}
.js #menu {
display:none;
}
.js .slicknav_menu {
display:block;
}
#bira{
position:fixed;
top:-5px;left:-30px; width:90%;
transform: rotate( -15deg );
}
input{
width:90%; padding:10px 0 10px 1em;
}
textarea { width:60%; height:200px; }
}