/**************************************************************/
/**********************      共通      ************************/
/**************************************************************/

html,body{
	overflow-x:hidden; /* モバイル端末で右にはみ出すことがあるので消す */
	overflow-y:auto; /* 上記の指定をするとブラウザ左のスクロールバーが二つ表示されることがあるのでその対応 */
	padding:0 !important;
}

/* IEだと縦スクロールバーが2つ出るのを回避 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 
	html,body{
		overflow-x:visible;
		overflow-y:visible; 
	}
}

.wrapper{
	position:relative;
	padding:0;
	margin:0;
	width: 100%;
}

.pc {
	display: none !important;
}

.sp {
	display: block !important;
}

/**************************************************************/
/**********************     スマホ     ************************/
/**************************************************************/


/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
   header
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

#header{
	position: fixed;
	top:0;
	left:0;
	height: 60px;
	width: 100%;
	background:#fff;
	z-index:2;
}

.button-toggle {
	width: 100px;
	height: 60px;
	text-align: center;

	position: absolute;
	top: 0;
	right: 0;
	background:#FFF601;
}

.menu-trigger {
  display: inline-block;
	width: 100px;
	height: 60px;
  vertical-align: middle;
  cursor: pointer;
  margin: auto;
  z-index: 9999;
  transition: transform .5s;
  color: #fff;
  text-align:center;
	border:solid 1px #fff;
}

.menu-trigger span {
  display: inline-block;
  box-sizing: border-box;
  position: absolute;
  width: 60px;
  height: 4px;
  left: 20px;
  background-color: #2C2B00;
}
.menu-trigger span:nth-of-type(1) {
	top: 20px;
}
.menu-trigger span:nth-of-type(2) {
	top: 35px;
}

.menu-trigger div{
  position: absolute;
  top: 28px;
  left: 0;
  right: 0;
  font-size:14px;
  text-align:center;
}

#drawer-menu {
  min-height: 100%;
  background-color: #FFF601;
  position: fixed;
  z-index: 99999;
  transition: all .5s;
  box-sizing: border-box;

  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transform: translate(100%);
  -ms-transform: translate(100%);
  transform: translate(100%);
}

#drawer-menu.open {
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}

#drawer-menu h1#logo_sp{
  background-color: #FFF;
  padding:20px 40px;
  margin-right:95px;
}

#drawer-menu h1#logo_sp a{
  font-size:24px;
}

#drawer-menu ul {
  padding-left:70px;
  margin-bottom:50px;
}


#drawer-menu li {
	position: relative;
	padding:5px 0;
}

#drawer-menu li:before {
	position: absolute;
	top:10px;
	left:-1.5em;
	content:"";
	background:#fff;
	height:30px;
	width:3px;

	-webkit-transform: skewX(20deg);
	-moz-transform: skewX(150deg);
	transform: skewX(140deg);
}

#drawer-menu li a{
	display:block;
	height:40px;
	color:#000;
	position: relative;
}

#drawer-menu li a span{
	display:block;
	font-size:24px;
	position: absolute;
	bottom:0px;
}

#drawer-menu li a:active span{
	bottom:-5px;
}

#drawer-menu dl.info{
  background-color: #FFFDCC;
  width:95%;
  margin:auto;
  padding:20px;
}

#drawer-menu dl.info dt{
	font-size:22px;
	margin-bottom:10px;
}

#drawer-close-btn{
  height: 50px;
  margin:0 auto;
}
#drawer-close-btn p{
  font-size:14px;
}
.menu-close {
  display: inline-block;
  width: 50px;
  height: 50px;
  vertical-align: middle;
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 20px;
  z-index: 1;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  transition: transform .5s;
}
.menu-close span {
  display: inline-block;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  width: 100%;
  height: 6px;
  background-color: #000;
}
.menu-close span:nth-of-type(1) {
  top: 10px;
  -webkit-transform: translateY(12px) rotate(-45deg);
  -ms-transform: translateY(12px) rotate(-45deg);
  transform: translateY(12px) rotate(-45deg);
}
.menu-close span:nth-of-type(2) {
  bottom: 8px;
  -webkit-transform: translateY(-14px) rotate(45deg);
  -ms-transform: translateY(-14px) rotate(45deg);
  transform: translateY(-14px) rotate(45deg);
}


