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

*,*::before,*::after{
margin: 0;
padding: 0;
box-sizing: border-box;
/*border: 1px solid #000;*/
}

body {
font-family: "Noto Sans JP", sans-serif;
padding-top: 100px;
overflow-x: hidden;
line-height: 1.6em;
}

img{
max-width: 100%;
height: auto;
vertical-align: bottom;
}

.container{
width: 1080px;
margin: 0 auto;
}
@media (max-width:767px){
.container{
width:90%;
}
}

/*デフォルトのマウスカーソルを非表示にする*/
html,
body,
a {
  cursor: none;
}

/*独自のマウスカーソルを作成*/
.cursor {
  position: fixed;
  top: -5px;
  left: -5px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(205, 114, 113, 0.7);
/*  background:rgba(40,38,37,0.7);*/
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  z-index: 1000;
  transition: width 0.5s, height 0.5s, top 0.5s, left 0.5s;
  transform: translate(0, 0);
  pointer-events: none;
}

/*aタグにホバーした時に見た目変化*/
.cursor.cursor--hover {
  top: -20px;
  left: -20px;
  width: 40px;
  height: 40px;
  background: rgba(205, 114, 113, 0.5);
}

.center{
text-align: center;
}

.right{
text-align: right;
}

.left{
text-align: left;
}

span{
font-size:  0.8em;
}

@media(max-width:767px){
.br-pc{
display:none;
}
}

.br-sp{
display: none;
}
@media(max-width:767px){
.br-sp{
display: block;
}
}

.btn a{
padding: 20px;
background-color:rgba(65,56,31,0.5);
color: #fff;
text-decoration-line: none;
border-radius: 999px;
box-shadow: 0 4px 6px rgba(0,0,0,0.2);
}

.btn a:hover{
background-color:rgba(65,56,31,0.3);
color: #000;
}

/* Slick UI 非表示 */
.slick-dots { display: none !important; }
.slick-prev, .slick-next { display: none !important; }

.fadein {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s ease;
}

/* 表示状態：フェードイン＆位置リセット */
.fadein.scrollin {
  opacity: 1;
  transform: translateY(0);
}

/* テキストに適用（やや遅く、柔らかく） */
.fadein.text {
  transition-duration: 1.2s;
}

/* 画像に適用（少し早く、きびきび） */
.fadein.image {
  transition-duration: 0.8s;
}


header{
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1000;
display: flex;
justify-content: space-between;
align-items: center;
height: 100px;
min-height: 100px;
background-color: rgba(234,226,196,0.7);
font-family: "kinuta-shin-enpitsu-stdn", sans-serif;
font-weight: 1000;
backdrop-filter: blur(20px);
/*box-shadow: 0 10px 30px rgba(0,0,0,0.08);*/
transition: none !important; 
}

header .container{
display: flex;
justify-content: space-between;
align-items: center;
}
@media (max-width:767px){
header .container{
width:100%;
}
}

h1 img{
width: 200px;
min-width: 150px;
}
@media (max-width:767px){
h1 img{
margin-left: 20px;
}
}

.header__nav img{
height: 50px;
}

.header__nav ul{
list-style: none;
display: flex;
justify-content: flex-end;
align-items: center;
}

.header__nav a{
color: #000;
font-size: 18px;
text-decoration-line: none;
padding: 10px;
}

.header__nav a:hover{
color: #000;
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-thickness: 1px;
text-underline-offset:5px;
}

@media(max-width:767px){
.header__nav {
    display: none;
    position: absolute;
    top: 100px; /* ヘッダーの下に出す想定 */
    left: 0;
    width: 100%;
    height: calc(100vh - 100px);
    background-color: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px); 
    z-index: 10;
	padding:20px;
	overflow-y: auto;
    transition: 0.3s ease-in-out;
  }
.header__nav.is-open {
display: block;
}
.header__nav ul{
display: flex;
flex-direction: column;
align-items: flex-end;
text-align: right;
gap:15px;
padding:0;
margin: 0;
transition: 0.5s;
}

.header__nav a {
    display: block;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
    color: #000;
    padding: 8px 12px;
    border-radius: 4px;
    width: 100%;           /* ← これがあると右に寄せやすい */
    text-align: right;     /* ← 文字も右寄せ */
    transition: background-color 0.3s;
  }

}


.header__btn{
background-color:rgba(0,0,0,0.7);
width:100px;
height:100px;
border:none;
right: 0;
top:0;
display: none;
flex-direction: column;
justify-content: space-between;
padding: 30px;
}
@media(max-width:767px){
.header__btn{
display: flex;
}
}

.header__btn span,
.header__btn::before,
.header__btn::after{
content:"";
display:block;
width:80%;
height: 2px;
margin: 0 auto;
background-color: #fff;
transition:0.5s;
}

.header__btn.is-open span{
width:0;
}

.header__btn::before{
position:relative;
top:0;
}

.header__btn::after{
position:relative;
top:0;
}

.header__btn.is-open::before{
transform:rotate(45deg);
top:calc(50% - 1px);
}

.header__btn.is-open::after{
transform:rotate(-45deg);
top:calc(-50% + 1px);
}



footer{
padding: 60px 0;
background-color: #eae2c4;
}


.footer__logo{
height: 220px;
display: flex;
justify-content: center;
align-items: center;
}

.footer__logo img{
width: 300px;
}

footer ul{
display: flex;
list-style: none;
justify-content: center;
margin-bottom: 20px;
font-family: "kinuta-shin-enpitsu-stdn", sans-serif;
align-items: center;
}
@media(max-width:767px){
footer ul{
flex-wrap: wrap;
}
}

footer li{
padding: 0 20px;
}
@media(max-width:767px){
footer li{
padding: 15px 15px;
}
}

footer li img{
height: 40px;
}

footer a{
color: #000;
text-decoration: none;
}

footer a:hover{
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-thickness: 1px;
text-underline-offset:5px;
}

footer a:visited{
color: #000;
}

footer p{
text-align: center;
}

@media (hover: none) and (pointer: coarse) {
  .cursor {
    display: none;
  }
}