@charset "utf-8";
/* CSS Document */

.top_cms_box{
	    position: relative;
}
.top_cms_box:before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -10px;
    display: inline-block;
    width: 50px;
    height: 2px;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translate(-50%);
    background-color: #000;
}
.top_cms_box:last-child:before {
    display: none;
}




/*-------------------------------------------------------
				ページタイトルアニメーション
-------------------------------------------------------*/
p > span > span{
     display: inline-block;
     -webkit-transform: translateY(20px);
     transform: translateY(20px);
     -webkit-animation: .35s cubic-bezier(.175,.885,.32,1.275) both;
     animation: .35s cubic-bezier(.175,.885,.32,1.275) both;
     opacity: 0;
}
p > span > span:nth-child(1){
-webkit-transition-delay: 200ms;transition-delay: 200ms;
-webkit-animation-delay: 200ms;animation-delay: 200ms;
}
p > span > span:nth-child(2){
-webkit-transition-delay: 250ms;transition-delay: 250ms;
-webkit-animation-delay: 250ms;animation-delay: 250ms;
}
p > span > span:nth-child(3){
-webkit-transition-delay: 300ms;transition-delay: 300ms;
-webkit-animation-delay: 300ms;animation-delay: 300ms;
}
p > span > span:nth-child(4){
-webkit-transition-delay: 350ms;transition-delay: 350ms;
-webkit-animation-delay: 350ms;animation-delay: 350ms;
}
p > span > span:nth-child(5){
-webkit-transition-delay: 400ms;transition-delay: 400ms;
-webkit-animation-delay: 400ms;animation-delay: 400ms;
}
p > span > span:nth-child(6){
-webkit-transition-delay: 450ms;transition-delay: 450ms;
-webkit-animation-delay: 450ms;animation-delay: 450ms;
}
p > span > span:nth-child(7){
-webkit-transition-delay: 500ms;transition-delay: 500ms;
-webkit-animation-delay: 500ms;animation-delay: 500ms;
}
p > span > span:nth-child(8){
-webkit-transition-delay: 550ms;transition-delay: 550ms;
-webkit-animation-delay: 550ms;animation-delay: 550ms;
}
p > span > span:nth-child(9){
-webkit-transition-delay: 600ms;transition-delay: 600ms;
-webkit-animation-delay: 600ms;animation-delay: 600ms;
}
p > span > span:nth-child(10){
-webkit-transition-delay: 650ms;transition-delay: 650ms;
-webkit-animation-delay: 650ms;animation-delay: 650ms;
}
p > span > span:nth-child(11){
-webkit-transition-delay: 700ms;transition-delay: 700ms;
-webkit-animation-delay: 700ms;animation-delay: 700ms;
}
p > span > span:nth-child(12){
-webkit-transition-delay: 750ms;transition-delay: 750ms;
-webkit-animation-delay: 750ms;animation-delay: 750ms;
}
p > span > span:nth-child(13){
-webkit-transition-delay: 800ms;transition-delay: 800ms;
-webkit-animation-delay: 800ms;animation-delay: 800ms;
}
p > span > span:nth-child(14){
-webkit-transition-delay: 850ms;transition-delay: 850ms;
-webkit-animation-delay: 850ms;animation-delay: 850ms;
}
p > span > span:nth-child(15){
-webkit-transition-delay: 900ms;transition-delay: 900ms;
-webkit-animation-delay: 900ms;animation-delay: 900ms;
}

p.is-show > span > span
{
     -webkit-animation-name: slide-bs;
     animation-name: slide-bs;
     opacity: 1;
}
@keyframes slide-bs{
     0%{-webkit-transform: translateY(20px);transform: translateY(20px);}
     100%{-webkit-transform: translateY(0);transform: translateY(0);}
}

/*-------------------------------------------------------
				ローディング画面
-------------------------------------------------------*/
#loading{
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 999999;
	background-color: #fff;
