@charset "utf-8";
/*
construction.css
サイト全体で使うレイアウト用のクラス、ヘッダー・フッター・見出し・本文・リスト・テーブルなど、大まかな構造を定義
*/

@media screen and (max-width: 900px) {p{ line-height: 1.7em;}}
#loading{ width: 100%; height: 100vh; position: fixed; background:#fff; ; top: 0; left: 0; z-index: 10000;pointer-events: none; }
#loadingInner{ width: 100px; height: 100px; display: block; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%) ;  -webkit- transform: translateX(-50%) translateY(-50%) ;}
/*btn*/
.btn-conversion{ width: 100%; max-width: 560px;}
/*icon*/
.icon-picchio{ position: relative;}
.icon-picchio::before{ content: ""; width: 30px; height: 30px; background: url(../img/icon_picchio.svg) no-repeat; display: block; margin: 0 auto; margin-bottom: 20px;}
@media screen and (max-width: 900px) {
	.icon-picchio::before{ content: ""; width: 20px; height: 20px; background: url(../img/icon_picchio.svg) no-repeat; background-size: 20px; display: block; margin: 0 auto; margin-bottom: 10px;}
}

/*tag*/
.entrytime{ font-size: 0.8rem; letter-spacing: 0.1em; color: #666; }
.tag-wrap-news{ font-size: 0.8rem;}
.tag-wrap-news span{font-family:"Noto Serif Japanese"; color: #666;}
.category{ display: block; text-align: center; font-size: 0.8rem; }

/*bg-about*/
.bg-about{ background: #e6f0f8;}
.bg-about .list-border{ border-top: 1px solid #fff!important;}
.bg-about .list-border > li { border-bottom: 1px solid #fff!important; }
.bg-about dl.list-vertical.list-border > dd{border-bottom: 1px solid #fff!important;}
.bg-about dl.list-horizontal.list-border  > *{border-bottom: 1px solid #fff!important; padding-top: 10px;}
.bg-about table.table thead th { border-bottom: 1px solid #fff; }
.bg-about table.table tbody th { border-bottom: 1px solid #fff; }
.bg-about table.table tbody td { border-bottom: 1px solid #fff; }

.blog-list{ margin-bottom: 40px;}
.blog-list .text-wrap{ padding-top: 0; }
.blog-list .text-wrap .title5{ margin-bottom: 5px; }

@media screen and (max-width: 900px) {
	.blog-list{ margin-bottom: 20px;}
	.blog-list .text-wrap{ padding-top: 0; margin-bottom: 0;}
}

.npobnr{display: block; padding: 5vw 0 5vw}
.npobnr img{max-width: 100%;}
.npobnr[target="_blank"]:not(.btn):after{display: none;}
#home .npobnr{padding: 0;}

/*///////////////////////////////////////////////////////////

HOME

/////////////////////////////////////////////////////////////*/
#home #main{ background: #000;}
#home #main .pagetitle{  height: 485px;  width: 200px;  display: block; position: absolute; left: 50%; top:50%; padding: 0;
	transform: translateX(-50%) translateY(-50%) ;  -webkit- transform:translateX(-50%) translateY(-50%)  ; z-index: 10;}
#home .title1{display: block; }
#home .title1 img{ position: absolute; left:0; top: 0; width: 100%; height: auto; }
#home .title1 svg path{ opacity: 0;}

.news-category-list{  background: #d9e5ed; border-radius: 5px; display: block; overflow: hidden; padding: 20px 30px; position: relative;}
.news-category-list .title5{ width: 110px; height: -webkit-calc(100% - 40px); height: calc(100% - 40px); border-right: 1px solid #666; color: #666; position: absolute; left:30px; top: 20px; text-align: left;}
.news-category-list .tag-wrap-news{ padding-left: 130px; text-align: left;}
.news-category-list .tag-wrap-news a{display: inline-block;margin-right: 20px;color: #666;}
@media screen and (max-height: 700px) {
	#home #main .pagetitle{  height: 365px;  width: 150px;}
}
@media screen and (max-width: 900px) {
	#home .title1 svg path{ opacity: 1;}
	#home #main .pagetitle{ height: 365px; width: 150px; top:45%;} 
	.news-category-list{ padding: 10px; margin-top: 20px;}
	.news-category-list .title5{ width: auto; border-right:none; display: block; position:relative; left:0; top: 0; text-align: center;}
	.news-category-list .tag-wrap-news{ padding-left: 0;}
	.news-category-list .tag-wrap-news a{ margin-right: 10px; color: #666;}
}


#home #header-wrapper{ background:none;}
#home #container{ padding-top: 0; padding-bottom: 0;}
#home #main{ width: 100%; height: 100vh; display: block;  background-size: cover; position: relative; overflow: hidden;}
#home #main video{ min-height: 100%;
  min-height: 100vh;
  min-width: 100%;
  min-width: 100vw; position: absolute; left: 50%; top: 0; vertical-align: middle; transform: translateX(-50%) ;  -webkit- transform: translateX(-50%) ;}
#home #etcNav{ margin-bottom: 80px;}
#home .slider img{ width: 100%; height: auto;}

#home #etcNav figure.circle{ width: 90%; padding-top: 90%; margin: 0 auto 20px; }
#home #etcNav figure.circle img{ width: 100%; height: auto; -ms-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; -webkit-clip-path: circle(50% at 50% 50%);
clip-path: circle(50% at 50% 50%);}
#home #etcNav a:hover figure.circle img{ transform:translateY(-50%) translateX(-50%) scale(1.05); -webkit-transform:translateY(-50%) translateX(-50%) scale(1.05);}

@media screen and (max-width: 900px) {
	#home #etcNav .layout-M{    display: -webkit-flex!important;
    display: flex!important;
    -webkit-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
    -webkit-box-pack: justify;
    justify-content: space-between;}
	#home #etcNav .layout-M figure.circle{width:120px;padding-top:120px;margin: 0 auto 20px;}
	#home #etcNav .layout-M .text-wrap { display: block; text-align: left; width: calc(100% - 140px); width: -webkit-calc(100% - 140px); margin-left: 20px; margin-right: 0; padding-top: 20px;}
	#home #etcNav .layout-M .text-wrap .title4{font-size: 1rem;}
	#home #etcNav .layout-M .text-wrap .title4 br{ display: none;}
	
	#home a.layout-L .img-wrap .inner img{height: 100%;
    width: auto;
    position: absolute;
    left: 50%;
    top: 50%;transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);}
}


#home-news{ width: 50%; height: 80px; display: block; position: absolute; right: 0; bottom: 0; background: #094a81; color: #fff; z-index: 10;}
#home-news .title{ width: 120px; font-size: 1.4rem; position: relative; padding-left: 30px;box-sizing: border-box; text-align: left; float: left; }
#home-news .title a{font-weight: 100; line-height: 80px; letter-spacing: 0.1em;color: #fff;}
#home-news .topInfoWrap {  width : -webkit-calc(100% - 120px) ;   width : calc(100% - 120px) ; float:right; margin-right: 0; position: relative;}
#home-news ul.news-ticker li a{ line-height:80px; position:relative; display:block; text-align: left; color: #fff;  padding-right: 60px; padding-left: 30px; font-weight: 100;
-ms-transition: all .3s; -webkit-transition: all .3s; transition: all .3s; }

#home-news ul.news-ticker li a:hover{ background: rgba(255,255,255,0.1); text-decoration: none;}

#home-news ul.news-ticker li {width: 100%; display: none;}
#home-news .topInfoWrap .arr-white{ position: absolute; right: 30px; top:40px; transform: translateY(-50%) ;  -webkit-transform: translateY(-50%) ;}

#pickup .layout-L{ margin-bottom: 80px;}
#pickup .layout-L .text-wrap{ position: relative;}
#pickup .layout-L .illust{ position: absolute;}
#pickup .layout-L.naturewatching .illust{width: 140px;height: auto;right: -110px;top: -30px;}
#pickup .layout-L.musasabi .illust{width: 185px;height: auto;left: -190px;top: -68px;}
#pickup .layout-L.hoshizora .illust{width: 170px;height: auto;right: -104px;top: -80px;}
#pickup .layout-L.flower .illust{width: 170px;height: auto;left: -140px;top: -70px;}

@media screen and (max-width: 900px) {
	#home #main video{ display: none;}
	#home .slider img{ width: auto; height:-webkit-calc(100vh - 90px) ;  height:calc(100vh - 90px) ; left: 50%; transform: translateX(-50%);
  -webkit- transform: translateX(-50%); position: absolute;}
	#home .slider::before{ content: ""; width: 100%; height: 100vh; position: absolute; left: 0; top:0; background: rgba(0,0,0,0.15); z-index: 1;}
	#pickup .layout-L{ margin-bottom: 40px;}
	#home #pickup a.layout-L .img-wrap .inner{ padding-top: 70%;}
	#home-news .title a{line-height: 1em; }
	#home-news{ width: 100%; height: auto; padding:5%;}
	#home-news .title{ width: 100%; font-size: 1.2rem; line-height: 1.5em; padding-left:0;float: none; margin-bottom: 10px; }
	#home-news .topInfoWrap {  width :100% ; float:none; }
	#home-news ul.news-ticker li a{ line-height:1.5em; position:relative; display:block; padding-right: 0; padding-left: 0; }
	#home-news ul.news-ticker li {width: 100%; display: none; height:1.5em; padding-right: 20px; overflow: hidden;}
	#home-news .topInfoWrap .arr-white{ position: absolute; right:0; top:10px;}
	#home #etcNav{ margin-bottom: 20px;}
	
	#pickup .layout-L{ border-bottom: 1px solid #ccc;}
	#pickup .layout-L.naturewatching .illust{width: 60px;height: auto;right: -14px;top: -36px;}
	#pickup .layout-L.musasabi .illust{width: 70px;height: auto;left:auto;right: -15px;to;top: -35px;}
	#pickup .layout-L.hoshizora .illust{width: 70px;height: auto;left:auto;right: -12px;top: -30px;}
	#pickup .layout-L.flower .illust{width: 85px;height: auto;left:auto;right: -25px;to;top: -30px;}
	#pickup .layout-L .text-wrap .period{ text-align: center;}
	#pickup .layout-L .btn-arr{ padding-left: 0; margin-bottom: 20px;}
	#pickup .layout-L .btn-arr svg{ position:relative; left: 0; top: 0; margin-right: 5px;}
}

.playmov{ width: 15%; min-width: 240px; display: block; position: absolute; left: 0; bottom: 0; background: #fff; height: 80px; line-height: 80px; z-index: 10;}
.playmov span.playicon{ width: 20px;  height: 20px; display: block; border-radius: 10px;  border: 1px solid #000; position:absolute; left: 30px; top: 30px;  }
.playmov span.playicon svg{ width: 6px; height: auto; position: absolute; left: 50%; top: 50%;  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);}
.playmov span.pc{ display: inline-block!important;}
.playmov:hover{text-decoration: none;}

@media screen and (max-width: 900px) {
	.playmov{ width:80px; height: 90px;  min-width: inherit; line-height: 1.6em; display: block; position: absolute; left: 0; top : -webkit-calc(50% - 45px) ;   top : calc(50% - 45px) ;  transform: translateY(-50%) ;  -webkit- transform: translateY(-50%) ; font-size: 0.8rem; padding-top: 35px;}
	.playmov span.playicon{ width: 15px; height: 15px; top: 15px; left: 50%; transform: translateX(-50%) ;  -webkit- transform: translateX(-50%) ;}
	.playmov span.playicon svg{ width: 4px; height: auto; }
}

#home .home-about-Main{ display: block;  position: relative;}
#home .home-about-Main .img-wrap{ width: 100%; padding-top: 470px; display: block; position:relative; left: 0; top: 0; background:#094a81;  }
#home .home-about-Main .text-wrap{width: 470px;display: block;color: #fff;position: absolute;right: 5%;top:80px;text-align: right;}
#home .home-about-Main .text-wrap .title2{ line-height: 1.6em; margin-bottom: 20px; font-size: 4em;}
#home .home-about-Main img{transform-origin: 50%; -ms-transition: all .5s; -webkit-transition: all .5s; transition: all .5s;}
#home .home-about-Main:hover img{ opacity: 0.8; transform: translateY(-50%) translateX(-50%) scale(1.05); -webkit-transform: translateY(-50%) translateX(-50%) scale(1.05);}


@media screen and (max-width: 1200px) {
	#home .home-about-Main{width: 100%; margin: 0 auto 30px; }
}

@media screen and (max-width: 900px) {
	#home .home-about-Main .img-wrap{width: 100%;padding-top: 49%;display: block;position:relative;left: 0;top: 0;}
	#home .home-about-Main .text-wrap{ background: #e6f0f8; width: 90%; display: block; position:relative; margin: 0 5%; padding: 15px 0 0 0; right:0; top:0; margin-top: -40px; text-align: center;}
	#home .home-about-Main .text-wrap .title2{ line-height: 1.6em; margin-bottom: 10px; color:#000; font-size: 1.1rem;}
	#home .home-about-Main .text-wrap .title2 br{ display: none;}
	#home .home-about-Main .text-wrap *{color:#000;}
	#home .home-about-Main .text-wrap .arr-white .st0{fill:none;stroke:#000;stroke-miterlimit:10;}
}

#home-about{ padding-bottom: 80px;}
#home-about .home-about-list { margin-bottom: 80px;}
#home-about .home-about-list .box-column-size1:first-child{ position: relative;}
#home-about .home-about-list .box-column-size1:first-child .img-wrap{background: #094a81;width: 100%;height: 100%;}
#home-about .home-about-list .box-column-size1:first-child .text-wrap{ width: 260px; display: block; background: #e6f0f8; position: absolute; text-align: left;left: 0; bottom: 0; z-index: 10; padding: 30px 30px 0 0;}
#home-about .home-about-list .box-column-size1:first-child .text-wrap .title3{ margin-bottom: 10px;}

#home-about .home-about-list .box-column-size1:first-child img{transform-origin: 0; -ms-transition: all .5s; -webkit-transition: all .5s; transition: all .5s;}
#home-about .home-about-list .box-column-size1:first-child:hover img{transform: scale(1.05) translateY(-50%) translateX(-50%);-webkit-transform: scale(1.05) translateY(-50%) translateX(-50%);transform-origin: 0;opacity: 0.8;}

#home-about .home-about-list .box-column-size1:last-child ul.list li:last-child{ padding-bottom: 0;}
#home-about .home-about-list .img-wrap.center-p{ padding: 0;}

@media screen and (max-width: 900px) {
	#home-about .home-about-list .box-column-size1:first-child{ margin-bottom: 40px;}
	#home-about .home-about-list .box-column-size1:first-child .img-wrap{ width: 100%; height: 100%; padding-top: 100%;}
	#home-about .home-about-list .box-column-size1:first-child .text-wrap{ width: 70%;}
	#home-about .home-about-list .box-column-size1:first-child .text-wrap{ padding: 5% 5% 0 0;}
	#home-about .contentsSection:last-child{ margin-bottom:0;}
	/*#home-about .list li:nth-child(2n) .layout-S{flex-direction: row-reverse;}*/
	
}

#home #ture-event{ padding-top: 40px;}
@media screen and (max-width: 900px) {
	#home #ture-event{ padding-top: 0; padding-bottom: 20px; border-bottom: 1px solid #ccc;}
	#home #ture-event .mb0{ margin-bottom: 20px!important;}
	#home #ture-event a.layout-M{    display: -webkit-flex!important;  display: flex!important;  -webkit-flex-wrap: wrap!important;
    flex-wrap: wrap!important;    -webkit-box-pack: justify;    justify-content: space-between;}
	#home #ture-event a.layout-M .tag-wrap { text-align: left;}
	#home #ture-event a.layout-M .img-wrap{ width: 120px; height: 0; padding-top: 120px;}
	#home #ture-event a.layout-M .img-wrap img{ height: 100%; width: auto; position: absolute; left: 50%; top: 50%; transform: translateY(-50%) translateX(-50%); -webkit-transform:translateY(-50%) translateX(-50%); margin: 0;}
	#home #ture-event a.layout-M .text-wrap{ width: calc(100% - 140px); width: -webkit-calc(100% - 140px);    text-align: left; margin: 0;}
	#home #ture-event a.layout-M .text-wrap .title3 br{ display: none;}
}


/*///////////////////////////////////////////////////////////

TOUR

/////////////////////////////////////////////////////////////*/

#tour.index #tourList{ text-align: center;	}
#tour.index .title3{ text-align: center;}
#tour.index #container nav.contentsSection{ overflow: hidden;}
#tour.index .nav-tab{ margin-bottom: 0; width: 75%; float: left;}
#tour.index .nav-tab li { width: 25%; }
#tour.index .nav-tab.-item5 li { width: 20%; }
#tour.index .nav-tab li a{ font-size: 1rem;}
#tour.index .program{ width: 25%; display: block; float: right;} 
#tour.index .program a{ display: block; margin-left: 20px; margin-bottom: 5px;}
#tour.index .program a:last-child{margin-bottom: 0;}


#tour.index .filter{ margin-bottom: 40px;}
#tour.index .filter a{ color: #094a81; display: inline-block; margin: 0 10px;}
#tour.index .filter a::before{ content: "";  background-size: 10px;width: 10px; height: 10px; display: inline-block; border: 1px solid #094a81; margin-right: 5px;}



#tour.index .filter a.check::before{ content: ""; background: url(../img/check.svg) no-repeat center; background-size: 10px;width: 10px; height: 10px; display: inline-block; border: 1px solid #094a81; margin-right: 5px;}

@media screen and (max-width: 900px) {
	#tour.index .nav-tab{ margin-bottom: 0; width: 100%; float: none; margin-bottom: 10px;}
	#tour.index .nav-tab li { width: 25%; margin-right: 0%; margin-bottom: 0%; padding: 0; }
	#tour.index .nav-tab li a{font-size: 0.8rem;line-height: 1.5em;padding: 10px 0;}
	#tour.index .filter a{ font-size: 0.8rem; margin: 0 5px;}
	#tour.index .filter a.check::before{ }
	#tour.index .program{ width: 100%; display: block; float: none;} 
#tour.index .program a{ display: block; margin-left: 0; margin-bottom: 5px;}
#tour.index .program a:last-child{margin-bottom: 0;}
	#tour.index .layout-M{ margin-bottom: 40px;}
}

#tour.page #container{ padding-bottom: 0;}
#tour.page #main{padding-top: 35%;position: relative;background-size:cover;background-repeat: no-repeat;background-position: center;background: #006fba;}
#tour.page #main:after{content: "";width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: rgba(0,0,0,0.3);}
#tour.page #main .pageNav{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; height:80px; z-index: 100; position: relative; margin-bottom: 0;}
#tour.page #main .pageNav .priod{ width: 180px; display: block; border: 1px solid #fff; border-bottom: none; color: #fff; padding-top: 15px;}
#tour.page #main .pageNav ul{ width:calc(100% - 360px); width: -webkit-calc(100% - 360px); display: block; padding-right: 180px; padding-left: 180px; background: #fff; text-align: center; position: relative;}
#tour.page #main .pageNav ul li{ display: inline-block; margin: 0 20px;}
#tour.page #main .pageNav ul li a{ line-height: 80px; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#tour.page #main .pageNav ul li.yoyaku { width: 180px; border-radius: 0; position: absolute; margin: 0; right: 0; top: 0;}
#tour.page #main .pageNav ul li.yoyaku a.btn{border-radius: 0;line-height: 78px;padding: 0;border: none;color: #094a81;}
#tour.page .column-flex.box-column2 .box-column-size1{ margin-bottom: 0;}

#tour.page #point .column-flex.box-column2 .box-column-size1 .table{ border-top:#000 solid 1px;}
#tour.page #point .column-flex.box-column2 .box-column-size1 .table th{ width: 20%; }
#tour.page.school #point .wrap,
#tour.page.company #point .wrap{ margin-bottom: 80px;}

body#tour.nature-watching #container article:first-child{ overflow: hidden;}
#tour.page #trees{ z-index: 10;}

#tour.page #trees .tree-left{ content: ""; width: 140px; height:40vh; display: block; position:fixed; left: 0; bottom: 0; z-index: 100; background: url(../img/illust/tree_l.png) repeat-y; background-size: 140px;}
#tour.page #trees .tree-right{ content: ""; width: 140px; height:40vh; display: block;position:fixed; right: 0; bottom: 0; z-index: 100; background: url(../img/illust/tree_r.png) repeat-y; background-size: 140px;}
#tour.page.musasabi #trees .tree-left{ content: ""; width: 140px; height:40vh; display: block; position:fixed; left: 0; bottom: 0; z-index: 100; background: url(../img/illust/tree_l_night.png) repeat-y; background-size: 140px;}
#tour.page.musasabi #trees .tree-right{ content: ""; width: 140px; height:40vh; display: block;position:fixed; right: 0; bottom: 0; z-index: 100; background: url(../img/illust/tree_r_night.png) repeat-y; background-size: 140px;}

#tour.page.musasabi .btn-arr .arr-black .st0 {
    fill: none;
    stroke: #fff;
    stroke-miterlimit: 10;
}

#tour.page.musasabi .contentsSection > *{ z-index: 1;}
#tour.page.musasabi .contentsSection > .illust{ z-index: 0;}

@media screen and (max-width: 1400px) {
	#tour.page #trees .tree-left{ content: ""; width: 70px; height:40vh; display: block; position:fixed; left: 0; bottom: 0; z-index: 0; background: url(../img/illust/tree_l.png) repeat-y; background-size: 70px;}
	#tour.page #trees .tree-right{ content: ""; width: 70px; height:40vh; display: block;position:fixed; right: 0; bottom: 0; z-index: 0; background: url(../img/illust/tree_r.png) repeat-y; background-size: 70px;}
	#tour.page.musasabi #trees .tree-left{ content: ""; width: 70px; height:40vh; display: block; position:fixed; left: 0; bottom: 0; z-index: 0; background: url(../img/illust/tree_l_night.png) repeat-y; background-size: 70px;}
	#tour.page.musasabi #trees .tree-right{ content: ""; width: 70px; height:40vh; display: block;position:fixed; right: 0; bottom: 0; z-index: 0; background: url(../img/illust/tree_r_night.png) repeat-y; background-size: 70px;}
}

@media screen and (max-width: 900px) {
	#tour.page #trees{ z-index: 0; opacity: 0.3;}
	#tour.page .contentsSection{ position: relative; z-index: 1;}
	#tour.page #trees .tree-left{ content: ""; width: 35px; height:40vh; display: block; position:fixed; left: 0; bottom: 0; z-index: 0; background: url(../img/illust/tree_l.png) repeat-y; background-size: 35px;}
	#tour.page #trees .tree-right{ content: ""; width: 35px; height:40vh; display: block;position:fixed; right: 0; bottom: 0; z-index: 0; background: url(../img/illust/tree_r.png) repeat-y; background-size: 35px;}
	#tour.page.musasabi #trees .tree-left{ content: ""; width: 35px; height:40vh; display: block; position:fixed; left: 0; bottom: 0; z-index: 0; background: url(../img/illust/tree_l_night.png) repeat-y; background-size: 35px;}
	#tour.page.musasabi #trees .tree-right{ content: ""; width: 35px; height:40vh; display: block;position:fixed; right: 0; bottom: 0; z-index: 0; background: url(../img/illust/tree_r_night.png) repeat-y; background-size: 35px;}
	#tour.page #point .column-flex.box-column2 .box-column-size1 .table th{width: 35%;}

}

/*title*/
#tour.page .pagetitle{ color: #fff; padding-top: 0; position: absolute; left: 50%; top:-webkit-calc(50% - 45px); top:calc(50% - 45px);  transform: translateX(-50%) translateY(-50%) ;  -webkit- transform: translateX(-50%) translateY(-50%) ;  z-index: 10;}
#tour.page .pagetitle .title2{ margin-bottom: 30px;}
#tour.page .pagetitle .tag-wrap{ margin-bottom: 0;}
#tour.page .pagetitle .tag-wrap span:first-child{border-left: 1px solid #fff!important;}
#tour.page .pagetitle .tag-wrap span{border-right: 1px solid #fff!important;line-height: 1.8em;padding: 0 1em;font-family:"Noto Serif Japanese";}
#tour .title3{ text-align: left;}
#tour #introduction .img-wrap{ position: relative; width: 100%; padding-top: 44%; overflow:hidden;}
#tour #introduction .img-wrap img{ width: 100%; height: auto; position: absolute; left: 0; top: 50%; transform: translateY(-50%) ;  -webkit- transform: translateY(-50%) ;}
#tour #introduction .column-flex.box-column3.lay-etc{
    display: -webkit-flex!important;
    display: flex!important;
    -webkit-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
    -webkit-box-pack: justify;
    justify-content: center;
}
#tour #introduction .column-flex.box-column3.lay-etc > .box-column-size1{ margin-right: 39px;}
#tour #introduction .column-flex.box-column3.lay-etc > .box-column-size1:last-of-type{ margin-right: 0;}

@media screen and (max-width: 900px) {
	#tour.page #main{ padding-top: 70%; margin-bottom: 20px;}
	#tour.page .pagetitle .title2{ margin-bottom: 20px;}
	#tour.page .pagetitle{ width: 90%; display: block;}
	#tour.page .pagetitle .title2{ margin-bottom: 30px;}
	
	
	#tour.page #main .pageNav{ height:50px;}
	#tour.page #main .pageNav .priod{ width: 100%; padding: 10px; height: 50px; overflow: hidden;}
	#tour.page #main .pageNav .priod br{ display: none;}
	#tour.page #main .pageNav ul{ width: 100%; padding-right: 0; padding-left: 0; height: 50px; overflow: hidden;}
	#tour.page #main .pageNav ul li{ display: none;}
	#tour.page #main .pageNav ul li.yoyaku { width: 100%; display: block; position: relative;}
	#tour.page #main .pageNav ul li.yoyaku a.btn{ line-height: 50px!important;}
	#tour.page #container .column-flex .box-column-size1{ width: 100%;}
	#tour.page .nav-tab li{ width: 20%; }
	#tour.page .nav-tab li span.sp.disblo{font-weight: bold; font-size: 0.7em; line-height: 1em; padding: 5px 0;}
	
	#tour.page dl.list-horizontal dd.btn-in .btn{ margin: 10px auto 10px;}
	
	#tour.page #container .column-flex.box-column5.justify-start .box-column-size1{ width: 48%; margin-right: 4%; margin-bottom: 10px;}
	#tour.page #container .column-flex.box-column5.justify-start .box-column-size1:nth-child(2n){ margin-right: 0;}
	#tour #introduction .column-flex.box-column3.lay-etc > *{ margin-right: 0;}
	#tour #introduction .column-flex.box-column3.lay-etc > .box-column-size1{ margin-right: 0;}
}
/*etc*/
#tour .tourPoint > div:nth-child(2n){flex-direction: row-reverse;}


#tour dl.list-horizontal > dd.bring{ padding-top: 20px;}
#tour .btn-conversion{ width: 100%; max-width: 560px;}
#tour .link-area{ text-align: left;}
#tour .link-area a{ margin-bottom: 10px;}


#tour #message{ padding-bottom: 80px; position: relative; z-index: 110;}
#tour #message .profile .layout-S{ width: 100%;}

@media screen and (max-width: 900px) {
#tour #container .tourPoint .img-wrap{ margin-bottom: 20px!important;}
	#tour #season .tourCourse .wrap{ margin-bottom: 30px;}
#tour #season .tourCourse figure{ margin-bottom: 10px;}
	#tour #season .tourCourse .title3 div:first-child{ margin-bottom: 5px;}
	#tour #season .tourCourse .title3 div:last-child{ margin-top: 5px;}
	#tour #season .tourCourse .wrap .btn{ width: 100%;}
	#tour #message .profile{ margin-bottom: 20px;}
}

/*layout*/
#mission{ padding-bottom: 40px;}
#mission .box-column-size1.layout-S{ width: 100%;}
#mission .box-column-size1.layout-S .img-wrap.center-p{ width:170px; height: 170px; overflow: hidden; border-radius: 50%;}
#mission .box-column-size1.layout-S .text-wrap{ padding: 20px 0; width: calc(100%-190px);    width: -webkit-calc(100% - 190px);}
#mission .box-column-size1{ width: 450px;}
#mission .box-column-size1:last-child{ width: 650px;}


@media screen and (max-width: 1200px) {
	#mission{ padding-bottom: 40px;}
	#mission .box-column-size1{ width: 30%;}
#mission .box-column-size1:last-child{ width: 65%;}
	#tour #mission .title3{ font-size: 1.3rem; }
	#tour #mission .profile .box-column-size1.layout-S{ width: 100%; text-align: center;}
	#tour #mission .box-column-size1.layout-S .img-wrap.center-p{ width: 35%;  height: auto; padding-top: 35%; display: block; margin:0;}
	#tour #mission .box-column-size1.layout-S .text-wrap{ width: 60%;}
	#tour #mission .profile .title3{ text-align: left;	}
	
}

@media screen and (max-width: 900px) {
	#tour #mission .title3{ text-align: center; }
	#tour #introduction .column-flex .box-column-size1{ width: 30%; margin-bottom: 10px;}
	#tour #introduction .column-flex .box-column-size1:last-child{ margin-bottom: 0;}
	#tour #mission .box-column-size1{ margin-bottom: 10px;}
	#tour #mission .box-column-size1.layout-S { margin-bottom: 0;}
	#tour #mission .box-column-size1.layout-S .img-wrap.center-p{ width: 80%; padding-top: 80%; display: block; margin: 0 auto;}
	#tour #mission .box-column-size1.layout-S .text-wrap{ width: 100%; padding: 10px 0 0 0;}
	#mission .box-column-size1{ width:auto; display: block;}
	#mission .box-column-size1:last-child{ width:auto;}
	#tour #mission .profile .title3{ text-align: center;	}
}


body#tour .zukan-tour .nav-tab li{ width: 20%; }
body#tour .zukan-tour .title4{ text-align: center; margin-bottom: 0;}	
body#tour.nature-watching #container{ background: #f4ede9; padding-bottom: 0;}



body#tour.nature-watching #main .pageNav ul{background: #f4ede9;}
body#tour.nature-watching #main .pageNav ul li.yoyaku { width: 180px; border-radius: 0; position: absolute; margin: 0; right: 0; top: 0;}
body#tour.nature-watching #main .pageNav ul li.yoyaku a.btn{ border-radius: 0; line-height: 78px; padding: 0;}
body#tour.nature-watching #main .pageNav .priod{border: 1px solid #f4ede9; border-bottom: none;}

body#tour.nature-watching .illust{ position: absolute;}
body#tour.nature-watching .illust#illust1{width: 175px;height: auto; right: -40px;top: -140px;}
body#tour.nature-watching .illust#illust2{ width: 224px; left: -140px;    top: -90px;}
body#tour.nature-watching .illust#illust3{ width: 170px;  right: -87px;top: -93px;}
body#tour.nature-watching .illust#illust4{ width: 115px; height: auto; left: -56px; top: -90px;}
body#tour.nature-watching .illust#illust5{ width: 175px; height: auto; left: 230px; top: -220px;}
body#tour.nature-watching .illust#illust6{ width: 170px; height: auto; right: -40px; top: -139px;}

body#tour.nature-watching .lay-etc .img-wrap::before{ content: ""; width: 100%; height: 200%; display: block; position: absolute; left: 0; top: 0; background: #e3dbd7; -ms-transition: all .5s ease-out .5s; -webkit-transition: all .5s ease-out .5s; transition: all .5s ease-out .5s; z-index: 10;}
body#tour.nature-watching .lay-etc .img-wrap::after{ content: ""; width: 100%; height: 200%; display: block; position: absolute; left: 0; top: 0; background: #fff; -ms-transition: all .5s ease-out ; -webkit-transition: all .5s ease-out ; transition: all .5s ease-out ; z-index: 11; }
body#tour.nature-watching .lay-etc.active .img-wrap::before{ content: ""; width: 0%; height: 200%; display: block; position: absolute; left: 0; top: 0; background: #e3dbd7;}
body#tour.nature-watching .lay-etc.active .img-wrap::after{content: ""; width: 0%; height: 200%; display: block; position: absolute; left: 0; top: 0; background: #fff;}

@media screen and (max-width: 900px) {
	body#tour.nature-watching .illust#illust1{width: 43px;height: auto; right: 0px;top: -32px;}
	body#tour.nature-watching .illust#illust2{width: 58px;left: -15px;top: -30px;}
	body#tour.nature-watching .illust#illust3{ width: 42px;  right: 0px;top: -33px;}
	body#tour.nature-watching .illust#illust4{width: 35px;height: auto;right: -15px;left: auto;top: -30px;}
	body#tour.nature-watching .illust#illust5{ width: 44px; height: auto; left: 0px; top: -30px;}
	body#tour.nature-watching .illust#illust6{width: 42px;height: auto;right: -15px;top: -10px;}
}

/*musasabi*/
body#tour.musasabi #container{background: #05243f;padding-bottom: 0;}
body#tour.musasabi #container article:first-child *{ color: #fff; border-color:#20374c; overflow: hidden;}
body#tour.musasabi #main .pageNav ul{background: #05243f;}
body#tour.musasabi #main .pageNav .priod{ border-color:#05243f; }

body#tour.musasabi #musasabi1{width: 140px;height: auto;position:absolute;z-index: 0;top: 53%;right: 16%;opacity: 1;}
body#tour.musasabi #musasabi2{width: 210px;height: auto;position:absolute;z-index: 0;top: 50%;left: 5%;}
body#tour.musasabi #musasabi3{width: 140px;height: auto;position:absolute;z-index: 0;top: 5%;left: 70%;opacity: 1;}
body#tour.musasabi #musasabi4{width: 70px;height: auto;position:absolute;z-index: 0;top: 20%;left: 15%;opacity: 1;}

#tour .nav-tab li{ width: 33.33%;} 
#tour #season { margin-bottom: 40px;}
#tour #season .main-single .img-wrap{ padding-top: 35%;}

#tour #season .seasonContents{ position: relative; margin-top: 120px; }
#tour #season .seasonContents .tabfunc nav{ position: absolute; top: -90px; left: 0;}


#tour #season .seasonContents .zukan.box{ padding-top:0; }
#tour #season .seasonContents .zukan .title4{ text-align: center;}

#tour #season .seasonPoint figure{margin-bottom: 15px; padding-top: 46%;}
#tour #season .seasonPoint .title4{ margin-bottom: 15px; text-align: center;}

#tour #season .nav-tab{-webkit-flex-wrap: nowrap;  flex-wrap: nowrap; }
#tour #season .nav-tab .pod{ display: block;}
#tour #season .column-flex.box-column3 .box-column-size1 .title4{ text-align: center;}

#tour #season .seasonwrap .main-single .text-wrap .title3 span{ display: block; font-size: 1rem; }

#tour .conversion-area .column-flex.box-column2 .box-column-size1 .column-flex.box-column2 .box-column-size1{
    width: calc(50% - 10px);
    width: -webkit-calc(50% - 10px);
}
#tour .conversion-area .box-column-size1{ margin-bottom: 0;}

body#tour #infomation{padding-bottom: 0;position: relative;}
body#tour #infomation dd .table{ margin-bottom: 10px;}

body#tour #reserve{padding-bottom: 80px;position: relative;}

body#tour #reserve .reserve-box{ overflow: hidden; width: 800px; margin: 0 auto; display: block; }
body#tour #reserve .reserve-box{ letter-spacing: 0.05em; padding: 20px 20px; margin-bottom: 20px;  }
body#tour #reserve .reserve-box span{ display:inline-block; margin-left: 10px; font-size: 0.9rem; } 
body#tour #reserve .reserve-box .title4{ line-height: 1.5em; margin-bottom: 0; float: left; line-height: 50px; margin-left: 20px; color: #000!important;}
body#tour #reserve .reserve-box .title4.t-center{ text-align: left!important; line-height: 1.5em;}

body#tour #reserve .column-flex{-webkit-box-pack: center;justify-content: center;box-sizing:  border-box;}
body#tour .btn-conversion{ display: block;}
body#tour .btn-conversion{ width: 200px; float: right;}

#reserve .intro-box { max-width: 800px;  width: 100%;display: block;margin: 0 auto 40px;overflow: hidden;border: 1px solid #094a81;}
#reserve .intro-box .tag-yoyaku{width: 140px;padding: 20px 10px;border-right: 1px solid #094a81;font-size: 1.2rem;display: block;color: #094a81;font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#reserve .intro-box .txt-area{width: 658px;text-align: left;color: #094a81;padding: 10px 10px 10px 20px;}

body#tour.normal #reserve .reserve-box{ background: #f5f5f5;}

@media screen and (max-width: 1400px) {
#tour #season .seasonContents .tabfunc nav{ width: 100%; margin: 0;}
	#tour .btn-conversion{ max-width: none;}
	#tour #season .seasonPoint figure{ padding-top: 40%;}
}

@media screen and (max-width: 900px) {
	#tour #season .seasonContents .tabfunc nav{position:relative; top: auto; left: auto;}
	#tour #season .nav-tab { -webkit-flex-wrap: wrap; flex-wrap: wrap;}
	#tour #season .seasonContents .tabfunc nav{ margin: 0 auto; width: 100%;}
	#tour #season .seasonPoint figure{ padding-top: 0;}
body#tour.musasabi #musasabi1{width: 70px;height: auto;position:absolute;z-index: 0;top: 2%;right: 5%;opacity: 1;}
body#tour.musasabi #musasabi2{width: 105px;height: auto;position:absolute;z-index: 0;top: 60%;left: 5%;}
body#tour.musasabi #musasabi3{width: 70px;height: auto;position:absolute;z-index: 0;top: 0%;left: 80%;opacity: 1;}
body#tour.musasabi #musasabi4{width: 50px;height: auto;position:absolute;z-index: 0;top: 5%;left: 5%;opacity: 1;}
body#tour #reserve .reserve-box .title4.t-center{ text-align: center!important;}
}

@media screen and (max-width: 900px) {
	#tour #season .main-single .img-wrap{/* padding: 27%; */background-size: contain;}
	#tour #season .main-single .img-wrap img{width: 100%;/* margin-left: -25%; */}
	#tour #season .seasonContents{margin: 0 5% 0;}
	#tour #season .seasonContents .tabfunc nav{margin: 0 auto;width: 100%;padding: 0 5% 0 5%;}
	
	body#tour.nature-watching #main .pageNav ul li.yoyaku{ width: 100%;}
	body#tour.nature-watching #container dl.list-horizontal > dt{ background: #eae2dd;}
	body#tour.nature-watching #container dl.list-horizontal.list-border > dd dl.list-border dt{ background: none;}
	body#tour.musasabi #container dl.list-horizontal > dt{ background-color: rgba(255,255,255,0.1);}
	body#tour.musasabi #container dl.list-horizontal.list-border > dd dl.list-border dt{ background: none;}
	
	body#tour #infomation{ padding-bottom: 0;}
	
	body#tour #reserve{ margin-bottom: 0;}
	body#tour #reserve .reserve-box{ overflow: hidden; width: 100%; margin: 0 auto; display: block;}
	body#tour #reserve .reserve-box{ letter-spacing: 0.05em; padding: 20px 20px; margin-bottom: 20px;  }
	body#tour #reserve .reserve-box span{ display:inline-block; margin-left: 10px; font-size: 0.9rem;} 
	body#tour #reserve .reserve-box .title4{ line-height: 1em; margin-bottom: 15px; float: none; text-align: center;margin-left: 0; display: block;}
	body#tour #reserve .reserve-box:last-child{ margin-bottom: 0;}
	#tour #season .tab{ padding-top: 0;} 
	#tour #season .nav-tab{ display: block; overflow: hidden; margin-bottom: 5%;}
	#tour #season .nav-tab li{width: 19.5%;display: block;float: left;font-size: 0.8rem;margin-bottom:0;border:none;margin-right: 0.6%;}
	#tour #season .nav-tab li:last-child{ margin-right: 0%; }
	#tour #season .nav-tab li::after{content: ""; width:100%; height: 1px; display: block; position: absolute; left: 4%; bottom: 0; background:#000; }
	#tour #season .nav-tab li.crt::after{content: ""; width:100%; height: 1px; display: block; position: absolute; left: 4%; bottom: 0; background:#ffe000; }
	#tour #season .nav-tab li span{ display: none;}
	
	#tour #season .seasonContents .tabfunc nav{ width: 100%; margin: 0;}
	
	body#tour .btn-conversion{ display: block;}
	body#tour .btn-conversion{ width: 100%; float: none;}
	
	#reserve .intro-box { max-width:inherit;  width:auto;display: block;margin: 0 5% 20px;overflow: hidden;border: 1px solid #094a81; padding: 0 5%;}
	#reserve .intro-box .tag-yoyaku{width: 100%;padding: 20px 10px;border-right:none; border-bottom: 1px solid #094a81; font-size: 1.2rem;display: block;color: #094a81;font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
	#reserve .intro-box .txt-area{width: 100%;text-align: left;color: #094a81;padding: 10px 0;}
	

}



/*///////////////////////////////////////////////////////////

model course

/////////////////////////////////////////////////////////////*/
#model-course .column-flex.box-column2 .box-column-size1 { text-align: left; }
#model-course .column-flex.box-column2 .box-column-size1 .btn.size-s{ min-width: 60%; }



/*///////////////////////////////////////////////////////////

recruit

/////////////////////////////////////////////////////////////*/
#recruit.entry .main-single .text-wrap{ padding-top: 40px;}
#recruit.entry .state.stateNow::before,
#recruit.entry .state.stateEnd::before{ position: relative; display: block; margin: 0 auto 0px; top: 20px; left: 0;}

#recruit.entry img { max-width: 100%; height: auto; }

#recruit.entry .main-single .img-wrap{ background-position: center;}
#recruit dd .recruit-detail{ border-top: 1px solid #ccc; padding-top: 20px; }
#recruit dd .recruit-detail:first-child{border-top:none; padding-top: 0; }

@media screen and (max-width: 900px) {
#recruit.entry .state.stateNow::before,
#recruit.entry .state.stateEnd::before{ position: relative; display: block; margin: 0 auto 15px; top: 20px; left: 0; top: auto; transform: none;}
	#recruit .state.stateNow::before{    top: auto;
    bottom: 0;}
	#recruit .indexList li .textArea{ font-size: 1.1em; padding-top: 0; }
}



/*///////////////////////////////////////////////////////////

news

/////////////////////////////////////////////////////////////*/
#news .category { text-align: left;}
#news.entry .title3 { position: relative; padding-right: 160px; }
#news.entry .title3 .entrytime{ position: absolute; right: 0; top: 0;}

#news.entry figure{ margin-bottom: 20px;}

#news.entry img { max-width: 100%; height: auto; }

@media screen and (max-width: 900px) {
	#news.entry .title3 { position: relative; padding-right: 0; }
	#news.entry .title3 .entrytime{ position:relative; right:auto; top:auto; margin-top: 10px;}
	#news.entry .title3 > *{ display: block;}
}



/*///////////////////////////////////////////////////////////

Q & A

/////////////////////////////////////////////////////////////*/
.qaList{ text-align: left;}
.qaList li{ background: #e5e5e5; padding:30px 30px 30px 120px; margin-bottom: 20px; position: relative; -webkit-transition: all 1s ease; transition: all  1s ease;}
.qaList li:last-child{margin-bottom: 0;}
.qaList .title4{ margin-bottom: 0;}
.qaList .answer{ opacity: 0; display: none; -webkit-transition: all 1s ease; transition: all  1s ease;}
.qaList li *:last-child{ margin-bottom: 0;}
.qaList li .tglBtn{ width: 90px; height: 100%; position: absolute; left:0; top: 0; -webkit-transition: all 1s ease; transition: all  1s ease;} 
.qaList li .tglBtn span{ width: 29px; height: 29px; position: absolute; left: 30px; top: 30px;}
.qaList li .tglBtn span::before{ content: ""; width: 1px; height: 30px; position: absolute; left: 14px; top: 0; background: #000;}
.qaList li .tglBtn span::after{ content: ""; width: 30px; height: 1px; position: absolute; left: 0; top: 14px; background: #000;}

.qaList li.open .answer{ opacity: 1; display: block;}
.qaList li.open .tglBtn{ background: #ffe000;}
.qaList li.open .tglBtn span::before{ -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);}
.qaList li.open .tglBtn span::after{ -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);}
.qaList li.open .title4{ margin-bottom: 20px;}

#qa main .contentsSection{ margin-bottom: 0;}
#qa .pagetitle{ margin-bottom: 40px;}
#qa .news-category-list{ background: #e5e5e5; margin-bottom: 0;}
@media screen and (max-width: 900px) {
	.qaList li{ background: #e5e5e5; padding:15px 15px 15px 60px; margin-bottom: 20px; position: relative; -webkit-transition: all 1s ease; transition: all  1s ease;}
	.qaList li .tglBtn{ width: 45px; } 
	.qaList li .tglBtn span{ width: 15px; height: 15px; position: absolute; left: 15px; top: 20px;}
	.qaList li .tglBtn span::before{ content: ""; width: 1px; height: 15px; position: absolute; left: 7px; top: 0; background: #000;}
	.qaList li .tglBtn span::after{ content: ""; width: 15px; height: 1px; position: absolute; left: 0; top: 7px; background: #000;}
	.qaList li.open .title4{ margin-bottom: 10px;}
}

/*///////////////////////////////////////////////////////////

ACCESS

/////////////////////////////////////////////////////////////*/
#access #hoshino .container-mini-harf{ text-align: left;}
#access #map_canvas{ width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0;}
#access .nav-tab li{ width: 50%;}
#access .tab .tab_wrap .zu{ margin-bottom: 40px;}

/*///////////////////////////////////////////////////////////

contact

/////////////////////////////////////////////////////////////*/
#contact .contact-intro{ text-align: center; margin-bottom: 40px; padding: 30px;}
#contact .contact-intro p{ text-align: center;}
#contact dl.list-horizontal > dt{ width: 30%;}
#contact dl.list-horizontal > dd{ width: 70%;}
#contact .formList{ margin-bottom: 40px;}
#contact .formList > dt{ line-height: 34px;}


@media screen and (max-width: 900px) {
	#contact .contentsSection{ width: 90%; margin: 0 auto 5%;}
	#contact .contact-intro{ padding: 15px; text-align: left; margin-bottom: 20px;}
	#contact .contact-intro p{ text-align: left!important;}
	#contact .contact-intro p br{ display: none;}
	#contact dl.list-horizontal > dt{ width: 100%;}
	#contact dl.list-horizontal > dd{ width: 100%;}
	dt.required::after{ right: 10px;}
}
	


/*///////////////////////////////////////////////////////////

cancell

/////////////////////////////////////////////////////////////*/
#cancell .cancell-intro{ text-align: center; padding: 20px; margin-bottom: 15px;}
#cancell .cancell-intro .tel{ margin-bottom: 20px;}

/*///////////////////////////////////////////////////////////

climate

/////////////////////////////////////////////////////////////*/

#climate .graph-area figure{ display: block; margin-bottom: 20px;}
#climate .graph-area .cap-area img{ width: 300px; height: auto; margin: 0 10px;}
#climate .season-wrap { padding-top: 80px;}
#climate .season-wrap .title3{ line-height: 1.2em;}
#climate .season-wrap .title3 span{ font-size: 0.8rem; display: block;}
#climate .season-wrap .text-wrap{ padding-top: 20px;}
#climate .season-wrap .box-column-size1{ width: 350px;}

#climate .nav-tab li{ width: 14.28	%;}
@media screen and (max-width: 900px) {
	#climate .wrap > p{ text-align:  left!important;}
	#climate .wrap > p br{ display: none;}
	#climate .graph-area .cap-area img{ width: 49.5%; margin-right: 1%; margin-left: 0;}
	#climate .graph-area .cap-area img:last-child{ margin-right: 0; margin-left: 0;}
	#climate .nav-tab{ display: block; overflow: hidden; margin-bottom: 5%;}
	#climate .nav-tab li{ width: 49%; display: block; float: left; font-size: 0.8rem; margin-bottom:0;  border:none; padding: 0;}
	#climate .nav-tab li:nth-child(even){ margin-left: 2%; }
	#climate .nav-tab li::after{content: ""; width:100%; height: 1px; display: block; position: absolute; left: 0; bottom: 0; background:#000; }
	#climate .nav-tab li.crt::after{content: ""; width:100%; height: 1px; display: block; position: absolute; left: 0; bottom: 0; background:#ffe000; }

	#climate .season-wrap .title3.t-left{ text-align: center!important; font-size: 1.6rem;}
	#climate .season-wrap .box-column-size1{ margin-bottom: 10px; width: 100%;}
	#climate .season-wrap .box-column-size1:last-child{ margin-bottom: 0;}
	#climate .season-wrap .text-wrap{ padding-top: 0;}
	#climate #container dl.list-horizontal > dt br{ display: none;}
	#climate .container-mini{ margin-bottom: 40px;}
}

/*///////////////////////////////////////////////////////////

about

/////////////////////////////////////////////////////////////*/
#about{background: #e6f0f8;}
#about .line{ border-color:#fff;}
#about .main-single .text-wrap{ background: #e6f0f8;}

#about #main{ position: relative;}
#about #main > *{ z-index: 1;}
#about.index #main::before{ content: ""; width: 560px; height:830px; background:url(../img/illust/tree_about_l.png) no-repeat left; position: absolute; left: 0; top: 0; z-index: 0;}
#about.index #main::after{ content: ""; width: 560px; height:830px; background:url(../img/illust/tree_about_r.png) no-repeat right; position: absolute; right: 0; top: 0; z-index: 0;}
#about.index #main .lead{ width:100%; max-width: 324px; margin: 0 auto; position: relative;}
#about.index #main .lead .buterfly{ position: absolute;     right: -20px; top: -42px; width: 70px; height: 64px; }

#about .layout-L.title-over.row-revers .text-wrap .title2{ background: #e6f0f8;}
#about .layout-L.title-over .text-wrap .title2{     background: none!important;
    font-size: 3.4rem;}

@media screen and (max-width: 1200px) {
	#about.index #main::before{ content: ""; width: 420px; height:622px; background:url(../img/illust/tree_about_l.png) no-repeat left; background-size: 420px; position: absolute; left: 0; top: 0; z-index: 0;}
	#about.index #main::after{ content: ""; width: 420px; height:622px; background:url(../img/illust/tree_about_r.png) no-repeat right; background-size: 420px; position: absolute; right: 0; top: 0; z-index: 0;}
}

@media screen and (max-width: 900px) {
	#about.index #main .lead .buterfly{ position: absolute; right: 60px; top: -20px; width:35px; height: 35px; }
		#about.index #main::before{ content: ""; width: 130px; height:308px; background:url(../img/illust/tree_about_l.png) no-repeat right top; background-size: 180px; position: absolute; left:0; top: 0; z-index: 0;}
	#about.index #main::after{ content: ""; width: 130px; height:308px; background:url(../img/illust/tree_about_r.png) no-repeat left top; background-size: 180px; position: absolute; right:0; top: 0; z-index: 0;}
	.leafs{ display: none;}
	#about .layout-L.title-over .text-wrap .title2{font-size: 1.4rem;background: #e6f0f8!important;margin-bottom: 10px;}
}

#about #container .list-border.list-border-gray,
#about #container .list-border{ border-top: 1px solid #fff;}
#about #container .list-border > li,
#about #container .list-border.list-border-gray > li,
#about dl.list-vertical.list-border > dd,
#about dl.list-horizontal.list-border > *,
#about #container dl.list-horizontal.list-border.list-border-gray > *,
#about #container dl.list-horizontal.list-border > dd dl.list-horizontal > * { border-bottom: 1px solid #fff;}

#about.ecoture .layout-L .img-wrap,
#about.bear .layout-L .img-wrap{padding-top: 40%;}
#about.bear .beardogwork{ font-size: 0.9rem; display: block; margin-bottom: 0;}
#about.bear #beardog .main-single .img-wrap{ background:url(../img/about/beardogwork0.jpg) no-repeat center; background-size: cover; padding-top: 40%; height: auto;}
#about.bear .bearflow .img-wrap{ margin-bottom: 10px;}
/*staff index*/
.zukan{position: relative;/* overflow: hidden; */}
.zukan::before{content: "";width: 110%;padding-top: 6%;background: url(../img/staff/book_top.svg) no-repeat bottom center;background-size: 100%;position: absolute;left: -5%;top: -5px;z-index: 10;}
.zukan::after{content: "";width: 110%;padding-top: 6%;background: url(../img/staff/book_btm.svg) no-repeat top center;background-size: 101%;position: absolute;left: -5%;bottom: -3%;z-index: 10;}
#about.staffindex .staffList > *{ margin-bottom: 40px;}
#about.staffindex .staffList .title3 *{font-family: "Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; display: block; line-height: 1.5em; letter-spacing: 0.05em;}
#about.staffindex .leadArea dl *{font-family: "Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#about.staffindex .zukan{position: relative;padding-top: 80%; margin-bottom: 10px;}
#about.staffindex .zukan img{ width: 100%; height: auto; position: absolute; top: 50%; transform: translateY(-50%); -webkit- transform: translateY(-50%); left: 0; }

/*about index*/
#about.index .lead img{ width: 324px; height: auto; display: block; margin:0 auto 40px;}
#about.index .business .box-column-size1{ margin-bottom: 0;}
#about.index .leaf1{position: absolute;left: 40%;top: 6%;}
#about.index .leaf2{position: absolute;left: 28%;top: 46%;}
#about.index .leaf3{position: absolute;left: 25%;top: 80%;}
#about.index .leaf4{ position: absolute; left: 30%; top: 60%;}
#about.index .leaf5{ position: absolute; left: 50%; top: 100%;}
#about.index .leaf6{position: absolute;left: 50%;top: 30%;}
#about.index .leaf7{position: absolute;right: 35%;top: 10%;}
#about.index .leaf8{position: absolute;right: 35%;top: 55%;}
#about.index .leaf9{position: absolute;right: 40%;top: 90%;}
#about.index .leaf10{position: absolute;right: 50%;top: 59%;}
#about.index .leaf11{position: absolute;right: 22%;top: 70%;}
#about.index .leaf12{position: absolute;right: 33%;top: 40%;}
#about #ecotureLink.layout-L.title-over .text-wrap{ padding-top: 140px;}

@media screen and (max-width: 900px) {
	.column-flex.box-column4.justify-start .box-column-size1{ margin-right: 0;}
	#about.staffindex .staffList > *{ margin-bottom: 20px;}
	#about.index .lead img{ width: 60%; margin-bottom: 20px;}
	#about.index .business .box-column-size1{ margin-bottom: 20px;}
	#about.index .business .box-column-size1:last-child{ margin-bottom: 0;}
	#about.ecoture .layout-L .img-wrap,
#about.bear .layout-L .img-wrap{padding-top: 50%;}
	#about .layout-L.title-over.row-revers .text-wrap .title2 br{ display: none;}
	#about #ecotureLink.layout-L.title-over .text-wrap{ padding-top: 0;}
	.layout-L.title-over.row-revers .text-wrap .title4{ text-align: center;}
	#about .layout-L.title-over .btn-arr{ padding-left: 0;}
	#about .layout-L.title-over .btn-arr svg{ position: relative; top: auto; left: auto; margin-right: 5px;}
	.zukan::after{bottom:-:;10px; z-index: 10;}
}

/*about ecoture*/
#about.ecoture .title3{ text-align: left;}

/*staff page*/
#about.staff #container{ margin-bottom: 100px;}
#about.staff .contentsSection{ padding-top: 40px;}
.profileMain{ width: 90%; max-width: 1300px; margin:0 auto 0;}
.profileMain > *{ width: 50%; height: 540px; display: block; background: #fff; overflow:hidden;}
.profileMain > figure img{ height: 100%; width: auto;}
.profileMain .img-wrap.center-p{ padding-top: 0;     height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover;}
.profileMain > .txt-wrap{ padding: 100px 100px 0; text-align: left;}
.profileMain > .txt-wrap .title3{ font-size: 3em; letter-spacing: 0.05em; margin-bottom: 40px;}
.profileMain > .txt-wrap .title3 *{font-size: 1em; font-family: "Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; display: block; line-height: 1.5em; letter-spacing: 0.05em;}

#about.staff .qaList > dt{padding:20px 0 0 30px; margin-bottom: 10px; position: relative;}
#about.staff .qaList > dt::before{ content: "Q"; font-family: "Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; position: absolute; left: 0; top: 15px; font-size: 1.5rem;}
#about.staff .qaList > dd{padding:0 0 20px 30px; }
#about.staff .staffContents{ margin-bottom: 40px; text-align: left;}
#about.staff .staffContents figure{ position: relative; overflow: hidden; margin-bottom: 0; }
#about.staff .staffContents .text-wrap{ padding-top: 40px;}


@media screen and (max-width: 900px) {
	.profileMain .img-wrap.center-p{ padding-top: 80%;}
	#about.ecoture .title3{ text-align:center;}
	#about.staff #container{ margin-bottom: 40px;}
.profileMain{ width: 90%; max-width:inherit; margin:0 5% 5px;}
.profileMain > *{ width: 100%; height: auto; display: block; background: #fff;}
.profileMain .img-wrap{ position: relative;}

.profileMain > figure img{ height: 100%; width: auto;}
.profileMain > .txt-wrap{ padding: 20px; text-align: left;}
.profileMain > .txt-wrap .title3{ font-size: 1.4em; letter-spacing: 0.05em; margin-bottom: 20px;}
.profileMain > .txt-wrap .title3 *{font-size: 1em; font-family: "Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; display: block; line-height: 1.5em; letter-spacing: 0.05em;}

	#about.staff .staffContents figure{ margin-bottom: 0; display: none;}

	#about.staff .staffContents .text-wrap{ padding-top: 20px;}
}

/*book*/
#about.book .title3 span{ display: block;}
#about.book .text-wrap{ text-align: left;}
#about.book .text-wrap .publisher{ padding: 20px 10px 20px 10px; position: relative; overflow: hidden;}
#about.book .text-wrap .publisher .blank{ width: 240px; display: block; text-align: right; float: right;}
#about.book .box-column4.wrap{ margin-bottom: 40px;}
#about.bear .beardogworks .title3{ text-align: left;}

@media screen and (max-width: 900px) {
	#about #container dl.list-horizontal > dt{ background: #d9e5ed;}
	#about.bear .beardogworks .box-column2{ margin-bottom: 20px;}
	#about.book figure.jacket{text-align: center;}
	#about.book figure.jacket img{ width: 60%; height: auto;}
	
	#about.book .text-wrap .publisher{ padding: 10px 0; text-align: center; margin-top: 10px!important;}
	#about.book .text-wrap .publisher .blank{ width: 100%; float: none; text-align:center;}
	#about.book .text-wrap .publisher .blank a{ display: block;}
	#about.book .text-wrap .title3{ text-align: center;}
	#about.book .text-wrap .title3 span{ display: block; text-align:center;}
	#about.bear .beardogworks .title3{ text-align: center;}
}

/*blog*/
#about.blog{}
#about.blog #container > article{ position: relative;}
#about.blog #container > article::before{content:"";width: 740px;height: 380px;background: url(../img/blog/tree_l.png) no-repeat;background-size: contain;left: 0;top: 0;position: absolute;z-index: 1000;}
#about.blog #container > article::after{content:"";width: 740px;height: 380px;background: url(../img/blog/tree_r.png) no-repeat;background-size: contain;right: 0;top: 0;position: absolute;z-index: 1000;}
@media screen and (max-width: 1500px) {
	#about.blog #container > article::before{ content:""; width: 555px; height: 285px; background: url(../img/blog/tree_l.png) no-repeat; background-size: 555px; left: 0; top: 0; position: absolute;}
	#about.blog #container > article::after{ content:""; width: 555px; height: 285px; background: url(../img/blog/tree_r.png) no-repeat; background-size: 555px; right: 0; top: 0; position: absolute;}
}
@media screen and (max-width: 1200px) {
	#about.blog #container > article::before{ content:""; width: 370px; height: 190px; background: url(../img/blog/tree_l.png) no-repeat; background-size: 370px; left: 0; top: 0; position: absolute;}
	#about.blog #container > article::after{ content:""; width: 370px; height: 190px; background: url(../img/blog/tree_r.png) no-repeat; background-size: 370px; right: 0; top: 0; position: absolute;}
}

@media screen and (max-width: 900px) {
	#about.blog #container > article::before{ content:""; width: 185px; height: 95px; background: url(../img/blog/tree_l.png) no-repeat; background-size: 185px; left: 0; top: 0; position: absolute;}
	#about.blog #container > article::after{ content:""; width: 185px; height: 95px; background: url(../img/blog/tree_r.png) no-repeat; background-size: 185px; right: 0; top: 0; position: absolute;}
}


#about.blog .contentsSection.pickup {padding: 0;overflow: inherit;margin-bottom:  60px;}
#about.blog .contentsSection.pickup a{background: #fff;position: relative;z-index: 10;}
#about.blog .contentsSection.pickup .illust{position: absolute;width: 100%;left: 0;top: 0;z-index: 0;}

#about.blog .pickup-entryThum .thum{ max-width: 800px; height: 470px; display: block;  width:-webkit-calc(100% - 320px); width: calc(100% - 320px);}
#about.blog .pickup-entryThum .thum img{position:relative;left: 50%;top: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);-ms-transition: all .5s;-webkit-transition: all .5s;transition: all .5s;transform-origin: 100%;}

#about.blog .pickup-entryThum .textArea{ width: 300px; display: block; padding:40px 20px 10px 20px; box-sizing: border-box; text-align: left;}

#about.blog .pickup-entryThum .textArea > *{ margin-bottom: 10px; text-align: left; display: block;}
#about.blog .pickup-entryThum .textArea > .btn-arr{ margin-top: 20px;}

#about.blog .contentsSection.pickup a:hover .btn-arr{ padding-left:30px;  }
#about.blog .contentsSection.pickup a:hover .btn-arr svg{ left: 10px; width: 13px; height: 13px; }

#about.blog .contentsSection.pickup a:hover .img-wrap .inner img{ transform:translateY(-50%) translateX(-50%) scale(1.05); -webkit-transform:translateY(-50%) translateX(-50%) scale(1.05); opacity: 0.85;}

#about.blog .contentsSection.pickup .img-wrap .inner{display: block;overflow: hidden;width: 100%;padding-top: 470px;position: relative;}
#about.blog .contentsSection.pickup .img-wrap .inner img{position: absolute;/* left: 0; *//* top: 0; */}
#about.blog .btnArea{width: 100%;display: block;margin-bottom: 160px;margin: 0 auto;}

@media screen and (max-width: 1200px) {
	#about.blog .pickup-entryThum .thum{max-width:inherit; max-width: none; width: 100%; height:auto; padding-top: 0%; display: block;}
	#about.blog .pickup-entryThum .thum img{position:relative;left: 50%;top: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);-ms-transition: all .5s;-webkit-transition: all .5s;transition: all .5s;transform-origin: 100%;}
	#about.blog .pickup-entryThum .textArea{ width: 100%; display: block; padding:15px; box-sizing: border-box; text-align: left;}
}

@media screen and (max-width: 900px) {
	#about.blog .contentsSection.pickup {padding: 0;overflow: inherit;margin-bottom:  20px;}
	#about.blog .pickup-entryThum .thum{ width: 100%; height:auto; padding-top: 0%; display: block;}
	#about.blog .pickup-entryThum .thum img{ position:relative;left: 50%;top: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);-ms-transition: all .5s;-webkit-transition: all .5s;transition: all .5s;transform-origin: 100%;}
	#about.blog .pickup-entryThum .textArea{ width: 100%; display: block; padding:15px; box-sizing: border-box; text-align: left;}
	#about.blog .pickup-entryThum .textArea > *{ margin-bottom: 0; text-align: left; display: block;}
	#about.blog .pickup-entryThum .textArea .entrytime{ margin-bottom: 10px;}
	#about.blog .contentsSection.pickup .img-wrap .inner{display: block;overflow: hidden;width: 100%;padding-top: 40%;position: relative;}
	#about.blog .btnArea .btn.w100{ margin: 0 auto;}
}


#about.blog.blog-index .blogTitle{margin-bottom: 40px;padding-top: 0;width: 801px;height: 360px;display: block;margin: 0 auto;position: relative;}
#about.blog.blog-index .blogTitle .titleLogo{position: absolute;left: 0;top: 35px;z-index: 10;}
#about.blog.blog-index .blogTitle .illust{position: relative;z-index: 0;}
#about.blog .blogTitle img.titleLogo{ width: 770px; height: auto;}


#about.blog #main .illust .sun{ position: absolute; left: 50%; top: -42px; transform: translateX(-50%);  -webkit- transform: translateX(-50%); }
#about.blog #main .illust .rain1{ position: absolute;  left: 13%; top: 300px;  }
#about.blog #main .illust .rain2{ position: absolute;  right: 13%; top: 380px; }

#about.blog #main .illust .bard1{position: absolute;left: 33%;top: -35px;}
#about.blog #main .illust .dog{position: absolute;right: 23%;top: -10px;}
#about.blog #main .illust .man{position: absolute;right: 8%;top: 90px;}

#about.blog .contentsSection.pickup .mituketa{position: absolute;left: 0;top: -228px;}
#about.blog .contentsSection.pickup .woman1{position: absolute;right: -33px;top: -110px;z-index:0;}

.blog .nposidebnr{display: block; margin-top: 20px;}
.blog .nposidebnr img{ width: 100%; height: auto;}

@media screen and (max-width: 900px) {
	#about.blog.blog-index .blogTitle .titleLogo{ top:0;}
	#about.blog .blogTitle img.titleLogo{ width: 100%; height: auto;}
#about.blog #main .illust .rain1{position: absolute;left: 7%;top: 70%;width: 47px;height: auto;}
#about.blog #main .illust .rain2{position: absolute;right: 13%;top: 380px;width: 47px;height: auto;display: none;}
	
#about.blog #main .illust .bard1{position: absolute;left: 33%;top: 23px;width: 25px;height: auto;}
#about.blog #main .illust .dog{position: absolute;right: 23%;top: 32px;width: 44px;height: auto;}
#about.blog #main .illust .man{position: absolute;right: 8%;top: 67px;width: 28px;height: auto;}
	
#about.blog .contentsSection.pickup .mituketa{position: absolute;left: 0;top: -60px;width: 120px;height: auto;}
#about.blog .contentsSection.pickup .woman1{position: absolute;right: -25px;top: -30px;z-index:0;width: 70px;height: auto;}
}

/*sdgs*/
#about.sdgs .container.wrap.main-single .img-wrap{ background: url("../img/sdgs/main.jpg") no-repeat center; background-size: cover;}
#about.sdgs #esd2 dl.list-horizontal > dt{width: 20em;}
#about.sdgs #esd2 dl.list-horizontal > dd{width: calc(100% - 20em);}
#plan dl.list-horizontal.list-border > *{padding: 2em 0;}
#about #program .box-column1{display: block; margin: 50px auto 0;}

#about #plan .plan-schedule{ display:flex; position: relative; margin-bottom: 10px;}
#about #plan .plan-schedule:last-child{margin-bottom: 0;}
#about #plan .plan-schedule .-time{width: 10em;padding: 0.25em 1em;background: #ffe000;text-align: center;color: #094a81;display: block;}
#about #plan .plan-schedule .-do{width: calc(100% - 10em); display: block;padding: 0.25em 1em; text-align: left;}
#about #plan .plan-schedule.-syuugou{background: #fff; padding: 0.25em 1em; width: 100%; display: block;}
#about #plan .plan-schedule.-syuugou div{display: block; width: 8em; text-align: center;}
#about .plan-title{margin-bottom: 0;background: #094a81;color: #fff;display: block;padding:0.5em 1em;}
#about.sdgs .title3{    margin-bottom: 1.5em;}

@media screen and (max-width: 900px) {
	#about.sdgs #esd2 dl.list-horizontal > dt{width: 100%;}
	#about.sdgs #esd2 dl.list-horizontal > dd{width: 100%;}
	#plan dl.list-horizontal.list-border > dt{padding:0.5em 1em;}
	#plan dl.list-horizontal.list-border > dd{padding:0.5em 0em;}
	#about #plan .plan-schedule .-time{font-size: 0.8rem; width: 7rem;}
	#about #plan .plan-schedule .-do{font-size: 0.8rem; width: calc(100% - 7rem);}
	#about #plan .plan-schedule.-syuugou div{font-size: 0.8rem; text-align: left;}
}

#blogContents{ margin-bottom: 80px;}
#blogContents section{ width: 800px; margin-right: 40px; overflow: hidden;}
#blogContents .entryList .entryThum:first-child{ border-top: 1px solid #fff;}
#blogContents .entryList .entryThum{ display: block;  border-bottom: 1px solid #fff; padding: 15px 0; overflow: hidden;}
#blogContents .entryList .entryThum .thum{ width: 220px; height: 130px; display: block; float: left; margin-left: 20px;}
#blogContents .entryList .entryThum .thum img{ position:relative; width: 100%; height: auto; top: 50%; transform: translateY(-50%) ;  -webkit- transform: translateY(-50%) ;}
#blogContents .entryList .entryThum .textArea{ width: 520px; height: auto; display: block; float: right; text-align: left; margin-right:20px;}
#blogContents .entryList .entryThum .textArea > *{ text-align: left; margin-bottom: 10px;}

@media screen and (max-width: 900px) {
	#blogContents section{width: 100%;margin-right: 0;overflow: hidden;padding-bottom: 80px;}
	#blogContents section .indexList li a{padding: 20px 0;}
}

#blogContents .sidenav{ width: 280px; text-align: left;}
#blogContents .sidenav .title4{ text-align: left; position: relative; margin-bottom: 0; padding-bottom: 20px;}
#blogContents .sidenav .title4 .catIllust{ position: absolute; right: 0; bottom: 0;}
#blogContents .sidenav ul li { margin-bottom: 10px;}
#blogContents .sidenav ul li a{ background: #fff; display: block; padding: 5px 10px 5px 40px; position: relative; -ms-transition: all .2s; -webkit-transition: all .2s; transition: all .2s;}
#blogContents .sidenav ul li a::before{ content: ""; width: 10px; height: 10px; border-radius: 5px; display: block; background:#e6f0f8; position: absolute; left: 15px; top: 50%; transform: translateY(-50%) ;  -webkit- transform: translateY(-50%) ;}
#blogContents .sidenav ul li a:hover{ transform: translateX(-10px);-webkit- transform: translateX(-10px);  }

#blogContents .sidenav select{ width: 100%; border: none; padding: 10px;}
#blogContents .sidenav input{ border: none; padding: 10px; }
#blogContents .sidenav .siteSearch { position: relative; display: block;	}
#blogContents .sidenav .siteSearch #searchsubmit{ width: 50px; position: absolute; right: 0; top: 0; background: url(../img/blog/icon_search.svg) no-repeat center; background-size: 15px;}
#blogContents .sidenav .siteSearch input{ padding: 10px;}

#blogContents .sidenav .tagList a{background: #fff;margin-right: 5px;margin-bottom: 5px;padding: 5px 1em;display: inline-block;text-align: center;font-size: 0.8rem;line-height: 1.5em;}

#about.blog.blog-entry .blogTitle{margin-bottom: 20px;/* padding-top: 40px; */width: 770px;height: 280px;display: block;margin: 0 auto 30px;position: relative;}


#about.blog.blog-entry .blogTitle img.titleLogo{ width: 100%; height: auto;}
#about.blog.blog-entry .blogTitle .titleLogo{position: absolute;left: 0;top: 0;z-index: 10;}
#about.blog.blog-entry .blogTitle .illust{position: relative;z-index: 0;}



#about.blog.blog-entry .titleArea{ background: #fff; text-align: left; display: block; margin-bottom: 40px;}
#about.blog.blog-entry .titleArea .innner{ padding: 30px; display: block; position: relative; padding-right: 150px;}
#about.blog.blog-entry .titleArea .innner > *{ text-align: left; margin-bottom: 0;}
#about.blog.blog-entry .titleArea .innner .entrytime { position: absolute; right: 30px; top: 30px;}
#about.blog.blog-entry .titleArea .img-wrap{ padding-top: 60%;}

#about.blog.blog-entry .freespace { text-align: left;}
#about.blog.blog-entry .freespace *{ text-align: left;}

@media screen and (max-width: 900px) {
	#about.blog #container{ overflow: hidden;}
	
	#about.blog.blog-entry .blogTitle,
	#about.blog.blog-index .blogTitle{padding-top: 20px;width: 90%;padding-top: 32%;height: auto;display: block;margin: 0 auto 20px;position: relative;}
	
	#about.blog.blog-entry .pagetitle,
	#about.blog.blog-index .pagetitle{ padding-top: 60px;}
	
	#about.blog.blog-entry .blogTitle img.titleLogo{ top:0;}
	
	#about.blog.blog-index .blogTitle .illust,
	#about.blog.blog-entry .blogTitle .illust{ position:absolute; left: 0; top: 0; width: 100%;}
	#blogContents .sidenav .title4 .catIllust{ width: 33px; height: auto; display: none;}
	
	#about.blog.blog-entry .titleArea .innner{ padding: 15px 15px 15px 15px;}
	#about.blog.blog-entry .titleArea .title3{ margin-bottom: 10px;}
	#about.blog.blog-entry .titleArea .innner .entrytime {position:relative; right:auto; top:auto; margin-top: 10px;}
	#about.blog.blog-entry .title3 > *{ display: block;}
	#about.blog.blog-entry .titleArea .innner .category{ line-height: 1.5em;}

}


@media screen and (max-width: 900px) {
	#blogContents .sidenav{ width: 100%; text-align: left;}
}


#about{}


/*///////////////////////////////////////////////////////////

facility

/////////////////////////////////////////////////////////////*/
#facility .layout-L.title-over .text-wrap .title2{ font-size: 2.4rem;}
#facility .layout-L.title-over .text-wrap{ padding-top: 180px;}
#facility .discriptionArea .discription{ margin-bottom: 0;}
#facility .discriptionArea .discription .title3{ text-align: left;}
@media screen and (max-width: 900px) {
#facility .discriptionArea .discription{ margin-bottom: 20px;}
	#facility .layout-L.title-over .text-wrap{ padding-top: 0;}
	#facility .layout-L.title-over .text-wrap .title2{font-size: 1.1rem;padding: 10px 10px 0;margin-bottom: 10px;}
	#facility .layout-L.title-over .text-wrap .title2 br{ display: none;}
}

#facility.picchio #caffe dl.list-horizontal > dt{ width: 40%;}
#facility.picchio #caffe dl.list-horizontal > dd{ width: 60%;}

#facility.picchio .main-single .img-wrap{ background:url(../img/facility/index_picchio.jpg) no-repeat; background-size: cover;}
#facility.skate .main-single .img-wrap{ background:url(../img/facility/index_kera.jpg) no-repeat; background-size: cover;}
#facility.wildforest .main-single .img-wrap{ background:url(../img/facility/index_wildforest.jpg) no-repeat; background-size: cover;}
#facility.skate .main-single .img-wrap.-img2023 { background:url(../img/facility/index_kera2023.jpg) no-repeat; background-size: cover;}

/*///////////////////////////////////////////////////////////

freespace

/////////////////////////////////////////////////////////////*/
.freespace{ width: 800px; display: block; margin: 0 auto; padding-bottom: 80px;}

/* title ////////////////////////////////////////////////////////////////////////////////////////////*/

.freespace h1{font-size: 2rem; margin-bottom:20px;font-weight: 100;letter-spacing: 0.05em; line-height: 1.3em; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
.freespace h2{font-size: 1.6rem; margin-bottom:10px; font-weight: 100; line-height: 1.5em; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-align: left;}
.freespace h3{font-size: 1.2rem; margin-bottom:10px; line-height: 1.8em; font-weight: 100; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-align: left;}
.freespace h4{font-size: 1rem; margin-bottom:10px; font-weight: 100; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-align: left;}
.freespace h5{font-size: 0.8rem; margin-bottom:10px; font-weight: 100;}
.freespace p{ margin-bottom: 10px;}
.freespace figure{ margin-bottom: 20px;}
.freespace ul {border-top: 1px solid #ccc; }
.freespace ul li{padding: 10px 0; border-bottom: 1px solid #ccc;}
.freespace ul li *:last-child{ margin-bottom: 0;}

.freespace iframe{ width: 100%;height: 600px;}


#tour dl.list-horizontal > dd h1{font-size: 2rem; margin-bottom:20px;font-weight: 100;letter-spacing: 0.05em; line-height: 1.3em; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#tour dl.list-horizontal > dd h2{font-size: 1.6rem; margin-bottom:10px; font-weight: 100; line-height: 1.5em; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-align: left;}
#tour dl.list-horizontal > dd h3{font-size: 1.2rem; margin-bottom:10px; line-height: 1.8em; font-weight: 100; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-align: left;}
#tour dl.list-horizontal > dd h4{font-size: 1rem; margin-bottom:10px; font-weight: 100; font-family:"Noto Serif Japanese","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-align: left;}


@media screen and (max-width: 900px) {
	.freespace{width: 100%;margin-bottom: 0;padding-bottom: 40px;}
	#tour .freespace{ width: auto; display: block; margin: 0 auto; padding: 0 5% 40px;}
	.freespace h1{font-size: 1.2rem; margin-bottom:20px; }
	.freespace h2{font-size: 1.1rem; margin-bottom:10px; }
	.freespace h3{font-size: 1rem; margin-bottom:10px; }
	.freespace h4{font-size: 1rem; margin-bottom:10px; }
	.freespace h5{font-size: 0.8rem; margin-bottom:10px; }
	.freespace iframe{ width: 100%; height: 300px;}
}



/*テーブル*/
.freespace table { width: 100%; border-collapse: collapse; table-layout: fixed; border-top: 1px solid #ccc; margin-bottom: 40px;}
.freespace table th,
.freespace table td { padding: 10px; text-align: left;}
.freespace table thead th { border-bottom: 1px solid #ccc; }
.freespace table tbody th { border-bottom: 1px solid #ccc; }
.freespace table tbody td { border-bottom: 1px solid #ccc; }
.freespace table tbody tr td:first-child{ width: 25%;}

#tour dl.list-horizontal > dd table { width: 100%; border-collapse: collapse; table-layout: fixed; border-top: 1px solid #ccc; margin-bottom: 40px;}
#tour dl.list-horizontal > dd table th,
#tour dl.list-horizontal > dd table td { padding: 10px; text-align: left;}
#tour dl.list-horizontal > dd table thead th { border-bottom: 1px solid #ccc; }
#tour dl.list-horizontal > dd table tbody th { border-bottom: 1px solid #ccc; }
#tour dl.list-horizontal > dd table tbody td { border-bottom: 1px solid #ccc; }
#tour dl.list-horizontal > dd table tbody tr td:first-child{ width: 25%;}


.freespace table tr .w10{ width: 10%;}
.freespace table tr .w20{ width: 20%;}
.freespace table tr .w30{ width: 30%;}
.freespace table tr .w40{ width: 40%;}
.freespace table tr .w50{ width: 50%;}
.freespace table tr .w60{ width: 60%;}
.freespace table tr .w70{ width: 70%;}
.freespace table-layout: ; tr .w80{ width: 80%;}


.c-button-video-play { width: 100%; display: flex; padding: 0; border: none;  background: none; align-items: center; cursor: pointer; max-width: 600px; margin: 1em auto;}
.c-button-video-play:hover { opacity: .7;  }
.c-button-video-play .img { width: 120px; margin-right: 15px; position: relative; background: rgba(0,0,0,.3);}
.c-button-video-play .img img {width: 100%; height: auto; background: #000; mix-blend-mode: multiply; }
.c-button-video-play .img::before { content: ''; width: 30px; height: 30px; border: 1px solid #FFF;  border-radius: 50%; position: absolute; inset: 0; margin: auto; z-index: 2; }
.c-button-video-play .img::after { content: '';  width: 0; height: 0; border-width: .5em 0 .5em .8em; display: block; border-style: solid; border-color: transparent transparent transparent #FFF; position: absolute; inset: 0; margin: auto; z-index: 2; }
.c-button-video-play p { width: calc(100% - 135px); }

@media screen and (min-width: 768px) { 
  #tour:not(.model-course) #introduction .c-button-video-play { width: 31%; }
}

.js-overlay {
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.9);
  z-index: 200;
  cursor: pointer;
}

.js-contsWrap {
  width: 80%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 0 0;
  top: 50%;
  position: relative;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.js-contsWrap::before {
  content: "×";
  position: absolute;
  top: 0;
  right: 0;
  font-size: 30px;
  color: #B5A992;
  font-weight: 100;
}

.js-contsInner {
  position: relative;
  padding-bottom: 56.25%;
}

.is-modalActive .is-view {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}