@charset "utf-8";

/* ---------------------------------------------------------------------- */
body {
color: #313131;
scroll-behavior: smooth;
font-family: "Noto Serif JP",'ヒラギノ明朝 ProN','Hiragino Mincho ProN','Yu Mincho Light','YuMincho','Yu Mincho','游明朝体',sans-serif;
}
body.is-loading {
overflow: hidden;
}
#wrap {
position: relative;
}
.pc {display: block;}
.sp{display: none;}
@media screen and (max-width: 744px) {
.pc {display: none;}
.sp{display: block;}
}
/* ---------------------------------------- */
a {
color: #BE9E1E;
}
a:hover {
opacity: 0.6;
transition: opacity 0.25s cubic-bezier(0.33, 1, 0.68, 1);
}
a[href^="tel:"] {
pointer-events: none;
}
@media screen and (max-width: 744px) {
a[href^="tel:"] {
pointer-events:all;
}
}
/* ---------------------------------------- */
#loading {
width: 100%;
height: 100vh;
background: #fff;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: flex;
justify-content: center;
align-items: center;
z-index: 100;
}
#loading .loadTxt {
color: #aaa;
font-family: "hiragino-kaku-gothic-pron", sans-serif;
font-weight: 600;
font-size: 1.2rem;
letter-spacing: 0.1em;
}
#loading .loadTxt .loadAnime {
margin: 32px 0 0 0;
display: flex;
justify-content: center;
gap: 14px;
}
#loading .loadTxt .loadAnime div {
content: "";
display: block;
width: 7px;
height: 7px;
border-radius: 50%;
background: #aaa;
}
#loading .loadTxt .loadAnime div:nth-child(1) {
animation: loadAnime 1.5s 0s linear infinite;
}
#loading .loadTxt .loadAnime div:nth-child(2) {
animation: loadAnime 1.5s 0.5s linear infinite;
}
#loading .loadTxt .loadAnime div:nth-child(3) {
animation: loadAnime 1.5s 1s linear infinite;
}
@keyframes loadAnime {
0% {opacity: 0.7; transform: scale(1.5);}
100% {opacity: 0.1;}
}
/* ---------------------------------------- */
h1 a {
font-family: "hiragino-kaku-gothic-pron", sans-serif;
font-size: 3.2rem;
font-weight: 600;
letter-spacing: 0.05em;
color: #313131;
}
h1 a:hover {
opacity: 1.0;
}
h2 {
font-size: 2.0rem;
letter-spacing: 0.075em;
}
h3 {
font-size: 1.6rem;
letter-spacing: 0.075em;
}
h2,h3,h4 {
line-height: 1.5;
font-family: "hiragino-kaku-gothic-pron", sans-serif;
font-weight: 600;
}
p,dt,dd {
font-size: 1.3rem;
line-height: 1.8;
}
@media screen and (max-width: 834px) {
h1 a {
font-size: 2.2rem;
}
}
/* ---------------------------------------------------------------------- */
#header {
position: fixed;
top: 0;
left: 0;
width: 100%;
padding: 30px;
z-index: 90;
}
#header.is-white h1 a,
#header.is-white #gnav .gnavBtn span.on {
color: #fff;
}
#header.is-bg {
background: #fff;
}
#header #gnav {
position: fixed;
right: 30px;
top: 30px;
}
#header #gnav .gnavBtn {
position: relative;
z-index: 90;
}
#header #gnav .gnavBtn span {
font-size: 1.8rem;
}
#header #gnav .gnavBtn span:hover {
opacity: 0.6;
transition: opacity 0.25s cubic-bezier(0.33, 1, 0.68, 1);
}
#header #gnav .gnavBtn span.off {
display: none;
}
#header #gnav.is-open .gnavBtn span.on {
display: none;
color: #000;
}
#header #gnav.is-open .gnavBtn span.off {
display: block;
color: #000;
}
#header #gnav .gnavMenuWrap .cover {
opacity: 0;
visibility: hidden;
position: fixed;
right: 0;
bottom: 0;
top: 0;
width: 100%;
height: 100%;
transition: .4s ease-in-out;
}
#header #gnav.is-open .gnavMenuWrap .cover {
opacity: 1.0;
visibility:visible;
background: rgba(220, 220, 220, 0.5);
transition: .3s ease;
}
#header #gnav .gnavMenu {
visibility: hidden;
position: fixed;
transform: translateX(100%);
top: 0;
right: 0;
padding: 15vh 30px 30px 30px;
width: 100%;
max-width: 192px;
height: 100%;
background: #fff;
transition: all 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}
#header #gnav.is-open .gnavMenu {
visibility:visible;
transform: translateX(0%);
transition: all 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}
#header #gnav .gnavMenu li {
margin: 20px 0 20px 0;
}
#header #gnav .gnavMenu li a {
font-size: 1.6rem;
letter-spacing: 0.1em;
color: #313131;
}
#header #gnav .gnavMenu li ul {
margin: 20px 0 30px 0;
}
#header #gnav .gnavMenu li ul li {
margin: 18px 0 18px 0;
}
#header #gnav .gnavMenu li ul li a {
font-size: 1.4rem;
padding: 0 0 0 1em;
position: relative;
}
#header #gnav .gnavMenu li ul li a::before {
position: absolute;
left: 0;
top: 50%;
content: "";
background: #313131;
display: block;
width: 7px;
height: 1px;
}
@media screen and (max-width: 1280px) {
#header {
padding: 20px;
}
#header #gnav {
right: 20px;
top: 20px;
}
#header #gnav .gnavBtn span {
font-size: 1.6rem;
}
}




/* ---------------------------------------------------------------------- */
#main .column2Wrap {
display: flex;
width: 100%;
max-width: 1152px;
margin: 0 auto;
}
#main .column2Wrap .ttlWrap {
width: 152px;
padding: 0 20px;
}
#main .column2Wrap .contentWrap {
width: calc(100% - 192px);
padding: 0 20px;
}

@media screen and (max-width: 744px) {
#main .column2Wrap {
flex-direction: column;
}
#main .column2Wrap .ttlWrap {
width: 100%;
margin: 0 0 50px 0;
}
#main .column2Wrap .contentWrap {
width: 100%;
}
}