@charset "utf-8";

/* This responsive setting is only Ipad Vertical */

/* HOME */
#background1 {
	background-image: url(../images/top-Illustration/nav4.png),url(../images/top-Illustration/home_bg_02.png),url(../images/bg-images/bg_03.png);
	background-position: center 200px ,center top, center bottom;
	background-repeat: no-repeat,no-repeat,no-repeat;
	background-size: 100% 50px,100% 200px,100% 80px;
}
/* 本園について */
#background2 {
	background-image: url(../images/top-Illustration/nav4.png),url(../images/bg-images/bg_04.png),url(../images/bg-images/bg_03.png);
	background-position: center 200px ,center top, center bottom;
	background-repeat: no-repeat,no-repeat,no-repeat;
	background-size: 100% 50px,100% 200px,100% 80px;
}
/* 保育内容 */
#background3 {
	background-image: url(../images/top-Illustration/nav4.png),url(../images/bg-images/bg_04.png),url(../images/bg-images/bg_03.png);
	background-position: center 200px ,center top, center bottom;
	background-repeat: no-repeat,no-repeat,no-repeat;
	background-size: 100% 50px,100% 200px,100% 80px;
}
/* 入園案内 */
#background4 {
	background-image: url(../images/top-Illustration/nav4.png),url(../images/bg-images/bg_07.png),url(../images/bg-images/bg_02.png);
	background-position: center 200px ,center top, center bottom;
	background-repeat: no-repeat,no-repeat,no-repeat;
	background-size: 100% 45px,100% 200px,100% 85px;
}
/* 鳩ポッポクラブ */
#background5 {
	background-image: url(../images/top-Illustration/nav4.png),url(../images/bg-images/bg_07.png),url(../images/bg-images/bg_02.png);
	background-position: center 200px ,center top, center bottom;
	background-repeat: no-repeat,no-repeat,no-repeat;
	background-size: 100% 45px,100% 200px,100% 85px;
}
/* お問い合わせ */
#background6 {
	background-image: url(../images/top-Illustration/nav4.png),url(../images/bg-images/bg_07.png),url(../images/bg-images/bg_02.png);
	background-position: center 200px ,center top, center bottom;
	background-repeat: no-repeat,no-repeat,no-repeat;
	background-size: 100% 45px,100% 200px,100% 85px;
}

/* プライバシーポリシー */
#others {
	background-image: url(../images/top-Illustration/nav4.png),url(../images/bg-images/bg_07.png),url(../images/bg-images/bg_02.png);
	background-position: center 200px ,center top, center bottom;
	background-repeat: no-repeat,no-repeat,no-repeat;
	background-size: 100% 45px,100% 200px,100% 85px;
}



a:hover {
    background: none;
}


/*	Common 
------------------------------------------------*/
#container {
	width: 100%;
	overflow: hidden;
	max-width: 1024px; 
}


/* header 
------------------------------------------------*/
header h1 {
	font-size: 0.7em;
	margin: 0;
	margin-top: 0.5%;
	margin-left: 2%;
}

header h2 {
    margin-left: 7%;
    /*margin-top: -4%;*/
	margin-top: 0.6%;
    font-size: 1.5em;
    width: 70%;
}

header p.tel {
	max-width: 110%;
    height: auto;
    font-size: 1.5em;
    margin-right: 0;
    margin-top: -3%;
}

.tel img {
    margin: 19% 1% 5% -1%;
    width: 5%;
}
.logo img {
	position: absolute;
	top: 18px;
	left: 8px;
	width: 5%;
	height: auto;
}

/*  nav 
------------------------------------------------*/
nav {
    display: block;
    padding: 0;
}