top:0;
}
#loading_line{
	position: absolute;
	top: 0;
	margin: auto;
	width: 100%;
	height: 100%;
}
#loading_line .line{
	position: absolute;
	top: 0;
	width: 0;
	height: 100%;
	z-index: 1;
}
#loading_line .line2{
	position: absolute;
	top: 0;
	width: 0;
	height: 100%;
	z-index: 2;
	background-color: #fff;
}
#loading_logo{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 60%;
	max-width: 150px;
	z-index: 3;
}




/*-------------------------------------------------------
				スクロールアニメーション
-------------------------------------------------------*/
.img-container{
    overflow: hidden;
    position: relative;
	display: inline-block;
}
 
.img-container_img{
  
    opacity: 0;
    position: relative;
    transition:all .5s .3s ease; 
    z-index: 0;
}
.all_page .img-container_img{
    transition:all 1.5s 0.3s ease; 
}
.all_page .img-container:before{
    transition:all 1.8s 0s ease; 
}
.img-container:before{
    background: #669ca1;
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    transform: translateX(-100%);
    transition:all 1.2s 0s ease; 
    width: 100%;
    z-index: 1;     
}
.t_cms_img2 .img-container:before{
    background: #bf9d74;
}
.img-container.active .img-container_img{
    opacity: 1!important;
}
 
.img-container.active:before{
    transform: translateX(100%);        
}

/*-------------------------------------------------------
				ふわっと表示 
-------------------------------------------------------*/
.delighter {
    transition: transform .5s ease-out, opacity .5s ease-out;
      transform: translatey(80px);
      opacity: 0;
	
   }
.delighter.started {
      transform: none;
      opacity: 1;
}

.delighter.started.ended {
    transform: translatey(0%);
}
.main_img_wrap .catch{
	    bottom: 100px;
    left: 15px;
	
}
.main_img_wrap .catch span{
	line-height: 2.6;
    padding: 20px 0px;
}
/*-------------------------------------------------------
					all page
-------------------------------------------------------*/
html{font-size:100%;}
body{
	font-size: 16px;
}
main{

}
.logo{
	text-align: center;
}
.cate img,.cate_box img{
	box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}
.cate_list{
	border-bottom: 2px solid #333;
	margin-bottom: 100px;
	display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    justify-content: flex-start;
    align-items: flex-start;
	flex-direction: row;
	font-size: 18px;
}
.cate_list li{
	margin-right: 10px;
	margin-bottom: 15px;
	width: 23%;
	text-align: center;
}
.cate_list li a::before{
	font-family: "FontAwesome";
	content: '\f0da';
	padding-right: 10px;
}
.cate_list li a:hover::before{
	color: #333;
}
.cate_list li a{
	display: block;
	padding: 10px;
}
#page-top{
	position: fixed;
	right: 10px;
}
#page-top a{
	display: block;
	width: 50px;
	height: 50px;
	position: relative;
}
.width_95per{
	width: 95%!important;	
}
#wrap{
	width: calc( 97% + 0.5px );
    margin: auto;
    margin-top: 1.5vw;
}


/* -- page-top -- */
#page-top{
	position: fixed;
	right: 20px;
	z-index: 99; 
}
#page-top a{
	display: block;
	width: 50px;
	height: 50px;
	position: relative;
}
#page-top a div{
	margin: auto;
    text-align: center;
}
#page-top a div i{
	text-align: center;
    top: 0;
    bottom: 0;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 10px;
    line-height: 1.2;
    margin: auto;
}


/* -- ヘッダー -- */
header{
z-index: 9;
}
#header{

}
.menu .nav{
	width: 95%!important;
}
.menu .nav ul li{
	-webkit-transform: skewX(160deg);
	-moz-transform: skewX(160deg);
	transform: skewX(160deg);
	margin-left: 10px;
	line-height: 1.2;
}
.menu .nav ul li:first-child{
	margin-left: 0px;	
}
.menu .nav ul li a{
	display:block;
	-webkit-transform: skewX(-160deg);
	-moz-transform: skewX(-160deg);
	transform: skewX(-160deg);
	padding-left: 10px;
}
.menu .nav ul li:first-child a{
	padding-left: 0px;	
}