/* +++++++++++++++++++++++++++++++++++++++++++++++++++++
   フッター
++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#footer{
	width: 100%;
	text-align:center;
	background:#FCEEEE;
}

#footer #footer_menu{
	height:30px;
	background:#FFF601;
	text-align:center;
}

#footer #footer_menu li{
	display:inline-block;
	height:30px;
	line-height:30px;
	text-align:center;
}

#footer #footer_menu li a {
	height:30px;
	font-size:14px;
	line-height:30px;
	color:#000;
	position: relative;
	padding:0 1em;
	border-left:solid 1px #000;
	text-decoration:underline; 
	text-underline-offset:3px; 
}

#footer #footer_menu li:last-child a{
	border-right:solid 1px #000;
}


#footer #footer_banner{
	padding:25px 0 5px 0;
}

#footer #copyright{
	background:#FFF;
	text-align: right;
	width:100%;
	font-size:14px;
	padding:15px 20px;
}

/* ページトップへ戻る */
.pageTop {
	/*display:none;*/ /* jqueryで指定 */
	position:relative;
	width: 100%;
	max-width:100%;
	height:0;
	margin:0 auto;
}
.pageTop a {
	position: fixed;
	bottom: 0px;
	right:0;
	display: block;
	width: 80px;
	padding:1.5em 0 1.5em 2px;
	background-color:#FCEEEE;
	text-align:center;
	outline:none;
	text-decoration: none;
	z-index:9999;
	border-radius:10px 10px 0 0;
	font-weight:bold;
	color:#fff;
}

.pageTop a:hover {
	cursor:pointer;
}

/* 矢印作成 */
.pageTop a:before,
.pageTop a:after {
	position:absolute;
	left:50%;
	content:"";
	width:0px;
	height:0px;
	margin-left:-15px;
	border:15px solid transparent;
}
.pageTop a:before {
	top:10%;
	border-bottom:15px solid #000;
}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++
   ページ共通
++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


.eventFadeIn {
    opacity: 0;
    -webkit-transition: all 1.5s;
    -o-transition: all 1.5s;
    transition: all 1.5s;
}

.eventFadeIn.in-top {
    -webkit-transform: translate(0,-30px);
    -ms-transform: translate(0,-30px);
    transform: translate(0,-30px);
}

.eventFadeIn.in-bottom {
    -webkit-transform: translate(0,50px);
    -ms-transform: translate(0,50px);
    transform: translate(0,50px);
}

.eventFadeIn.in-left {
    -webkit-transform: translate(-50px, 0);
    -ms-transform: translate(-50px, 0);
    transform: translate(-50px, 0);
}

.eventFadeIn.in-right {
    -webkit-transform: translate(50px, 0);
    -ms-transform: translate(50px, 0);
    transform: translate(50px, 0);
}


.eventFadeIn.active {
    opacity: 1;
    -webkit-transition: all 1.0s;
    -o-transition: all 1.0s;
    transition: all 1.0s;
    -webkit-transform: translate(0, 0) !important;
    -ms-transform: translate(0, 0) !important;
    transform: translate(0, 0) !important;
}

.fadeInAfterLoad .child {
	opacity : 0;
    -webkit-transition: all 1.5s;
    -o-transition: all 1.5s;
	transition : all 1.5s;
}

.fadeInAfterLoad .child.in-left {
	-webkit-transform: translate(-2em,0);
	-ms-transform: translate(-2em,0);
	transform: translate(-2em,0);
}

.fadeInAfterLoad .child.in-right {
	-webkit-transform: translate(2em,0);
	-ms-transform: translate(2em,0);
	transform: translate(2em,0);
}

.fadeInAfterLoad .child.active {
	opacity : 1;
	-webkit-transform: translate(0, 0) !important;
	-ms-transform: translate(0, 0) !important;
	transform: translate(0, 0) !important;
}

.fadein-turn .child {
	opacity : 0;
	transition : all 1.5s;
	-webkit-transform: translate(0,-30px);
	-ms-transform: translate(0,-30px);
	transform: translate(0,-30px);
}
  
.fadein-turn .child.active {
	opacity : 1;
	-webkit-transform: translate(0, 0) !important;
	-ms-transform: translate(0, 0) !important;
	transform: translate(0, 0) !important;
}

.slide-in {
	overflow: hidden;
    display: inline-block;
}

.slide-in_inner {
	display: inline-block;

}

/* 上下のアニメーション*/
.upAnime{
    opacity: 0;
}

.slideAnimeDownUp {
    animation-name:slideTextY100;
    animation-duration:0.8s;
    animation-fill-mode:forwards;
    opacity: 0;
}

@keyframes slideTextY100 {
    from {
        transform: translateY(100%);/* 要素を上の枠外に移動*/
        opacity: 0;
    }
    to {
        transform: translateY(0);/* 要素を元の位置に移動*/
        opacity: 1;
    }
}
.slideAnimeUpDown {
    animation-name:slideTextY-100;
    animation-duration:0.8s;
    animation-fill-mode:forwards;
    opacity: 0;
}

@keyframes slideTextY-100 {
    from {
    transform: translateY(-100%);/* 要素を下の枠外に移動*/
    opacity: 0;
    }
    to {
    transform: translateY(0);/* 要素を元の位置に移動*/
    opacity: 1;
    }
}


