@charset "utf-8";
@import url(//use.fontawesome.com/releases/v5.7.2/css/all.css);

/*=====================================================================
//	reset
=====================================================================*/

* {
  padding: 0;
  margin: 0 auto;
  font-size: 96%;
}


html, body, span, applet, object, iframe, p,blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn,
em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, h1, h2, h3, h4, h5, h6,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
details, embed, figure, figcaption, footer, header, hgroup, menu, nav,
output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: none;
  font-style: normal;
  font-weight: normal;
  font-size: 100%;
  font-family: 'Noto Serif JP', serif !important;
  line-height: 1.4;
  /*vertical-align: baseline !important;*/
}

ol, ul {list-style: none;}

/* circle cut */

.circle-img{
    border-radius: 50%;
    width:  100%;
    height: 100%;
}

main{
  overflow-x: hidden;
}

.Shippori{
  font-family: 'Hind', sans-serif;
  font-family: 'Shippori Mincho', serif;
}

i{
  font-family: "Font Awesome 5 Free" !important;
}

/*=====================================================================
//	clearfix
=====================================================================*/

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

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

.both {clear: both;}

/*=====================================================================
//	mediaQuery default
=====================================================================*/

.sm-br{display: none;}

/*=====================================================================
//	hover
=====================================================================*/

a:hover{
  text-decoration: none;
}

a.hoverOpa:hover{
  filter: alpha(opacity=70);
  -webkit-opacity: 0.70;
  -moz-opacity: 0.70;
  opacity: 0.70;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}


header .nav-item.no-hover:hover{
  background-color: transparent !important;
  color:#000 !important;
}

/*==================================================
共通　横並びのための設定
===================================*/
.gnavi{
  display: flex;
  flex-wrap: wrap;/*スマホ表示折り返し用なのでPCのみなら不要*/
  margin:0 0 50px 0;
  list-style: none;
}

/*=====================================================================
//	bootstrap
=====================================================================*/

.navbar-dark .navbar-toggler{
  border: none;
}

/*=====================================================================
//	loading
=====================================================================*/

#loading {
  /* 画面一杯にローディング画面を広げる */
  height: 100vh;
  width: 100vw;
  background: #f0f0f0;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 9999;
  /* flexboxを使ってローディングアイコンを画面の中央に寄せる */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

/*=====================================================================
// text
=====================================================================*/

