@import url('https://fonts.googleapis.com/css?family=Raleway:200,400,600,800&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,700&display=swap&subset=japanese');
@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');


/*========= LoadingのためのCSS ===============*/

/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999;
  background:#fff;
  text-align:center;
  color:#fff;
}

/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo img {
  width:100%;
  max-width: 500px;
}
#splash_logo h2{
	font-family: 'Shippori Mincho', serif;
    color: #6c757d;
    color: #222;
    font-weight: 300;
    line-height: 1.7;
	font-size: 1.2rem;
	margin-top: 1rem;
	color: #ACB6E5;
	background: -webkit-linear-gradient(0deg, #222, #aaa);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
  }

/* fadeUpをするアイコンの動き */

.fadeUp{
animation-name: fadeUpAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(25px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/*=======================================================
スタートアニメーション 
=======================================================*/

#is-loading {
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: #FFF;
	z-index: 9998;
   }
   #loading {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 300px;
	height: 300px;
	margin-top: -150px;
	margin-left: -150px;
	text-align: center;
	color: #fff;
	z-index: 9999;
   }
.start {
	/*background:url(/html/img/sansoufukugou/sansoufukugou_st.jpg) center/cover no-repeat ;*/
	background-color: #fff;
	position: fixed;
	top: 0;
	left: 0;
	height: 100vh;
	width: 100%;
	z-index: 9000;
	text-align: center;
}
/*対象のテキスト*/
.start .start_title_a h1{
    position: relative;
    top: 50%;  
    width: 100%;
    margin: 0 auto;
    border-right: 2px solid rgba(0,0,0,.75);
    text-align: center;
    white-space: nowrap;
	overflow: hidden;
	transform: translateY(-50%); 
	color: #333;   
}
.anim-typewriter{/*アニメーションセッティング*/
	animation: typewriter 4s steps(44) 1s 1 normal both,
   blinkTextCursor 500ms steps(44) infinite normal;
  }
  @keyframes typewriter{/*タイプライターライクなアニメーション*/
	from{width: 0;}
	to{width: 50%;}
  }
  @keyframes blinkTextCursor{/*点滅するカーソルのアニメーション*/
	from{border-right-color: rgba(0,0,0,.75);}
	to{border-right-color: transparent;}
  }

.start span {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: none;
	z-index: 9999;
}

.start p.skip {
	position: fixed;
	top: 3%;
	right: 1%;
	color: #333;
	font-size: 80%;
	z-index: 9999;
	display: none;
	text-decoration: underline;
	transform: translate(-50%, -50%);
}
.start p.skip:hover {
	cursor: pointer;
}

.fadein {
	opacity : 0;
	transform : translate(0, 50px);
	transition : all 1s;
  }
  .fadein.active{
	opacity : 1;
	transform : translate(0, 0);
  }

.fadein:nth-of-type(2) {
	-moz-transition-delay:300ms;
	-webkit-transition-delay:300ms;
	-o-transition-delay:300ms;
	-ms-transition-delay:300ms;
	}
/* 3つ目の要素に400msのdelayをかける */
.fadein:nth-of-type(3) {
	-moz-transition-delay:600ms;
	-webkit-transition-delay:600ms;
	-o-transition-delay:600ms;
	-ms-transition-delay:600ms;
	}
	/* 3つ目の要素に400msのdelayをかける */
.fadein:nth-of-type(4) {
	-moz-transition-delay:800ms;
	-webkit-transition-delay:800ms;
	-o-transition-delay:800ms;
	-ms-transition-delay:800ms;
	}
.fadein:nth-of-type(5) {
	-moz-transition-delay:1000ms;
	-webkit-transition-delay:1000ms;
	-o-transition-delay:1000ms;
	-ms-transition-delay:1000ms;
	}
/*=======================================================
ヘッダー・フッター部bootstrap打ち消し
=======================================================*/
header #header-inner h1 {
	font-size: 12px;
	margin-bottom: initial;
    font-weight: normal;
    line-height: 1.6;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
}
header #header-logo {
    margin-bottom: initial;
}
#en {
	text-decoration: underline;
    font-family: initial;
}
article #heading h1 {
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	font-weight: initial;
}
article #pan-list .pan-list-wrapper{
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
    font-weight: initial;
}
article #pan-list .pan-list-wrapper a{ 
	font-family: sans-serif;
    font-weight: initial;
}
footer .footer-wrap-bottom-inner .footer-bottom-block.base p {
	margin-bottom: 0;
}
#top_btn
{
    position: fixed;
    bottom: 0;
    right: 0;
    width: 60px;
    height: 56px;
    background-color: #4b3627;
    padding: 6px 3px;
    z-index: 99;
}
#top_btn span:after {
    content: '';
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    position: absolute;
    display: block;
    margin-top: -8px;
    margin-left: -8px;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}