/* -- フッター -- */
.bottom_menu{
	z-index: 1;
}
.bottom_menu li a{
	transition: 0.3s;
}
/*.bottom_menu li{
	-webkit-transform: skewX(160deg);
	-moz-transform: skewX(160deg);
	transform: skewX(160deg);
	line-height: 1.2;
	border-right: 1px solid #333;
}
.bottom_menu li:last-child{
	border-right: none;
}
.bottom_menu li:first-child{
	margin-left: 0px;	
}
.bottom_menu li a{
	display:block;
	-webkit-transform: skewX(-160deg);
	-moz-transform: skewX(-160deg);
	transform: skewX(-160deg);
	padding-left: 5px;
}*/
footer{
    z-index: 0;
    height: 480px;
	background-color: #333;
}

#footer{
	left: 0;
	right:0;
	bottom: 0;
	height: 480px;
    margin: auto;
}
footer ul li{
	max-width: 30px !important;
}
.map iframe{
	width: 100%;
	height:300px;
}
.sns_box{
	padding-top: 70px;
	padding-bottom: 70px;
}
.sns_links{
   margin-left: auto;
}
.sns_links li{
	max-width: 25px;
}
.sns_links li:hover{
	opacity: 0.7;
	transition:0.3s;
}
.all_page .sns_box{
	padding-top: 70px;
	padding-bottom: 30px;
}



/*-------------------------------------------------------
					index.html 
-------------------------------------------------------*/
.top_page header{
	width: 97%;
}
.is-fixed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100%;
  transition: 0.3s;

}
.is-fixed .logo{
  width: 7%!important;
  transition: 0.3s;
}
/*----　メインイメージ　----*/
.main_img_wrap{
	height: 100vh;
	width: 97%;
	z-index: 1;
	background-color: #fff;
}
.main_img{
	position: static!important;
}
.top_nav{
	width: 95%;
}
.top_nav ul li{
	-webkit-transform: skewX(160deg);
	-moz-transform: skewX(160deg);
	transform: skewX(160deg);
	margin-left: 10px;
	line-height: 1.2;
}
.top_nav ul li a{
	display:block;
	-webkit-transform: skewX(-160deg);
	-moz-transform: skewX(-160deg);
	transform: skewX(-160deg);
	padding-left: 10px;

}
/*----　ページャー　----*/
.main_img_wrap .navi{
	bottom: 80px;
    right: 15px;
}
.navi a {
    display: inline-block;
    width: 50px;
    margin: 0 7px;
    line-height: 50px;
    text-decoration: none;
    color: #FFFFFF;
    border: 1px solid #FFFFFF;
	text-align: center;
	transition: 0.3s;
}
.navi a:hover {
    background-color: rgba(255, 255, 255,0.3);
}
.fa-angle-left:before {
	font-family: "FontAwesome";
    content: "f104";
}
.fa-angle-right:before {
	font-family: "FontAwesome";
    content: "f105";
}


/*----　スライドショー以下　----*/
.main_wrap{
	margin-top: 94vh;
	background-color: #fff;
	z-index: 9;
}

/*----　コンテンツ　----*/
.svg_box .dec{opacity: 0}
.dec {
    width: 35px;
}
#dec1,#dec3,#dec5,#dec7{
	margin-left: 48.5%;
	margin-top: 5px;
	margin-bottom: 5px;
}
#dec2,#dec4,#dec6,#dec8{
	margin-left: 51.5%;
	margin-top: 5px;
	margin-bottom: 5px;
}
svg {
	fill: currentColor;
}
footer .svg_box{
	    position: absolute;
	width: 50%;
	max-width: 200px;
	    transform: rotate(-40deg);
    -moz-transform: rotate(-40deg);
    -webkit-transform: rotate(-40deg);
}
footer svg{
	opacity: 0.1;
}
footer .dec {
    width: 80px;
	    transform: rotate(40deg);
    -moz-transform: rotate(40deg);
    -webkit-transform: rotate(40deg);
}
#dec9,#dec11,#dec13,#dec15{
	margin-left: auto;
	margin-top: 5px;
	margin-bottom: 5px;
}
#dec10,#dec12,#dec14,#dec16{
	left: 100%;
	margin-top: 5px;
	margin-bottom: 5px;
}
#contents .box figure{
	width: 45%;
    position: relative;
	z-index: 1;
}
#contents .box figure:after{
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 95%;
    height: 0%;
    z-index: -1;
    border: 155px solid;
    opacity: 0.15;
}
#contents .box:nth-child(odd) figure:after{
	   right: 40%;
	    -moz-transform: translateX(50%);
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translate(50);
}
#contents .box:nth-child(even) figure:after{
    left: 40%;
	    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translate(-50);
}
#contents .box .txt_wrap{
		width: 45%;
}
#contents .box h3{
	display: inline-block;
	position: relative;
}
#contents .box h3:before {
    content: '';
    position: absolute;
    bottom: -10px;
    display: inline-block;
    width: 35px;
    border-bottom: 2px solid;
}


