/**************************************** ベース設定 ****************************************/
:root{
	--ink:#1f1c17;        /* 墨 */
	--ink-soft:#3d382f;   /* やわらかい墨 */
	--gold:#b8923a;       /* 金 */
	--gold-deep:#9a7a2e;  /* 深い金 */
	--gold-soft:#cbb079;  /* 淡い金 */
	--paper:#faf7f0;      /* 和紙 */
	--paper-2:#f3ede1;    /* 生成り */
	--line:#e4ddcf;       /* 罫線 */
	--text:#33302a;       /* 本文 */
	--text-soft:#6a6459;  /* 補助文字 */
}
html,body {font-size:0.9vw;margin:0;padding:0;background:var(--paper);}
body {font-family:"Noto Sans JP","Helvetica",sans-serif;color:var(--text);line-height:1.9;letter-spacing:0.03em;-webkit-font-smoothing:antialiased;}
div,h1,h2,h3,h4,ul,li,dl,dt,dd,img {margin:0px; padding:0px;}
h1,h2,h3,h4 {font-family:"Shippori Mincho","Noto Serif JP",serif;font-weight:600;line-height:1.5;letter-spacing:0.04em;color:var(--ink);}
ul {list-style:none;margin:0px;padding:0px;}
p {margin:0px;padding:0px;}
a,a:visited {color:var(--ink);text-decoration:none;transition:color 0.3s,background 0.3s,border 0.3s;}
a:hover {color:var(--gold-deep);text-decoration:none;}
a img {border-style:none;}
input,button,textarea,select {-webkit-appearance:none;-moz-appearance:none;appearance:none;}
*{box-sizing:border-box;}
.text-right {text-align:right;}
.text-center {text-align:center;}
.gold {color:var(--gold-deep);}
/*SP*/
@media (max-width:896px){
	html,body {font-size:3.6vw;}
	body {line-height:1.85;}
}
/*共通 表示切替*/
@media (max-width:896px){ .pc {display:none !important;} }
@media (min-width:897px){ .sp {display:none !important;} }

/*パソコン カラム*/
@media (min-width:897px){
.collist {display:flex;flex-wrap:wrap;}
.collist.reverse {flex-direction:row-reverse;}
.collist .inner {justify-content:space-between;}
.col .inner {float:left;}
.col .inner.right {float:right;}
.col2 .inner {width:50%;} .col3 .inner {width:33.3%;} .col4 .inner {width:25%;}
}

/*セクション*/
.contentarea {padding:7vw 5vw;}
.content {width:62vw;max-width:100%;margin:0px auto;}
.content.wide {width:90vw;}
.contentarea h2 {font-size:2.9rem;margin-bottom:0.7em;}
.contentarea p {font-size:1.25rem;line-height:2.1em;color:var(--text);}
.contentarea p a {font-size:1.1rem;}

/*見出し装飾 共通*/
.sectionhead {text-align:center;margin-bottom:3.5rem;}
.sectionhead .en {display:block;font-family:"Shippori Mincho",serif;font-size:0.9rem;letter-spacing:0.35em;color:var(--gold-deep);margin-bottom:1rem;}
.sectionhead h2 {font-size:2.9rem;position:relative;display:inline-block;padding-bottom:1rem;}
.sectionhead h2:after {content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:3rem;height:2px;background:var(--gold);}

/*SP*/
@media (max-width:896px){
	.contentarea {padding:9vh 7vw;}
	.content {width:100%;}
	.contentarea h2 {font-size:1.9rem;}
	.contentarea p {font-size:1.1rem;line-height:2.0em;}
	.sectionhead h2 {font-size:1.9rem;}
}

/*ボタン*/
a.btn,span.btn {font-size:1.05rem;padding:1.05em 2.8em;border-radius:0;letter-spacing:0.08em;
	display:inline-block;text-decoration:none;background:transparent;border:solid var(--ink) 1px;color:var(--ink);cursor:pointer;}