/*=======================================================
ナビメニュー 
=======================================================*/
.top_image nav {
	display: flex;
    align-items: center;
	top: 0;
	right: 0;
	position: fixed;
	z-index: 1000;
}
.top_image .logo h1 {
	font-size: 20px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 3px;
}
/* nav-links */
.top_image .nav-links {
	display: flex;
	align-items: center;
	margin-left: auto;
}
.top_image .nav-links li {
	list-style: none;
	margin: 0 15px;
	text-align: center;
}
.top_image .nav-links li a {
	text-decoration: none;
	color:#fff;
	position: relative;
	font-family: 'Shippori Mincho', serif;
	line-height: 2.5;
	font-size: .9rem;
}

/* menu */
.top_image .menu {
    cursor: pointer;
    border: none;
    outline: none;
    z-index: 1;
}
.top_image .menu .bar {
	width: 20px;
	height: 2px;
	background: #fff;
	border-radius: 5px;
	opacity: 1;
	visibility: visible;
	transition: 0.5s ease;
	transform-origin: left;
}
.top_image .menu .menubg {
	background:#4b3627;
    padding: 20px;
    top: 0;
    right: 0;
}
.top_image .menu .bar1 {
	margin-bottom: 5px;
}
.top_image .menu .bar3 {
	margin-top: 5px;
}
.top_image .menu.toggle .bar1 {
	transform-origin: left;
	transform: rotate(45deg);
}
.top_image .menu.toggle .bar2 {
	opacity: 0;
	visibility: hidden;
}
.top_image .menu.toggle .bar3 {
	transform-origin: left;
	transform: rotate(-45deg);
}
/* responsive */
	article#article {
		padding:0!important;
	}
	.top_image .nav-links {
		flex-direction: column;
		position: fixed;
		top: 0;
		left: 100%;
		width: 40%;
		height: 100%;
		background: #333;
		transition: 0.5s ease-out;
		padding-top: 100px;
		opacity: 0.7;
	}
	.top_image .nav-links li {
		 text-align: center;
		 width: 100%;
		 display: block;
	}
	.top_image .menu {
		 display: block;
		 margin-left: auto;
	}

	.top_image .menu.toggle + .nav-links {
		 transform: translateX(-100%);
	}

	.headerColor-default {
			background: #000;
		}

	@media (max-width: 576px){
		.top_image .nav-links {
			width: 100%;
		}
	}
/*=======================================================
コンテナ幅指定
=======================================================*/
#main-container,
article .main-one-col,
.main-one-col .col-main{
    width: 100%;
    margin: 0 auto;
}
.container-fluid {
	/*width: 950px!important;*/
	/*max-width: 1024px;/*コンテナ最大幅*/
	/*max-width: 1200px;*/
	margin-right: 0;
	margin-left: 0;
	padding-left: 0!important;
	padding-right: 0!important;
}
.row {
    margin-right: 0!important; 
    margin-left: 0!important;
}
.bg_layer{/*max幅用のクラス*/
	width: 100%;
	background-color: #FBFAF4;
	position: relative;
	/*padding-top: 100px;*/
}
.bg_layer_w{/*max幅用のクラス*/
	width: 100%;
	background-color: #fff;
	position: relative;
	/*padding-top: 100px;*/
}
/*=======================================================
TOP画像
=======================================================*/
#wrap-bg > div{
	z-index: 0 !important;
  }