/*----　TOP CMS　----*/
#top_cms:before {
    content: '';
    display: inline-block;
    width: 85%;
    height: 100%;
    background-color: #ffffff;
    position: absolute;
    z-index: 0;
}
#top_cms .line{
	z-index: 9;
    position: relative;
    width: 150px;
    margin: auto;
    padding-top: 80px;
}
#top_cms .top_cms_wrap{
	z-index: 9;
	padding-top: 80px;
}
#top_cms .top_cms_box:last-child{
	padding-bottom: 0px;
	margin-bottom: 0px;
}
#top_cms .cms_title p{
	letter-spacing: 0px;
}
#top_cms .cms_title h2{
	display: inline-block;
	position: relative;	
}
#top_cms .cms_title h2:before {
    content: '';
    position: absolute;
    bottom: -10px;
    display: inline-block;
    width: 35px;
    border-bottom: 2px solid;
}


.top_cms_box .more_box {
    width: 30%;
    height: 60px;
    min-width: 220px;
	max-width: 250px;
    margin: auto;
    opacity: 1 !important;
    display: block;
    margin-top: 50px;
}
.top_cms_box .more_box .more{
	height: 60px;
    padding-left: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative;

}
.top_cms_box .more_box .more:before {
    content: '';
    display: block;
    position: absolute;
    top: 3px;
    bottom: 0;
    margin: auto;
    left: 12px;
    width: 25px;
    height: 1px;
    background-color: #2d2d2d;
    transform-origin: left;
    transition: .23s cubic-bezier(0.79, 0.17, 0.15, 0.96);
    transform: scaleX(0);
}
.top_cms_box .more_box .more:hover:before {
    transform: scaleX(1);
    transition: .28s cubic-bezier(0.79, 0.17, 0.15, 0.96);
}
.top_cms_box .more_box .more:after {
    content: "";
    position: absolute;
    left: -1px;
    top: -1px;
    height: calc(100% + 2px);
    width: calc(100% + 2px);
    border: solid 1px #2d2d2d;
    opacity: 0;
    transition: .5s;
    pointer-events: none;
}
.top_cms_box .more_box .more div{
    position: relative;
    z-index: 1;
    font-weight: bold;
    padding-right: 8px;
    transition: .3s cubic-bezier(0.3, 0.2, 0.1, 1);
    transform: translateX(0);
}
.top_cms_box .more_box .more:hover div {
    transform: translateX(30px);
}
.top_cms_box .more span {
    position: absolute;
    top: 50%;
    right: 20px;
    height: 13px;
    margin-top: -6px;
    width: 24%;
    transition: .3s;
    opacity: 1;
    transform: translateX(0) scale(1);
}
.top_cms_box .more span:before {
    content: '';
    display: block;
    position: absolute;
    top: 6px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #2d2d2d;
    transform-origin: right;
    transition: .3s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.top_cms_box .more span:after {
    content: '';
    display: block;
    position: absolute;
    top: 1px;
    right: -5px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #2d2d2d;
    transform: scale(0.7);
    transform-origin: center 70%;
}


/* -- その他リンク -- */
.other .box{
	height: 400px;
	width: 50%;
	overflow: hidden;
    background-color: #fff;
    border: 2px solid #333;
	transition: all .4s ease-in-out;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.other .box:last-child{
	border-left: none;
}
.other .box figure{
	overflow: hidden;
	opacity: 0;
	transition:opacity 0.5s;
}
.other .box:hover figure{
	
}
.other .box figure img{
	height: 400px;
	object-fit: cover;
	font-family: 'object-fit: cover;'
}
.other .box:hover figure{
	opacity: 0.7;
}
.other .box:hover{
	background-color: #000;
}
.other .box:hover p,.other .box:hover h2 span{
	color: #fff;
}
.other .box_item {
	width: 100%;
	height: 100%;
	
}
.other .box_title{
    width: 100%;
    position: relative;
	display: inline-block;
}
.other .box_title:before{
    content: '';
    position: absolute;
    bottom: -10px;
    display: inline-block;
    width: 35px;
    border-bottom: 2px solid;
    left: 50%;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translate(-50%);
}
.other .box_title2{
    padding: 7px;
	min-width: 200px;
}






/*-------------------------------------------------------
					下層ページ
-------------------------------------------------------*/
.all_page{
	position: relative;
	z-index: 1;
}
.all_page:before {
    content: '';
    display: inline-block;
    width: 85%;
    height: 100%;
    background-color: #ffffff;
    position: absolute;
    z-index: 0;
    right: 0;
}
.all_page .menu{
	transition: 0.5s;
}
.all_page .menu .logo{
	z-index: 1;
}

.cms_wrap{
	position: relative;
}

/* -- ページタイトル -- */
#page_title .page_title_box {
	margin-left: 80px;
	z-index: 1;
}
.page_title_box:before {
    content: '';
    position: absolute;
    bottom: -10px;
    display: inline-block;
    width: 35px;
    border-bottom: 2px solid;
}
#title_img{
	height: 300px;
	width: 80%;
	margin-left: auto;
	z-index: 0;
	position: relative;
}
#title_img span{
	height: 300px;
	width: 100%;
}
/*#title_img:before {
    content: '';
    width: 100%;
    height: 300px;
    position: absolute;
    background-color: rgba(51, 51, 51,0.15);
}*/
/* -- page7.html -- */
#page7 #map iframe{
	width: 100%;
	height: 500px;
}
/* -- page8.html -- */
#page8 #form_box .box input::-webkit-input-placeholder,#page8 #form_box .box textarea::-webkit-input-placeholder{
	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
	font-size: 14px;
	opacity: 0.8;
}
#page8 #form_box .box input:-moz-placeholder,#page8 #form_box .box textarea:-moz-placeholder{
	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
	font-size: 14px;
	opacity: 0.8;
}
#page8 #form_box .box input::-moz-placeholder,#page8 #form_box .box textarea::-moz-placeholder{
	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
	font-size: 14px;
	opacity: 0.8;
}
#page8 #form_box .box input:-ms-input-placeholder,#page8 #form_box .box textarea:-ms-input-placeholder {
	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
	font-size: 14px;
	opacity: 0.8;
}
#page8 #form_box #form_bt div{
	display: inline-block;
	height: 50px;
	position: relative;
	-ms-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
}
#page8 #form_box #form_bt div input{
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 99;
	top: 0;
	left: 0;
	padding: 15px;
	cursor: pointer;
	border: none;
	background-color: transparent;
	-webkit-appearance: none;
}
#page8 #form_box #form_bt div:hover{
	transform: translate(0,-5px);
	box-shadow: 0 2px 4px rgba(0,0,0,0.5);
}
#page8 #form_box #form_bt div::after{
	display: block;
	position: absolute;
	width: auto;
	height: 18px;
	letter-spacing: 3px;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	line-height: 1;
	z-index: 98
}
#page8 #form_box #form_bt #submit::after{
	content: "送信";
}
#page8 #form_bt button{
	padding-left: 13px;
}

