@charset "utf-8";

header {
	position: fixed;
	box-sizing: border-box;
	background: #f8ecd8;
	width: 100%;
	min-width: 1240px;
	margin: 0 auto;
	padding: 0;
	z-index: 999999;
}


footer {
	background-color: #eee;
}

.header,
.footer,
.nav {
	display: flex;
	justify-content: space-between;
}

.header,
.footer {
	padding: 20px 0;
}

.nav li {
	padding: 10px;
	font-weight: bold;
}

.nav a:hover {
	color: #fff;
	transition: all 0.3s;
}

.content {
	/* height: 300px; */
	/* padding: 20px 0; */
}

footer p {
	position: absolute;
	bottom: 10%;
	left: 50%;
	transform: translate(-50%, -50%);
	letter-spacing: 0.1em;
	font-size: 1.2rem;
	text-transform: uppercase;
	color: #fff;
	text-shadow: 1px 2px 3px #808080;
	padding: 0;
	margin-top: -210px;
}

@media screen and (max-width: 1400px) {
	footer p {
		position: absolute;
		width: 80%;
		bottom: 10%;
		left: 50%;
		transform: translate(-50%, -50%);
		letter-spacing: 0.1em;
		font-size: 1.2rem;
		text-transform: uppercase;
		color: #fff;
		text-shadow: 1px 2px 3px #808080;
		padding: 0;
		margin-top: -210px;
	}
}

@media screen and (max-width: 900px) {
	footer p {
		position: absolute;
		bottom: 10%;
		left: 50%;
		transform: translate(-50%, -50%);
		letter-spacing: 0.1em;
		color: #fff;
		text-shadow: 1px 2px 3px #808080;
		font-size: 1.0rem;
		text-align: center;
		width: 100%;
	}
}

/*****************************************************

color

******************************************************/
/*グラデーション*/
.gra {
	/* background: -moz-linear-gradient(left, #EEAECC, #F08E4C); */
	/* background: -webkit-linear-gradient(left, #EEAECC, #F08E4C); */
	/* background: linear-gradient(to right, #EEAECC, #F08E4C); */
	background: #5b2c02;
}