.top_image{
	width: 100%;;
	height: 100vh;
	background-position:center center;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
 }

  @keyframes fadeIn { /*上のbody内で呼び出しているアニメーションと名前をそろえる*/
    0% {opacity: 0} /* 始め */
    100% {opacity: 1} /* 終わり */
	}
	/*古いブラウザ用*/
	@-webkit-keyframes fadeIn {
		0% {opacity: 0}
		100% {opacity: 1}
	}
	/*ヘッダー部レイヤー調整*/
		header {
			height: 88px;
			display: none!important;
		}
		header nav#nav {
			height: 62px;
		}
		article #heading {
			z-index: 1;
			position: relative;
			display: none;
		}
		article #pan-list {/*ヘッダー部は非表示、クラス指定に変更しフッターへ移動*/
			z-index: 1;
			position: relative;
			display: none;
		}
		footer {
			z-index: 1;
			position: relative;
			border-top: 0;
		}

		article {
			padding-bottom: 0;
			padding-top: 0;
		}

 .top_image h1{
	font-size: initial;
 }
 .top_image .contents-frame{
    margin: 0;
    position: absolute;
    left: 50%;
	/*top: 50%;*/
	top: 45%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	max-width: 150px;
 }
 .contents-frame img{
	width: 150px;
	animation-name: fadein;
    animation-duration: 2s;
}

@keyframes fadein {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.top_image p.scroll_anime {
	display: inline-block;
	position: absolute;
	box-sizing: border-box;
	left: 50%;
	bottom: 0;
	z-index: 2;
	padding: 10px 10px 110px;
	overflow: hidden;
	color: #fff;
	font-size: 14px;
	font-family: 'Sawarabi Gothic', sans-serif;
	font-weight: 300;
	letter-spacing: .2em;
	/*text-transform: uppercase;*/
	text-decoration: none;
	/*writing-mode: vertical-lr;*/
	margin-bottom: 0;
	transform: translate(-50%, 35%);
    -webkit-transform: translate(-50%, 35%);
    -ms-transform: translate(-50%, 35%);
  }
  .top_image p.scroll_anime::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 1px;
	height: 100px;
	background: #fff;
	animation: sdl 2s cubic-bezier(1, 0, 0, 1) infinite;
  }

  @keyframes sdl {
	0% {
	  transform: scale(1, 0);
	  transform-origin: 0 0;
	}
	30% {
	  transform: scale(1, 1);
	  transform-origin: 0 0;
	}
	70% {
	  transform: scale(1, 1);
	  transform-origin: 0 100%;
	}
	100% {
	  transform: scale(1, 0);
	  transform-origin: 0 100%;
	}
  }

  .scroll-anime a {
	position: absolute;
	bottom: 20px;
	left: 50%;
	z-index: 2;
	display: inline-block;
	-webkit-transform: translate(-50%,, -50%);
    transform: translate(-50%, -50%);
	text-decoration: none;
	color: #fff!important;
	padding-top: 60px;
	font-family: 'Shippori Mincho', serif;
	font-size: .7rem;
  }
  .scroll-anime a span {
	position: absolute;
	top: 0;
	left: 50%;
	width: 30px;
	height: 50px;
	margin-left: -15px;
	border: 2px solid #fff;
	border-radius: 50px;
	box-sizing: border-box;
  }
  .scroll-anime a span::before {
	position: absolute;
	top: 10px;
	left: 50%;
	content: '';
	width: 6px;
	height: 6px;
	margin-left: -3px;
	background-color: #fff;
	border-radius: 100%;
	-webkit-animation: sdb 2s infinite;
	animation: sdb 2s infinite;
	box-sizing: border-box;
  }
  @-webkit-keyframes sdb {
	0% {
	  -webkit-transform: translate(0, 0);
	  opacity: 0;
	}
	40% {
	  opacity: 1;
	}
	80% {
	  -webkit-transform: translate(0, 20px);
	  opacity: 0;
	}
	100% {
	  opacity: 0;
	}
  }
  @keyframes sdb {
	0% {
	  transform: translate(0, 0);
	  opacity: 0;
	}
	40% {
	  opacity: 1;
	}
	80% {
	  transform: translate(0, 20px);
	  opacity: 0;
	}
	100% {
	  opacity: 0;
	}
  }