a.btn:hover,span.btn:hover {background:var(--ink);color:var(--paper);border:solid var(--ink) 1px;text-decoration:none;}
a.btn.gold,span.btn.gold {background:var(--gold);border:solid var(--gold) 1px;color:#fff;}
a.btn.gold:hover,span.btn.gold:hover {background:var(--gold-deep);border:solid var(--gold-deep) 1px;color:#fff;}

/*inview*/
.inview {opacity:0;transform:translateY(2.5vw);}
.inview.on {opacity:1;transform:translateY(0px);transition:1.2s cubic-bezier(0.16,1,0.3,1);}
.clear {clear:both;}

/**************************************** ヘッダー ****************************************/
.headerarea {position:fixed;top:0px;left:0px;width:100%;height:10vh;z-index:7000;background:rgba(250,247,240,0.82);
	backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(184,146,58,0.18);}
.logoarea {position:absolute;top:0vh;left:2.5vw;height:10vh;display:flex;align-items:center;}
.logoarea img {height:5.6vh;width:auto;max-width:34vw;object-fit:contain;object-position:center left;}
.barwrap {display:none;}

.menu {position:fixed;top:0px;right:0px;width:auto;height:10vh;line-height:10vh;padding:0px;z-index:7100;}
.menu .menulist {display:flex;flex-wrap:wrap;align-items:center;height:10vh;}
.menu .menulist a {font-size:0.95vw;font-weight:500;color:var(--ink);padding:0 1.2vw;display:flex;align-items:center;height:10vh;letter-spacing:0.05em;}
.menu .menulist a:hover {color:var(--gold-deep);}
.menu .menulist a.attention02 {background:var(--gold);color:#fff;padding:0 2vw;margin-left:1vw;height:10vh;}
.menu .menulist a.attention02:hover {background:var(--ink);color:#fff;}

/*SP*/
@media (max-width:896px){
	.logoarea img {height:5vh;max-width:62vw;}
	.menu {position:fixed;top:0px;left:0px;width:100vw;height:100vh;height:100dvh;background:var(--ink);transform:translateX(150vw);overflow-y:auto;-webkit-overflow-scrolling:touch;}
	.menu.on {transform:translateX(0vw);transition:0.45s cubic-bezier(0.16,1,0.3,1);}
	.menu.out {transform:translateX(150vw);transition:0.3s;}
	.menu .menulist {padding:12vh 10vw 5vh 10vw;display:block;height:auto;min-height:100%;}
	.menu .menulist a {font-size:1.2rem;height:auto;color:var(--paper);padding:0.85rem 0;display:block;border-bottom:solid rgba(203,176,121,0.25) 1px;}
	.menu .menulist a:hover {color:var(--gold-soft);}
	.menu .menulist a.attention02 {display:block;text-align:center;width:100%;padding:2.5em 0;margin-top:1.8rem;border:none;color:#fff;line-height:1.0;height:auto;font-size:1.1rem;letter-spacing:0.12em;font-weight:700;}

	.barwrap {position:fixed;top:1.2vh;right:1.5vh;display:block;height:7.6vh;width:7.6vh;z-index:8000;background:rgba(250,247,240,0.9);border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,0.12);}
	.barwrap .bar {position:absolute;background:var(--ink);width:4.4vh;height:1px;}
	.barwrap .bar.bar01 {top:3.4vh;left:1.6vh;}
	.barwrap .bar.bar02 {top:4.4vh;left:1.6vh;}
	.barwrap.on .bar {transition:0.6s;}
	.barwrap.on .bar.bar01 {transform:translateX(-50%) translateY(-50%) rotateZ(45deg);top:50%;left:50%;width:4.4vh;background:var(--paper);}
	.barwrap.on .bar.bar02 {transform:translateX(-50%) translateY(-50%) rotateZ(-45deg);top:50%;left:50%;width:4.4vh;background:var(--paper);}
	.barwrap.on {background:var(--ink);}
	.barwrap.out .bar {transition:0.4s;}
	.barwrap.out .bar.bar01 {transform:none;top:3.4vh;left:1.6vh;background:var(--ink);}
	.barwrap.out .bar.bar02 {transform:none;top:4.4vh;left:1.6vh;background:var(--ink);}
	.barwrap.out {background:rgba(250,247,240,0.9);}
}

/**************************************** フッター ****************************************/
.footerarea {padding:7vw 0px 0px 0px;background:var(--ink) url(../img/cmn/bg_footer.jpg) no-repeat center center;background-size:cover;position:relative;}
.footerarea:before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(20,18,14,0.78);}
.footerarea > div {position:relative;z-index:2;}

.contactarea {text-align:center;padding:2vw 5vw 7vw;}
.contactarea h2 {color:var(--paper);font-size:2.6rem;margin-bottom:1.1em;}
.contactarea p {color:rgba(250,247,240,0.82);font-size:1.2rem;line-height:2.1em;}
.contactarea a.btn {font-size:1.15rem;border:solid var(--gold-soft) 1px;color:var(--paper);}
.contactarea a.btn:hover {background:var(--gold);border:solid var(--gold) 1px;color:#fff;}

/*SP*/
@media (max-width:896px){
	.contactarea {padding:8vh 8vw;}
	.contactarea h2 {font-size:1.7rem;margin-bottom:1.4rem;}
	.contactarea p {font-size:1.05rem;text-align:left;}
	.contactarea a.btn {font-size:1.05rem;}
}

.footer {position:relative;padding:5vw 6vw;text-align:left;border-top:solid rgba(203,176,121,0.2) 1px;}
.footermenu {padding-bottom:2rem;}
.footermenu a {font-size:0.95rem;line-height:2em;color:rgba(250,247,240,0.78);display:inline-block;padding-right:1.6rem;}
.footermenu a:hover {color:var(--gold-soft);}
.companyinfo p {font-size:0.95rem;color:rgba(250,247,240,0.6);line-height:1.9em;margin-bottom:1.4rem;}
.copyright p {color:rgba(250,247,240,0.5);font-size:0.85rem;letter-spacing:0.1em;}

/*SP*/
@media (max-width:896px){
	.footermenu a {display:block;border-bottom:solid rgba(203,176,121,0.15) 1px;padding:12px 0;}
	.footermenu br {display:none;}
}