.about .gra {
	background: -moz-linear-gradient(left, #EEAECC, #F08E4C);
	background: -webkit-linear-gradient(left, #EEAECC, #F08E4C);
	background: linear-gradient(to right, #EEAECC, #F08E4C);
}

.kyouiku .gra {
	background: -moz-linear-gradient(left, #5b2c02);
	background: #5b2c02;
	background: #5b2c02;
}

.annai .gra {
	background: -moz-linear-gradient(left, #EDC31C, #E48F15);
	background: -webkit-linear-gradient(left, #EDC31C, #E48F15);
	background: linear-gradient(to right, #EDC31C, #E48F15);
}

.shien .gra {
	background: -moz-linear-gradient(left, #4F86BB, #7E549F);
	background: -webkit-linear-gradient(left, #4F86BB, #7E549F);
	background: linear-gradient(to right, #4F86BB, #7E549F);
}

.soudan .gra {
	background: -moz-linear-gradient(left, #BBBDBE, #9DA3A6);
	background: -webkit-linear-gradient(left, #BBBDBE, #9DA3A6);
	background: linear-gradient(to right, #BBBDBE, #9DA3A6);
}

.etc .gra {
	background: -moz-linear-gradient(left, #333333, #111111);
	background: -webkit-linear-gradient(left, #333333, #111111);
	background: linear-gradient(to right, #333333, #111111);
}

.contact .gra {
	background: -moz-linear-gradient(left, #FFBD8A, #EA5150);
	background: -webkit-linear-gradient(left, #FFBD8A, #EA5150);
	background: linear-gradient(to right, #FFBD8A, #EA5150);
}




/* ==========================================================================
	プロパティ
========================================================================== */
/*shadow*/
.shadow {
	-webkit-box-shadow: #5b2c02(0, 0, 0, .1) 0 3px 3px 0;
	-moz-box-shadow: #5b2c02(0, 0, 0, .1) 0 3px 3px 0;
	box-shadow: #5b2c02(0, 0, 0, .1) 0 3px 3px 0;
}

.demand {
	color: #FF0000;
	display: block;
	font-size: 0.85rem;
}

.kiwi {
	font-family: 'Kiwi Maru', serif;
}

/* ==========================================================================
	main
========================================================================== */
#main {
	width: 100%;
	margin: 0 auto;
	position: relative;
}

#main:after {
	content: "";
	display: block;
	position: absolute;
	z-index: 100;
	width: 100%;
	height: 176px;
	bottom: -75px;
	background: url(../image/main_bottom_bg.png) bottom center repeat-x;
}

#main .touch {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 195px;
	margin: auto;
	width: 137px;
	z-index: 100;
}


#main .bxslider {
	width: 100% !important;
	margin: 0 auto;
	position: relative;
}

#main .bxslider li:before {
	content: "";
	display: block;
	padding-top: 800px;
	/*
	padding-top:720px;
	*/
}

.mtbg {
	display: block;
	position: absolute;
	top: 0;
	padding: 0 !important;
	z-index: 100;
	width: 100% !important;
	/*
	height:720px!important;
	
	background:url(../image/main1.jpg) top center no-repeat;
	*/
	background-size: cover !important;
	background-position: center center !important;
	background-size: 100% !important\9;

	-webkit-animation: sc 20s linear;
	animation: sc 20s linear;
}

/*
@-webkit-keyframes sc {
  0% {transform: matrix3d(
        1, 0, 0, 0,
        0, 1, 0, 0,
        0, 0, 1, 0,
        0, 0, 0, 1
    );
}
  100% {transform: matrix3d(
        1, 0, 0, 0,
        0, 1, 0, 0,
        0, 0, 1, 0,
        0, 0, 0, 0.8
    );

  }
}
@keyframes sc {
  0% {transform: matrix3d(
        1, 0, 0, 0,
        0, 1, 0, 0,
        0, 0, 1, 0,
        0, 0, 0, 1
    );
}
  100% {transform: matrix3d(
        1, 0, 0, 0,
        0, 1, 0, 0,
        0, 0, 1, 0,
        0, 0, 0, 0.8
    );

  }
}
	

*/
.row {
	margin-right: 0;
	margin-left: 0;

}

.main01 {
	background-image: url(../image/main01.jpg);
}

.main01 h2 {
	position: absolute;
	right: calc(50% - 490px);
	top: 104px;
	width: 160px;
}

.main01 p {
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100px;
	margin: auto;
	width: 300px;
}

.main02 {
	background-image: url(../image/main02.jpg);
}

.main02 h2 {
	position: absolute;
	right: calc(50% - 490px);
	top: 104px;
	width: 160px;
}

.main02 p {
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100px;
	margin: auto;
	width: 257px;
}

.main03 {
	background-image: url(../image/main03.jpg);
}

.main03 h2 {
	position: absolute;
	right: calc(50% - 490px);
	top: 104px;
	width: 160px;
}

.main03 p {
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100px;
	margin: auto;
	width: 259px;
}

.main04 {
	background-image: url(../image/main04.jpg);
}

.main04 h2 {
	position: absolute;
	left: calc(50% - 540px);
	top: 104px;
	width: 340px;
}

.main04 p {
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100px;
	margin: auto;
	width: 258px;
}

.main05 {
	background-image: url(../image/main05.jpg);
}

.main05 h2 {
	position: absolute;
	right: calc(50% - 490px);
	top: 104px;
	width: 160px;
}

.main05 p {
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100px;
	margin: auto;
	width: 306px;
}


.bx-wrapper {
	position: relative;
	margin: 0 auto;
	width: 100%;
}

.bx-viewport {
	margin: 0 auto;
	width: 100%;
}

.bx-wrapper img {
	width: 100%;
}


/* コントローラー */
.bx-controls {
	position: absolute;
	width: 78px;
	height: 20px;
	z-index: 150;
	left: 0;
	right: 0;
	margin: auto;
	bottom: 110px;
}

.bx-controls-direction {
	max-width: 100%;
	min-width: 780px;
	top: 0;
	position: absolute;
}

.bx-controls-direction a {
	position: absolute;
	width: 100%;
	height: 300px;
	display: block;
	background-color: #fff;
	z-index: 600;
}

.bx-controls-direction a:hover {
	background-color: #0d6fb8;
}



/* bx-pager *******/

.bx-pager {
	text-align: center;
	clear: both;
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	-js-display: flex;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

.bx-pager a {
	background: #fff;
	text-indent: -9999px;
	/*数字表示をブラウザ外に押しやる*/
	display: block;
	width: 9px;
	height: 9px;
	margin: 0;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
	margin-top: 2px;
	-webkit-transition: color 0.2s ease;
	-moz-transition: color 0.2s ease;
	-o-transition: color 0.2s ease;
	transition: color 0.2s ease;
}

.bx-pager a:hover,
.bx-pager a.active {
	background: #0d6fb8;
}

.bx-pager-item {
	line-height: 1;
}

.bx-pager-item a {
	background-color: #fff;
	display: block;
}

.bx-pager-item a.active {
	width: 13px;
	height: 13px;
	background: #0d6fb8;
	margin-top: 0;
}





.bottom_msk {
	width: calc(100% - 30px);
	max-width: 980px;
	height: 60px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 9996;
	background: url(../image/pattern.gif) left top;
}

.bottom_msk:before {
	content: "";
	display: block;
	position: absolute;
	width: 60px;
	height: 60px;
	left: -59px;
	bottom: 0;
	background: url(../image/pattern.gif) left top;
	-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
	clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

.bottom_msk:after {
	content: "";
	display: block;
	position: absolute;
	width: 60px;
	height: 60px;
	right: -60px;
	bottom: 0;
	background: url(../image/pattern.gif) left top;
	-webkit-clip-path: polygon(0 0, 0% 100%, 100% 100%);
	clip-path: polygon(0 0, 0% 100%, 100% 100%);
}

@media screen and (max-width: 1400px) {

	#main .bxslider li:before {
		padding-top: 57.8vw;
	}

}



@media screen and (max-width: 1250px) {
	#main .bxslider li:before {
		padding-top: 730px;
	}



}


@media screen and (max-width: 1100px) {

	.main01 h2,
	.main02 h2,
	.main03 h2,
	.main05 h2 {
		right: 30px;
	}

	.main04 h2 {
		left: 10px;
	}
}

@media screen and (max-width: 800px) {

	#main .bxslider li:before {
		padding-top: 89% !important;
	}

	#main:after {
		content: "";
		display: block;
		position: absolute;
		z-index: 100;
		width: 100%;
		height: 70px;
		bottom: -42px;
		background: url(../image/main_bottom_bg_sp.png) bottom center repeat-x;
		background-size: 498px 70px;
	}


	.main01 h2 {
		position: absolute;
		right: 3vw;
		top: 10.9vw;
		width: 19vw;
	}

	.main01 p {
		bottom: 35px;
		margin: auto;
		width: 148px;
	}

	.main02 h2 {
		position: absolute;
		right: 3vw;
		top: 10.9vw;
		width: 19vw;
	}

	.main02 p {
		bottom: 35px;
		margin: auto;
		width: 128px;
	}

	.main03 h2 {
		position: absolute;
		position: absolute;
		right: 3vw;
		top: 10.9vw;
		width: 19vw;
	}

	.main03 p {
		bottom: 35px;
		margin: auto;
		width: 128px;
	}

	.main04 h2 {
		position: absolute;
		position: absolute;
		right: 3vw;
		left: auto;
		top: 10.9vw;
		width: 40vw;
	}

	.main04 p {
		bottom: 35px;
		margin: auto;
		width: 128px;
	}

	.main05 h2 {
		position: absolute;
		position: absolute;
		right: 3vw;
		top: 10.9vw;
		width: 19vw;
	}

	.main05 p {
		bottom: 35px;
		margin: auto;
		width: 148px;
	}

	#main .touch {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 85px;
		margin: auto;
		width: 17vw;
		z-index: 100;
	}


	/* コントローラー */
	.bx-controls {
		width: 34px;
		height: 5px;
		bottom: 45px;
	}

	.bx-controls-direction {
		min-width: 780px;
	}

	.bx-controls-direction a {
		position: absolute;
		width: 100%;
		height: 300px;
		display: block;
		background-color: #fff;
		z-index: 600;
	}

	.bx-controls-direction a:hover {
		background-color: #0d6fb8;
	}



	/* bx-pager *******/

	.bx-pager {
		text-align: center;
		clear: both;
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;
		-js-display: flex;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.bx-pager a {
		width: 4px;
		height: 4px;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		border-radius: 4px;
		margin-top: 1px;
	}

	.bx-pager-item a.active {
		width: 6px;
		height: 6px;
	}

}

@media screen and (max-width: 400px) {
	#main .bxslider li:before {
		padding-top: 316px !important;
	}

	#main .touch {
		bottom: 75px;
	}



	.main01 p,
	.main02 p,
	.main03 p,
	.main04 p,
	.main05 p {
		bottom: 30px;
	}


}

/* ==========================================================================
	デイリープログラム
========================================================================== */
span.kiwi.daily-text {
	font-size: 1.8rem;
	font-weight: bold;
}

.daily-text01 {
	text-align: center;
	margin: 0 auto 10px;
	list-style: none;
	padding: 0;
	color: #753d01;
	font-size: 1.6rem;
	font-weight: bold;
	font-family: 'Kiwi Maru', serif;
}

.daily-text02 {
	display: table;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	list-style: none;
	padding: 0;
	color: #753d01;
	font-size: 1.6rem;
	font-family: 'Kiwi Maru', serif;
}

.daily-text03 {
	text-align: right;
	margin-bottom: 10px;
	line-height: 1.6em;
	color: #753d01;
	font-size: 1.6rem;
	font-weight: bold;
	font-family: 'Kiwi Maru', serif;
}

.daily-text04 {
	text-align: left;
	margin-bottom: 10px;
	line-height: 1.6em;
	color: #753d01;
	font-size: 1.6rem;
	font-weight: bold;
	font-family: 'Kiwi Maru', serif;
}

.daily-text05 {
	display: table;
	text-align: left;
	margin-right: auto;
	list-style: none;
	padding: 0;
	color: #753d01;
	font-size: 1.6rem;
	font-family: 'Kiwi Maru', serif;
}

.daily-text06 {
	display: table;
	text-align: left;
	margin-right: auto;
	list-style: none;
	padding: 0;
	color: #753d01;
	padding-top: 5px;
	font-size: 1.2rem;
	font-family: 'Kiwi Maru', serif;
}

.daily-text07 {
	/* display: table; */
	text-align: left;
	margin-right: auto;
	list-style: none;
	padding: 0;
	color: #753d01;
	padding-bottom: 5px;
	font-size: 1.4rem;
	font-family: 'Kiwi Maru', serif;
}

.daily-text08 {
	text-align: center;
	margin-bottom: 10px;
	line-height: 1.6em;
	color: #753d01;
	font-size: 2.4rem;
	font-weight: bold;
	font-family: 'Kiwi Maru', serif;
	background: linear-gradient(transparent 60%, #f3cb8f 60%);
	border-radius: 60% 50% 60% 5%/80% 75% 15% 75%;
	width: 60%;
}

@media screen and (max-width: 900px) {
	.daily-text02 {
		display: table;
		text-align: left;
		margin-left: auto;
		margin-right: auto;
		list-style: none;
		padding: 0;
		color: #753d01;
		font-size: 2.0rem;
		font-family: 'Kiwi Maru', serif;
	}

	.daily-text03 {
		text-align: center;
		margin-bottom: 10px;
		line-height: 1.6em;
		color: #753d01;
		font-size: 2.2rem;
		font-weight: bold;
		font-family: 'Kiwi Maru', serif;
		background: linear-gradient(transparent 60%, #f3cb8f 60%);
		background-color: #f8ecd8 ;
		border-radius: 80% 50% 60% 5%/80% 75% 15% 75%;
	}

	.daily-text08 {
		text-align: center;
		margin-bottom: 10px;
		line-height: 1.6em;
		color: #753d01;
		background: ;
		font-size: 2.4rem;
		font-weight: bold;
		font-family: 'Kiwi Maru', serif;
		background: linear-gradient(transparent 60%, #80cbe2 60%),#f8ecd8;
		border-radius: 80% 50% 60% 5%/80% 75% 15% 75%;
		width: 100%;
	}

	.daily-text04 {
    text-align: center;
    margin-bottom: 10px;
    line-height: 1.6em;
    color: #753d01;
    font-size: 2.2rem;
    font-weight: bold;
    font-family: 'Kiwi Maru', serif;
		background: linear-gradient(transparent 60%, #f3cb8f 60%);
    background-color: #f8ecd8;
    border-radius: 80% 50% 60% 5%/80% 75% 15% 75%;
}

.daily-text05 {
	display: block;
	text-align: center;
	text-align: left;
	margin-right: auto;
	list-style: none;
	padding: 0;
	color: #753d01;
	font-size: 1.8rem;
	font-family: 'Kiwi Maru', serif;
}

}

@media screen and (max-width: 450px) {
	.daily-text02 {
		display: table;
		text-align: left;
		margin-left: auto;
		margin-right: auto;
		list-style: none;
		padding: 0;
		color: #753d01;
		font-size: 1.6rem;
		font-family: 'Kiwi Maru', serif;
	}
}

/* ==========================================================================
	デイリープログラム
========================================================================== */
.t-center {
	text-align: center !important;
}

/* ==========================================================================
	drop down
========================================================================== */
/* link */
.mod_dropnavi ul li a {
	transition-property: border;
	transition-duration: 0.5s;
	transition-timing-function: ease;
	transition-delay: 0s;
}

.mod_dropnavi ul li a:link {
	text-decoration: none;
}

.mod_dropnavi ul li a:visited {
	text-decoration: none;
}

.mod_dropnavi ul li a:hover {
	text-decoration: none;
}

.mod_dropnavi ul li a:active {
	text-decoration: none;
}

/* mod_dropnavi */
.mod_dropnavi>ul {
	width: 920px;
	height: 45px;
	border-bottom: solid 3px #003700;
	background-color: #336600;
}

.mod_dropnavi>ul>li {
	width: 150px;
	float: left;
	position: relative;
	text-align: center;
	line-height: 45px;
	border-right: solid 1px #003700;
}

.mod_dropnavi>ul>li>a {
	display: block;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: solid 3px #003700;
}

.mod_dropnavi>ul>li>a:hover {
	border-bottom: solid 3px #336600;
}

.mod_dropnavi>ul>li>a:active {
	border-bottom: solid 3px #336600;
}

/* mod_dropnavi_child */
.mod_dropnavi .mod_dropnavi_child {
	display: none;
	position: absolute;
	top: 48px;
	left: 0px;
	z-index: 99;
	padding: 12px 0 0 0 !important;
	background: transparent url('img/icon_arrow_01.png') no-repeat 10px 0px !important;
}

.mod_dropnavi .mod_dropnavi_child ul {
	padding: 4px 27px 16px 27px !important;
	background-color: #003700;
}

.mod_dropnavi .mod_dropnavi_child ul li {
	font-size: 90%;
	line-height: 1.3;
	text-align: left;
	margin: 12px 0 0 0 !important;
	white-space: nowrap;
}

.mod_dropnavi .mod_dropnavi_child ul li a {
	padding: 0 0 0 12px !important;
	display: inline-block;
	background: transparent url('img/icon_arrow_02.png') no-repeat left 5px !important;
}

.mod_dropnavi .mod_dropnavi_child ul li a:link {
	color: #FFF;
	text-decoration: none;
}

.mod_dropnavi .mod_dropnavi_child ul li a:visited {
	color: #FFF;
	text-decoration: none;
}

.mod_dropnavi .mod_dropnavi_child ul li a:hover {
	color: #FFF;
	text-decoration: underline;
}

.mod_dropnavi .mod_dropnavi_child ul li a:active {
	color: #FFF;
	text-decoration: underline;
}





/* ==========================================================================
	top_news
========================================================================== */
/* #top_news{
	position:relative;
	padding:200px 0 240px;
	box-sizing:border-box;
	background:url(../image/top_news_bg.png) top center no-repeat #f6f6f6;
	}
#top_news:before{
	content:"";display:block;
	width:244px;height:145px;
	background:url(../image/top_news_illust.png);
	background-size:cover;
	position:absolute;
	left:0;
	right:0;margin:auto;
	top:20px;
	z-index:600;
	}
#top_news:after{
	content:"";display:block;
	position:absolute;
	width:100%;
	height:160px;
	bottom:0;
	background:url(../image/top_about_tpbg.png) bottom center repeat-x;
	}


	
#top_news .illust_area{
	position:absolute;
	overflow:hidden;
	top:-15px;left:0;right:0;
	width:100%;height:250px;
	z-index:100;
	} */
/* #top_news .illust_area img{display:block;position:absolute; z-index:150;}

#top_news .illust_area .lgrn{width:265px; top:0; right:calc(50% + 430px);}
#top_news .illust_area .rgrn{width:181px; top:0; left:calc(50% + 510px);}

@media screen and ( max-width: 1200px ) {
	
#top_news .illust_area .lgrn{width:265px; top:0; right:auto; left:-100px;}
#top_news .illust_area .rgrn{width:181px; top:0; left:auto; right:-100px;}
	} */



/* #top_news ul{
	width:calc(100% - 30px);
	max-width:1080px;
	margin:10px auto 0;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	} */

/* #top_news ul li{width:240px;
  transition: transform 0.5s ease;}
#top_news ul li:nth-child(2),
#top_news ul li:nth-child(3){margin-top:50px;}



#top_news ul li:hover{transform: translateY(-10px);}


#top_news ul li a{display:block;}
#top_news ul li a:hover{display:block;
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;}



#top_news ul li .img_area{
	width:100%;
	-moz-border-radius: 10px 10px 0 0;
	-webkit-border-radius: 10px 10px 0 0;
	border-radius: 10px 10px 0 0;
	height:160px;
	background-position:center center;
	background-size:cover;
	}
#top_news ul li .text_area{
	position:relative;
	width:100%;
	background:#fff;
	-moz-border-radius: 0 0 10px 10px;
	-webkit-border-radius: 0 0 10px 10px;
	border-radius: 0 0 10px 10px;
	padding:30px 20px 20px;
	box-sizing:border-box;
}
#top_news ul li .text_area span{
	font-size:12px;
	color:#999;
	}
	
#top_news ul li .text_area h2{
	font-size:16px;
	font-weight:700;
	color:#0d6fb8;
	letter-spacing:0.04em;
	margin:8px 0 18px;
	}
#top_news ul li .text_area p{
	font-size:14px;
	line-height:22px;
	letter-spacing:0.04em;
	color:#666;
	font-weight:400;
    word-break: break-all;
	}
	
#top_news ul li:hover p{color:#0d6fb8;transition: color 0.5s ease;}
	
#top_news ul li .text_area:before{
	content:"";
	display:inline-block;
	position:absolute;
	left:20px;top:-15px;
	padding:10px 14px 9px;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	color:#fff;
	font-size:12px;
	font-weight:700;	
	}
	
#top_news ul li.cate1 .text_area:before{content:"園だより";background:#036eb6;}
#top_news ul li.cate2 .text_area:before{content:"今日のどろんこ";background:#f3aaa9;}
#top_news ul li.cate3 .text_area:before{content:"園長先生の「今日の一曲」";background:#6bba6e;}
#top_news ul li.cate4 .text_area:before{content:"お知らせ";background:#999999;} */



/* @media screen and ( max-width: 1050px ) {#top_news ul li{width:23%; }}
@media screen and ( max-width: 900px ) {
#top_news ul li{width:48%; }
#top_news ul li:nth-child(2),
#top_news ul li:nth-child(3){margin-top:0;}
#top_news ul li,
#top_news ul li:nth-child(2){margin-bottom:4%; }
	
	
	
#top_news ul li .img_area{position:relative;height:auto;}
#top_news ul li .img_area:before{content:"";display:block;padding-top:65%;}
	} */
@media screen and (max-width: 800px) {

	/* #top_news{
	position:relative;
	padding:117px 0 75px;
	box-sizing:border-box;
	background:url(../image/top_news_bgsp.png) top center repeat-y #f6f6f6;
	background-size:780px 550px;
	}
#top_news:before{
	width:138px;height:82px;
	background:url(../image/top_news_illust.png);
	background-size:cover;
	position:absolute;
	left:0;
	right:0;margin:auto;
	top:15px;
	z-index:100;
	}

#top_news:after{height:62px;background:url(../image/top_about_tpbg_sp.png) bottom center repeat-x;background-size:509px 62px;	}	
	

	
#top_news .illust_area{top:15px;height:100px;}

#top_news .illust_area .lgrn{width:101px; top:0; left:-30px;}
#top_news .illust_area .rgrn{width:71px; top:0; right:-30px;}

#top_news ul{width:calc(100% - 30px);margin:25px auto 0;}
#top_news ul li{width:calc(50% - 10px); margin-bottom:20px;}
#top_news ul li .img_area{
	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
	}
#top_news ul li .text_area{
	-moz-border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
	padding:15px 12px 20px;
}
#top_news ul li .text_area span{font-size:10px;}
	
#top_news ul li .text_area h2{
	font-size:13px;
	line-height:1.5;
	margin:4px 0 2px;
	}
#top_news ul li .text_area p{font-size:11px;line-height:16px;}
	
#top_news ul li .text_area:before{
	left:12px;top:-12px;
	padding:5px 8px 5px;
	font-size:10px;
	}	
	
	
#top_news ul li:hover{transform: translateY(-5px);}
	
	} */



	/* ==========================================================================
	top_about
========================================================================== */
	/* #top_about{
	position:relative;
	padding-top:115px;
	margin-bottom:108px;
	}
	
	
	
#top_about .illust_area{
	position:absolute;
	overflow:hidden;
	top:-90px;left:0;right:0;
	width:100%;height:400px;
	}
#top_about .illust_area img{display:block;position:absolute; z-index:150;}

#top_about .illust_area .lgrn{width:265px; top:0; right:calc(50% + 430px);}

#top_about .illust_area .lleaf{width:29px; top:360px; right:calc(50% + 588px);}
#top_about .illust_area .rleaf{width:35px; top:135px; right:calc(50% + 422px);}

#top_about .illust_area .lbird{width:126px; top:200px; left:calc(50% + 366px);}
#top_about .illust_area .rbird{width:62px; top:170px; left:calc(50% + 523px);} */


	@media screen and (max-width: 1200px) {

		/* #top_about .illust_area .lgrn{width:265px; top:0; right:auto; left:-100px;} */
	}



	/* #top_about:before{
	content:"";display:block;
	width:223px;height:140px;
	background:url(../image/top_about_illust.png);
	background-size:cover;
	position:absolute;
	left:0;
	right:0;margin:auto;
	top:-85px;
	z-index:600;
	}
	
.top_about_inr{
	width:100%;
	background:url(../image/top_about_bg.jpg) top center no-repeat;
	overflow:hidden;
	position:relative;
	}

.top_about_inr .about_trbox{
	width:calc(100% - 30px);
	max-width:1080px;
	position:relative;	
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background:#fff;
	margin:30px auto 10px;
	padding:20px 20px 30px;
	box-sizing:border-box;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	}
.top_about_inr .about_trbox .trbox{
	width:32.7%;
	display:block;
	position:relative;
	}


.top_about_inr .about_trbox .trbox .img_area{
	width:100%;
	position:relative;
	z-index: 1;
	}

.top_about_inr .about_trbox .trbox .img_area .img_inr{
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	z-index: 1;
	position:relative;
	background-size:cover;
	background-position:center center;
	overflow:hidden;
	
	} */
	/*
.top_about_inr .about_trbox .trbox .img_area:before{
	content:"";
	display:block;
	padding-top:76.47%;
	}
*/




	.top_about_inr .about_trbox .trbox h2 {
		font-size: 37px;
		color: #0d6fb8;
		font-weight: 700;
		margin: 40px 0 20px;
		text-align: center;
	}

	.top_about_inr .about_trbox .trbox h2 span {
		font-weight: 400;
		color: #0d6fb8;
	}

	.top_about_inr .about_trbox .trbox p {
		font-size: 15px;
		line-height: 26px;
		width: calc(100% - 30px);
		padding-left: 20px;
		margin-bottom: 14px;
		color: #333;
	}



	/*	
.top_about_inr .about_trbox .trbox.box01 .img_area{background-image:url(../image/trbox_img01.jpg);}
*/
	.top_about_inr .about_trbox .trbox.box01 .img_area:after {
		content: "";
		display: block;
		width: 73px;
		height: 62px;
		position: absolute;
		z-index: 5;
		left: 0;
		right: 0;
		bottom: -25px;
		margin: auto;
		background: url(../image/trbox_icon01.png);
		background-size: cover;
	}

	.top_about_inr .about_trbox .trbox.box01 h2 {
		font-size: 38px;
	}

	.top_about_inr .about_trbox .trbox.box01 h2 span {
		font-size: 42px;
		letter-spacing: -0.14em;
	}

	.top_about_inr .about_trbox .trbox.box01 h2 span.stxt {
		font-size: 31px;
		letter-spacing: -0.04em;
	}

	/*
.top_about_inr .about_trbox .trbox.box02 .img_area{background-image:url(../image/trbox_img02.jpg);}
*/
	.top_about_inr .about_trbox .trbox.box02 .img_area:after {
		content: "";
		display: block;
		width: 65px;
		height: 78px;
		position: absolute;
		z-index: 5;
		left: 0;
		right: 0;
		bottom: -25px;
		margin: auto;
		background: url(../image/trbox_icon02.png);
		background-size: cover;
	}

	.top_about_inr .about_trbox .trbox.box02 h2 {
		font-size: 37px;
	}

	.top_about_inr .about_trbox .trbox.box02 h2 span {
		font-size: 41px;
		letter-spacing: -0.09em;
	}

	.top_about_inr .about_trbox .trbox.box02 h2 span.stxt {
		font-size: 31px;
		letter-spacing: -0.08em;
	}


	/*
.top_about_inr .about_trbox .trbox.box03 .img_area{background-image:url(../image/trbox_img03.jpg);}
*/
	.top_about_inr .about_trbox .trbox.box03 .img_area:after {
		content: "";
		display: block;
		width: 59px;
		height: 64px;
		position: absolute;
		z-index: 5;
		left: calc(50% - 24px);
		bottom: -20px;
		margin: auto;
		background: url(../image/trbox_icon03.png);
		background-size: cover;
	}

	.top_about_inr .about_trbox .trbox.box03 h2 {
		font-size: 37px;
	}

	.top_about_inr .about_trbox .trbox.box03 h2 span {
		font-size: 41px;
		letter-spacing: -0.08em;
	}

	.top_about_inr .about_trbox .trbox.box03 h2 span.stxt {
		font-size: 31px;
		letter-spacing: -0.08em;
	}



	.top_about_inr .about_trbox .trbox .link_btn {
		width: 100%;
		max-width: 300px;

	}

	.top_about_inr .about_trbox .trbox:hover .link_btn {
		background: #ef9998;
		color: #fff;
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}

	.top_about_inr .about_trbox .trbox:hover .link_btn:before {
		right: 15px;
		background: url(../image/btn_ar_af.png);
		background-size: cover;
	}

	.top_about_inr .about_trbox .trbox .img_area img {
		-webkit-transition: transform 0.5s ease;
		-moz-transition: transform 0.5s ease;
		-o-transition: transform 0.5s ease;
		transition: transform 0.5s ease;
	}


	.top_about_inr .about_trbox .trbox:hover .img_area img {

		transform: scale3d(1.1, 1.1, 1.1);
	}






	.top_about_inr .about_bfbox {
		width: calc(100% - 30px);
		max-width: 1080px;
		position: relative;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		background: #fff;
		margin: 0 auto;
		padding: 20px 20px 30px;
		box-sizing: border-box;
		-js-display: flex;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		z-index: 100;
	}

	.top_about_inr .about_bfbox .bfbox {
		width: 19%;
		display: block;
		position: relative;
	}


	.top_about_inr .about_bfbox .bfbox .img_area {
		width: 100%;
		position: relative;
	}

	.top_about_inr .about_bfbox .bfbox .img_area .img_inr {
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		position: relative;
		z-index: 1;
		background-size: cover;
		background-position: center center;
		overflow: hidden;
	}

	.top_about_inr .about_bfbox .bfbox .text_area {
		position: relative;
	}


	.top_about_inr .about_bfbox .bfbox h2 {
		font-size: 18px;
		color: #0d6fb8;
		font-weight: 700;
		margin: 40px 0 12px;
		text-align: center;
	}

	.top_about_inr .about_bfbox .bfbox p {
		font-size: 15px;
		line-height: 22px;
		width: calc(100% - 10px);
		padding-left: 10px;
		margin-bottom: 14px;
		color: #333;
	}


	.top_about_inr .about_bfbox .bfbox.box01 .text_area:after {
		content: "";
		display: block;
		width: 51px;
		height: 51px;
		position: absolute;
		z-index: 5;
		left: 0;
		right: 0;
		top: -72px;
		margin: auto;
		background: url(../image/bfbox_icon01.png);
		background-size: cover;
	}

	.top_about_inr .about_bfbox .bfbox.box02 .text_area:after {
		content: "";
		display: block;
		width: 48px;
		height: 44px;
		position: absolute;
		z-index: 5;
		left: 0;
		right: 0;
		top: -72px;
		margin: auto;
		background: url(../image/bfbox_icon02.png);
		background-size: cover;
	}


	.top_about_inr .about_bfbox .bfbox.box03 .text_area:after {
		content: "";
		display: block;
		width: 60px;
		height: 48px;
		position: absolute;
		z-index: 5;
		left: 0;
		right: 0;
		top: -72px;
		margin: auto;
		background: url(../image/bfbox_icon03.png);
		background-size: cover;
	}

	.top_about_inr .about_bfbox .bfbox.box04 .text_area:after {
		content: "";
		display: block;
		width: 37px;
		height: 58px;
		position: absolute;
		z-index: 5;
		left: 0;
		right: 0;
		top: -77px;
		margin: auto;
		background: url(../image/bfbox_icon04.png);
		background-size: cover;
	}

	.top_about_inr .about_bfbox .bfbox.box05 .text_area:after {
		content: "";
		display: block;
		width: 50px;
		height: 58px;
		position: absolute;
		z-index: 5;
		left: 0;
		right: 0;
		top: -72px;
		margin: auto;
		background: url(../image/bfbox_icon05.png);
		background-size: cover;
	}

	.top_about_inr .about_bfbox .bfbox .link_btn {
		width: calc(100% - 20px);
	}

	.top_about_inr .about_bfbox .bfbox:hover .link_btn {
		background: #ef9998;
		color: #fff;
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}

	.top_about_inr .about_bfbox .bfbox:hover .link_btn:before {
		right: 15px;
		background: url(../image/btn_ar_af.png);
		background-size: cover;
	}

	.top_about_inr .about_bfbox .bfbox .img_area img {
		-webkit-transition: transform 0.5s ease;
		-moz-transition: transform 0.5s ease;
		-o-transition: transform 0.5s ease;
		transition: transform 0.5s ease;
	}


	.top_about_inr .about_bfbox .bfbox:hover .img_area img {
		transform: scale3d(1.1, 1.1, 1.1);
	}



	@media screen and (max-width: 980px) {

		.top_about_inr .about_bfbox .bfbox .link_btn {
			width: 100%;
		}

		.top_about_inr .about_bfbox .bfbox .link_btn:before {
			right: 10px;
		}

		.top_about_inr .about_bfbox .bfbox:hover .link_btn:before {
			right: 5px;
		}



	}




	@media screen and (max-width: 800px) {

		#top_about {
			padding-top: 85px;
			margin-bottom: 45px;
		}

		#top_about:before {
			width: 126px;
			height: 79px;
			background: url(../image/top_about_illust_sp.png);
			background-size: cover;
			top: -22px;
			z-index: 600;
		}

		#top_about:after {
			content: "";
			display: block;
			width: 100%;
			height: 130px;
			background: url(../image/top_about_tpbg_sp.jpg) bottom center no-repeat #fff;
			background-size: 800px 73px;
			position: absolute;
			left: 0;
			right: 0;
			margin: auto;
			top: 85px;
			z-index: 10;
		}


		#top_about .illust_area {
			top: -25px;
			height: 100px;
		}



		/* #top_about .illust_area .lgrn{width:101px; top:0; left:-30px;} */


		.top_about_inr {
			width: 100%;
			background: url(../image/top_about_ctbg_sp.jpg) center 90px repeat-y;
			background-size: 800px 527px;
			overflow: hidden;
			position: relative;
		}

		.top_about_inr:after {
			content: "";
			display: block;
			width: 100%;
			height: 69px;
			background: url(../image/top_about_btbg_sp.jpg) bottom center no-repeat #fff;
			background-size: 800px 69px;
			position: absolute;
			left: 0;
			right: 0;
			margin: auto;
			bottom: 0;
			z-index: 10;
		}

		#top_about h1,
		#top_about .s_tit {
			position: relative;
			z-index: 100;
			margin-top: 5px;
		}

		.top_about_inr .about_trbox {
			z-index: 100;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			border-radius: 5px;
			margin: 26px auto 10px;
			padding: 12px 12px 24px;
		}

		.top_about_inr .about_trbox .trbox {
			width: 100%;
		}

		.top_about_inr .about_trbox .trbox .img_area .img_inr {
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			border-radius: 5px;
		}

		.top_about_inr .about_trbox .trbox h2 {
			margin: 24px 0 15px;
		}

		.top_about_inr .about_trbox .trbox p {
			font-size: 12px;
			line-height: 18px;
			width: calc(100% - 10px);
			padding-left: 10px;
			margin-bottom: 10px;
		}

		.top_about_inr .about_trbox .trbox.box01 .img_area:after {
			width: 61px;
			height: 52px;
			bottom: -22px;
			background: url(../image/trbox_icon01_sp.png);
			background-size: cover;
		}

		.top_about_inr .about_trbox .trbox.box01 h2 {
			font-size: 27px;
		}

		.top_about_inr .about_trbox .trbox.box01 h2 span {
			font-size: 30px;
		}

		.top_about_inr .about_trbox .trbox.box01 h2 span.stxt {
			font-size: 20px;
		}

		.top_about_inr .about_trbox .trbox.box02 {
			margin: 34px 0;
		}

		.top_about_inr .about_trbox .trbox.box02 .img_area:after {
			width: 49px;
			height: 59px;
			position: absolute;
			bottom: -11px;
			background: url(../image/trbox_icon02_sp.png);
			background-size: cover;
		}

		.top_about_inr .about_trbox .trbox.box02 h2 {
			font-size: 27px;
		}

		.top_about_inr .about_trbox .trbox.box02 h2 span {
			font-size: 30px;
		}

		.top_about_inr .about_trbox .trbox.box02 h2 span.stxt {
			font-size: 20px;
		}

		.top_about_inr .about_trbox .trbox.box03 .img_area:after {
			width: 43px;
			height: 48px;
			left: calc(50% - 15px);
			bottom: -13px;
			background: url(../image/trbox_icon03_sp.png);
			background-size: cover;
		}

		.top_about_inr .about_trbox .trbox.box03 h2 {
			font-size: 27px;
		}

		.top_about_inr .about_trbox .trbox.box03 h2 span {
			font-size: 30px;
		}

		.top_about_inr .about_trbox .trbox.box03 h2 span.stxt {
			font-size: 20px;
		}

		.top_about_inr .about_bfbox {
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			border-radius: 5px;
			padding: 12px 12px 3px;
		}

		.top_about_inr .about_bfbox:after {
			content: "";
			display: block;
			width: 32%;
		}

		.top_about_inr .about_bfbox .bfbox {
			width: 32%;
			display: block;
			position: relative;
			margin-bottom: 15px;
		}

		.top_about_inr .about_bfbox .bfbox .img_area .img_inr {
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			border-radius: 5px;
		}

		.top_about_inr .about_bfbox .bfbox h2 {
			font-size: 14px;
			margin: 0 0 8px;
		}

		.top_about_inr .about_bfbox .bfbox p {
			font-size: 12px;
			line-height: 15px;
			width: 100%;
			padding-left: 0;
			margin-bottom: 10px;
		}


		.top_about_inr .about_bfbox .bfbox .text_area {
			padding: 26px 0 0 0;
		}

		.top_about_inr .about_bfbox .bfbox.box01 .text_area:after {
			width: 26px;
			height: 26px;
			top: -10px;
			background: url(../image/bfbox_icon01.png);
			background-size: cover;
		}

		.top_about_inr .about_bfbox .bfbox.box02 .text_area:after {
			width: 24px;
			height: 23px;
			top: -10px;
			background: url(../image/bfbox_icon02_sp.png);
			background-size: cover;
		}


		.top_about_inr .about_bfbox .bfbox.box03 .text_area:after {
			width: 30px;
			height: 25px;
			top: -10px;
			background: url(../image/bfbox_icon03_sp.png);
			background-size: cover;
		}

		.top_about_inr .about_bfbox .bfbox.box04 .text_area:after {
			width: 19px;
			height: 30px;
			top: -10px;
			background: url(../image/bfbox_icon04_sp.png);
			background-size: cover;
		}

		.top_about_inr .about_bfbox .bfbox.box05 .text_area:after {
			width: 25px;
			height: 30px;
			top: -10px;
			background: url(../image/bfbox_icon05_sp.png);
			background-size: cover;
		}

	}


	@media screen and (max-width: 550px) {


		.top_about_inr .about_bfbox .bfbox {
			width: 100%;
			margin-bottom: 22px;
			-js-display: flex;
			display: -webkit-box;
			display: -webkit-flex;
			display: -moz-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-justify-content: space-between;
			justify-content: space-between;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
		}


		.top_about_inr .about_bfbox .bfbox .img_area {
			width: 45%;
			position: relative;
		}


		.top_about_inr .about_bfbox .bfbox .text_area {
			width: calc(55% - 15px);
			padding: 36px 0 0 0;
			margin-left: 15px;
			box-sizing: border-box;
		}

		.top_about_inr .about_bfbox .bfbox.box01 .text_area:after,
		.top_about_inr .about_bfbox .bfbox.box02 .text_area:after,
		.top_about_inr .about_bfbox .bfbox.box03 .text_area:after,
		.top_about_inr .about_bfbox .bfbox.box04 .text_area:after,
		.top_about_inr .about_bfbox .bfbox.box05 .text_area:after {
			top: 0;
		}




	}

	/* ==========================================================================
	howto
========================================================================== */

	#howto {
		width: 100%;
		background: url(../image/pattern.gif) left top;
		padding: 100px 0 95px;
	}

	#howto h1 {
		width: 274px;
		margin: 0 auto;
	}

	#howto .c_txt {
		font-size: 14px;
		line-height: 32px;
		font-weight: 700;
		margin: 42px auto 45px;
		text-align: center;
	}

	#howto_slider {
		width: 100%;
	}


	#howto_slider .sp-slide {
		width: 50%;
		height: 411px;
		padding-top: 10px;
		box-sizing: border-box;
	}

	#howto_slider .sp-slide .slidewrap {
		background: #fff;
		width: 100%;
		height: 400px;
		position: relative;
		-js-display: flex;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	#howto_slider .sp-slide .slidewrap .txt_area {
		position: relative;
		-moz-border-radius: 10px 0 0 10px;
		-webkit-border-radius: 10px 0 0 10px;
		border-radius: 10px 0 0 10px;
		box-sizing: border-box;
		width: 48%;
		padding: 130px 0 0 40px;
		box-sizing: border-box;
		background: #fff;
		-webkit-box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		-moz-box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
	}

	#howto_slider .sp-slide .slidewrap .txt_area .type {
		display: block;
		position: absolute;
		width: 127px;
		left: 30px;
		top: -10px;
	}

	#howto_slider .sp-slide .slidewrap .txt_area p {
		font-size: 14px;
		line-height: 28px;
		margin-top: 15px;
	}

	#howto_slider .sp-slide .slidewrap .txt_area h2 {
		padding-bottom: 20px;
		border-bottom: 4px dotted #2aa830;
	}

	#howto_slider .sp-slide .slidewrap .img_area {
		width: 52%;
		position: relative;
		-moz-border-radius: 0 10px 10px 0;
		-webkit-border-radius: 0 10px 10px 0;
		border-radius: 0 10px 10px 0;
		-webkit-box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		-moz-box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
	}

	#howto_slider .sp-slide .slidewrap .img_area:before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		/*2色パターン*/
		border-top: 200px solid #fff;
		border-right: 45px solid transparent;
		border-bottom: 200px solid transparent;
		border-left: 45px solid #fff;

	}


	#howto_slider .sp-slide .slidewrap.type01 .txt_area h2 {
		width: 263px;
	}

	#howto_slider .sp-slide .slidewrap.type01 .img_area {
		background: url(../image/howto_img01.jpg);
		background-size: cover;
	}


	#howto_slider .sp-slide .slidewrap.type02 .txt_area h2 {
		width: 250px;
		border-color: #e33e3a;
	}

	#howto_slider .sp-slide .slidewrap.type02 .img_area {
		background: url(../image/howto_img02.jpg);
		background-size: cover;
	}


	#howto_slider .sp-slide .slidewrap.type03 .txt_area h2 {
		width: 280px;
		border-color: #0b75be;
	}

	#howto_slider .sp-slide .slidewrap.type03 .img_area {
		background: url(../image/howto_img03.jpg);
		background-size: cover;
	}


	#howto_slider .sp-slide .slidewrap.type04 .txt_area h2 {
		width: 226px;
		border-color: #15c39c;
	}

	#howto_slider .sp-slide .slidewrap.type04 .img_area {
		background: url(../image/howto_img04.jpg);
		background-size: cover;
	}


	#howto_slider .sp-slide .slidewrap.type05 .txt_area {
		width: 52%;
	}

	#howto_slider .sp-slide .slidewrap.type05 .txt_area h2 {
		width: 100%;
		max-width: 311px;
		border-color: #f5c400;
	}

	#howto_slider .sp-slide .slidewrap.type05 .img_area {
		width: 48%;
		background: url(../image/howto_img05.jpg);
		background-size: cover;
	}


	#howto_slider .sp-slide .slidewrap.type06 .txt_area h2 {
		width: 203px;
		border-color: #ee780f;
	}

	#howto_slider .sp-slide .slidewrap.type06 .img_area {
		background: url(../image/howto_img06.jpg);
		background-size: cover;
	}


	@media screen and (max-width: 800px) {

		#howto {
			padding: 50px 0 45px;
		}

		#howto h1 {
			width: 200px;
			margin: 0 auto;
		}

		#howto .c_txt {
			font-size: 13px;
			line-height: 26px;
			margin: 20px auto 25px;
			width: calc(100% - 30px);
		}

		#howto_slider .sp-slide {
			height: 285px;
			padding-top: 5px;
		}

		#howto_slider .sp-slide .slidewrap {
			height: 275px;
			display: blockl;
		}

		#howto_slider .sp-slide .slidewrap .txt_area {
			width: calc(46% + 50px);
			height: 275px;
			position: absolute;
			left: 0;
			top: 0;
			padding: 75px 0 0 15px;
			z-index: 100;
			-moz-border-radius: 0;
			-webkit-border-radius: 0;
			border-radius: 0;
		}

		#howto_slider .sp-slide .slidewrap .txt_area .type {
			width: 75px;
			left: 20px;
			top: -5px;
		}

		#howto_slider .sp-slide .slidewrap .txt_area p {
			font-size: 13px;
			line-height: 26px;
			margin-top: 10px;
		}

		#howto_slider .sp-slide .slidewrap .txt_area h2 {
			padding-bottom: 15px;
			border-bottom: 3px dotted #2aa830;
		}

		#howto_slider .sp-slide .slidewrap .txt_area h3 {
			font-size: 16px;
			font-weight: bold;
			line-height: 24px;
			padding-bottom: 10px;
			border-bottom: 3px dotted #2aa830;
			letter-spacing: 0.04em;
		}

		#howto_slider .sp-slide .slidewrap .txt_area h3 span {
			font-size: 13px;
			font-weight: bold;
			letter-spacing: 0.04em;
		}

		#howto_slider .sp-slide .slidewrap .img_area {
			width: calc(52% - 50px);
			height: 275px;
			position: absolute;
			right: 0;
			-moz-border-radius: 0;
			-webkit-border-radius: 0;
			border-radius: 0;
		}

		#howto_slider .sp-slide .slidewrap .img_area:before {
			content: "";
			display: block;
			position: absolute;
			left: 0;
			/*2色パターン*/
			border-top: 137.5px solid #fff;
			border-right: 25px solid transparent;
			border-bottom: 137.5px solid transparent;
			border-left: 25px solid #fff;

		}


		#howto_slider .sp-slide .slidewrap.type01 .txt_area h3 {
			width: 100%;
			max-width: 165px;
		}

		#howto_slider .sp-slide .slidewrap.type01 .img_area {
			background: url(../image/howto_img01.jpg);
			background-size: cover;
		}


		#howto_slider .sp-slide .slidewrap.type02 .txt_area h3 {
			width: 100%;
			max-width: 164px;
			border-color: #e33e3a;
		}

		#howto_slider .sp-slide .slidewrap.type02 .img_area {
			background: url(../image/howto_img02.jpg);
			background-size: cover;
		}


		#howto_slider .sp-slide .slidewrap.type03 .txt_area h3 {
			max-width: 170px;
			width: 100%;
			border-color: #0b75be;
		}

		#howto_slider .sp-slide .slidewrap.type03 .img_area {
			background: url(../image/howto_img03.jpg);
			background-size: cover;
		}


		#howto_slider .sp-slide .slidewrap.type04 .txt_area h3 {
			width: 100%;
			max-width: 150px;
			border-color: #15c39c;
		}

		#howto_slider .sp-slide .slidewrap.type04 .img_area {
			background: url(../image/howto_img04.jpg);
			background-size: cover;
		}


		#howto_slider .sp-slide .slidewrap.type05 .txt_area {
			width: 55%;
		}

		#howto_slider .sp-slide .slidewrap.type05 .txt_area h2 {
			width: 100%;
			max-width: 211px;
		}

		#howto_slider .sp-slide .slidewrap.type05 .img_area {
			width: 45%;
			background: url(../image/howto_img05.jpg);
			background-size: cover;
		}


		#howto_slider .sp-slide .slidewrap.type06 .txt_area h3 {
			width: 100%;
			max-width: 135px;
			border-color: #ee780f;
		}

		#howto_slider .sp-slide .slidewrap.type06 .img_area {
			background: url(../image/howto_img06.jpg);
			background-size: cover;
		}


	}


	/* ==========================================================================
	top_info
========================================================================== */
	#top_info {
		width: 100%;
		background: #fff;
		position: relative;
	}

	#top_info h1 {
		width: 144px;
		margin: 0 auto;
	}

	/*
#top_info ul{
	width:calc(100% - 30px);
	margin:45px auto 10px;
	max-width:1100px;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	}

#top_info ul li{
	width:48.63%;
	margin-bottom:40px;
	}
#top_info ul li a{
	position:relative;
	display:block;
	width:100%;
	}
#top_info ul li a:after{
	content:"";
	display:block;
	clear:both;
	}
#top_info ul li a .img_area{
	width:160px;
	height:160px;
	float:left;
	background-size:cover;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	}
#top_info ul li.new a .img_area:before{
	content:"";
	display:block;
	width:53px;
	height:45px;
	position:absolute;
	left:5px;
	top:-5px;
	background:url(../image/info_new.png);
	background-size:cover;
	}
	
	

#top_info ul li .text_area{
	width:calc(100% - 184px);
	float:right;
	padding-top:11px;
	}
#top_info ul li .text_area .day{
	font-size:14px;
	position:relative;
	}
#top_info ul li .text_area .day:after{
	content:"";
	display:block;
	position:absolute;
	width:132px;
	height:24px;
	left:100px;
	top:-6px;
	background-size:cover;
	}
#top_info ul li .text_area h2{
	font-size:16px;
	font-wieght:700;
	line-height:1.5;
	margin:15px 0 12px;
	width:100%;
	color:#252525;
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis;
	}
#top_info ul li .text_area p{
	font-size:12px;
	line-height:26px;
	color:#8c8c8c;
	font-weight:700;
	}
	
#top_info ul .news .text_area .day{
	color:#2aa830;
	}
#top_info ul .news .text_area .day:after{
	background-image:url(../image/info_news_stit.png);
	}
	
#top_info ul .note .text_area .day{
	color:#0b75be;
	}
#top_info ul .note .text_area .day:after{
	background-image:url(../image/info_note_stit.png);
	}
	
	
#top_info ul .event .text_area .day{
	color:#ee780f;
	}
#top_info ul .event .text_area .day:after{
	background-image:url(../image/info_event_stit.png);
	}
	
	
#top_info ul .column .text_area .day{
	color:#272727;
	}
#top_info ul .column .text_area .day:after{
	background-image:url(../image/info_column_stit.png);
	}
	
*/


	#top_info .news_wrap {
		width: calc(100% - 30px);
		margin: 45px auto 10px;
		max-width: 1100px;
		-js-display: flex;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	#top_info .l_con,
	#top_info .r_con {
		width: 48.63%;
	}

	#top_info .news,
	#top_info .event,
	#top_info .note,
	#top_info .column {
		margin-bottom: 40px;
	}

	#top_info .news_wrap a {
		position: relative;
		display: block;
		width: 100%;
	}

	#top_info .news_wrap a:after {
		content: "";
		display: block;
		clear: both;
	}

	#top_info .news_wrap a .img_area {
		width: 160px;
		height: 160px;
		float: left;
		background-size: cover;
		background-position: center center;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
	}

	#top_info .news_wrap .new a .img_area:before {
		content: "";
		display: block;
		width: 53px;
		height: 45px;
		position: absolute;
		left: 5px;
		top: -5px;
		background: url(../image/info_new.png);
		background-size: cover;
	}



	#top_info .news_wrap .text_area {
		width: calc(100% - 184px);
		float: right;
		padding-top: 11px;
	}

	#top_info .news_wrap .text_area .day {
		font-size: 14px;
		position: relative;
	}

	#top_info .news_wrap .text_area .day:after {
		content: "";
		display: block;
		position: absolute;
		width: 132px;
		height: 24px;
		left: 100px;
		top: -6px;
		background-size: cover;
	}

	#top_info .news_wrap .text_area h2 {
		font-size: 16px;
		font-wieght: 700;
		line-height: 1.5;
		margin: 15px 0 12px;
		width: 100%;
		color: #252525;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	#top_info .news_wrap .text_area p {
		font-size: 12px;
		line-height: 26px;
		color: #8c8c8c;
		font-weight: 700;
	}

	#top_info .news_wrap .news .text_area .day {
		color: #2aa830;
	}

	#top_info .news_wrap .news .text_area .day:after {
		background-image: url(../image/info_news_stit.png);
	}

	#top_info .news_wrap .note .text_area .day {
		color: #0b75be;
	}

	#top_info .news_wrap .note .text_area .day:after {
		background-image: url(../image/info_note_stit.png);
	}


	#top_info .news_wrap .event .text_area .day {
		color: #ee780f;
	}

	#top_info .news_wrap .event .text_area .day:after {
		background-image: url(../image/info_event_stit.png);
	}


	#top_info .news_wrap .column .text_area .day {
		color: #272727;
	}

	#top_info .news_wrap .column .text_area .day:after {
		background-image: url(../image/info_column_stit.png);
	}

	#top_info .link_btn img {
		width: 131px;
	}


	@media screen and (max-width: 800px) {


		#top_info {
			padding-top: 20px;
		}

		#top_info h1 {
			width: 100px;
			margin: 0 auto;
		}

		#top_info .news_wrap {
			width: calc(100% - 30px);
			margin: 35px auto 10px;
			max-width: 1100px;
			-js-display: flex;
			display: -webkit-box;
			display: -webkit-flex;
			display: -moz-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-justify-content: space-between;
			justify-content: space-between;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
		}

		#top_info .l_con,
		#top_info .r_con {
			width: 100%;
		}

		#top_info .news,
		#top_info .event,
		#top_info .note,
		#top_info .column {
			margin-bottom: 15px;
		}

		#top_info .news_wrap a {
			position: relative;
			display: block;
			width: 100%;
		}

		#top_info .news_wrap a .img_area {
			width: 110px;
			height: 110px;
		}

		#top_info .news_wrap .new a .img_area:before {
			width: 47px;
			height: 40px;
		}


		#top_info .news_wrap .text_area {
			width: calc(100% - 125px);
			float: right;
			padding-top: 5px;
		}

		#top_info .news_wrap .text_area .day {
			font-size: 12px;
			position: relative;
		}

		#top_info .news_wrap .text_area .day:after {
			content: "";
			display: block;
			position: absolute;
			width: 87px;
			height: 16px;
			left: 75px;
			top: -3px;
			background-size: cover;
		}

		#top_info .news_wrap .text_area h2 {
			font-size: 14px;
			margin: 12px 0 8px;
			width: 100%;
			color: #252525;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}

		#top_info .news_wrap .text_area p {
			font-size: 11px;
			line-height: 20px;
		}

		/*
#top_info ul{
	width:calc(100% - 30px);
	margin:35px auto 10px;
	max-width:1100px;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	}

#top_info ul li{
	width:100%;
	margin-bottom:15px;
	}
#top_info ul li a{
	position:relative;
	display:block;
	width:100%;
	}
#top_info ul li a .img_area{
	width:110px;
	height:110px;
	}
#top_info ul li.new a .img_area:before{
	width:47px;
	height:40px;
	}
	
	
#top_info ul li .text_area{
	width:calc(100% - 125px);
	float:right;
	padding-top:5px;
	}
#top_info ul li .text_area .day{
	font-size:12px;
	position:relative;
	}
#top_info ul li .text_area .day:after{
	content:"";
	display:block;
	position:absolute;
	width:87px;
	height:16px;
	left:75px;
	top:-3px;
	background-size:cover;
	}
#top_info ul li .text_area h2{
	font-size:14px;
	margin:12px 0 8px;
	width:100%;
	color:#252525;
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis;
	}
#top_info ul li .text_area p{
	font-size:11px;
	line-height:20px;
}
	*/
		#top_info .link_btn {

			width: calc(100% - 30px);
			margin-bottom: 30px;
		}

		#top_info .link_btn img {
			width: 105px;
		}

	}



	/* ==========================================================================
	top_link
========================================================================== */

	#top_link {
		width: 100%;
		position: relative;
		background: url(../image/pattern.gif) left top;
		padding: 100px 0 240px;
		/*
	margin-bottom:240px;
	*/
	}

	#top_link ul {
		width: calc(100% - 30px);
		max-width: 1100px;
		margin: 0 auto 40px;
		-js-display: flex;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	#top_link ul li {
		width: 30.9%;
	}

	#top_link ul li a {
		display: block;
		width: 100%;
		position: relative;
		-webkit-transition: shadow 0.2s ease, transform 0.2s ease;
		-moz-transition: shadow 0.2s ease, transform 0.2s ease;
		-o-transition: shadow 0.2s ease, transform 0.2s ease;
		transition: shadow 0.2s ease, transform 0.2s ease;
	}

	#top_link ul li a:hover {
		transform: translate3d(0, 3px, 0);
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
		-webkit-transition: shadow 0.2s ease, transform 0.2s ease;
		-moz-transition: shadow 0.2s ease, transform 0.2s ease;
		-o-transition: shadow 0.2s ease, transform 0.2s ease;
		transition: shadow 0.2s ease, transform 0.2s ease;

	}


	#top_link ul li .img_area {
		-moz-border-radius: 10px 10px 0 0;
		-webkit-border-radius: 10px 10px 0 0;
		border-radius: 10px 10px 0 0;
		position: relative;
		background-image: url(../image/top_link_conbg1.jpg);
		background-size: cover;
	}

	#top_link ul li:nth-child(2) .img_area {
		background-image: url(../image/top_link_conbg2.jpg);
	}

	#top_link ul li:nth-child(3) .img_area {
		background-image: url(../image/top_link_conbg3.jpg);
	}

	#top_link ul li .img_area:before {
		content: "";
		display: block;
		padding-top: 53%;
	}

	#top_link ul li .img_area:after {
		content: "";
		display: block;
		position: absolute;
		z-index: 100;
		left: 0;
		right: 0;
		margin: auto;
		bottom: -5px;
		width: 139px;
		height: 55px;
		background: url(../image/top_link_icon1.png);
		background-size: cover;
	}

	#top_link ul li:nth-child(2) .img_area:after {
		background: url(../image/top_link_icon2.png);
		background-size: cover;
	}

	#top_link ul li:nth-child(3) .img_area:after {
		background: url(../image/top_link_icon3.png);
		background-size: cover;
	}

	#top_link ul li .text_area {
		position: relative;
		background: #fff;
		padding-top: 18px;
		padding-bottom: 20px;
		text-align: center;
		box-sizing: border-box;
		-moz-border-radius: 0 0 10px 10px;
		-webkit-border-radius: 0 0 10px 10px;
		border-radius: 0 0 10px 10px;
		-webkit-box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		-moz-box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		-webkit-transition: shadow 0.2s ease;
		-moz-transition: shadow 0.2s ease;
		-o-transition: shadow 0.2s ease;
		transition: shadow 0.2s ease;
	}

	#top_link ul li a:hover .text_area {
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
		-webkit-transition: shadow 0.2s ease;
		-moz-transition: shadow 0.2s ease;
		-o-transition: shadow 0.2s ease;
		transition: shadow 0.2s ease;

	}

	#top_link ul li .text_area h2 {
		width: 103px;
		margin: 0 auto 10px;
		z-index: 100;
	}

	#top_link ul li:nth-child(2) .text_area h2 {
		width: 102px;
	}

	#top_link ul li:nth-child(3) .text_area h2 {
		width: 101px;
	}

	#top_link ul li .text_area span {
		font-size: 10px;
		font-weight: 700;
		color: #ee780f;
		text-align: center;
	}

	#top_link ul li .text_area p {
		font-size: 14px;
		line-height: 24px;
		text-align: center;
		margin-top: 16px;
		color: #252525;
	}





	#top_link .bnr_area {
		width: calc(100% - 30px);
		max-width: 1100px;
		margin: 0 auto;
		position: relative;
	}


	#top_link .bnr_area:after {
		content: "";
		display: block;
		clear: both;
	}

	#top_link .bnr_area a {
		display: block;
		/*width:48%;*/
		width: 530px;
		float: right;
		position: relative;
		-webkit-transition: transform 0.2s ease;
		-moz-transition: transform 0.2s ease;
		-o-transition: transform 0.2s ease;
		transition: transform 0.2s ease;
	}

	#top_link .bnr_area a:first-child {
		float: left;
	}

	#top_link .bnr_area a img {
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		-webkit-box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		-moz-box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		box-shadow: 0px 4px 0px 0px rgba(227, 222, 199, 1);
		-webkit-transition: shadow 0.2s ease;
		-moz-transition: shadow 0.2s ease;
		-o-transition: shadow 0.2s ease;
		transition: shadow 0.2s ease;
	}

	#top_link .bnr_area a:hover {
		transform: translate3d(0, 3px, 0);
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
		-webkit-transition: transform 0.2s ease;
		-moz-transition: transform 0.2s ease;
		-o-transition: transform 0.2s ease;
		transition: transform 0.2s ease;

	}

	#top_link .bnr_area a:hover img {
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
		-webkit-transition: shadow 0.2s ease;
		-moz-transition: shadow 0.2s ease;
		-o-transition: shadow 0.2s ease;
		transition: shadow 0.2s ease;

	}




	#loopslidewrap {
		position: relative;
		width: 100%;
		margin-bottom: 240px;
	}

	#loopslidewrap .loop_wrap {
		position: absolute;
		height: 320px;
		width: 100%;
		top: -170px;

	}

	/*ループスライダーの設定*/

	.loopslider {
		margin: 0 auto;
		width: 100%;
		height: 320px;
		text-align: left;
		position: relative;
		overflow: hidden;
	}

	.loopslider ul {
		width: 100%;
		height: 320px;
		float: left;
		display: inline;
		overflow: hidden;
	}

	.loopslider ul li {
		height: 320px;
		float: left;
		margin: 0 10px;
		display: inline;
	}

	.loopslider ul li.img01 {
		width: 392px;
	}

	.loopslider ul li.img02 {
		width: 300px;
	}

	.loopslider ul li.img03 {
		width: 400px;
	}

	.loopslider ul li.img04 {
		width: 300px;
	}

	.loopslider ul li.img05 {
		width: 400px;
	}

	.loopslider ul li.img06 {
		width: 300px;
	}

	/*
.loopslider ul li img{
	width: 217px;
	height: 217px;
	}
	*/
	.loopslider .loopslider_wrap {
		height: 320px !important;
	}


	/*	ClearFixElements */
	/*
.loopslider ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}
*/

	.loopslider ul {
		display: inline-block;
		overflow: hidden;
	}



	@media screen and (max-width: 1100px) {
		#top_link .bnr_area a {
			width: 48%;
			margin-bottom: 25px;
		}
	}

	@media screen and (max-width: 800px) {

		#top_link {
			padding: 55px 0 105px;
		}

		#top_link ul {
			margin: 0 auto;
		}

		#top_link ul li {
			width: 100%;
			margin-bottom: 25px;
		}

		#top_link ul li .img_area:before {
			padding-top: 35%;
		}

		#top_link ul li .img_area:after {
			bottom: -3px;
			width: 78px;
			height: 31px;
		}

		#top_link ul li .text_area {
			padding-top: 9px;
			padding-bottom: 15px;
		}

		#top_link ul li .text_area h2 {
			width: 76px;
		}

		#top_link ul li:nth-child(2) .text_area h2 {
			width: 75px;
		}

		#top_link ul li:nth-child(3) .text_area h2 {
			width: 75px;
		}

		#top_link ul li .text_area p {
			font-size: 13px;
			line-height: 24px;
			margin-top: 10px;
		}

		#top_link .bnr_area a {
			width: 100%;
			float: none;
		}

		#top_link .bnr_area a:first-child {
			float: none;
		}


		#loopslidewrap {
			margin-bottom: 120px;
		}

		#loopslidewrap .loop_wrap {
			height: 160px;
			top: -80px;
		}

		/*ループスライダーの設定*/

		.loopslider,
		.loopslider ul,
		.loopslider ul li {
			height: 160px;
		}

		.loopslider ul li {
			margin: 0 5px;
		}

		.loopslider .loopslider_wrap {
			height: 160px !important;
		}

		.loopslider ul li.img01 {
			width: 196px;
		}

		.loopslider ul li.img02 {
			width: 150px;
		}

		.loopslider ul li.img03 {
			width: 200px;
		}

		.loopslider ul li.img04 {
			width: 150px;
		}

		.loopslider ul li.img05 {
			width: 200px;
		}
	}


	/* ==========================================================================
	top_contact
========================================================================== */
	/*
#top_contact_wrap{
	width:100%;
	max-width:calc(100% - 60px);
	
	position:relative;
	margin:0 auto;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	background:#fff;
	z-index:500;
	
	}
#top_contact{
	width:100%;
	max-width:1160px;
	position:relative;
	padding:0 30px 60px;
	box-sizing:border-box;
	margin:0 auto;

	}
#top_contact h1{
	width:217px;
	margin: 0 auto;
	}
	
#top_contact .c_txt{
	font-size:14px;
	line-height:32px;
	font-weight:bold;
	text-align:center;
	margin-top:40px;
	}
	
	
#top_contact .contact_link{
	width:100%;
	margin:60px auto 100px;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	}

#top_contact .contact_link li{
	width:22.7%;
	border:3px solid #0c0307;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	height:100px;
	position:relative;
	box-sizing:border-box;
	text-align:center;
	-webkit-box-shadow: 2px 2px 2px 1px rgba(227,222,199,1);
    -moz-box-shadow: 2px 2px 2px 1px rgba(227,222,199,1);
    box-shadow: 2px 2px 2px 1px rgba(227,222,199,1);
    -webkit-transition: shadow 0.2s ease,transform 0.2s ease;
    -moz-transition: shadow 0.2s ease,transform 0.2s ease;
    -o-transition: shadow 0.2s ease,transform 0.2s ease;
    transition: shadow 0.2s ease,transform 0.2s ease;
	}

#top_contact .contact_link li:before{
	content:"";
	display:block;
	position:absolute;
	width:80px;
	height:40px;
	background:#fff;
	left:0;
	right:0;
	top:-10px;
	margin:auto;
	}
	
#top_contact .contact_link .link_box1{
	padding-top:33px;
	}
#top_contact .contact_link .link_box1 p{
	font-size:28px;
	color:#0b75be;
	font-style:italic;
	font-weight:700;
}
#top_contact .contact_link .link_box1 p span{
	color:#0c0307;
	}
#top_contact .contact_link .link_box1:before{
	top:-16px;
	background:url(../image/contact_link_box1_icon.png) #fff no-repeat top center;
	background-size:32px 32px;
}
	
#top_contact .contact_link .link_box2{
	padding-top:33px;
	}
#top_contact .contact_link .link_box2 p{
	font-size:28px;
	color:#31be0b;
	font-weight:700;
	}
#top_contact .contact_link .link_box2:before{
	top:-11px;
	background:url(../image/contact_link_box2_icon.png) #fff no-repeat top center;
	background-size:41px 27px;
}
	
#top_contact .contact_link .link_box3 img{
	display:block;
	width:104px;
	height:41px;
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	top:0;
	margin:auto;
	}
#top_contact .contact_link .link_box3 img.pc_off{display:none;}
#top_contact .contact_link .link_box3:before{
	background:url(../image/contact_link_box3_icon.png) #fff no-repeat top center;
	background-size:31px 22px;
}
	
#top_contact .contact_link .link_box4 img{
	display:block;
	width:97px;
	height:16px;
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	top:0;
	margin:auto;
	}
#top_contact .contact_link .link_box4:before{
	top:-16px;
	background:url(../image/contact_link_box4_icon.png) #fff no-repeat top center;
	background-size:30px 36px;
}



#top_contact .contact_link .link_box3:after,
#top_contact .contact_link .link_box4:after{
	content:"";
	display:block;
	position:absolute;
	top:0;
	bottom:0;
	right:20px;
	margin:auto;
	width:11px;
	height:14px;
	background:url(../image/contact_link_box_ar.png);
	background-size:cover;
	}
	
	
	
#top_contact .contact_link .link_box3:hover,
#top_contact .contact_link .link_box4:hover{
    transform: translate3d(2px, 2px, 0);
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    box-shadow: none;
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
	-webkit-transition: shadow 0.2s ease,transform 0.2s ease;
    -moz-transition: shadow 0.2s ease,transform 0.2s ease;
    -o-transition: shadow 0.2s ease,transform 0.2s ease;
    transition: shadow 0.2s ease,transform 0.2s ease;

}


#btm_info:after{
	content:"";
	display:block;
	clear:both;
	}

#btm_info h1{
	width:194px;
	float:left;
	}

#btm_info p{
	float:left;
	padding-top:5px;
	font-size:14px;
	line-height:30px;
	margin-left:30px;
	}
	
#btm_info ul{
	padding-top:30px;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	width:184px;
	float:right;
	}
	
#btm_info ul .fb{
	width:26px;
	}
#btm_info ul .twi{
	width:31px;
	}
#btm_info ul .insta{
	width:25px;
	}
#btm_info ul .line{
	width:25px;
	}
	
.footer_link{
	width:100%;
	box-sizing:border-box;
	margin-top:50px;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	
	}

.footer_link li h2{
	font-size:15px;
	font-weight:bold;
	margin-bottom:30px;
	color:#252525;
	}
	
.footer_link li a{
	display:block;
	color:#000;
	font-size:12px;
	line-height:30px;
	letter-spacing:-0.02em;
	}
	
.footer_link .link_box01{
	width:230px;
	}
.footer_link .link_box01 h2{
 	color:#de1919;
 }	
 
.footer_link .link_box02{
	width:120px;
	}
.footer_link .link_box02 h2{
 	color:#3db143;
 }	
 
.footer_link .link_box03{
	width:100px;
	}
.footer_link .link_box03 h2{
	
 	color:#edb316;
 }	
 
.footer_link .link_box04{
	width:122px;
	}
.footer_link .link_box04 h2{
 	color:#0b75be;
 }	
 
.footer_link .link_box05{
	width:80px;
	}
.footer_link .link_box05 h2{
 	color:#ee780f;
 }	
 
 
.footer_link .link_box06,
.footer_link .link_box07{
	width:100px;
	}
.footer_link .link_box06 h2 a,
.footer_link .link_box07 h2 a{
	font-size:15px;
	font-weight:bold;
	line-height:15px;
 }	
 
.oc{pointer-events: none;}
 
@media screen and ( max-width: 1100px ) {
	
	
#top_contact .contact_link{	padding-left:15px;	padding-right:15px;	box-sizing:border-box;	}

#top_contact .contact_link li{width:48%;}

#top_contact .contact_link li{margin-bottom:20px;}

	
#btm_info{width:100%;box-sizing:border-box;}

}
@media screen and ( max-width: 990px ) {
	
.footer_link .tab_on{display:block;}
.footer_link .tab_off{display:none;}

}
@media screen and ( max-width: 960px ) {
	
#btm_info .cl{display:inline;}
#btm_info ul{float:left;}
.footer_link .link_box01{width:150px; padding-right:10px;box-sizing:border-box;}
.footer_link .link_box02{width:100px;}
.footer_link .link_box03{width:90px;}
	}
	
	
@media screen and ( max-width: 800px ) {
#top_contact_wrap{width:100%;max-width:100%;-moz-border-radius: 0px;-webkit-border-radius: 0px;border-radius:0px;}
.footer_link .tab_on{display:none;}
.footer_link .tab_off{display:block;}

#top_contact{padding:0 0 0px;}
#top_contact h1{width:166px;}
	
#top_contact .c_txt{font-size:13px;line-height:20px;margin-top:25px;}
		
#top_contact .contact_link{	margin:45px auto 40px;	}

#top_contact .contact_link li{width:100%;border:2px solid #0c0307;-moz-border-radius: 65px;-webkit-border-radius: 65px; border-radius: 65px; height:65px; margin-bottom:25px;}


#top_contact .contact_link li p{z-index:300; position:relative;}
#top_contact .contact_link .link_box1{padding-top:20px;	}
#top_contact .contact_link .link_box1 p{font-size:24px;}
#top_contact .contact_link .link_box2{	padding-top:20px;	}
#top_contact .contact_link .link_box2 p{font-size:26px;	}
#top_contact .contact_link .link_box3 img{width:211px;height:17px;}
#top_contact .contact_link .link_box3 img.pc_off{display:inline;}

#btm_info h1{width:113px;float:none;margin:0 auto;}

#btm_info p{float:none;text-align:center;padding:15px 15px 20px;box-sizing:border-box;font-size:12px;line-height:24px;margin-left:0;	}
	
#btm_info ul{padding-top:0px;float:none; margin:0 auto;}
	
	
	
	
.footer_link{margin-top:0;padding:0;}
	
.footer_link li .btm_toggle{display:none;}
	
.footer_link li h2{	font-size:14px;	margin-bottom:0px; padding: 17px 0; border-bottom: 1px solid #4e4e4e; margin: 0; position:relative; text-align: center; cursor:pointer;}
	
.footer_link li a{padding: 15px 0; border-bottom: 1px solid #4e4e4e; text-align:center; line-height:20px;}
	
.footer_link li h2:before{content:"+";display:block;position:absolute;top:12px;right:17px;color:#999999;font-size:17px;font-weight:nomal;text-align:center;}
.footer_link li h2.active:before{content:"-";}
.footer_link .link_box01{border-top:1px solid #4e4e4e;}
	
	
	
.footer_link .link_box01, 
.footer_link .link_box02,
.footer_link .link_box03, 
.footer_link .link_box04, 
.footer_link .link_box05{
	width:100%;
	padding:0;
	}
.footer_link .link_box06{
	border-right:1px solid #4e4e4e;box-sizing:border-box;
	}
.footer_link .link_box06,
.footer_link .link_box07{
	width:50%;
	}
.footer_link .link_box06 h2,
.footer_link .link_box07 h2{
	padding:0;
	border-bottom:0;
	}
	
.footer_link .link_box06 h2:before,
.footer_link .link_box07 h2:before{	
      content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 20px;
    margin: auto;
    width: 11px;
    height: 14px;
    background: url(../image/contact_link_box_ar.png);
    background-size: cover;}
	
	
.oc{pointer-events: all;}
}