/*=======================================================
カテゴリー非表示
=======================================================*/
.scat_h2 {
	display: none;
}
/*=======================================================
パンくずフッター
=======================================================*/
.pan-list {
	width: 100%;
	background-color: #4b3627;
	box-sizing: border-box;
	padding: 20px;
	font-size: 0.8rem;
	color: #fff;
}
.pan-list a{
	color: #fff;
	font-family: 'Sawarabi Gothic', sans-serif;
	font-size: 0.6rem;
	font-weight: 300;
	text-decoration: underline;
}
.pan-list strong{
	color: #fff;
	font-family: 'Sawarabi Gothic', sans-serif;
	font-size: 0.6rem;
	font-weight: 500;
}
/*上記のため非表示*/
footer .footer-wrap-top {
    display: none;
}
.line {
	width:0%; /* 開始時の状態 */
	margin: 5rem auto;
	height: 1px; 
	background-color: #ccc;
	transform-origin: center;  
	transition: width 1.5s ease-in-out;
	position: relative;
  }
  .isAnimate {
	width:98%; 
  }
/*=======================================================
タイトルセクション
=======================================================*/
.title_sec{
	width: 100%;
	box-sizing: border-box;
	padding: 100px 0 0;
}
.title_sec .inner{
	display: flex;
    align-items: center;
    justify-content: center;
}
.title_sec h2{
	color: #222;
	font-family: 'Shippori Mincho', serif;
	font-size: 0.9rem;
	font-weight: 500;
	letter-spacing: 3px;
	line-height: 3;
	text-align: center;
	margin-top: 5rem;
}
.title_sec h2 img{
	display: block;
	margin: 0 auto;
	max-width: 400px;
	width: 100%;
}
.title_sec p.lead{
	font-family: 'Shippori Mincho', serif;
	font-size: 0.8rem;
	letter-spacing: 3px;
    color: #222;
	font-weight: 500;
	line-height: 3;
	visibility: hidden;
	transition: 2000ms;
	opacity: 0;
	text-align: center;
}
.title_sec p.isAnimate2{
	visibility: visible;
	opacity: 1;
}
@media (max-width: 949px){
	.title_sec h2 img{
		width: 350px;
	}
}
@media (max-width: 576px){
	.title_sec p.lead{
		font-size: 0.7rem;
		letter-spacing: 1px;

	}
}

/*=======================================================
ストーリーセクション
=======================================================*/
#story_sec{
	width: 100%;
	position: relative;
}
#story_sec .story-title{
    width: 500px;
	margin: 0 auto;
}
#story_sec .story-title h2{
	font-family: 'Shippori Mincho', serif;
    color: #6c757d;
    color: #222;
    font-weight: 300;
    line-height: 1.7;
	font-size: 1.2rem;
	margin-top: 1rem;
	color: #ACB6E5;
	background: -webkit-linear-gradient(0deg, #222, #aaa);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#story_sec .story-title img{
	width: 100%;
}
#story_sec ul{
	display: flex;
    justify-content: center;
    align-items: center;
	padding: 0;
	margin: 0;
	position: relative;
}
#story_sec ul li h2{
	font-family: 'Shippori Mincho', serif;
	color: #6c757d;
	color: #222;
	margin-bottom: 2rem;
	font-weight: 300;
	line-height: 1.7;
	font-size: 1.5rem;
	color: #222;
	/*background: -webkit-linear-gradient(0deg, #222, #aaa);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;*/
}
#story_sec ul li p{
	font-family: 'Shippori Mincho', serif;
	color: #6c757d;
	color: #222;
    line-height: 2.5;
	font-size: .8rem;
	margin-bottom: 0;
	color: #222;
}
#story_sec ul li img{
	width: 100%;
    height: 500px;
    object-fit: cover;
    object-position: top;
}
#story_sec .inner-lh,
#story_sec .inner-rh{
	margin-top: 15rem;
}
#story_sec ul li.bg-box-a {
	padding: 50px;
}
#story_sec ul li.bg-box-b {
    background-color: rgba(255, 255, 255, 0.75);
    width: 550px;
	height: auto;
    z-index: 2;
    position: absolute;
	left: 0;
	padding: 0px 75px 75px 50px;
}
#story_sec ul li.bg-box-c {
    background-color: rgba(255, 255, 255, 0.75);
    width: 650px;
    /* height: auto; */
    z-index: 2;
    position: absolute;
    right: 10%;
    /* bottom: -15%; */
    top: 30%;
    padding: 50px;
    padding: 50px 0 0 100px;
}
#story_sec ul li.bg-box-d {
    background-color: rgba(255, 255, 255, 0.75);
    width: 550px;
	height: auto;
    z-index: 2;
    position: absolute;
	left: 0;
    top: 20%;
	padding: 0px 75px 75px 50px;
}
#story_sec ul li.img-rh {
	width: 700px;
	margin: 0 0 0 auto;
}
#story_sec ul li.icon-a {
	width: 120px;
    position: absolute;
    top: 0;
    right: 10%;
    z-index: 30;
}
#story_sec ul li.icon-b {
	width: 120px;
    position: absolute;
    top: 0;
    right: 10%;
    z-index: 30;
}
#story_sec ul li.icon-a img,
#story_sec ul li.icon-b img{
	width: 100%!important;
	height: auto;
}