nav ul {
    /*margin: -16.5% 3% 2%;*/
	margin: 22.3% 4% 2%;
    padding: 2.8% 0 1.8%;
   /* font-size: 0.9em;*/
}
@media screen and (max-width: 767px){
	nav ul {
		margin: 23.5% 4% 2%;
	}
}
@media screen and (min-width: 812px){
	nav ul {
		margin: 21% 4% 2%;
	}
}
nav ul li {
	display: inline;
	margin-right: -1%;
	margin-top: 0.8%;
	/*font-size: 1.7em;*/
	font-size: 1.2em;
	font-weight: bold;
	border: none;
	border-left: 4px dotted #ff9933;
	width: auto;
	padding: 0;
}
@media screen and (max-width: 767px){
	nav ul li {
		font-size: 1.15em;
	}
}
nav ul li:last-child {
	border-right: 4px dotted #ff9933;
}
nav ul li.ac1 {
	background-color: palegoldenred;
	/*padding: 0;*/
}
nav ul li a {
	padding: 0 10px;
	width: 20%; 
}

/*visual 
------------------------------------------------*/
#slideshow IMG {
    width: 94%;
	left:11px;
}

#title_image img {
    width: 100%;
    margin-bottom: -29%;
}


/* article 
------------------------------------------------*/

/*-----------------------------
	追加CSS(外部指導者)
-------------------------------*/
/*.gaibu-back {
    margin: 50% 2.5% 0%;
}*/

.gaibu-back {
    margin: 58% 2.5% 0%;
}
/*@media screen and (min-width: 668px)  and (max-width: 735px){
	.gaibu-back {
    	margin: 30% 2.5% 0%;
	}
}*/

.box-last p {
    font-size: 0.7em;
}

/*-----------------------------*/

.main2 {
    margin:0;
}

article h2 {
	width: 94%;
	font-size: 1.4em;
}

.bosyuu {
    font-size: 2.4em;
    margin: -2% 0 2%;
}

.thumbnail {
    margin-top: -7%;
}


.box-first{
	width: 20%;
	margin: 2% 2% 2% 1%;
}
.box {
    margin: 1.6% 1% 2% 1%;
}

.box-last {
	width: 20%;
	margin: 2% 0 2% 2%;
}

.box h3 {
    font-size: 1.2em;
}

.box-first .description {
	font-size: 1.4em;
}
@media screen and (min-width: 736px)  and (max-width: 767px){
	.box-first .description {
	    margin-top: -93%;
	}
}

.box-last .description {
	font-size: 1.2em;
	margin: 50% 3%;
}

.setumei {
    font-size: 0.9em;
	margin-left: 10px;
    margin-right: 10px;
}

/*thumbnail-2*/

/*ホバー打消し*/
#background1 .en1 a,#background1 .en1 a:hover{
  	background-image:url(../images/top-Illustration/information1.png);
}

#background1 .en2 a,#background1 .en2 a:hover{
  	background-image:url(../images/top-Illustration/information3.png);
}

#background1 .en3 a,#background1 .en3 a:hover{
  	background-image:url(../images/top-Illustration/hatopopo2.png);
}

#background1 .en4 a,#background1 .en4 a:hover{
  	background-image:url(../images/top-Illustration/hatopopo1.png);
}

#background1 span.font a{
    font-size: 0.7em;
}

.thumbnail-2 ul {
    margin: 1% 0 7% -4.5%;
}

.thumbnail-2 ul li img{ 
	width:160px;
	height:160px;
}

span.font

span.font1 a {
	font-size: 1em;
}

span.font2 a {
	font-size: 1em;
}

/*access*/
section.info1 {
    width: 44%;
    margin: 4% 0% 2% 3%;
    margn-left: 2%;
    font-size: 1.0em;
}

section.info2 {
    width: 39%;
    height: 340px;
    margin-top: 3%;
}

#access {
    float: none;
    margin: -8% 0 0 0;
}

#access section.info2 a img {
    margin: 0 1% 5% 6%;
    width: 88%;
    height: 230px;
}

/* news_set */

.news_set {
    margin: 0 2% 0 -2%;
}

.news {
    width: 41.5%;
    margin:0 3%;
}

.blog {
	width: 41.5%;
	margin:0 3%;
}

.info1 {
    float: left;
    width: 41%;
    height: auto;
    margin: 2% 0% 6% 1%;
    padding: 1% 1.6%;
    border: #FC0 dotted 8px;
    border-radius: 10px;
    font-size: 0.9em;
}

.blog h2 {
    width: 45%;
    font-size: 1.1em;
}

