@charset "UTF-8";
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');


/*------------------------normalize*/
html {-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; scroll-behavior: smooth;}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {display: block;}audio,canvas,progress,video {display: inline-block; vertical-align: baseline;}a {background: transparent;}a:active,a:hover {outline: 0;}sub,sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}sup {top: -0.5em;}sub {bottom: -0.25em;}img {border: 0;}svg:not(:root) {overflow: hidden;}figure {margin: 0;}hr {-moz-box-sizing: content-box; box-sizing: content-box; height: 0;}pre {overflow: auto;}button,input,optgroup,select,textarea {color: inherit; font: inherit; margin: 0;}button {overflow: visible;}button,select {text-transform: none;}button,html input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance: button; cursor: pointer;}button[disabled],html input[disabled] {cursor: default;}button::-moz-focus-inner,input::-moz-focus-inner {border: 0; padding: 0;}input {line-height: normal;}input[type="checkbox"],input[type="radio"] {box-sizing: border-box; padding: 0;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button {height: auto;}input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}fieldset {border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}textarea {overflow: auto;}table {border-collapse: collapse; border-spacing: 0;}td,th {padding: 0;}img{ vertical-align: bottom;}
button{ border:none;}button:focus{ outline:none;}table { border-collapse: collapse; border-spacing: 0;}
*{ box-sizing: border-box;}
ul{ margin: 0; padding: 0; list-style: none; }
dl, dt, dd{ margin: 0; padding: 0;}
/*------------------------normalizeEnd*/
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 100;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 200;
}


@media all and (-ms-high-contrast: none)  {
  html {
    font-family: Verdana, Meiryo, sans-serif;
  }
}
@media all and (-ms-high-contrast: active) {
  html {
    font-family: Verdana, Meiryo, sans-serif;
  }
}

html,
.min{ font-family: "Yu Mincho", "YuMincho", serif;}
.gothic{ font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;}

body {
	background:#fff;
	/* font-family:'Hiragino kaku Gothic ProN', 'ヒラギノ角ゴ ProN W4', 'Meiryo', 'メイリオ', -apple-system, BlinkMacSystemFont, sans-serif; */
	color:#595757;
	margin:0 auto;
	text-align:left;
	font-size:14px;
}