@media (max-width: 992px){

	#story_sec ul li img{
		width: 95%;
	}
	#story_sec ul {
		display: initial; 
		justify-content: initial; 
		align-items: initial; 
	}
	#story_sec ul li.icon-a {
		top: 10%;
	}
	#story_sec ul li.icon-b{
		top: 10%;
	}
	#story_sec .inner-lh, #story_sec .inner-rh {
		margin-top: 5rem;
	}
}
@media (max-width: 767px){
	#story_sec ul li img {
		height: auto; 
	}
}
@media (max-width: 567px){

	#story_sec ul li h2 {
		font-size: 1.1rem;
	}
	#story_sec ul li p {
		font-size: .7rem;
		line-height: 2.2;
	}
	#story_sec ul li.bg-box-a {
		padding: 20px 20px 0 20px;
	}
	#story_sec ul li.icon-a {
		width: 90px;
	}
}

/*=======================================================
ギャラリー
=======================================================*/

#gallery_sec{
	width: 100%;
	box-sizing: border-box;
	padding: 150px 0 0;
	position: relative;
}
#gallery_sec ul {
	padding: 0;
	margin: 0;
	overflow: hidden;
}
#gallery_sec ul img{
	width: 100%;
	transition: 1s all;
}
#gallery_sec ul img:hover{
    transform: scale(1.2,1.2);
    transition: 1s all;
}

@media (max-width: 567px){

	#gallery_sec{
		padding: 100px 0 0;
	}
}
/*=======================================================
アバウト
=======================================================*/
#about_sec{
	width: 100%;
	box-sizing: border-box;
	padding: 150px 0;
	position: relative;
}
#about_sec .story-title{
    width: 500px;
	margin: 0 auto;
	text-align: center;
}
#about_sec .story-title img{
    width: 100%;
}
#about_sec .story-title h2{
	font-family: 'Shippori Mincho', serif;
    font-weight: 300;
    line-height: 1.7;
	font-size: 1rem;
	margin-top: 1rem;
	color: #4B3627;
}

#about_sec dt{
	font-family: 'Shippori Mincho', serif;
    color: #222;
    font-weight: 300;
    font-size: 1.2rem;
    margin: 1rem 0;
    text-align: center;
}
#about_sec dd{
	font-family: 'Shippori Mincho', serif;
	color: #222;
	font-weight: 300;
	font-size: .8rem;
	line-height: 1.7;
}
#about_sec p{
	text-align: right;
}


  @media (max-width: 767px){
	#about_sec{
		padding: 100px 0;
	}
}
  @media (max-width: 567px){
	#about_sec a.arrow{
		padding: 15px 20px;
	  }
}