.info2 {
    width: 34%;
    height: 248px;
    margin: 2% 0 4% -2.5%;
    border-radius: 30px;
}

.info3 h3 {
    margin: -6.5% 0;
    font-size: 1.2em;
}

#info3-1, #info3-2, #info3-2, #info3-3, #info3-1-2 {
    width: 93%;
    margin-top: 2%;
    height: auto;
}
#info3-7 h3 {
    padding: 0% 9%;
}

section.info1 {
    float: left;
    width: 45%;
    height: auto;
    padding-right: 2%;
    border: #FC0 dotted 8px;
    border-radius: 10px;
    background: #fff;
    font-size: 1em;
    margin: 3% -1% 2% 3%;
}

section.info1 dd {
    padding: 1% 0 1% 32%;
    font-size: 0.9em;
    text-align: justify;
    width: 68%;
	line-height:1.3;
}

.news h2{
	width: 45%;
    font-size: 1.1em;
}

.map {
    width: 70%;
    height: auto;
    margin: 0 16%;
}

article dl.contents {
    margin: 1% 0 5% -5%;
    padding-right: 0%;
    padding-left: 12px;
    width: 105%;
    height: 225px;
    overflow: auto;
    border-radius: 5px;
    box-shadow: 4px 3px;
    border: 1px solid #ccc;
}

.contents p {
    font-size: 1.05em;
}

.corporate h2 {
    margin: 2% 0 1.3% 3.5%;
    font-size: 1.4em;
}

.main {
    width: 100%;
    height: auto;
}

#background3 .main {
    width: 100%;
    height: auto;
}

#background2 .main h2 {
    margin: -27% auto 1%;
	width:30%;
}

.info2 {
    width: 42.5%;
    height: 356px;
    margin: 2% 0 0 2%;
    padding: 1% 1.5%;
}



section.info1-a {
    float: left;
    width: 42%;
    height: auto;
    padding: 0 0 0% 2%;
    border: #FC0 dotted 8px;
    border-radius: 10px;
    background: #fff;
    font-size: 1em;
    margin: 3% 1% 4% 2%;
    line-height: 1.2em;
}

/*---------------更新・追加--------------------*/

.thumbnail-2 .new img {
	margin: 0% 27%;
	width: 45%;
	height: 100%;
	float: left;
}

.video img {
    margin: -9% 0 15% -4%;
    width: 92%;
    height: auto;
}

.btn-video {
    top: 193px;
    left: 398px;
    width: 37%;
}



@media screen and (min-width: 812px)  and (max-width: 823px){
		.btn-video {
			top: 213px;
			left: 452px;
			width: 35%;
	}
}


/* video 
------------------------------------------------*/
.main2 {
    width: 100%;
    margin: 10% 2%;
}

.page-contents {
    margin: -10% 4% 0 0%;
}

.page-contents img {
	width: 100%;
    height: auto;
}


.videolist {
    margin: 0 11%;
}

.video-box {
    width: 110%;
    margin: 5% -8%;
}



/*about
----------------------------------------------*/
.main img {
    float: left;
    margin: 2.5% 3% 0 3.4%;
    width: 18%;
    height: auto;
}

#background2 #info3-1 p.info3-1-1 img {
    width: 23%;
    height: auto;
    position: absolute;
    left: -11px;
    top: 64px;
}

#background2.photo_corprate img {
    margin: 0 -1% 4% 5%;
    width: 43%;
    height: auto;
}

#background2.corporate {
    margin-bottom: -2%;
}

#background2.corporate h2 {
    margin: 7% 0 1.3% 3.5%;
    font-size: 1.2em;
}

#background2 #info3-1 p {
    width: 66%;
    margin-bottom: 2%;
}

.flow dt {
    font-size: 1.4em;
    margin: 1% 0 0 3%;
    line-height: 1.3em;
}

#background2 #info3-1 h4 {
    padding: 2.5% -1% 0 2%;
}

#policy1 {
    height: 365px;
}

#policy2 {
    height: 340px;
}

#policy3 {
    height: 340px;
}

#policy1 p, #policy2 p, #policy3 p {
    width: 94%;
    margin: 9% 2%;
}