.container1200{
	width:96%;
	margin:0 auto;
}

.container1500{
	width:96%;
	margin:0 auto;
}

.container1800{
	width:960%;
	margin:0 auto;
}

h1#logo{
	text-align:left;
	margin:10px 0 5px 1em;
}

h1#logo a{
	font-size:24px;
	font-weight:bold;
	color:#000;
}

h1.ptn1{
	background: #F1F5F9;
	font-size: 40px;
	line-height: 1em;
	text-align: center;
	padding: 70px 0 50px 0;
	letter-spacing: 0em;
}

h1.ptn1 span {
	font-family: Century,sans-serif;
	line-height: 1em;
	font-size: 18px;
	color: #f3ac03;
}

h1.ptn1 span:before {
	content: "\A";
	white-space: pre;
}

h2.ptn1{
	font-size:30px;
	color:#f3ac03;
	text-align:center;
}

h2.ptn2{
	position:relative;
	font-size:30px;
	font-weight:bold;
	padding-left:1em;
	margin-bottom:70px;
}

h2.ptn2:before{
	position:absolute;
	left: 0;
	top: -2px;
	content:"";
	width:9px;
	height:1.5em;
	background:#FFF601;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px; 
	border-radius:10px; 
}

h3.ptn3{
	font-size:20px;
	background:#F1F5F9;
	padding:20px 25px;
	margin-bottom:50px;
	-moz-border-radius: 20px; 
	-webkit-border-radius: 20px; 
	border-radius:20px; 
}

a.ptn2{
	position:relative;
	display:block;
	width:90%;
	max-width:800px;
	padding:20px 60px 20px 20px;
	font-size:18px;
	margin:0 auto 30px auto;
	border:solid 3px #F0F1F3;
	overflow: hidden;
}

a.ptn2:after{
	content:url("../images/icon-pdf.png");
	position:absolute;
	top:18px;
	right:10px;
}

a.ptn2.mini{
	max-width:350px;
}

a.ptn2.right{
	max-width:330px;
	margin:0 0 30px auto;
}

a.ptn2.link2:after{
	content:url("../images/icon-link2.png");
}

a.ptn2::before {
  content: "";
  width: 150%;
  position: absolute;
  top: 0;
  right: -100px;
  z-index: -1;
  border-right: 100px solid transparent;
  border-bottom: 100px solid #F0F1F3;
  transform: translateX(-200%);
  transition: transform ease .3s;
}


a.ptn2:hover{
	transition: .3s;
	border:solid 3px #e5e5e5;
}

a.ptn2:hover::before {
  transform: translateX(0);
}

ul.ptn1 {
	padding-left:1.5em;
}

ul.ptn1 li{
	position:relative;
	font-size:18px;
	padding-left:1.25em;
	margin-bottom:15px;
}

ul.ptn1 li:before{
	position:absolute;

	display: block;
	content: '';
	top: 8px;
	left: 0;
	width: 10px;
	height: 10px;
	background-color: #FFF601;
	border-radius: 100%;
}

.breadcrumb {
	margin-top:20px !important; 
	margin-bottom:50px !important; 
	font-size:14px;
}


.breadcrumb a{
	font-size:14px;
	text-decoration:underline;
	text-underline-offset:3px; 
	line-height:1.75em;
}


.google-maps {
	position: relative;
	padding-bottom: 40%; /* ここが縦横比 */
	height: 0;
	overflow: hidden;
}
.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

#content{
	margin-top:50px; /* ヘッダーの高さを指定 */
}

#main{
	width:100%;
}

#lower_header1 {
	position:relative;
}

#lower_header1 .inner {
	max-height:100vh;
}

#lower_header1 .inner img{
	height:100vh;
	object-fit: cover;
	width: 100%;
}

#lower_header1 img.child.girl{
	position:absolute;
	top:20px;
	right:10px;
	width:200px;
}

#lower_header1 img.child.boy{
	position:absolute;
	bottom:20px;
	left:50px;
	width:200px;
}

#lower_header1 img.msg{
	position:absolute;
	top:30px;
	left:30px;
	width:auto;
}

#lower_header2 {
	position:relative;
	margin-bottom:70px;
}

#lower_header2 img.child{
	position:absolute;
	top:20px;
	right:50px;
	width:35%;
}

#lower_header2 p{
	position:absolute;
	bottom:80px;
	width:100%;
	background-color: rgb(255, 255, 255, 0.7);
	text-align:center;
	padding:10px;
	line-height:1em;
}

#lower_header2 p span{
	line-height:1.25em;
	font-size:20px;
}

#news .news-list{
	width:95%;
	max-width:900px;
	margin:auto;
}