/*=======================================================
工務店インタビュー
=======================================================*/
#interview_sec{
	width: 100%;
	box-sizing: border-box;
	margin: 50px 0;
	padding-bottom: 100px;
	position: relative;
	background-color: #ffffff;
	background-image: url(/html/img/azumino/subtle-grey.png);
}
#interview_sec .interview_top{
	position: relative;
	margin-bottom: 5rem;
}
#interview_sec .interview_top ul{
	padding: 0;
	background: #000;
}
#interview_sec .interview_top ul li img{
	opacity: .5;
}
#interview_sec .interview_top h2{
	font-weight: 700;
	font-size: 2.5rem;
	line-height: 1.7;
	font-family: 'Montserrat', sans-serif;
    position: absolute;
    z-index: 99;
	color: #fff;
	top: 35%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	margin: auto;
}
#interview_sec .interview_top h3{
	color: #fff;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: 1.5rem;
	line-height: 1.7;
	position: absolute;
    z-index: 99;
	color: #fff;
	top: 60%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	margin: auto;
}
#interview_sec .interview_top h3 span{
	color: #fff;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.7;
}
#interview_sec h3{
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.7;
	text-align: left;
}
#interview_sec h3 span{
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.7;
	text-align: center;
}
#interview_sec ul{
	margin-bottom: 0;
}
#interview_sec li.cap{
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
	font-size: .6rem;
	text-align: right;
	margin-bottom: .5rem;
    margin-top: .3rem;
}
.maru {
    text-align: center;
	font-size: 5rem;
	margin: 0 auto;
}
.maru span{
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
}
#interview_sec p{
	font-family: 'Montserrat', sans-serif;
	font-size: .6rem;
	color: #222;
	font-weight: 800;
	text-align: center;
    margin-top: -15px;
}
#interview_sec .image {
	padding: 0;
}
#interview_sec .image ul li{
	overflow: hidden;
}
#interview_sec .image img{
    height: 350px;
    object-fit: cover;
	width: 100%;
	transition: 1s all;
}
#interview_sec .image img:hover{
    height: 350px;
    object-fit: cover;
	width: 100%;
	transition: 1s all;
	transform: scale(1.2,1.2);
}
#interview_sec .profile {
    border: 1px solid #ccc;
    padding: 15px 0;
    border-radius: 5px;
}
#interview_sec .profile a{
	color: #b58726;
}
#interview_sec .profile ul{
	margin: 0;
	text-align: left;
}
#interview_sec .profile ul li{
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	line-height: 1.5;
	font-size: .7rem;
}
#interview_sec .profile ul li.company{
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: .8rem;
	line-height: 1.7;
	margin-top: .5rem;
}
#interview_sec .profile ul li.name{
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: .8rem;
	line-height: 1.7;
}
#interview_sec p.text{
	font-family: 'Shippori Mincho', serif;
    font-size: .9rem;
    color: #222;
    font-weight: 300;
    text-align: left;
    margin: 0;
    line-height: 2;
}
#interview_sec p.text span{
	display: block;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: .6rem;
	color: #222;
	font-weight: 300;
}
#interview_sec .profile li.cap_x {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: sideways;
	margin-left: .5rem;
	font-family: 'Montserrat', sans-serif;
	color: #222;
	font-weight: 800;
	border-left: 1px solid #222;
}

.et_pb_module {
	display: inline-block;
  }
  
  
  .secList {
	display: inline-block;
	color: #ccc;
	background: #fff;
	text-align: center;
	font-size: 5rem;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	border: none;  /* 枠線を消す */
    outline: none!important; /* クリックしたときに表示される枠線を消す */
    background: transparent; /* 背景の灰色を消す */
  }

  .secList p{
	color: #fff!important;
  }
.maru span{
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
}

  .secList:hover {
	background: #fff;
	color:#222;
  }
  .active-c{
	color:#222;
  }
  .active-p{
	color:#fff!important;
  }
.imgWrap{
	display: flex;
	align-items: center;
	height: 340px; 
	overflow: hidden;
}

.content {
	width: 500px;
	height: 300px;
  }
.imgWrap .content img{
	width: 100%;
}
  
  .slideshow {
	display: flex;
	animation: loop-slide 30s infinite linear 1s both;
  }
  .slide-paused:hover .slideshow {
	animation-play-state: paused;
  }
  
  .content-hover {
	transition: all 0.2s;
  }
  

  @media (max-width: 992px){
	#interview_sec .interview_top h3 {
		top: 67%;
	}
}

  @media (max-width: 767px){
	.secList {
		font-size: 3rem;
	  }
	  #interview_sec p.text {
		font-size: .8rem;
		line-height: 1.7;
	}

}
  @media (max-width: 567px){
	.content {
		width: 300px;
		height: auto;
	  }
	  .imgWrap{
		height: auto; 
	}
	.secList {
		font-size: 1.7rem;
	  }
	  #interview_sec .profile {
		margin-top: 2rem;
	}
	#interview_sec h3 {
		font-size: 1rem;
	}
	#interview_sec .image{
		padding: 0;
	}
	.maru {
		/*font-size: 3rem;*/
	}
	#interview_sec .profile ul li {
		font-size: .7rem;
	}
	#interview_sec .profile ul li.company{
		margin-top: 0;
	}
}

  @keyframes loop-slide {
	from {
	  transform: translateX(0);
	}
	to {
	  transform: translateX(-100%);
	}
  } 
  