#background2 #info3-2 img.about-photo3 {
    width: 34%;
    float: right;
    margin: 1% 1.5% 0 3%;
}

#background2 .flow dd.description {
    margin-top: -3%;
    font-size: 0.9em;
    width: 56%;
    color: #F60;
    line-height: 1.4em;
}

#background2 #info3-2 dd {
    padding: 0 0 1% 9%;
    width: 69%;
    font-size: 0.85em;
}

#background2 #info3-2 .img5 {
    width: 5.5%;
    height: 73%;
    top: 228px;
    left: 126px;
}

#background2 #info3-1 h3,#background2 #info3-2 h3,#background2 #info3-3 h3 {
    border: none;
    margin-top: 0.5%;
}

#background2 #info3-3 p {
    margin-top: 0;
    margin-left: 5%;
    width: 90%;
}
/*introduce
----------------------------------------------*/

#background3 #info3-1 {
    width: 93%;
    margin-top: 2%;
    height:1600px;
}

#background3 #info3-1 p {
    width: 78%;
}


#info3-3 p {
    margin-top: -6%;
    margin-left: 5%;
    width: 76%;
}

#background3 #info3-1 p.info-description {
    width: 90%;
    padding: 0.8% 0 0 2.5%;
    font-size: 1.2em;
    text-align: justify;
}


#background3 #info3-1 img, #background4 #info3-1-2 img, #background4 #info3-2 img, #background4 #info3-3 img {
    width: 18%;
    height: auto;
    position: absolute;
    top: 29px;
    left: 520px;
}

#background3 #info3-1 h3 img,#background3 #info3-2 h3 img,#background3 #info3-3 h3 img {
    width: 5%;
    top: -0.22%;
    left: -1%;
}

#background3 #info3-1 p.info3-1 {
	width:70%;
}

#background3 #info3-1 p .info-description{
    width:87%;
    margin-bottom: 2%;
	padding-left: 2.5%;
	text-align:justify;
}  

.flow dd.description-a {
    width: 49%;
}

#background3 #info3-1 p.info3-1-1 img {
    width: 22%;
    height: auto; 
    position: absolute;
    left: -11px;
    top: 71px;
}

#background3 .main h2 {
    width: 30%;
    margin: -30% auto 0;
}

#background3 #info3-3 .img7 {
    width: 19%;
    position: absolute;
    float: none;
    top: 302px;
    left: 520px;
}

#background3 #info3-3 .img8 {
    width: 19%;
    position: absolute;
    float: none;
    top: 452px;
    left: 520px;
}

#background3 #info3-1 img.photo-position1 {
	left: -9px;
    top: 232px;
	width: 23%;
} 
#background3 #info3-1 img.photo-position2 {
    left: 158px;
    top: 273px;
	width: 23%;
}

#background3 #info3-1 img.photo-position3 {
    left: 339px;
    top: 254px;
	width: 23%;
}

#background3 #info3-1 img.photo-position4 {
    left: 475px;
    top: 182px;
    width: 23%;
}

#background3 #info3-3 .img5-1 {
    /*width: 0.5%;
    height: 529px;
    position: relative;
    margin: -76% 0 0 21%;*/
	display:none;
}

#background3 #info3-3 .img6 {
    width: 18%;
    position: absolute;
    float: none;
    top: 166px;
    left: 528px;
}

#background3 #info3-2 .img2 {
    left: 0px;
    top: -733px;
}

#background3 #info3-2 .img3-1 {
    top: -28px;
    left: 561px;
}

#background3 #info3-2 .img5-1 {
    top: 72px;
    left: 548px;
}

#background3 #info3-2 .img6-1 {
    top: 239px;
    left: 483px;
}

#background3 #info3-2 .img11-1 {
    top: 18px;
    left: 8px;
}

#background3 #info3-2 .img12-1 {
    top: 21px;
    left: 59px;
}


#background3 #info3-2 .img1 {
    left: 16px;
    top: -793px;
}

#background3 #info3-2 .img3 {
    left: 0px;
    top: -702px;
}

#background3 #info3-2 .img9-1 {
    top: 24px;
    left: -2%;
}