/* -- page10.html -- */
.page10 .more_box {
    height: 60px;
    margin: auto;
    opacity: 1 !important;
    display: block;
    margin-bottom: 60px;
	margin-left: 20px;
	margin-right: 20px;
	font-size:14px;
}
.page10 .more_box .more{
	height: 60px;
    padding-left: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative;

}
.page10 .more_box .more:before {
    content: '';
    display: block;
    position: absolute;
    top: 3px;
    bottom: 0;
    margin: auto;
    left: 12px;
    width: 25px;
    height: 1px;
    background-color: #2d2d2d;
    transform-origin: left;
    transition: .23s cubic-bezier(0.79, 0.17, 0.15, 0.96);
    transform: scaleX(0);
}
.page10 .more_box .more:hover:before {
    transform: scaleX(1);
    transition: .28s cubic-bezier(0.79, 0.17, 0.15, 0.96);
}
.page10 .more_box .more:after {
    content: "";
    position: absolute;
    left: -1px;
    top: -1px;
    height: calc(100% + 2px);
    width: calc(100% + 2px);
    border: solid 1px #2d2d2d;
    opacity: 0;
    transition: .5s;
    pointer-events: none;
}
.page10 .more_box .more div{
    position: relative;
    z-index: 1;
    font-weight: bold;
    padding-right: 8px;
    transition: .3s cubic-bezier(0.3, 0.2, 0.1, 1);
    transform: translateX(0);
}
.page10 .more_box .more:hover div {
    transform: translateX(30px);
}
.page10 .more span {
    position: absolute;
    top: 50%;
    right: 20px;
    height: 13px;
    margin-top: -6px;
    width: 24%;
    transition: .3s;
    opacity: 1;
    transform: translateX(0) scale(1);
}
.page10 .more span:before {
    content: '';
    display: block;
    position: absolute;
    top: 6px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #2d2d2d;
    transform-origin: right;
    transition: .3s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.page10 .more span:after {
    content: '';
    display: block;
    position: absolute;
    top: 1px;
    right: -5px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #2d2d2d;
    transform: scale(0.7);
    transform-origin: center 70%;
}

/*-------------------------------------------------------
					page8.html 
-------------------------------------------------------*/




/*-------------------------------------------------------
					page10.html
-------------------------------------------------------*/
#page10 ul li a {
	position: relative;
	padding: 1em 1em;
	line-height: 1;
	text-transform: uppercase;
	overflow: hidden;
	border-bottom: 2px solid;
	border-top: 2px solid
}
#page10 ul li a:hover{
	border-top: none;
}
#page10 ul li a::after {
  position: absolute;
  top: 0;
  left: 0;
  content: attr(data-hover);
  display: block;
  width: 100%;
  padding: 1em 0;
  transition: .3s ease-in-out;
  transform: translateY(2.2em);
}
#page10 ul li a span {
  display: inline-block;
  transition: .3s ease-in-out;
}
#page10 ul li a:hover::after,
#page10 ul li a:focus::after {
  transform: translateY(0);
}
#page10 ul li a:hover span,
#page10 ul li a:focus span {
  transform: translateY(2.2em);
}