#news .news-list dl{
    display: -webkit-flex;
    display: flex;
    flex-wrap:wrap;
    margin-bottom:20px;
}

#news .news-list dt{
	display:inline-block;
	width:140px;
	text-align:center;
}

#news .news-list dt span{
	display:inline-block;
	width:140px;
	background-color:#20CBD4;
	-moz-border-radius: 50%; 
	-webkit-border-radius: 50%; 
	border-radius:20px; 
	font-weight:bold;
}

#news .news-list dd{
	display:inline-block;
	width:calc(100% - 140px);
	padding-left:20px;
}

#news .news-list dd a{
	position:relative;
	text-decoration:underline;
	text-underline-offset:3px; 
	display:inline-block;
	padding-right:30px;
}

#news .news-list dd a:after{
	content:url("../images/icon-pdf.png");
	position:absolute;
	top:-2px;
	right:-15px;
	
}

#top #content{
	margin-top:0; /* ヘッダーの高さを指定 */
}

#top .section .column2 .child:nth-of-type(1){
	background:#25B7C0;
}

#top .section .column2 .child:nth-of-type(2){
	background:#FFF601;
}

#top .section .column2 .child .box {
	width:90%;
	max-width:660px;
	margin:60px auto;
	text-align:center;
}

#top .section .column2 .child .box a{
	display:inline-block;
	margin-bottom:20px;
}



@media only screen and (max-width : 750px ) {

#top .section .column2 .child:nth-of-type(1){
	width:100%;
}

#top .section .column2 .child:nth-of-type(2){
	width:100%;
}


} /* max-width : 750px */




/**************************************************************/
/**********************    パソコン    ************************/
/**************************************************************/

@media only screen and (min-width : 601px ) {

#lower_header1 img.child.girl{
	top:20px;
	right:10px;
	width:24%;
}

#lower_header1 img.child.boy{
	bottom:20px;
	left:50px;
	width:24%;
}

#lower_header1 img.msg{
	top:30px;
	left:30px;
	width:11.722%;
}

#lower_header2 img.child{
	top:20px;
	right:10px;
	width:24%;
}


#lower_header2 p span{
	font-size:26px;
}

}


@media only screen and (min-width : 951px ) {

.pc {
	display: block !important;
}

.sp {
	display: none !important;
}

.container1200{
	max-width:1200px;
	margin:0 auto;
}

.container1500{
	max-width:1500px;
	margin:0 auto;
}

.container1800{
	max-width:1800px;
	margin:0 auto;
}



/* +++++++++++++++++++++++++++++++++++++++++++++++++++++
   header
++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#header{
	height: 175px;
	height: 145px;
	width: 100%;
}

#top #header{
	height: 0;
}

#header #header_menu{
	background:#FFF601;
	padding:15px 0;
}

#header #header_menu .inner {
	margin:auto;
    max-width: 1040px;
    text-align:center;
}

#header #header_menu .inner ul{
	vertical-align:middle;
	display:inline-block;
}

#header #header_menu .inner li{
	float:left;
	height:30px;
	line-height:30px;
	text-align:center;
	margin:0 0.75em;
}


#header #header_menu li a {
	height:30px;
	font-size:26px;
	line-height:30px;
	color:#000;
	position: relative;
	padding:0 1em;
}

#header #header_menu li a:before {
	position: absolute;
	left:0;
	content:"";
	background:#fff;
	height:30px;
	width:3px;

	-webkit-transform: skewX(20deg);
	-moz-transform: skewX(150deg);
	transform: skewX(140deg);
}

#header #header_menu li a:after {
	position: absolute;
	right:0.15em;
	content:"";
	background:#fff;
	height:30px;
	width:3px;

	-webkit-transform: skewX(20deg);
	-moz-transform: skewX(150deg);
	transform: skewX(140deg);
}

#header #header_menu li a:hover {
	cursor:pointer;
	
	text-decoration:underline; 
	text-underline-offset:3px; 
}

.menu {
	display:none !important;
}

h1#logo{
	text-align:center;
	/*margin:40px 0 30px 0;*/

	margin:20px 0 20px 0;
}

h1#logo a{
	font-size:30px;
}

a.ptn2:after{
	right:30px;
}

#lower_header1 img.child.girl{
	top:30px;
	right:60px;
}

#lower_header1 img.child.boy{
	top:initial;
	bottom:40px;
	left:150px;
}

#lower_header1 img.msg{
	top:30px;
	left:80px;
}


#lower_header2 img.child{
	top:30px;
	right:50px;
}


#lower_header2 p{
	bottom:95px;
}

#lower_header2 p span{
	font-size:32px;
}

#content{
	margin-top:175px;
	margin-top:145px; 
}

#top #content{
	margin-top:0; 
}


} /* min-width : 950px */