#background3 #info3-2 .img4 {
	left: 11px;
    top: -647px;
}

#background3 #info3-2 {
    float: left;
    width: 93%;
    color: #452420;
    border: #399 2px solid;
    margin: 3% 3% 0;
    height: 945px;
    background: #fff;
    border-radius: 12px;
    position: relative;
    line-height: 2.2;
}

#background3 #info3-2 .img2-1 {
    top: 118px;
    left: 159px;
}

#background3 #info3-2 .img4-1 {
    top: 71px;
    left: 141px;
}

#background3 #info3-2 .img8-1 {
    top: -9px;
    left: 154px;
}

#background3 #info3-2 .img7-1 {
    top: -82px;
    left: 156px;
}

#background3 #info3-2 .img10-1 {
    top: 32px;
    left: -30px;
}

#background3 #info3-2 .img5 {
    width: 5.5%;
    height: 72%;
    top: 216px;
    left: 112px;
}

#background3 section.info1 dd {
    padding: 1% 0 1% 32%;
    font-size: 0.9em;
    text-align: justify;
    width: 68%;
    line-height: 1.4;
}

#background3 #info3-2 dd {
    padding: 0 0 1% 9%;
    width: 95%;
}

.flow dd.description {
    margin-top: -3%;
    font-size: 0.9em;
    width: 68%;
    color: #F60;
    line-height: 1.4em;
}

#background3 section.info1 dd {
    padding: 1% 0 1% 35%;
    font-size: 0.87em;
    text-align: justify;
    width: 68%;
    line-height: 1.4;
}

/*hatopopo
----------------------------------------------*/
#background5 #info3-1 dl {
    margin-left: 30px;
    margin-top: 1%;
}

#background5#info3-2 .txt {
    width: 95%;
}

#background5 #info3-1 dd {
    margin: 0 0 1% -5%;
    font-size: 0.9em;
    width: 100%;
}

#background5 article h2 {
    width: 36%;
    font-size: 1.4em;
    margin: -27% 0 0 32%;
}

#background5 #info3-2 img {
    width: 5.5%;
    left: -6px;
    top: 0;
}

#background5 #info3-1 img {
    width: 5.5%;
    left: -7px;
    top: 1px;
}

#background5 #info3-2 p{
    margin: 3% 4.5% 2% 3%;
}

#background5 #info3-2 h3 {
    margin: 2% 0 1% 1.2%;
}

#background5 #info3-1 h3 {
    padding: 0 9%;
}

#background5 #info3-2 dd {
    padding: 0 0 1% 9%;
    width: 69%;
}
#background5 #info3-2 .txt {
    width: 95%;
}

#background5 #info3-1 .hato {
    width: 12%;
    margin: -2% 4% 0 1%;
}
/*information
----------------------------------------------*/
#info3-4 {
    width: 93%;
    color: #36f;
    margin: 2% 3% 1%;
    height: auto;
    border-radius: 12px;
    position: relative;
}

#info3-4 img {
    margin: 2% -16% 0% 2%;
    width: 20%;
    height: 100%;
}

#info3-1 dl ul {
    padding-left: 8%;
}

article section dd {
    margin: 0 0 2%;
    padding: 0 0 1% 35%;
    font-size: 0.75em;
}

article section dt {
    margin: 0 0% 1% -2%;
    font-size: 0.8em;
}

#info3-1 dt, #info3-1-2 dt ,#info3-2 dt{
   margin: 0 0% 1% 0;
}

#info3-1 dd, #info3-1-2 dd ,#info3-2 dd{
    padding: 0% 0% 0% 20%;
}

#info3-1 dd {
    margin: 0 0 1% 4%;
    font-size: 0.97em;
}
#background4 #info3-4 img {
    margin: 3% 0 0 3%;
    width: 7%;
    height: auto;
}
#background4 #info3-3 .access img {
    width: 40%;
    height: 33%;
    position: absolute;
    left: 390px;
    top: 122px;
    margin: 0;
}

#background4 article h2 {
    width: 36%;
    font-size: 1.4em;
    margin: -27% auto 0;
}