h3, h4, h5, h6{ margin: 0 0 1em; padding: 0; font-weight: normal;}
h1{}
h2{ font-family: "Yu Mincho", "YuMincho", serif; text-align: center; color: #fff;}
h3{ font-family: "Yu Mincho", "YuMincho", serif; font-size: 32px; text-align: center; line-height: 1.2em;}
h3 span{ font-size: 18px; color: #c79e63;}
h4{ font-family: "Yu Mincho", "YuMincho", serif; font-size: 22px; color: #c79e63; text-align: center;}
h5{ font-size: 18px; margin: 10px auto;}
p{ line-height: 1.7em;}

@media screen and (max-width: 1080px) {
h2{}
h3{ font-size: 24px;}
h4{ font-size: 18px;}
}



.titleBox { display: flex; justify-content: center; align-items: center; background: #999; margin-bottom: 60px; padding: 100px 1em;}
.titleBox h2{ }
.galleryTitle{ background: url(../img/subTitle.png) center center;}
@media screen and (max-width: 1080px) {
.titleBox { padding: 40px 1em;}
}


section{ margin-bottom: 100px; }
article{}
address{ font-style:normal;}
a:link, a:visited{ text-decoration: none; color:#007ab0;}/*007ab0*/
a:hover{ opacity: 0.6; transition: 0.4s; color:#0099FF;}/*0099FF*/
area { outline:none; }



/*------*/
.wrapBox{}

@media screen and (max-width: 1080px) {

}



/*------ slider ------*/
.slideBox{ position: relative;}
.slideBox h2{ position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%); z-index: 150;}
.slideBox h2 img{ display: block; width: auto; margin: 0 auto 40px;}
.slideBox h2 span{ display: inline-block; margin-right: 1em;}

.slider{ width:100%; margin: auto;}
.slider img{ width:100%;}
.slider .slick-slide{ height:auto!important;}
.slider .slick-next{ right:0!important;}
.slider .slick-prev{ left:0!important;}
.slider .slick-arrow{ width: initial!important; height: initial!important; z-index:2!important;}
.slider .slick-arrow:before{ font-size: 30px!important;}

@media screen and (max-width: 640px) {
.slider{ margin:0 auto; }
.slider div img{ width: 200%;}

.slideBox h2{ font-size: 18px; width: 100%;}
.slideBox h2 img{ display: none;}
.slideBox h2 span{ margin: 0;}

.slider div{ position: relative;}
.slider div.slide06 img{ position: absolute; top: -14px; right: 0;}

}


/*------ newsBox ------*/
.newsBox{ font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;}
.newsBox h3{ font-size: 26px;}
.news{ border-top: 2px solid #c79e63; border-bottom: 2px solid #c79e63; padding: 20px 0; max-height: 340px; overflow: scroll;}
.newsBox ul { font-size: 16px;}
.newsBox ul li{ padding: 1em 0; border-top: 1px solid #cfc9c5;}
.newsBox ul li span{ display: block; font-size: .8em;}

@media screen and (max-width: 1080px) {
.newsBox{ margin-top: 50px;}
.newsBox h3{ font-size: 24px;}
}

/*------ instagramBtn ------*/
.instagramBtn{ margin: 30px auto 100px;}
.instagramBtn a{  display: flex; align-items: center; justify-content: center; width: 240px; margin: 0 auto; border-radius: 4px; background: #ff0069; color: #fff; padding: 1em; text-align: center;}
.instagramBtn a i{ font-size: 2em; margin-left: 10px;}


/*------ galleryBox ------*/
.galleryBox{ }
.galleryBox h4{ color: #231815; margin: 20px auto;}
.galleryBox .flexBox{ flex-wrap: wrap;}
.galleryBox .flexBox section{ width: 48%; margin: 0 auto 20px;}
.galleryBox .more a{ display: block; text-align: center;}

@media screen and (max-width: 1080px) {
.galleryBox .flexBox{}
.galleryBox .flexBox section{ width: 100%; }
.galleryBox .flexBox section img{ display: block; width: 100%; max-width: 475px; margin: 0 auto;}
}


/*------ aboutBox ------*/
.aboutBox{}
.aboutBox .flexBox{ max-width: 980px; margin: 0 auto; justify-content: space-between;}
.aboutBox h3{ text-align: left;}
.aboutBox p{ line-height: 2.2em;}
.aboutBox img{ max-width: 470px;}

@media screen and (max-width: 1080px) {
.aboutBox .flexBox{ display: block;}
}


/*------ recoBox ------*/
.recoBox{ background: #f3f3e4; padding: 80px 0;}
.recoBox section{ text-align: center; margin: 40px auto;}
.recoBox section h4{ font-weight: bold; margin: 1.5em auto; font-size: 18px; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;}
.recoBox section p{ text-align: left; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;}
.recoBox .flexBox{ justify-content: space-between;}

.flex3{}
.flex3 section{ width: 32%; max-width: 268px;}

.flex2{}
.flex2 section{ width: 48%;max-width: 410px;}

.line1{ padding-top: 1.5em;}

@media screen and (max-width: 1080px) {
.recoBox .flexBox{ display: block;}
.flex3 section,
.flex2 section{ width: 100%;}
.flex2 section img{ width: 100%; max-width: 320px;}

.line1{ padding-top: 0;}
}









/*------------------------Style*/
main{ text-align:left;}
main section{ width: 100%; max-width: 1080px; margin: 100px auto;}
@media screen and (max-width: 1080px) {
main section{ padding: 0 10px;}
}



header{ display: flex; justify-content: space-between; align-items: center; max-width: 1080px; margin: 0 auto; padding: 100px 40px 20px;}
header h1 img{ width: 245px;}
header div a{ display: inline-block; margin: 0 10px;}
.instagram img{ }

@media screen and (max-width: 1080px) {
.contact,
.tel{ display: none;}

header{ padding: 5px 20px 0;}
header h1 img{ width: 165px;}
header div img{ width: 32px;}
header div a{ margin: 0;}
}


/*------*/
footer{ background: #a28978; text-align: center; padding: 40px 0; margin-top: 100px;}
footer a{ font-size: .9em; display: inline-block; margin-bottom: 1em;}
footer,
footer a:link,
footer a:visited { color: #fff;}

@media screen and (max-width: 1080px) {
footer{ padding-bottom: 80px;}
}


.footNav{ display: none; font-size: 12px;}

@media screen and (max-width: 1080px) {
.footNav {text-align: center; background: #fff; z-index: 999;}
.footNav a:link,
.footNav a:visited{ color: #fff;}

.footNav{ position: fixed; justify-content: space-between; bottom: 0; display: flex; width: 100%;}
.footNav a{ display: block; background: #006934; width: 49.9%; padding: 1.2em 5px; border-top: 1px solid #fff;}
.footNav a i{ margin-right: 5px; font-size: 14px; display: block;}
.footNav a:first-child{ background: #e95513;}
}



/*------*/
.notes{ margin: 40px auto ; padding: 1em; border: 1px solid #a28978; text-align: center; background: #fff;}
.notes p{ margin: 0; font-size: 16px; font-family: "Yu Gothic";}


/*------*/
.flexNafuda{ width: 100%; max-width: 860px; margin: 0 auto; display: flex; align-items: flex-start;}
.flexNafuda .notes{ margin: 0 auto; height: 180px; display: flex; align-items: center;}

.nafudaBox{}
.nafudaBox img{ width: 100%; max-width: 397px;}
.nafudaBox p{ font-size: 13px; margin: 0; padding: 0;}
@media screen and (max-width: 860px) {
.flexNafuda{ display: block;}
.nafudaBox { margin-bottom: 2em;}
}


/*------*/



/*------------------------otherStyle*/
.PC{ display: block; }
.SP{ display: none; }

.flexBox{ display: flex; }

.fitImg img{ width: 100%;}

.B{ font-weight: bold; }
p.kome{ font-size: 13px; text-indent: -1em; margin: 0; margin-left: 1em; font-family: "Yu Gothic"; }
.tC{ text-align: center; }
.tR{ text-align: right; }

.red{ color: red;}

.noEvent{ pointer-events: none; }

.clear { clear:both; }
.clear hr { display:none; }
.cf:after{/*for modern browser*/
    content:"."; display: block; height:0px; clear:both; line-height:0; visibility:hidden;}
.cf {zoom:1;/*for IE 5.5-7*/}


.fbBox{ position: fixed; z-index: 9000; bottom: 40px; right: 40px; text-align: center;}
@media screen and (max-width: 1080px) {
.fbBox{display: none;}
}

/*pagetop*/
.pagetop{ position: fixed; z-index: 9000; bottom: 20px; right: 20px; display: none; text-align: center;}
.pagetop a{ box-sizing: border-box; font-size: 24px; display: block; background: #fff; width: 64px; height: 64px; border-radius: 120px; padding-top: 14px;box-shadow: 0 0 1px 1px rgba(0,0,0,0.2);}
.pagetop a:link, .pagetop a:visited{ color: #147b99;}
.pagetop a:hover{ opacity: 0.6; transition: 0.2s;}

@media screen and (max-width: 1080px) {
.pagetop{ bottom: 80px; right: 15px;}
.pagetop a{ font-size: 14px; width: 36px; height: 36px; padding-top: 8px;}	
}


@media screen and (max-width: 1080px) {
.PC{ display: none; }
.SP{ display: block; }


}






































/*------------------------nav*/



@media screen and (min-width: 1080px) {
.drawer,
.navbar_toggle{ display: none;}
}

@media screen and (max-width: 1080px) {
.menu{ position: fixed; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition:ease .5s; transition:ease .5s; z-index:9998; top: 0; width: 100%; margin: 0;}
.menu nav{ padding: 20px 20px 80px; height: 100vh; overflow: scroll; font-size: 18px; text-align: left; }
}


