@charset "UTF-8";
/* CSS Document */
/* ▼　共通設定　▼ */
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box; }

body {
  font-size: 14px;
  font-weight: 400;
  font-family: 'Noto Sans JP', sans-serif;
  color: #000000;
  line-height: 1.5;
  margin: 0;
  padding: 0; }

.font_roboto {
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 300;
  line-height: 1.0;}

.page{
	margin-bottom: 0;
}

img {
  border: none; }

a img {
  border-style: none; }

a {
  outline: 0;
  color: #000000;
  text-decoration: none; }

a:hover {
  opacity: 0.7; }

a img, :link img, :visited img {
  border: none; }

/* delate dot boader of link for New Mozilla \*/
a {
  overflow: hidden; }

a[href^="tel:"] { cursor: default; }

a[href^="tel:"]:hover { opacity: 1.0; }

img, fieldset, abbr, acronym {
  border: 0; }

img {
  /*vertical-align:bottom;*/ }

hr {
  margin: 2em 0;
  border: 0;
  border-top: 4px solid #F4F4F4; }

/* float clear */
.clearfix:after {
  content: ".";
  /* 新しい要素を作る */
  display: block;
  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden; }

.clearfix {
  min-height: 1px; }

* html .clearfix {
  height: 1px;
  /*\*/
     /*/
height: auto;
overflow: hidden;
/**/ }

.clear {
  clear: both; }

ul {
  margin: 0; }

li {
  list-style-type: none; }

.wrapper {
  margin: 0 auto;
  padding: 0; }

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-size: 1.0em; }

.nav_btn{
	height:3em;
	font-weight: 700;
	background: #33CC4B;
	vertical-align: bottom;
	padding:0 1em !important;
	display: inline-block !important;
	margin-left: 10px;}
.nav_btn .flex_center{
	height: 100%;}
.nav_btn [class^="icon-"]{
	padding-right: 5px;}
.nav_btn .icon-taiken{
	font-size: 1.5em;}
.nav_btn .icon-calender{
	font-size: 1.2em;}
/* ▲　共通設定　▲ */
/* ▼　ヘッダ　▼ */
header{
	background-color: rgba(255,255,255,0.9);
}
#header_nav li{
	padding: 0 1em;
	margin-bottom: 1em; }

#header_nav li:first-child{
	padding-left: 0;}
#header_nav li:last-child{
	padding-right: 0;
	border-right: 0;}
#header_nav li{
	display:inline-block;
}
#header_nav li + li {
  border-left: 1px solid #e3e3e3;
}
#header_subnav{
	top: 0;
	right:0;}
#header_subnav li{
	display: inline-block;
	margin: 0 0 0 10px;}
/* ▽▽ハンバーガーメニュー▽▽ */
#nav_slide {
	/* チェックボックスを隠す */
	display: none; }
.nav_slide_btn {
	position: fixed;
	top: 20px;
	right: 0;
	width: 80px;
	height: 80px;
	cursor: pointer;
	display: block;
	z-index: 100;
	-webkit-transition: all 1s;
	transition: all 1s; }
.nav_slide_btn [class^="icon-"]{
	font-size: 3em;}  

.nav_slide_btn .icon-close {
	display: none; }
#nav_slide_cnt {
	width: 0%;
	height: 100%;
	padding: 68px 0 100px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	z-index: 90;
	position: fixed;
	right: 0;
	/*右からスライド*/
	top: 0;
	opacity: 0;
	background: linear-gradient(to bottom, transparent 50%, rgba(255,255,255,0.9) 50%);
	-webkit-transition: all 1s;
	transition: all 1s; }
/* ▽▽開閉時のアニメーション▽▽ */
#nav_slide:checked ~ .nav_slide_btn .icon-menu {
  display: none; }
#nav_slide:checked ~ .nav_slide_btn .icon-close {
  display: inline; }
#nav_slide:checked ~ #nav_slide_cnt {
  width: 100%;
  opacity: 1; }
#nav_slide_cnt ul{
	padding-top: 32px;
	background-color: rgba(255,255,255,0.9);}
#nav_slide_cnt li a {
  display: block;
  margin: 0 5%;
  padding: 1.5em 1em 1.5em 0;
  line-height: 1;
  position: relative; }
#side_nav{
	top: 180px;
    right: 0;}
#side_nav .btn_side{
	background: #33CC4B;
	width: 100%;
    padding: 1em 5px 1.5em;
    margin-bottom: 10px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    letter-spacing: 0.5em;
    width: 45px;}
#side_nav .btn_side .icon-taiken{
	font-size: 2.5em;}
#nav_bottom{
	position: fixed;
	width: 100%;
	bottom: 0;
	left: 0;}
#nav_bottom li{
	width: calc(100% / 3 - 0.5px);
}
#nav_bottom li a{
	text-align: center;
	display: block;
	padding: 1em 0.5em 0.5em; }
#nav_bottom li .area_icon {
    height: 40px;
    display: inline-flex;
	align-items: center;}
#nav_bottom li .icon-sp{
	font-size: 1.5em;
	margin-right: 5px;}
#nav_bottom li .icon-taiken{
	font-size: 1.75em;}
/* ▲　ヘッダ　▲ */
/* ▼　メイン　▼ */
/*home*/
main {
  margin-top: 160px; }

section {
  margin-bottom: 50px;
  opacity: 0;
  /*display: none;*/
  transition: all 5s; }