/* ----------　1280以下 ---------- */
@media screen and (max-width: 1280px){
.top_nav ul li{
	font-size: -webkit-calc(1rem + 2px);
    font-size: calc(1rem + 2px);
}
}
/* ----------　1000以下 ---------- */
@media screen and (max-width: 1000px){
.menu,.top_nav{
	display: none;
}
	header .logo,header #nav_menu{
		display: block;
	}
/* -- ヘッダー -- */
header{
	top: 0;	
	position: absolute!important;
}
#header {
	padding-left: 2.5%;
	padding-right: 2.5%;
	transition: 0.5s;

}
.is-fixed2 {
	background-color:rgba(255,255,255,0.8);
	padding-top: 10px;
    padding-bottom: 10px;
}
header{
	z-index: 9999;	
}
header .logo{
    width: 10%;
    position: relative;
	margin-right: auto;
}
header .logo img {
    width: 100%!important;
}
/*----　メインイメージ　----*/
.main_wrap{
	padding-top: 15px;
    margin-top: 97.5vh;
}
.all_header{
	position: static!important;	
	
}
.all_header #header{
	padding-top: 5px!important;	
	padding-bottom: 10px!important;
}
}






/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
/*-------------------------------------------------------
					all page
-------------------------------------------------------*/


/* -- フッター -- */
footer {
    height: 50vh;
}
#footer {
    height: 50vh;
}
.sns_box {
    padding-top: 50px;
    padding-bottom: 50px;
}
/*-------------------------------------------------------
					index.html 
-------------------------------------------------------*/