/*========
/*=======================================================
オーナーズインタビュー
=======================================================*/
#owners_sec{
	width: 100%;
	box-sizing: border-box;
    padding: 50px 0;
	position: relative;
}
#owners_sec h3{
	text-align: center;
	font-family: 'Shippori Mincho', serif;
	font-weight: 300;
	font-size: 2rem;
	margin-bottom: 2rem;
}
#owners_sec .owners_icon p{
	font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
    font-size: .9rem;
	color: #222;
	text-align: center;
}
#owners_sec .owners_icon p span{
	font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
    font-size: .7rem;
	color: #222;
	vertical-align: middle;
}
#owners_sec .owners_icon img{
	width: 200px;
}
#owners_sec dt{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
    font-size: .9rem;
    color: #222;
	letter-spacing: 2px;
}
#owners_sec dd{
    font-family: 'Shippori Mincho', serif;
    font-weight: 300;
    font-size: .8rem;
	color: #222;
	line-height: 1.7;
}
#owners_sec li{
	overflow: hidden;
}
#owners_sec li img{
	width: 100%;
	transition: 1s all;
}
#owners_sec li img:hover{
	transition: 1s all;
	transform: scale(1.2,1.2);
}
#owners_sec ul li.cap{
	text-align: right;
	color: #222;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
	font-size: .6rem;
}

.pentagon {
	margin: 3rem auto;
	position: relative;
    width: 320px;
    border-width: 80px 0px 0;
    border-style: solid;
    border-color: #222 transparent;
  }
  
  .pentagon:before {
    content: "";
    position: absolute;
    height: 0;
    width: 0;
    top: -120px;
    left: 0px;
    border-width: 0 160px 40px;
    border-style: solid;
    border-color: transparent transparent #222;
  }
  .pentagon h2{
    position: absolute;
    color: #FFF;
    font-family: 'Shippori Mincho', serif;
    font-weight: 500;
    font-size: 1.2rem;
    top: -50px;
	left: 65px;
  }
  .pentagon span{
	position: absolute;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: .8rem;
	color: #FFF;
	top: -75px;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	letter-spacing: 2px;
  }

  #owners_sec p{
	text-align: right;
  }
  @media (max-width: 767px){
	#owners_sec h3{
		font-size: 1.5rem;
	}
}
  @media (max-width: 567px){
	#owners_sec .owners_icon img{
		width: 150px;
	}
	#owners_sec ul li.cap {
		letter-spacing: -1px;
	}
}

/*=======================================================
スペシャル
=======================================================*/
#special_sec{
	width: 100%;
	box-sizing: border-box;
	padding: 100px 0;
	position: relative;
}

#special_sec h2{
    font-family: 'Shippori Mincho', serif;
    font-weight: 300;
    font-size: 2rem;
    color: #4B3627;
    letter-spacing: 2px;
}
#special_sec dt{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
    color: #4B3627;
	letter-spacing: 2px;
	margin-bottom: 1rem;
}
#special_sec li h3{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
    font-size: 1.2rem;
	color: #4B3627;
	line-height: 1.7;
	background-color: #fff;
	padding: 15px;
    margin: 15px 0;
}
#special_sec ul li{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
    font-size: 1rem;
	color: #4B3627;
	line-height: 1.7;
}
#special_sec ul li.taidan{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
    font-size: 1rem;
	color: #fff;
	line-height: 1.7;
	background-color: #4B3627;
	padding: 5px 10px;
	margin-bottom: 20px;
}
#special_sec ul.profile{
	border-left: 1px solid #4B3627;
}
#special_sec li.cap{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 300;
    font-size: .6rem;
	color: #4B3627;
	line-height: 1.7;
}
#special_sec dd{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 300;
    font-size: .8rem;
	color: #222;
    line-height: 1.5;
}
#special_sec dd span{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
    font-size: .8rem;
	color: #4B3627;
	line-height: 1.7;
}

#special_sec dl.matsusmile a{
	color: #b58726;
}
#special_sec dl.matsusmile dt{
	font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
	color: #fff;
	line-height: 1.7;
	background-color: #4B3627;
	padding: 20px;
	text-align: center;
	margin-bottom: 0;
}
#special_sec dl.matsusmile dd{
	font-family: 'Noto Sans JP', sans-serif;
    font-weight: 300;
    font-size: .8rem;
	color: #4B3627;
	line-height: 1.7;
	background-color: #fff;
	padding: 20px;
	margin-bottom: 0;
}

