body{font-family: 'Noto Sans JP', sans-serif;font-size:17px; font-weight:400; line-height:1.8; color:#1A1A1A;  letter-spacing:2px;font-feature-settings: "palt";}
@media screen and (max-width: 768px) {
body{font-size:15px;line-height:1.5; letter-spacing:1px; }
}
.site_logo img{position:fixed; top:14px; left:20px; z-index:3}
.global_inner{max-width:950px; margin:0 auto; position:relative;padding: 0 20px;}
.global_inner_wide{ margin:0 auto; position:relative; width:90%;}
h1,h2,h3,h4,h5,h6{line-height:1;}
h2{font-size:46px; font-weight:700; margin-bottom:40px;}
h2 span{display:block; font-size:24px; font-weight:400;}
.copy{letter-spacing:5px;}

img{width:100%; height:auto;}
a img{transition:0.4s all;}
a img:hover{transform: scale(1.10);transition:0.4s all; letter-spacing:2px;}
a img.no-zoom:hover{transform: scale(1.0);}


@media screen and (max-width: 768px) {
.global_inner{width:94%;padding: 0 3%; }
.global_inner_wide{width:94%;padding: 0 3%; }
h2{font-size:60px; margin-bottom:40px; }
}

/*====================
ハンバーガーメニュー
=====================*/
header{height:auto; position:fixed;width:200px; z-index:3; top:40px;left:0;}
header .logo{ background:#FFF; padding:10px 15px 10px 0; text-align:right;}
header .logo img{height:auto; width:140px;transition:0.4s all;}
header .logo img:hover{transform: scale(1.0); opacity:0.8;transition:0.4s all;}


nav {display: block;  position: fixed;  top: 82px;  left: -300px;  bottom: 0;  width: 300px;	background-color:#FFF;  	-webkit-overflow-scrolling: touch;  transition: all 0.5s;  z-index: 102;  opacity: 0;}
.open nav {left: 0;  opacity: 1;  top:82px;  width:25%;box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.08);}
nav .inner {	height: 100vh;	display:flex;	align-items: center;	width: 100%;overflow: auto;}
nav .inner .box{width: 100%;}
nav .inner .box .item{padding-left: 0px;}
nav .inner .box .item ul{margin-bottom:20px; }
nav .inner .box .item ul li{line-height: 1.3; font-size:16px; display: block;  overflow: hidden;   z-index:0;position: relative;    text-align: left;}
nav .inner .box .item ul li:last-child{border:none;}

nav .inner .box .item ul li:before{content:'';width: 12px;height: 0.5px;background-color: #000;display:  block;position: absolute;top: 50%;left: 5px;transform: translateY(-50%);-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);}
nav .inner .box .item ul li a{ display:block;padding-left:40px; padding-top:15px; padding-bottom:15px; color:#4a4a4a; 
position: relative;	overflow: hidden;    transition: ease .2s; border-bottom:solid 1px #4a4a4a;}
nav .inner .box .item ul li a span{position: relative;	z-index: 3;	}


nav .inner .box .item ul li a:hover{ transition: all 0.3s;}
nav .inner .box .item ul li a:before { 	content: '';position: absolute;top: 0;left: 0;z-index: 2;background:#d3cdc6;width: 100%;height: 100%;transition: transform .5s cubic-bezier(0.8, 0, 0.2, 1) 0s;transform: scale(0, 1);	transform-origin: right top;}

nav .inner .box .item ul li a:hover:before{	transform-origin:left top;	transform:scale(1, 1); z-index:-1;}

nav .inner .box .item ul li.title{font-size:18px;font-family: 'Noto Serif JP', serif;   }
nav .inner .box .item ul li.title span{display:block; margin-top:5px;font-family: "Oswald", sans-serif;letter-spacing:0px; font-size:13px; font-weight:300; margin-bottom:5px; }
nav .inner .box .item ul li.title:before{content:none;}
nav .inner .box .item ul li.title a:after{font-size:14px; display:block; font-weight:normal;z-index: 3; padding-left:3px; position:relative;}
nav .inner .box .item ul li:last-child{margin-bottom:0px;}





@media screen and (max-width: 1300px){
.open nav {  width:35%;}
}

@media screen and (max-width: 768px) {
header .logo{left:85px;}
.open nav{width:100%;}
nav {right: -220px;width: 220px;  }
nav .inner {margin: 0px;height:auto;	-top:60px;} 
nav .inner .box{width:90%; margin:0 auto;}
nav .inner .box .item ul{padding-bottom:10px; margin-bottom:0px; padding-top:0px;}
nav .inner .box .item ul li.title{font-size:16px;}
nav .inner .box .item ul li.title span{font-size:12px;}
nav .inner .box .item ul li a{padding-top:10px; padding-bottom:10px; padding-left:20px;}
nav br.pc{display:none;} 
}


/*============
ハンバーガーメニューのトグル
=============*/
.toggle_btn {  display: block;   height: 40px;  transition: all .5s;  cursor: pointer;  z-index: 103; background:#000; position:relative;}
.toggle_btn:before{content:"MENU"; position:absolute; top:8px; right:60px; font-size:13px; color:#FFF;font-family: "Oswald", sans-serif;letter-spacing:1px;}
.toggle_btn p{font-size:12px;}
.toggle_btn span {  display: block;  position: absolute;  left: 80px;  width: 20px;  height: 1.5px;  background-color: #FFF;  border-radius: 4px;  transition: all .5s;}
.toggle_btn span:nth-child(1) {  top: 15px;}
.toggle_btn span:nth-child(2) {  top: 19px;}
.toggle_btn span:nth-child(3) {  top: 23px;}
.open .toggle_btn span {  background-color: #FFF;}
.open .toggle_btn span:nth-child(1) {  transform: translateY(10px) rotate(-315deg);top: 9px;}
.open .toggle_btn span:nth-child(2) {  opacity: 0;}
.open .toggle_btn span:nth-child(3) {  transform: translateY(-10px) rotate(315deg);top: 29px;}

@media screen and (max-width: 768px) {
.toggle_btn{top:30px; left:20px;}
.toggle_btn:before{top:-20px; right:0px; }

}
/*============
ハンバーガーメニューのマスク
=============*/
#mask {display: none;  transition: all .5s;}
.open #mask {  display: block;  position: fixed;  top: 0;  right: 0;  width: 100%;  height: 100%;  /*background: #000;*/  opacity: .8;  z-index: 101; }



/*====================
メインビジュアル
=====================*/
.kv{ position:relative;width: 100%;height: 100%; overflow: hidden; color:#FFF;}
.kv video {position: absolute;top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);width: 100vw;height: 100vh;object-fit: cover; }
.kv .text1{position:absolute; text-align:right;  font-size: clamp(35px, 2.8vw, 60px); bottom:28vh; right:10vw; z-index:1; letter-spacing:15px; font-weight:bold; line-height:1.4;}
.kv .text1 span{margin-left:2vw;}



.kv .text2{position:absolute; text-align:right;letter-spacing:5px;  font-size: clamp(20px, 1.0vw, 30px); bottom:20vh; right:10vw; z-index:1;}

/*====================
フェードイン
=====================*/

.kv .text1 {  animation:  fadein 5.0s ease 1.5s 1 normal backwards;}
.kv .text2 {  animation:  fadein 5.0s ease 4.0s 1 normal backwards;}


@keyframes fadein {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}





@media screen and (max-width: 768px) {
.kv{ padding-top:60px;}
}



/*==========================
トップ：企業理念
=========================*/
.top_about{height:100vh; position:relative; color:#FFF;}
.top_about img{height:100vh; width:100%; object-fit:cover; overflow:hidden;object-position: bottom;position:absolute; top:0; left:0; }
.top_about h2{ padding-top:10vh;display:flex;align-items: center;}
.top_about h2 span{display:inline-block; margin-left:40px;}





/*==========================
トップ：ニュース
=========================*/
.top_news_list{padding-top:60px; padding-bottom:100px;font-family: 'Noto Sans JP', sans-serif; font-weight:300; }
.top_news_list h2{line-height:1;}
.top_news_list .box{display:flex;justify-content: space-between; text-align:left;}
.top_news_list .box .item{width:49%;border-left:solid 1px #000; padding-left:20px;}
.top_news_list .box .item h3{font-size:60px; line-height:1; display:flex;align-items: flex-end; margin-bottom:20px; font-weight:500;}
.top_news_list .box .item h3 span{font-size:36px; margin-left:20px; white-space:nowrap;}
.top_news_list .box .item h3 .more{display: inline-block; background:#894810; color:#FFF; margin-left:20px; padding:8px 20px;font-family: "Oswald", sans-serif;letter-spacing:1px;}
.top_news_list .box .item h3 .more span{font-size:30%;margin-left:0px; font-size:14px; font-weight:normal;}
.top_news_list .box .item dl{display:flex;margin-bottom:5px;}
.top_news_list .box .item dl dt{min-width: 140px; font-weight:normal; font-weight:300;}
.top_news_list .box .item dl dt:after{content:"｜"}
.top_news_list .box .item a:hover dl dt{text-decoration:underline;}
.top_news_list .box .item a:hover dl dd{text-decoration:underline;}

@media screen and (max-width: 768px) {
.top_news_list .box{flex-direction: column;}
.top_news_list .box .item{width:100%; margin-bottom:20px; padding-left:10px;}
.top_news_list .box .item h3{justify-content: space-between;font-size:30px; white-space:normal; letter-spacing:0.5px; }
.top_news_list .box .item h3 span{margin-right: auto; font-size:20px; margin-left:10px;}
}


/*==============================
もっと見る
==============================*/
.viewmore{
	min-width: 300px;
	width:fit-content;
	margin-top: 40px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
.viewmore a{display:block;color: #fff;background: #AB9A86;transition-duration: .3s; text-align:center; padding:15px; }
.viewmore a:hover{color: #fff;background: #a4c1d7;transition-duration: .3s;}	
a .viewmore{display:block;color: #fff;background: #AB9A86;transition-duration: .3s; text-align:center; padding:15px; }
a:hover .viewmore{color: #fff;background: #a4c1d7;transition-duration: .3s;}	



@media screen and (max-width: 768px) {
.viewmore{	width: 80%;	margin-top: 20px;	margin-right: auto;	margin-bottom: 0;	margin-left: auto;}
}



/*=======  ニュース  =======*/
.news{font-family: 'Noto Sans JP', sans-serif;  font-weight:300;text-align:left;}
.news.list .box{display:flex;flex-wrap: wrap;}
.news.list .box .item{width:32%; margin-right:2%; margin-bottom:20px;}
.news.list .box .item:nth-child(3n){margin-right:0;}
.news .box .photo{border-radius:20px; overflow:hidden; margin-bottom:10px;}
.news.list .box .item .photo img{transition:0.2s all;aspect-ratio: 1 / 1; object-fit:cover;}
.news.list .box .item:hover .photo img{transform: scale(1.15);transition:0.2s all;}
.news .box .item .date{margin-bottom:5px;}

.news.detail{} .box{}
.news.detail dl{display:flex; margin-bottom:20px; margin-top:20px;}
.news.detail dt{width:130px;}
.news.detail h3{font-size:20px; margin-bottom:10px; margin-top:40px; font-weight:bold;}



/*=======  ページャー  =======*/
.pagenation{display:flex;justify-content: center;margin-bottom:100px; margin-top:100px;}
.pagenation .item{width:10%; margin:20px 0px; text-align:center;}
.pagenation .item a{color:#000;}
.pagenation .item:last-child{text-align:right;}
.pagenation .item > div{display:flex; font-size:13px; margin-bottom:20px;}
.pagenation .item:last-child > div{flex-direction: row-reverse;}
.pagenation .item .date{ margin-bottom:0px;}
.pagenation .item .title{border-bottom:none; padding-bottom:0px;}
.pagenation .item .title a{color:#000; font-size:17px;}

.arrow-left,.arrow-right {position: relative;display: inline-block;padding: 10px;}
.arrow-left::before, .arrow-right::before {  content: '';  width: 20px;  height: 20px;  border-top: solid 2px #000;  border-right: solid 2px #000;  position: absolute;  left: 0px;  top: 1px;}

.arrow-left::before{ transform: rotate(-135deg);}
.arrow-right::before {  transform: rotate(45deg);}

@media screen and (max-width: 768px) {
.page-detail .title{margin-bottom:40px;}
.pagenation{margin-bottom:40px;}
}

/*=======  よくあるご質問  =======*/
.faq{font-family: 'Noto Sans JP', sans-serif;  font-weight:300;text-align:left;}
.faq .box{display:flex;flex-wrap: wrap;justify-content: space-between;}
.faq .box .item{width:48%;margin-bottom:40px; border-bottom:solid 2px #000; padding-bottom:30px;}
.faq .box .item .question{ position:relative; padding-left:50px; margin-bottom:30px;}
.faq .box .item .question:before{content:"Q"; font-size:50px; position:absolute; top:-15px; left:0px; line-height:1;}
.faq .box .item .answer{ position:relative; padding-left:50px;}
.faq .box .item .answer:before{content:"A"; font-size:50px; position:absolute; top:0; left:5px; line-height:1;}

@media screen and (max-width: 768px) {
.faq .box{flex-direction: column;}
.faq .box .item{width:100%;margin-bottom:40px;  padding-bottom:30px;}
.faq .box .item:first-of-type{ padding-top:20px;}
}


/*=======  お客様の声  =======*/
.voice{font-family: 'Noto Sans JP', sans-serif; font-weight:300; text-align:left;}
.voice .box{display:flex;flex-wrap: wrap;justify-content: space-between;}
.voice .box .item{width:48%;margin-bottom:40px; border-bottom:solid 2px #000; padding-bottom:30px;}
.voice .box .item h2{ font-size:26px; font-weight:normal; margin-bottom:40px;}


@media screen and (max-width: 768px) {
.voice .box{flex-direction: column;}
.voice .box .item{width:100%;margin-bottom:40px;  padding-bottom:30px;}
.voice .box .item h2{font-size:22px; margin-bottom:20px;}
}





table {width:100%;}
table th, table td{padding:10px;border-top:solid 1px #CCC; line-height:1.8;}
table tr:first-child th, table tr:first-child td{border-top:none;}
table th{background-color:#f8f8f8; width:25%; text-align:center;vertical-align: middle; font-weight:normal;}
.img100{width:100%; height:auto;}


@media screen and (max-width: 768px) {
table td:first-child{font-weight:bold; padding-bottom:5px;}
table td:last-child{border-top:none;padding-top:0;}
}


/*=======  フォーム  ======*/
.contact{ text-align:left;font-family: 'Noto Sans JP', sans-serif; font-weight:300;}
.contact .notice{ border-bottom:solid 1px #000; padding-bottom:20px; margin-bottom:20px;}
.contact .notice .box{display:flex;align-items: center;}
.contact .notice h2{font-size:22px; width:240px; white-space:nowrap; margin-right:20px; font-weight:normal; margin-bottom:0;}
.contact .notice .item{width:auto;}
.contact .flex{display:flex;align-items: center;}
.contact .item{  width: 100%;  outline: none;display:flex;align-items: center; margin-bottom:20px;}
.contact .item .title{display:flex;    align-items: center; width:240px; white-space:nowrap; margin-right:20px;}
.contact .item .must{width:70px; margin-right:20px; height:30px;}
.contact .item .must.on{border-radius:10px; color:#FFF; background:#754c24; padding:3px 5px; text-align:center; font-size:14px;}

.contact textarea{ width: calc( 100% - 240px );  border: 1px solid #aaa;  border-radius: 4px;  margin: 8px 0;  outline: none;  padding: 8px;  box-sizing: border-box;  transition: 0.3s;    padding: 8px;	display:flex;}
.contact textarea:focus {  border-color: #00a8ca;  box-shadow: 0 0 8px 0 #00a8ca;}

.contact .item span{padding:0 5px; white-space:nowrap;}
.contact .item span.error{color:#C00;}
.contact .item label{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center; margin-right:20px;}
.contact .item label:hover{cursor:pointer;}

input[type="text"],input[type="email"] {
  width: calc( 100% - 240px );
  border: 1px solid #aaa;
  border-radius: 4px;
  margin-bottom: 0px;
  outline: none;
  padding: 8px;
  box-sizing: border-box;
  transition: 0.3s;
}

input[type="text"]:focus {  border-color: #00a8ca;  box-shadow: 0 0 8px 0 #00a8ca;}


.contact input[type=submit],.contact button[type=submit]{background: #754c24; color:#FFF; width:300px; text-align:center; margin-left:auto; margin-right:auto; padding:10px;transition:0.2s all; border-radius:10px; }
.contact input[type=submit]:hover,,.contact button[type=submit]:hover{transform: scale(1.05);transition:0.2s all;}
.contact ul.btn{flex-direction: column; margin-top:40px; margin-bottom:40px;}
.contact ul.btn li.back{margin-bottom:20px;}
.contact ul.btn li.back button[type=submit] {width:200px;}


@media screen and (max-width: 768px) {
.contact .notice .box{flex-direction: column;align-items: flex-start;}
.contact .notice h2{margin-bottom:20px;}
.contact .item{flex-direction: column;align-items: self-start;}
.contact .item .title{margin-bottom:10px;flex-direction: column-reverse;align-items: self-start;}
.contact .item .must{margin-top:5px;}
.contact .item .must.off{display:none;}
.contact .flex span{ padding:0;}
input[type="text"], input[type="email"]{margin-left:0px;width: auto;width: 100%;}
.contact .item label{margin-right:10px;}
.contact textarea{ width: 100%;}


.form{width:100%;}
.form .item{display:block;}
.form .item span{margin-bottom:10px; margin-right:0px;    display: inline-block;}
.inputWithIcon i{line-height:1.2;}
table th, table td{width:100% !important; display:block !important; text-align:left;}
.photo-center{margin-bottom:20px;}
.img100-sp{width:100%; height:auto;}
}


/*==============================
ページトップ
==============================*/

#page_top {position: fixed;bottom: 30px;left: calc(100vw - 100px); display:none; z-index:1;}
#page_top a {background-color: #999;color: #fff;text-align: center;	text-decoration: none;font-size: 24px;padding-top: 6px;	padding-right: 15px;padding-bottom: 10px;padding-left: 15px;}
#page_top a:hover {background-color: #666;text-decoration: none;}

@media screen and (max-width: 768px) {
#page_top {bottom: calc(100vh - 95vh);left:auto; right:20px; }
#page_top a{}
}



/*=======  サイトマップ  =======*/


/*=======  フッター  ====*/
footer{padding-top:100px;  font-size:12px; text-align:center;font-family: "Oswald", sans-serif;letter-spacing:1px; }
footer .box{display:flex;justify-content: space-between;width:700px; margin:0 auto;}
footer .box .logo{width:17%;}
footer .box .navi{width:74%; text-align:left;}
footer .box .navi ul{display:flex;align-items: center; margin-bottom:10px; }
footer .box .navi ul li{margin-right:25px;}
footer .box .navi ul li.sns{margin-left:7px; margin-right:7px;}
footer .box .navi ul li i{font-size:30px;}
footer .box .navi ul li img{width:50px;}
footer .box .navi .address{letter-spacing:0px;}
footer .box .navi .address span{font-size:160%; }
.copyright{text-align:center;font-family: "Oswald", sans-serif; font-size:11px;letter-spacing:1px; margin-top:40px; margin-bottom:40px;letter-spacing:0px;}


@media screen and (max-width: 768px) {
footer{margin-bottom:0px; text-align:center;}
footer .box{width:100%;flex-direction: column;flex-wrap: wrap;}
footer .box .logo{width:30%; margin-left:auto; margin-right:auto;margin-bottom:20px;}
footer .box .navi{width:100%; }
footer .box .navi ul{justify-content: center;flex-wrap: wrap;}
footer .box .navi ul li{margin-left:5%; margin-right:5%; width:40%; text-align:center; margin-bottom:20px;}
footer .box .navi ul li:nth-child(1){text-align:right;}
footer .box .navi ul li:nth-child(2){text-align:left;}
footer .box .navi ul li.sns{width:10%;}
footer .box .navi .address{text-align:center;}
}



/*=======  下からフェードアップ  =======*/
.fadeup {opacity: 0;}
.fadeup.isShow {  opacity: 1;animation: fadeUp 1.0s ease 0.5s 1 normal backwards;}
.delay01{animation-delay: 0.1s !important;}
@keyframes fadeUp {
from {
    opacity: 0;
    transform: translateY(50px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}


/*=======  左からからフェードイン  =======*/
.fadein_from_left{opacity: 0;}
.fadein_from_left.isShow {  opacity: 1;animation:  fadein_from_left 1.0s ease 0.5s 1 normal backwards;}

@keyframes fadein_from_left {
  0% {
    opacity: 0;
    transform: translateX(-100px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*=======  右からからフェードイン  =======*/
.fadein_from_right{opacity: 0;}
.fadein_from_right.isShow {   opacity: 1;animation:  fadein_from_right 1.0s ease 0.5s 1 normal backwards;}

@keyframes fadein_from_right {
  0% {
    opacity: 0;
    transform: translateX(100px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/*=======  上からからフェードイン  =======*/
.fadein_from_top{opacity: 0;}
.fadein_from_top.isShow {   opacity: 1;animation:  fadein_from_top 1.0s ease 0.5s 1 normal backwards;}

@keyframes fadein_from_top {
  0% {
    opacity: 0;
    transform: translateY(-500px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}


@media screen and (max-width: 768px) {
.pc{display:none !important;}
}

@media screen and (min-width: 769px) {
.sp{display:none !important;} 
}