section.active {
  /*display: block;
  transform : translate(0, 0);*/
  opacity: 1; }

/*#sec_intro h3{
	padding: 30px 30px 30px 0;
}
#sec_intro h3 span{
	font-size: 1.35em;
}*/
@media screen and (max-width: 595px) {
	#sec_intro h3{
		font-size: 6.5vw;
	}
}

.blk_ttl_left{
	background: linear-gradient(to right, #8AE350 50%, transparent 50%);
}
.blk_ttl_left .content{
	padding: 30px 30px 30px 0;
}
.blk_ttl_left .content span{
	font-size: 1.35em;
}
.blk_ttl_right{
	background: linear-gradient(to right, transparent 50%, #484848 50%);
}
.blk_ttl_right .content{
	padding: 1.5em 0;
	transform: translateX(5%);
}
/*ページタイトル*/
#sec_ttl .txt_ttl{
	font-size: 60px;
	padding: 10px 30px 10px 20px;
	line-height: 1;
	margin-bottom: 10px;}
#sec_ttl .txt_sub{
	padding: 5px 20px;
}
#sec_ttl .page_ttl {
  color: #fff;
  font-weight: bold;
  padding-right: 2em;
  margin-left: 5%; }
.blk_sec_ttl{
	position: relative;
	    margin-bottom: 50px;
}
.blk_sec_ttl .area_img{
	margin-left: 25vw;
}
.blk_sec_ttl .area_img img{
	width: 100%;
}
.blk_sec_ttl .area_txt {
    width: 100%;
    /*position: absolute;
    bottom: -1vw;*/
    font-size: 1.5vw;
	margin-top: -8vw;
}
.blk_sec_ttl .area_txt h2 .font_merriweather{
	text-shadow: -0.01em -0.01em 0 #fff;
}
.blk_sec_ttl .area_txt.no_img{
	margin-top: 0;
}
#sec_post .entry-header,
#sec_posts .entry-header{
	padding: 50px 0;
}
#sec_post .entry-content,
#sec_posts .entry-content{
	margin-bottom: 50px;
}

.nav-links [class^="icon-"]{
	font-size: 1.5em;
    vertical-align: text-bottom;
}
/**404**/
.error-404 {
  padding: 50px 0; }

/**Instagram**/
#sec_instagram #gallery li{
	margin-bottom: 0.6%;
}
#sec_instagram #gallery li a{
	width: 100%;
	height: 100%;
}

#sec_instagram #gallery li a img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/*体験*/
.blk_taiken{
	background-image: url("../images/common/blk_taiken-bg.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	padding: 8vh 0;
    max-height: 380px;
}
.nav_taiken{
	display: block;
	position: relative;
}
.nav_taiken::after {
  font-family: "icontennoz";
  content: "\e900";
  font-weight: normal;
  font-size: 1.6em;
  color: #ffffff;
  position: absolute;
  right: 3%;
  top: 50%;
  transform: translateY(-40%);
  z-index: 5; }

.nav_taiken:hover:after {
	transform: translate(0.5em, -40%);
	transition: transform .5s; }
/* ▲　メイン　▲ */
/* ▼　フッター　▼ */
footer{
	position: relative;
}
footer .bgc_black{
	padding: 40px 0 30px;
}
#footer_logo .icon-logo{
	font-size: 70px;}
#footer_logo .area_sns li{
	display: inline-block;
	padding: 5px; }
#footer_logo .area_sns li:first-child{
	padding-left: 0;}
#footer_logo .area_sns a{
	color: #fff; }
#footer_logo .area_sns [class^="icon-"]{
	font-size: 40px;
}
#footer_nav{
	max-height: 14em;
}
#footer_nav .nav_left{
	min-width: 8em;
	margin-left: 50%;
}
#footer_nav .nav_right{
	min-width: 13em;
	margin-left: 30%;
}
#footer_nav .area_btn{
	bottom: 0em;
    left: 50%;
    width: calc(30% + 21em);
}
#footer_nav .nav_btn{
	color: #000000 !important;
}
#footer_nav .nav_btn:first-child{
	margin-left: 0;
}
footer .copyright{
	padding: 1em 0 2em;
}
/* ▲　フッター　▲ */
/* ▼　レスポンシブ　▼ */
/*===============================================*/
@media screen and (min-width: 1001px) {
  .nav_taiken::after{
	font-size: 22.5px;
	}
}
@media screen and (min-width: 768px) {
  .sponly {
    display: none !important; } }
/*===============================================
●smart.css  画面の横幅が767pxまで
===============================================*/
@media screen and (max-width: 767px) {
  .pconly {
    display: none !important; }

  .sponly {
    display: block; }
	
  main {
    margin-top: 90px; }
	
  #site_title img{
	width: 60%;
	max-width: 240px;
	}
  #site_title{
	text-align: left;
	position: relative;
	z-index: 100;}
	.nav_taiken::after{
		font-size: 3.2vw;
	}
	footer .copyright{
		padding-bottom: calc(70px + 2em);}
}
/*===============================================
●smart.css  画面の横幅が480pxまで
===============================================*/
@media screen and (max-width: 480px) {
	main{
		font-size: 12px;
	}
	#sec_ttl{
		font-size: 2.9vw;
	}
	.blk_sec_ttl .area_txt .txt_xxxxxbig{
		font-size: 21px;
	}
	.blk_sec_ttl .area_txt .txt_xxbig{
		font-size: 11px;
	}
}