#special_sec p{
	text-align: right;
  }
a.arrow{
    position: relative;
    border: 1px solid #666;
    color: #222;
    font-family: 'Shippori Mincho', serif;
    font-size: .7rem;
    font-weight: 700;
    padding: 20px 50px;
    margin-right: 2rem;
  }
  a.arrow:hover{
	color:#b58726;
  }
a.arrow:before,
a.arrow:after{
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 0;
	height: 1px;
	background: #666;
  }
a.arrow:before{
	width: 30px;
	transform: translate(30px, 0px);
  }
a.arrow:after{
	width: 10px;
    transform-origin: right center;
    transform: translate(30px, 0px) rotate(35deg);
  }

  @media (max-width: 767px){
	#special_sec dl.matsusmile dt{
		font-size: 1rem;
	}
}
@media (max-width: 567px){
	a.arrow{
		padding: 20px;
	  }
	  #special_sec p{
		text-align: center;
	  }
	  #special_sec ul li {
		font-size: .9rem;
	}
	#special_sec dt {
		font-size: 1.2rem;
	}
}

/*=======================================================
リンク
=======================================================*/
.link_sec{
	box-sizing: border-box;
	margin: 50px auto ;
	width: 100%;
	background-color: #fff;
}
.link_sec .inner{
	box-sizing: border-box;
	margin: 0 auto;
	width: 100%;
	background-color: #fff;
}
.link_sec .inner ul li a.link_button{
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	color: #222;
	font-family: 'Shippori Mincho', serif;
	text-align: center;
}
/*.link_sec .inner ul li a.link_button{
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	padding: 10px 0;
	border-bottom: 1px solid #222;
	color: #222;
	font-family: 'Shippori Mincho', serif;
	letter-spacing: 2px;
	text-decoration: none;
	background:url(/html/img/sansoufukugou/target_blank.png)  no-repeat ;
	background-size: 15px 15px;
	background-position: right 0pt top 12pt; 
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.link_sec .inner ul li a.link_button:hover {
	color: #222;
	border-bottom: 1px solid #222;
	background:url(/html/img/sansoufukugou/target_blank.png)  no-repeat ;
	background-size: 15px 15px;
	background-position: right 0pt top 12pt; 
	font-weight: 700;
  }


.link_sec img{
	display: inline-block;
	width: 15px;
}*/
.link_sec img.logo_sm{
	display: inline-block;
	width: 200px;
	margin-bottom: 2rem;
}


/*メニューをページ下部に固定*/
#sp-fixed-menu{
	position: fixed;
	width: 100%;
	bottom: 0px;
	font-size: 0;
	z-index: 99;
 }
 
 /*メニューを横並びにする*/
 #sp-fixed-menu ul{
	display: flex;
	list-style: none;
	padding:0;
	margin:0;
	width:100%;
	background: #ccc;
	justify-content: flex-end;
 }
 
 #sp-fixed-menu li{
	justify-content: center;
	align-items: center;
	width: 25%;
	padding:0;
	margin:0;
	font-size: 14px;
	border-right: 1px solid #fff;
	background: #4B3627;
 }
 
 #sp-fixed-menu span img{
	 width: 20px;

 }
 /*左側メニューを緑色に*/
 #sp-fixed-menu li:first-child{

 }
 
 /*左側メニューをオレンジ色に*/
 #sp-fixed-menu li:last-child{

 }
 
 /*ボタンを調整*/
 #sp-fixed-menu li a{
	color: #fff;
	font-family: 'Sawarabi Gothic', sans-serif;
	text-align: center;
	display:block;
	width: 100%;
    padding: 15px;
	font-size: .8rem;
 }
 #sp-fixed-menu li.top_btn
{
  z-index: 99;
  position: relative;
  width: 60px;
}
#sp-fixed-menu li.top_btn span:after {
    content: '';
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    position: absolute;
    display: block;
    margin-top: -8px;
    margin-left: -8px;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

@media (max-width: 767px){
	#sp-fixed-menu li{
		width: 50%;
	 }
}