#background4 #info3-2 h3 {
    color: #452420;
    padding: 0.3% 7.5%;
    font-size: 2.2em;
    border: none;
    margin-top: 1.2%;
}

#background4 #info3-1-2 h3 {
    color: #452420;
    padding: 1.5% 8.5% 0%;
    font-size: 2.2em;
    border: none;
    margin-top: 0;
}

#background4 #info3-1 img {
    width: 5.8%;
    height: auto;
    position: absolute;
    left: -7px;
    top: -7px;
}

#background4 #info3-1 h3, #info3-1-2 h3 {
    color: #452420;
    padding: 1% 9%;
    font-size: 2.2em;
    border: none;
    margin-top: 0;
}

#background4 #info3-1-2 img, #background4 #info3-2 img, #background4 #info3-3 img {
    width: 5.5%;
    height: auto;
    position: absolute;
    top: -4px;
    left: -9px;
}

#background4 #info3-1 dl,#background4 #info3-1-2 dl,#background4 #info3-2 dl {
    margin-left: 5%;
}

#background4 #info3-1 p {
    width: 99%;
}

#background4 #info3-2 h3 {
    color: #452420;
    padding: 1.3% 8%;
    font-size: 2.2em;
    border: none;
    margin-top: 0;
}

#background4 #info3-3 h3 {
    border: none;
    margin: 0.52% 0 2% 0.2%;
}

#background4 #info3-4 h3 {
    font-size: 2.2em;
    text-align: center;
    color: #222;
    margin: 1% 40% 4.5% 0;
}
#background4 #info3-4 .table img {
    width: 60%;
    height: auto;
    position: relative;
    margin: 1% 2% 2% -22%;
    border: 1px #cccccc solid;
}

#background4 .list-free2 {
    margin: 4% 2% 4%;
    font-size: 0.9em;
    line-height: 2em;
    list-style: none;
}

#background4 .list-free3 {
    margin: 2% 2% 0;
    font-size: 1.1em;
    line-height: 2em;
    width: 75%;
}

#background4 .list-free3 :last-child {
    margin: 3% 2% 4%;
    font-size: 1.1em;
    line-height: 1.2em;
}
/*inquiry
----------------------------------------------*/

.inquiry {
    background: #fff;
    width: 100%;
    height: auto;
    padding: 1% 0 33% 0;
    text-align: left;
    border-radius: 16px;
}

.formTable {
	height: auto;
	line-height: 60%;
	width: 95%;
	margin:1% 2.2%;
}

.formTable th {
    line-height: 1.4em;
    padding: 12px;
    width: 150px;
}

.formTable td {
    line-height: 1.4em;
    padding: 12px;
    width: 320px;
}

.inquiry h2{
	font-size:1.2em;
	margin-left:2%;
}

.inquiry h3 {
    float: left;
    padding-left: 1%;
    margin: 2% 0 1.3% 10%;
    font-size: 1.5em;
    text-align: left;
    background: none;
    padding: 1%;
    border-radius: 0;
    width: 45%;
}

#background6 article h2 {
    width: 30%;
    margin: -27% auto 3%;
}

#background6 .main img {
    float: left;
    margin: 2% 3% 0% -52%;
    width: 5%;
    height: auto;
}
/*privacy_policy
------------------------------------*/

#others article h2 {
    width: 83%;
    font-size: 1.4em;
	margin-top: -27%;
}

#others nav ul {
    margin: 22.5% 4% 2%;
    padding: 2.8% 0 1.8%;
    font-size: 0.9em;
}


/*footer
----------------------------------------------*/
footer {
    margin: -10% 0% 16%;
}

.footer_center {
    height: 193px;
}

p.pagetop img {
    width: 7.2%;
    vertical-align: bottom;
    bottom: 0px;
    right: 10px;
    position: fixed;
}


@media screen and (min-width: 736px)  and (max-width: 767px){
	.box-first img{
	    padding: 44% 0 0;
		width: 88%;
	}
}
.box-last a {
	margin-top: -15%;
}


/*2018.01.31山本追加*/

.res-br1{
	display: block;
}
.res-br2{
	display: none;
}
.res-dt1{
	width: 15%;
	height: 270px;
}
.br3 {
	display: block;
}