/*----　コンテンツ　----*/
#contents .box figure:after {
    width: 85%;
    border: 80px solid;
}
#dec1, #dec3, #dec5, #dec7 {
    margin-left: 47%;
}
#dec2, #dec4, #dec6, #dec8 {
    margin-left: 53%;
}
/*----　TOP CMS　----*/
#top_cms .top_cms_box{
	padding-bottom: 80px;
	margin-bottom: 80px;
}
/* -- その他リンク -- */
.other .box {
	height: 220px;
}
.other .box figure img {
	height: 220px;
}
/*-------------------------------------------------------
					下層ページ
-------------------------------------------------------*/
#page_title{
    height: 270px;
	background-position: center center;
}
#page_title .page_title_box {
    margin-left: 30px;
}
#title_img {
    height: 270px;
}
#title_img:before {
    height: 270px;
}
/* -- page10.html -- */
.page10 .more_box{
    margin-bottom: 40px;
}
.page10 .more_box:first-child {
	margin-left: 20px;
	margin-right: 20px;
}
.page10 .more_box:first-child .more{
	justify-content: flex-start; 	
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
/*-------------------------------------------------------
					all page
-------------------------------------------------------*/
#loading_logo {
    width: 30%;
}
#page-top a{
	display: block;
	width: 30px;
	height: 30px;
	position: relative;
}
.sns_links li:last-child {
	margin-right: 0px;
}
#wrap {
    margin-top: 2.5vw;
}
#wrap{
	width: 95%;
}
.top_page header{
	width: 95%;
}
.main_img_wrap{
	width: 95%;
}
/* -- ヘッダー -- */

/* -- フッター -- */
.sns_links{
	margin: auto;	
}
footer {
    height: 80vh;
}
#footer {
    height: 80vh;
}
footer .svg_box {
    width: 40%;
}
footer .dec {
    width: 50px;
}
/* -- page-top -- */
#page-top .fas {
   line-height: 0.9;
}
#page-top a{
	display: block;
	width: 40px;
	height: 40px;
	position: relative;
}
#page-top a div p{
	font-size: 10px;
	line-height: 1.2;
}
	
/*-------------------------------------------------------
					index.html 
-------------------------------------------------------*/
/*----　メインイメージ　----*/
.main_img_wrap .catch span {
    padding: 15px 0;
}
.main_img_wrap .catch {
    bottom: 80px;
}
.main_img_wrap .navi {
    bottom: 30px;
    right: 5px;
}
header .logo {
    width: 15%;
    position: relative;
}
.is-fixed2 {
    padding-top: 5px;
    padding-bottom: 5px;
}
/* -- コンテンツ -- */

#contents .box:nth-child(even) {
    display: flex;
    flex-direction: column-reverse;
}
#contents .box .txt_wrap {
    width: 90%;
    padding-right: 0px;
}
#contents .box figure {
    width: 90%;
    margin-top: 30px;
}
#contents .box:nth-child(3) figure {
    margin-top: 0px;
}
#contents .box:nth-child(3) .txt_wrap {
    padding-left: 0px;
    margin-top: 30px;
}
#contents .box figure:after {
    width: 60%;
    border: 90px solid;
}
#contents .box:nth-child(odd) figure:after {
    right: 50%;
}
#contents .box:nth-child(even) figure:after {
    left: 50%;
}
.dec {
    width: 30px;
}
#dec2, #dec4, #dec6, #dec8 {
    margin-left: 57%;
}
#dec1, #dec3, #dec5, #dec7 {
    margin-left: 43%;
}
/*----　TOP CMS　----*/
#top_cms:before {
    width: 80%;
}
#top_cms .line{
    width: 100px;
    padding-top: 50px;
}
#top_cms .top_cms_wrap{
	padding-top: 50px;
}
.top_cms_box:before {
    height: 1px;
}
/* -- その他リンク -- */
.other .logo2 {
	max-width: 80px;
}
.other .other_link:before {
	height: 70%;
}
.other .box {
    width: 100%;
}
.other .box:first-child {
    border-bottom: none;
}
.other .box:last-child {
    border-left: 2px solid #333;
}