.text-vertical-flex{
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Text color */
.text-color-red{color: #a60707 !important;}
.text-color-w{color: #FFFFFF !important;}
.text-color-gr{color: #494949 !important;}
.text-color-br{color: #000 !important;}

/* Text　link color */
.text-color-w a{color: #FFFFFF !important;}
.text-color-w a:hover,
.text-color-w a:active{
  color: #b7b7b7 !important;
  text-decoration: underline;
}

/* Text weight */
.text-bold{font-weight: bold;}

/* Lead text */
.text-Leadtext12{font-size: 12px !important; line-height: 1.4 !important;}
.text-Leadtext14{font-size: 14px !important; line-height: 1.6 !important;}
.text-Leadtext16{font-size: 16px !important; line-height: 2 !important;}
.text-Leadtext18{font-size: 18px !important; line-height: 2 !important;}
.text-Leadtext20{font-size: 20px !important; line-height: 2.2 !important;}
.text-Leadtext24{font-size: 24px !important; line-height: 2.2 !important;}
.text-Leadtext28{font-size: 28px !important; line-height: 2.2 !important;}

.text-titletext35{font-size: 35px !important; line-height: 1.6 !important;}
.text-titletext40{font-size: 40px !important; line-height: 1.6 !important;}
.text-titletext45{font-size: 45px !important; line-height: 1.6 !important;}

.text-lineheight2{
  line-height: 2.0 !important;
}

.text-dot::before{
  content: '・';
}


.price-table tr,
.price-table td{
  vertical-align: top;
}

.text-price::after{
  content: '(税込)';
  font-size: 80%;
}

.text-price-range::after{
  content: '(税込)～';
  font-size: 80%;
}

/*=====================================================================
//	contents bg
=====================================================================*/

.bg-color-w{background: #FFF !important;}
.bg-color-gray{background: #282727 !important; color: #FFF !important;}

.bg-washi01{
  background:url("../img/common/bg-washi01.jpg") no-repeat 100% center / cover;
}

.bg-kamon{
  background:url("../img/uzen/uzen-img-bg.png") no-repeat 0 center / cover;
}

.bg-menu-title{
  background:rgba(255,255,255,0.3);
}


/*=====================================================================
//	border
=====================================================================*/

.border-top-gr1{border-top:#b7b7b7 solid 1px;}
.border-bottom-gr1{border-bottom:#b7b7b7 solid 1px;}
.border-bottom-gr1_w80::after{
  content:'';
  width: 80%;
  height: 1px;
  display: block;
  background: #b7b7b7;
  margin: 0 auto;
  margin-top: 20px;
}

.border-left-gr1{border-left:#b7b7b7 solid 1px;}

.border-top-br1{border-top:#000 solid 1px;}
.border-bottom-br1{border-bottom:#000 solid 1px;}
.border-right-br1{border-right:#000 solid 1px;}

/*=====================================================================
//	list
=====================================================================*/

ul li {
  line-height: 1.5;
  padding: 0.2em 0;
}

ul li span{
  padding: 10px 0 20px 0;
  font-size: 80%;
  font-weight: normal;
  display: block;
}

ul.list-disc li {
  list-style: disc;
  list-style-position: inside !important;
  text-indent:-1em;
  padding-left:1em;
}

ul.list-num li {
  list-style: decimal;
  list-style-position: inside !important;
}


/*=====================================================================
//	table
=====================================================================*/

td,th{
    margin: 0 !important;
    padding: 5px 10px;
    line-height: 2;
}


.address-tel tr,
.address-tel th,
.address-tel td{
  padding: 0px 10px;
}

.address-tel{
  min-width: 200px;
}

/*=====================================================================
//	position | display |
=====================================================================*/

.fixed{position: fixed !important;}
.relative{position: relative !important;}

.position-left{left:0 !important;}
.position-right{right: 0 !important;}

.display-block{display: block !important;}
.display-inline{display: inline !important;}


.absolute-center-x{
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);  
}

.absolute-center-y{
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);  
}

.marginauto{
  margin: 0 auto;
}


/*=====================================================================
//	button
=====================================================================*/

.btn-txt12{font-size: 12px;}
.btn-txt16{font-size: 16px;}
.btn-txt24b{font-size: 24px; font-weight: bold; line-height: 1.7;}
.btn-txt28b{font-size: 28px; font-weight: bold;}

/*=====================================================================
//	header
=====================================================================*/

header{
  background:rgba(0,0,0,0.8);
  width: 100%;
  position: fixed;
  z-index: 100000;
  top:0;
}

header .nav-item{
  padding: 10px 0;
  position: relative;
}

header .nav-item:hover{
  background-color: #A1965D;
  color: #FFF !important;
}

header .nav-link{
  margin: 0 !important;
  font-size: 16px !important;
  text-decoration: none;
  color: #FFF !important;
}

header .nav-link:hover{
  color: #FFF !important;
}

/* pull-down */
header .hover-menu01{
  position: absolute;
  font-size: 16px;
  top:55px;
  width: 100%;
  z-index: 100000;
  display: none;
  margin-top: 1px;
}

header .nav-item:hover > .hover-menu01{
  display: block;  
}

/* pull-down links */
header .nav-item a.hovermenu-in-link{
  width: 100%;
  background-color: #2A2A2A;
  display: block;
  padding: 15px 0;
  margin-top: 1px;
  text-decoration: none;
  font-size: 0.8em;
  color: #FFF;

  filter: alpha(opacity=90);
  -webkit-opacity: 0.90;
  -moz-opacity: 0.90;
  opacity: 0.90;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

header .nav-item a.hovermenu-in-link:hover,
header .nav-item a.in-link-bginfo:hover{
  background-color: #A1965D !important;
  filter: alpha(opacity=100);
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;  
}

.h-main-logo{
  width: 220px;
  position:absolute;
  bottom: -90px;
  z-index: 300;
}

.fade-img:hover{
  filter: alpha(opacity=0);
  -webkit-opacity: 0;
  -moz-opacity: 0;
  opacity: 0;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
}


/*=====================================================================
//	footer
=====================================================================*/

footer .foot-keyword{
    padding: 20px 0;
    margin-bottom: 20px;
    border-bottom: #494949 1px solid;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1.6;
}

footer a{color: #2A2A2A;}
footer a:hover{text-decoration: none; color: #A1965D;}


footer small{
  width: 100%;
  padding: 15px 0 !important;
  font-size: 80%;
  text-align: center;
  display: block;
  background-color: #000;
}


.foot-links li{
  padding:10px 0;
}

.foot-links li:nth-child(1):before,
.foot-links li:nth-child(2):before,
.foot-links li:nth-child(3):before,
.foot-links li:nth-child(4):before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;

  display: inline-block;
  width: 90%;
  height: 1px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #2A2A2A;
}


/*=====================================================================
//	top
=====================================================================*/

.main-text-img{
  position: absolute;
  top:13%;
  right: 5%;
  width: 180px;
}

.main-btn{
  position: absolute;
  bottom: 5%;
  padding: 10px 30px;
}


/*=====================================================================
//	title-circle
=====================================================================*/


.title-circles{
  width: 180px;
  height: 180px;
  position: relative;
  display: block;
  margin: 0 auto;
}

.title-absolute{
  position: absolute !important;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);  
}

.title-text-in{
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
}


/*=====================================================================
//	Google map
=====================================================================*/

.google-map-area {
  position: relative;
  padding-top: 30px;
  min-height:480px;
  max-height: 800px;
  padding: 0;
  overflow: hidden;
}

.google-map-area iframe,
.google-map-area object,
.google-map-area embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%); */
}

/*=====================================================================
//	Navi menu
=====================================================================*/

button[aria-expanded="true"] > span {
  position: relative;
  display: none;
}

button[aria-expanded="true"]::after {
  top: 20px;
  right: 20px;
  font-size: 28px;
  content: "×";
}


/*=====================================================================
//	parallax
=====================================================================*/


.parallax-img{
  min-height: 380px;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  position: relative;
}

.plx-image-main {
  min-height: 840px !important;
  background: url('../img/top/main-image.jpg') no-repeat center 0 fixed;
}

.plx-image-tenpo{
  min-height: 540px !important;
  background: url('../img/top/main-image.jpg') no-repeat center 0 fixed;
}

.plx-image01 {
  min-height: 660px !important;
  background: url('../img/top/bg-parallax02.jpg') no-repeat center 0 fixed;
}

.plx-image02 {
  background: url('../img/page-header/p-header02-uzen.jpg') no-repeat fixed;
}

.plx-image03 {
  background: url('../img/page-header/p-header03-omotenashi.jpg') no-repeat center 0 fixed;
}

.plx-image04 {
  background: url('../img/omotenashi/omotenashi-houji-img03.jpg') no-repeat center 0 fixed;
}

.plx-image05 {
  background: url('../img/omotenashi/omotenashi-haisou-img04.jpg') no-repeat center 0 fixed;
}

.plx-image06 {
  background: url('../img/page-header/p-header04-menu.jpg') no-repeat center 0 fixed;
}

.plx-image07 {
  background: url('../img/page-header/p-header05-contact.jpg') no-repeat center 0 fixed;
}


/*=====================================================================
//	top btn
=====================================================================*/

/*トップへ戻るボタン*/
a.topBtn {
  position:fixed; /*固定*/
  bottom:30px; /*場所を右下に移動*/
  right:30px; /*場所を右下に移動*/
  display:block; /*aタグをblock要素に変更*/
  text-decoration:none !important;
  font-weight:bold;
  text-align:center;
  font-size: 12px !important;
}

a.topBtn i{
  font-size: 40px;
  display: block;
  padding-bottom: 5px;
}

a.topBtn:hover {
  opacity:0.7;
}