/*-------------------------------------------------------
					下層ページ
-------------------------------------------------------*/
.all_page:before {
    width: 80%;
}
#page_title {
    height: 200px;
	padding-top: 0px;
}
#page_title h2 ,#page_title p {
	color: #fff;
}
#page_title .page_title_box {
    margin-left: 15px;
}
#page_title #title_img {
    height: 200px;
	width: 100%;
}
#title_img:before {
    height: 200px;
}
.cate_list li {
    width: 100%;
    text-align: left;
}
/*-------------------------------------------------------
					page2.html
-------------------------------------------------------*/	
.pager li:not(.prev):not(.next){
	display: none
}
.pager li {
    margin-right: 25px;
    margin-left: 25px;
}
/*-------------------------------------------------------
					page7.html
-------------------------------------------------------*/
#page7 #map iframe{
	height: 350px;
}
/*-------------------------------------------------------
					page10.html
-------------------------------------------------------*/
.page10 .more_box:first-child {
	margin-left: 20px;
	margin-right: 20px;
}
.page10 .more_box:first-child .more {
    justify-content: flex-start;
}
.page10 .more_box {
    margin-bottom: 40px;
}
.page10 .more span {
    width: 20%;
}
#page_title .page_title_box{
	width: 100%;
    margin-left: 0px;
    height: 200px;
}
.page_title_box:before {
    bottom: 20px;
	color: #fff;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}
#page_title .page_title_box .wrap{
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
	text-align: center;
	width: 90%;
}
#page_title p{
	padding-right: 0px;
}
#page_title p:last-child {
	padding-bottom: 0px;
}
#title_img:after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 200px;
    top: 0;
    position: absolute;
    left: 0;
}
#page_title  .img-container:after{
    transition:all 1.8s 0s ease; 
}
#page_title .img-container::after{
        background-color: rgba(102, 156, 161,0.4);
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    transform: translateX(-100%);
    transition:all 1.2s 0s ease; 
    width: 100%;
    z-index: 1;     
}
#page_title .img-container.active::after{
    transform: translateX(0%);        
}
.main_img_wrap .catch {
    bottom: 170px;
}
.main_img_wrap .catch span {
    padding: 10px 0;
	line-height: 3;
}
.main_img_wrap .navi {
    bottom: 100px;
    right: 5px;
}
}


@media all and (-ms-high-contrast: none){
.main_img_wrap .catch span{padding: 23px 0px 17px;}
.top_cms_box .more_box .more div{padding-top:5px;}
.dec {
    height: 35px;
}
footer .dec {
   height: 80px;
}
footer .svg_box {
	  top: 35%;
  left: 65%;
    transform: rotate(-40deg) translateY(-50%) translateX(-50%);
    -moz-transform: rotate(-40deg) translateY(-50%) translateX(-50%);
    -webkit-transform: rotate(-40deg) translateY(-50%) translateX(-50%);
}

main{
	overflow: hidden;
	display: block;
}
#page8 #form_box .box input:-ms-input-placeholder, #page8 #form_box .box textarea:-ms-input-placeholder{
	padding: 10px 5px 5px!important;
}
#top_cms .line{
	height: 15px;
}	
	
.pager li a span {
	padding-top: 15px;
}
#page8 #tel_CONTACT p a{
	padding-top: 25px;
}
#page8 #form_bt button{
	padding-top: 20px;
}
#page9 p a{
	padding-top: 10px;
}
.page10 .more_box .more div{padding-top: 5px;}
}


/* ---------- スマホIE処理 ---------- */
@media screen and (max-width: 667px) and (-ms-high-contrast: none){
.dec {
    height: 30px;
}
footer .dec {
   height: 50px;
}
}