@charset "utf-8";/* CSS Document */
.pcno {display:none;}
img {max-width:100%;}
#navArea{display:none;}
/*▼ 初期化 ▼*/
body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, ul, li, blockquote, th, td, tr, img {padding:0px;margin:0px;font-size:16px;line-height:1.5em;letter-spacing:1px;color:#333;-webkit-text-size-adjust:100%;font-family:"Noto Serif JP",serif;}

table {border-collapse:collapse;}
ul, li {list-style:none;}
h1, h2, h3, h4, h5, h6, .more{padding:0px;margin:0px;font-size:100%;font-weight:normal;}
a {overflow:hidden;outline:none;}
img {border:none;vertical-align:bottom;max-width:100%;}
video{max-width:100%;}
table td {border:none;vertical-align:top;}
.text99 {text-indent:-9999px;}
a{-webkit-transition:0.5s;-moz-transition:0.5s;-ms-transition:0.5s;transition:0.5s;color:inherit;text-decoration:none;}
a:hover {text-decoration:none;}
a:hover {opacity:0.8;filter:alpha(opacity=50);-webkit-transition:0.5s;-moz-transition:0.5s;-ms-transition:0.5s;transition:0.5s;}
*{box-sizing:border-box;margin:0;padding:0;}
/*▲ 初期化 ▲*/


/*----------  共通 common  ----------*/
/*----------  共通 common  ----------*/
/*----------  共通 common  ----------*/
html{scroll-behavior:smooth;scroll-snap-type:y proximity;}
body{color:#35323a;background:#fff;font-family:"Noto Serif JP",serif;font-weight:300;letter-spacing:.08em;}

h1{width:1px;height:1px;overflow:hidden;position:absolute;left:-9999px;}



.fixed-jewel{width:439px;height:100vh;position:fixed;left:0;top:0;z-index:1;opacity:.3;pointer-events:none;overflow:hidden;}
.fixed-jewel img{width:100%;min-height:100%;object-fit:cover;}
.snap-section{scroll-snap-align:start;}

.section-white{position:relative;}
.title{text-align:center;font-family:"Cormorant Garamond",serif;font-weight:400;}
.title small{display:block;font-family:"Noto Serif JP",serif;font-size:12px;letter-spacing:.28em;margin-bottom:8px;}
.title span{font-size:52px;font-weight:400;letter-spacing:.08em;}
.title.white{color:#d7d5d8;}
.fade-item{opacity:0;transform:translateY(45px);transition:opacity 1s ease,transform 1s ease;}
.fade-item.is-show{opacity:1;transform:none;}
.more{width:400px;margin:70px auto 0;}




/*----------  ヘッダー header  ----------*/
/*----------  ヘッダー header  ----------*/
/*----------  ヘッダー header  ----------*/

#header-wrap{height:92px;}
#header{width:100%;position:relative;z-index:100;padding:20px 0;}
#header.fixed{position:fixed;left:0;top:0;}

#header .inner{max-width:1500px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 30px;}
#header .logo{width:120px;}
#header .logo img{}
#header ul{display:flex;gap:55px;}
#header ul a,#footer ul a{font-family:"Cormorant Garamond",serif;font-size:18px;position:relative;padding:12px 0;letter-spacing:.13em;}
#header ul a:after,#footer ul a:after{content:"";height:1px;width:0;background:currentColor;position:absolute;left:50%;bottom:4px;transform:translateX(-50%);transition:.35s;}
#header ul a:hover:after,#footer ul a:hover:after{width:100%;}
#header .sns{display:flex;gap:32px;align-items:center;}
#header .sns img{width:auto;height:18px;}
#header.header-light{color:#35323a;}
#header.header-dark{background:transparent;color:#fff;}
#header.header-dark li a{color:#fff;}
#header.header-dark .logo img,#header.header-dark .sns img{filter:brightness(0) invert(1);}



/*----------  フッター footer  ----------*/
/*----------  フッター footer  ----------*/
/*----------  フッター footer  ----------*/
#footer{background:#29262e;color:#eee;text-align:center;padding-top:85px;position:relative;}
#footer .logo{width:250px;}
#footer p{margin:20px 0 35px;font-family:"Cormorant Garamond",serif;font-size:21px;color:#fff;letter-spacing:.1em;}
#footer .sns{display:flex;justify-content:center;gap:42px;margin:30px 0 35px;}
#footer .sns img{height:28px;width:auto;filter:brightness(0) invert(1);}
#footer ul{display:flex;justify-content:center;gap:55px;margin:25px 0 65px;}
#footer ul li a{color:#fff;}
#footer #tamonten{border-top:1px solid rgba(255,255,255,.18);padding:20px 0 20px;font-size:11px;line-height:2.2em;}
#footer #tamonten a{display:block;cursor:default;color:#fff;text-decoration:none;opacity:1;filter:alpha(opacity=100);}




/*----------  メインビジュアル mp  ----------*/
/*----------  メインビジュアル mp  ----------*/
/*----------  メインビジュアル mp  ----------*/
#mp{ height:100vh; position:relative; overflow:hidden; background:#08080a; scroll-snap-align:start;}
#mp .bg{ position:absolute; inset:0; background:url(../images/home/mv.jpg) center center/cover no-repeat; opacity:0; animation:mvBg 1.5s .2s forwards;}
#mp .jewel{
  width:439px;
  height:calc(100% + 80px);
  object-fit:cover;
  position:absolute;
  top:-80px;
  opacity:0;
}
#mp .jewel-01{ left:0; animation:jewelIn 1.3s 1.3s forwards;}
#mp .jewel-02{ left:51.3%; animation:jewelIn 1.3s 1.8s forwards;}
#mp .logo{width:350px;position:absolute;left:50%;top:50%;transform:translate(-50%,-42%);text-align:center;color:#fff;opacity:0;animation:logoIn 1.2s 2.8s forwards;}
#mp .logo img{width:350px;}
#mp .logo p{font-size:25px;margin-top:32px;color:#fff;letter-spacing:.18em;}
#mp .scroll-down{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);color:#fff;font-family:"Cormorant Garamond",serif;font-size:11px;letter-spacing:.18em;text-align:center;opacity:0;animation:fadeOnly 1s 4s forwards;}
#mp .scroll-down span{writing-mode:vertical-rl;}
#mp .scroll-down i{width:1px;height:85px;display:block;background:rgba(255,255,255,.25);margin:10px auto 0;position:relative;overflow:hidden;}
#mp .scroll-down i:after{content:"";width:1px;height:35px;background:#fff;position:absolute;left:0;top:-35px;animation:scrollLine 1.7s 4.2s infinite;}


.scroll-down{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);color:#fff;font-family:"Cormorant Garamond",serif;font-size:11px;letter-spacing:.18em;text-align:center;opacity:0;animation:fadeOnly 1s 4s forwards;}
.scroll-down span{writing-mode:vertical-rl;}
.scroll-down i{width:1px;height:85px;display:block;background:rgba(255,255,255,.25);margin:10px auto 0;position:relative;overflow:hidden;}
.scroll-down i:after{content:"";width:1px;height:35px;background:#fff;position:absolute;left:0;top:-35px;animation:scrollLine 1.7s 4.2s infinite;}


/*----------  下層共通 lower  ----------*/
#mp.lower-mp{height:350px;position:relative;overflow:hidden;background:#111;}
#mp.lower-mp .bg{width:100%;height:100%;background:url(../images/lower/lower-mp.png)center center/cover no-repeat;}
#mp.lower-mp .logo{width:250px;position:absolute;left:50%;top:45%;transform:translate(-50%,-45%);text-align:center;color:#fff;font-family:"Cormorant Garamond",serif;animation:logoIn 1.2s .8s forwards;}
#mp.lower-mp .logo img{width:210px;opacity:.92;}
#mp.lower-mp .logo p{font-size:20px;color:#fff;letter-spacing:.1em;margin-top:15px;}





/*----------  共通 common  ----------*/
/*----------  共通 common  ----------*/
/*----------  共通 common  ----------*/
.box{width:1280px;margin:auto;position:relative;z-index:2;}
.box-title{padding:120px 0 120px;}
.fade-item{opacity:0;transform:translateY(45px);transition:opacity 1s ease,transform 1s ease;}
.fade-item.is-show{opacity:1;transform:none;}


.h2-01{text-align:center;font-family:"Cormorant Garamond",serif;font-weight:400;margin-bottom: 50px;}
.h2-01 small{display:block;font-family:"Noto Serif JP",serif;font-size:14px;color:#897185;letter-spacing:.28em;margin-bottom:25px;}
.h2-01 span{font-size:50px;font-weight:400;letter-spacing:.08em;}
.h2-01.white{background:linear-gradient(90deg,#7f838b 0%,#fff 50%,#7f838b 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}


.h2-02{text-align:center;font-family:"Cormorant Garamond",serif;font-weight:400;margin-bottom:60px;}
.h2-02 small{display:block;font-family:"Noto Serif JP",serif;font-size:12px;letter-spacing:.25em;margin-bottom:15px;}
.h2-02 span{font-size:48px;font-weight:400;letter-spacing:.08em;}


.h2-03{text-align:center;font-family:"Cormorant Garamond",serif;font-weight:400;}
.h2-03 span{display:block;font-size:80px;font-weight:400;line-height:1em;letter-spacing:.08em;margin-bottom:35px;}
.h2-03 small{width:300px;display:block;border-top:1px solid #897185;border-bottom:1px solid #897185;padding:18px 0;color:#897185;font-family:"Noto Serif JP",serif;font-size:16px;font-weight:400;line-height:1.5em;letter-spacing:.25em;margin:auto;}

.ico-i{width:110px;height:55px;display:block;margin:0 auto 15px;}

.more{width:400px;margin:70px auto 0;}

.more a{height:70px;border:1px solid #777;display:flex;align-items:center;justify-content:center;background:#fff;color:#333;font-family:"Cormorant Garamond",serif;letter-spacing:.15em;position:relative;overflow:hidden;transition:.45s;}
.more a:before{content:"";width:100%;height:100%;background:linear-gradient(90deg,#8f8795 0%,#b7aeba 50%,#8f8795 100%);position:absolute;left:0;top:0;opacity:0;transition:.45s;}
.more a span{position:relative;z-index:2;}
.more a i{width:55px;height:1px;background:currentColor;display:block;position:absolute;left:290px;top:50%;z-index:2;transition:.45s;}
.more a i:after{content:"";width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;position:absolute;right:0;top:-3px;transform:rotate(45deg);}

.more a:hover{color:#fff;opacity:1;}
.more a:hover:before{opacity:1;}
.more a:hover i{width:70px;}

.more.small{width:210px;margin:35px 0 0;}
.more.small a{height:50px;}





/*----------  トップページ home  ----------*/
/*----------  トップページ home  ----------*/
/*----------  トップページ home  ----------*/
#home #box-01{padding:140px 0 650px;position: relative;}
#home #box-01 .area-01{ width: fit-content;max-width: 100%;margin: auto;}
#home #box-01 .p-01{font-size:34px;margin: 50px 0 0px;text-align:center;}
#home #box-01 .p-02{font-size:16px;line-height:2.5em;text-align: left;}
#home #box-01 .photo{width:65%;height:500px;position: absolute;right:0;bottom:50px;}
#home #box-01 .photo img{width: 100%;height:100%;object-fit:cover;}

#home #box-02{padding:120px 0 120px;}
#home #box-02 h2{text-align: left;}
#home #box-02 .area-01{display:flex;align-items:flex-start;gap:95px;flex-direction:row-reverse;}
#home #box-02 .photo{}
#home #box-02 .tb{width:580px;padding-top:10px;position: relative;padding-bottom:130px;}
#home #box-02 p{line-height:2.3em;margin-bottom:28px;}
#home #box-02 .logo{width:230px;position: absolute;right:0;bottom:0;}

.bk-black{background:url(../images/home/dark-bg.jpg) center/cover fixed;color:#eee;position:relative;}
.bk-black:before{content:"";position:absolute;inset:0;background:rgba(8,9,12,.34);}


#home #box-03{padding:120px 0 10px;}
#home #box-03 h2{margin-bottom: 85px;}
#home #box-03 .area-01{display:flex;justify-content:center;gap:50px;margin-bottom:85px;}
#home #box-03 .entry{width:396px;}
#home #box-03 .entry a{display:block;}
#home #box-03 .entry .img{width:100%;height:500px;overflow:hidden;margin-bottom: 15px;}
#home #box-03 .entry .img img{width:100%;height:100%;object-fit:cover;filter:saturate(.9);transition:.6s;}
#home #box-03 .entry span{height:70px;border:1px solid rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;letter-spacing:.15em;position:relative;transition:.4s;}
#home #box-03 .entry span:before{content:"";width:20px;height:20px;border-top:3px solid #7f838b;border-right:3px solid #7f838b;position:absolute;right:0px;top:-0px;transition:.4s;}
#home #box-03 .entry span:after{content:"";width:20px;height:20px;border-left:3px solid #7f838b;border-bottom:3px solid #7f838b;position:absolute;left:0px;bottom:0px;transition:.4s;}
#home #box-03 .entry a:hover{opacity:1;}
#home #box-03 .entry a:hover .img img{transform:scale(1.03);filter:saturate(1.05) brightness(1.05);}
#home #box-03 .entry a:hover span{background:#fff;color:#222;border-color: #7f838b;}



#box-bnr{padding:145px 0 70px;}
#box-bnr .bnr{width:1280px;height:300px;display:block;margin:auto;position:relative;overflow:hidden;color:#fff;}
#box-bnr .bnr>img{width:100%;height:100%;object-fit:cover;transition:.5s;}
#box-bnr .bnr .cover{position:absolute;inset:0;background:rgba(28,20,29,.56);}
#box-bnr .bnr .logo{width:220px;position:absolute;left:70px;top:60px;filter:brightness(0) invert(1);opacity:.8;}
#box-bnr .bnr .tb{position:absolute;left:360px;top:30px;text-align:center;}
#box-bnr .bnr .tb h2{font-size:32px;font-weight:300;color:#fff;letter-spacing:.12em;margin-bottom:18px;}
#box-bnr .bnr .tb h2 span{font-size:42px;}
#box-bnr .bnr .tb p{font-size:16px;color:#fff;}
#box-bnr .bnr .more{width:auto;height:60px;margin:0;position:absolute;left:0;right:0;bottom:0;background:rgba(24,11,15,.75);display:flex;justify-content:flex-end;align-items:center;padding-right:85px;font-size:18px;letter-spacing:.12em;color:#fff;}
#box-bnr .bnr .more i{width:75px;height:1px;background:#fff;margin-left:30px;transition:.4s;position:relative;}
#box-bnr .bnr .more i:after{content:"";width:10px;height:10px;border-top:1px solid currentColor;position:absolute;right:1px;top:-5px;transform:rotate(45deg);}
#box-bnr .bnr:hover>img{transform:scale(1.02);filter:brightness(1.08);}
#box-bnr .bnr:hover .more i{width:95px;}



#home #box-05{min-height:620px;padding:70px 0 140px;}
#home #box-05 .area-01{width:285px;float:left;}
#home #box-05 .area-01 h2{text-align:left;}
#home #box-05 .area-02{width:900px;float:right;border-top:1px solid #8d8a90;}
#home #box-05 .area-02 a{display:grid;grid-template-columns:130px 1fr;gap:25px;border-bottom:1px solid #8d8a90;padding:27px 0;font-size:13px;transition:.35s;}
#home #box-05 .area-02 a:hover{opacity:.55;padding-left:12px;}
#home #box-05 .area-02 time{font-family:"Cormorant Garamond",serif;padding-top:3px;}
#home #box-05 .area-02 strong{display:block;font-size:16px;font-weight:400;margin-bottom:10px;}
#home #box-05 .area-02 span{display:block;line-height:1.8em;}


#home #box-06{min-height:100vh;padding:120px 0 120px;overflow:hidden;}

#home #box-06 .area-01{max-width:1500px;margin:auto;position:relative;}
#home #box-06 .area-01 .pager{position:absolute;right:0;top:35px;display:flex;gap:15px;align-items:center;}
#home #box-06 .area-01 .count{font-family:"Cormorant Garamond",serif;font-size:18px;color:#fff;margin-right:10px;}
#home #box-06 .area-01 button{width:60px;height:60px;border:1px solid #ddd;border-radius:50%;color:#fff;background:transparent;cursor:pointer;transition:.35s;}
#home #box-06 .area-01 button:hover{color:#222;background:#fff;}

#home #box-06 .area-02{max-width:1500px;height:450px;margin:70px auto 0;overflow:hidden;}
#home #box-06 .area-02 .inner{align-items:center;}
#home #box-06 .area-02 .entry{height:350px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
#home #box-06 .area-02 .entry.up{transform:translateY(-25px);}
#home #box-06 .area-02 .entry.down{transform:translateY(25px);}
#home #box-06 .area-02 .entry img{width:100%;height:350px;object-fit:cover;transition:.5s;}
#home #box-06 .area-02 .entry:hover{opacity:1;}
#home #box-06 .area-02 .entry:hover img{transform:scale(1.03);}

#home #box-06 .more{margin-top:40px;}
#home #box-06 .more a{border-color:#ddd;}


#home #box-07{min-height:820px;padding:105px 0 80px;}
#home #box-07 .area-01{display:flex;gap:95px;align-items:flex-start;}
#home #box-07 .map{width:887px;height:503px;background:#8f9298;overflow:hidden;position:relative;}
#home #box-07 .map img{width:100%;height:100%;object-fit:cover;}
#home #box-07 .map span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#fff;font-family:"Cormorant Garamond",serif;font-size:26px;letter-spacing:.12em;}
#home #box-07 .tb{width:300px;padding-top:15px;}
#home #box-07 .tb h2{text-align: left;}
#home #box-07 .tb p{font-size:16px;line-height:1.9em;margin-bottom:20px;}






/*----------  アニメーション animation  ----------*/
@keyframes mvBg{to{opacity:1;}}
@keyframes jewelIn{from{opacity:0;transform:translateY(-70px);} to{opacity:1;transform:none;}}
@keyframes logoIn{from{opacity:0;transform:translate(-50%,-32%);} to{opacity:1;transform:translate(-50%,-42%);}}
@keyframes fadeOnly{to{opacity:1;}}
@keyframes scrollLine{0%{top:-35px;} 100%{top:85px;}}
@keyframes galleryIn{to{opacity:1;transform:none;}}




/*----------  プロフィール profile  ----------*/
/*----------  プロフィール profile  ----------*/
/*----------  プロフィール profile  ----------*/
#profile .bk-gallery{min-height:100vh;background:url(../images/profile/bk-gallery.png) center/cover fixed;color:#eee;position:relative;}
#profile #box-01{padding:80px 0 80px;position: relative;margin-bottom:150px;}
#profile #box-01 .area-01{width:1280px;margin:auto;min-height:730px;position:relative;}
#profile #box-01 .photo{width:600px;position:absolute;left:0;top:0;}
#profile #box-01 .tb{width:560px;position:absolute;right:0;top:20px;}
#profile #box-01 .tb .more{margin-top:20px;}
#profile #box-01 .tb .more a{border-color:#ddd;}
#profile #box-01 .tb .more a i{width:55px;height:1px;background:currentColor;display:block;position:absolute;left:320px;top:50%;z-index:2;transition:.45s;}
#profile #box-01 .tb .more a i:after{content:"";width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;position:absolute;right:0;top:-3px;transform:rotate(45deg);}
#profile #box-01 .p-01{font-size:11px;letter-spacing:.18em;margin-bottom:5px;}
#profile #box-01 .tb h2{text-align: left;}
#profile #box-01 .tb h3{font-size:24px;font-weight:300;color:#897185;letter-spacing:.12em;margin-bottom:25px;}
#profile #box-01 .p-02{font-size:15px;line-height:2em;}

#profile #box-01 .photo-02{width:40%;height:300px;position: absolute;right:0;bottom:50px;}
#profile #box-01 .photo-02 img{width: 100%;height:100%;object-fit:cover;}


#profile #box-02{padding:145px 0 120px;}
#profile #box-02 .area-01{text-align:center;position: relative;padding-bottom:200px;}
#profile #box-02 .photo{width:960px;display:block;margin:70px auto 0;overflow:hidden;}
#profile #box-02 .photo img{width:100%;height:auto;object-fit:cover;transition:.5s;}
#profile #box-02 .photo:hover{opacity:1;}
#profile #box-02 .photo:hover img{transform:scale(1.015);}
#profile #box-02 .scroll-down{position:absolute;left:50%;bottom:12px;animation:fadeOnly 1s 3s forwards;}
#profile #box-02 .area-02{padding:50px 0 0;}




/*----------  レッスン lesson  ----------*/
/*----------  レッスン lesson  ----------*/
/*----------  レッスン lesson  ----------*/
.h3-01{font-size: 20px;color:#897185;padding-left:30px;margin-bottom:15px;background:url(../images/lesson/h3-01.png)left 5px no-repeat;background-size:23px auto;display:inline-block;}
#lesson .bk-gallery{margin:80px 0;}
#lesson .bk-gallery{min-height:100vh;color:#eee;position:relative;}

#lesson #box-01{padding:50px 0 100px;}
#lesson #box-01 .area-01{min-height:760px;position:relative;}
#lesson #box-01 .photo{width:600px;position:absolute;left:0;top:30px;}
#lesson #box-01 .photo img{width:100%;height:732px;object-fit:cover;}
#lesson #box-01 .tb{width:550px;position:absolute;right:0;top:60px;}
#lesson #box-01 .p-01{font-size:11px;letter-spacing:.18em;margin-bottom:5px;}
#lesson #box-01 .tb h2{text-align: left;margin-bottom:50px;}
#lesson #box-01 .tb h3{font-size:20px;font-weight:400;color:#333;margin-bottom: 20px;}
#lesson #box-01 .tb h3 img{vertical-align: middle;margin-right: 3px;}
#lesson #box-01 .tb .p-01{font-size: 20px;margin-bottom: 40px;}
#lesson #box-01 .tb p{font-size:16px;line-height:2em;}
#lesson #box-01 .tb p span{font-weight: bold;}

#lesson #box-02{padding:50px 0 20px;}
#lesson #box-02 .area-01{margin-bottom:70px;text-align: center;}
#lesson #box-02 .area-01 .tb{margin-bottom: 50px;}
#lesson #box-02 .area-01 .tb p{line-height: 2em;}
#lesson #box-02 .area-01 .tb p span{font-size:20px;font-weight: bold;display: block;}
#lesson #box-02 .area-01 h4{font-size:18px;font-weight: bold;margin-bottom: 15px;}

#lesson #box-02 ol{text-align: center;margin:45px 0 0;}
#lesson #box-02 ol li{min-width:160px;text-align:center;font-size:15px;text-align: center;letter-spacing: normal;line-height:1.8em;position:relative;display: inline-block;vertical-align:top;padding:0 30px;}
#lesson #box-02 ol li:after{content:"";width: 1px;height:110px;display: inline-block;position:absolute;right:0px;top:0px;background:#999;}
#lesson #box-02 ol li:last-child:after{display:none;}
#lesson #box-02 ol span{width:42px;height:42px;border:1px solid #aaa;border-radius:50%;display:block;line-height:40px;margin:0 auto 12px;font-family:"Cormorant Garamond",serif;}
#lesson #box-02 .more{width: 400px;}

#lesson #box-02 .area-02{width: 1024px;margin:auto;}
#lesson #box-02 .area-02 .inner{overflow:hidden;}
#lesson #box-02 .area-02 .entry{width:310px;float:left;text-align:center;margin-right:45px;}
#lesson #box-02 .area-02 .entry:last-child{margin-right:0;}
#lesson #box-02 .area-02 p{font-size:15px;margin-top:20px;}

/* box-03の文字色 */
#lesson #box-03 h2,
#lesson #box-03 h3,
#lesson #box-03 p{color:#333;}
#lesson #box-03 .tb h2,
#lesson #box-03 .tb p{color:#333;}
#lesson #box-03{padding:30px 0 100px;}
#lesson #box-03 .area-01{width:1280px;min-width:1100px;min-height:620px;position:relative;margin:auto;}
#lesson #box-03 .tb{width:520px;position: relative;z-index: 2;top:80px;}
#lesson #box-03 h2{text-align: left;}
#lesson #box-03 h3{font-size:20px;line-height:2em;font-weight:300;margin-bottom:30px;}
#lesson #box-03 p{font-size:15px;line-height:2em;}

#lesson #box-03 .photo{max-width:50%;min-width:600px;height:550px;position:absolute;right:0px;top:150px;}
#lesson #box-03 .photo img{width:100%;height:100%;object-fit:cover;}
#lesson #box-03 .p-01{font-size:11px;letter-spacing:.18em;margin-bottom:5px;}

#lesson #box-04{padding:30px 0 100px;}
#lesson #box-04 .h2-01{margin-bottom:30px;}
#lesson #box-04 .area-01{min-height:620px;position:relative;}
#lesson #box-04 .tb{width:520px;position:absolute;right:0;top:80px;}
#lesson #box-04 h2{text-align: left;}
#lesson #box-04 h3{font-size:20px;line-height:2em;font-weight:300;}
#lesson #box-04 p{font-size:15px;line-height:2em;}
#lesson #box-04 .photo{width:920px;position:absolute;left:-320px;top:0;}
#lesson #box-04 .photo img{width:100%;height:535px;object-fit:cover;}
#lesson #box-04 .monitor{display:inline-flex;align-items:center;flex-wrap:wrap;gap:6px 14px;margin:8px 0 22px;padding:12px 18px;background:linear-gradient(110deg,#f3eef2,#fff);border-left:4px solid #897185;color:#897185;font-size:20px;font-weight:500;letter-spacing:.08em;}
#lesson #box-04 .monitor span{display:inline;color:#777;font-size:14px;font-weight:400;letter-spacing:.04em;}

#lesson #box-05{width:900px;padding:20px 0 120px;text-align:center;}
#lesson #box-05 .p-01{font-size:20px;}

#lesson #box-06{width:min(900px,100%);box-sizing:border-box;padding:20px 20px 120px;margin:0 auto;text-align:center;}
#lesson #box-06 .link{width:100%;box-sizing:border-box;display:flex;justify-content:center;gap:24px;margin:30px auto 0;}
#lesson #box-06 .link a{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-width:220px;min-height:64px;box-sizing:border-box;padding:12px 24px;border:1px solid #897185;color:#574653;font-size:20px;text-decoration:none;transition:background-color .2s,color .2s;}
#lesson #box-06 .link a:hover{background:#897185;color:#fff;}
#lesson #box-06 .link img{width:28px;height:28px;object-fit:contain;}
#lesson #box-06 .shadow{border:1px solid #251a1f;border-radius:12px;}



#lesson #box-bnr{padding:50px 0 150px;}


/*----------  お問い合わせ contact  ----------*/
/*----------  お問い合わせ contact  ----------*/
/*----------  お問い合わせ contact  ----------*/


#contact #box-00{width:1024px;padding:0px 0 50px;}
#contact #box-00 span{font-size:36px;font-weight:bold;}
#contact #box-00 .text-area{padding:30px;background: #f7f4f8;border: 1px solid #e3dde6; border-radius: 10px;}

#contact #box-01{width:1024px;padding:0px 0 130px;}
#contact #box-01 .h2-02{margin-top:100px;}

#contact #box-01 .area-01{border-top:1px dotted #aaa;}
#contact #box-01 .entry{border-bottom:1px dotted #aaa;}
#contact #box-01 .entry button{width:100%;border:0;background:transparent;color:#6b5364;text-align:left;font-family:"Noto Serif JP",serif;font-size:20px;font-weight:300;letter-spacing:.08em;padding:26px 15px;position:relative;cursor:pointer;}
#contact #box-01 .entry button span{position:absolute;right:15px;top:23px;font-size:28px;font-weight:200;}
#contact #box-01 .entry .inner{display:none;padding:0 90px 30px 70px;}
#contact #box-01 .entry .inner p{font-size:13px;line-height:2em;}
#contact #box-01 .entry.open .inner{display:block;}


#contact #box-01 .area-02{margin-bottom:80px;}

/* アコーディオンメニュー */
.accordion {background:#fff;border-radius:15px;margin-bottom:15px;overflow: hidden;transition:.3s;}

/* 質問部分 */
.accordion dt{padding: 25px 20px 25px 85px;font-size:18px;color:#333;font-weight:bold;position: relative;cursor:pointer;transition:.3s;}
.accordion dt:hover{background:#cbe7f5;}
/* Qマーク */
.accordion dt::before {content: 'Q';background:#ddd;width:40px;height:40px;line-height:35px;font-size:24px;color:#fff;text-align:center;position: absolute;left:25px;top: 50%;transform: translateY(-50%);border-radius:50%;}
  
/* 回答部分は最初非表示 */
.accordion dd{display: none;padding:15px 20px 30px 85px;font-size:16px;background: #fff;position: relative;letter-spacing:normal;}
/* Aマーク */
.accordion dd::before {content: 'A';background:#2497D3;width:40px;height:40px;line-height:35px;font-size:24px;color:#fff;text-align:center;position:absolute;left:25px;top:40%;transform:translateY(-50%);border-radius:50%;}

/**/
.accordion dt span::before,
.accordion dt span::after {content: '';display: block;width:25px;height:1px;border-radius: 5px;background:#333;position: absolute;right:25px;top: 50%;transform: translateY(-50%);}
  
.accordion dt span::after {background:#333;transform: translateY(-50%) rotate(-90deg);transition: 0.5s;}

.accordion dt .active::after {transform: rotate(0);transition: 0.5s;}

#contact #box-form h3{width:650px;display: block;border-top: 1px solid #897185;border-bottom: 1px solid #897185;padding: 18px 0;color: #897185;font-family: "Noto Serif JP", serif;font-size:15px;font-weight:500;
line-height: 1.5em;letter-spacing: .25em;margin: auto;text-align:center;margin-bottom: 50px;}
#contact #box-form .caution{text-align:center;}
#contact #box-form .caution h3 a{text-decoration:underline;text-underline-offset:4px;}
#contact #box-form .caution h3 a:hover{text-decoration:none;}
#contact #box-form .caution ul{display:flex;justify-content:center;text-align:left;padding:20px;gap:40px;margin:20px 0 10px;}
#contact #box-form .caution li{text-align:left;}

#contact #box-form {width: 1024px;padding:80px 0 100px;}
#contact #box-form .area-mailform table{width:100%;margin-bottom:50px;}
#contact #box-form .area-mailform table td{padding:30px 8px;vertical-align:middle;border-bottom:#CCC solid 1px;font-size:20px;}
#contact #box-form .area-mailform table tr:first-child td{border-top:#CCC solid 1px;}
#contact #box-form .area-mailform table td.td-01{width:270px;font-size: 15px;font-weight:bold;vertical-align:top;}
#contact #box-form .area-mailform table ul li{margin-bottom:7px;}
#contact #box-form .area-mailform table ul li:last-of-type{margin-bottom:0px;}
#contact #box-form .area-mailform table ul.ul-01 li{margin-bottom:0px;}
#contact #box-form .area-mailform table select{padding:3px;font-size:15px;}
#contact #box-form .area-mailform table input{padding:3px;font-size:15px;border:none;}
#contact #box-form .area-mailform table label{font-size:15px;}
#contact #box-form .area-mailform table button{}
#contact #box-form .area-mailform .chui{font-size:13px;font-weight:bold;color:#897185;margin-left:7px;position:relative;}
#contact #box-form .area-mailform .chui-01{float:left;}
#contact #box-form .area-mailform .p-01{margin-top:5px;}
#contact #box-form .area-mailform .autotext{margin-bottom:30px;}
#contact #box-form .area-mailform .p-02{font-weight:bold;}
#contact #box-form .area-mailform .p-min{font-size:14px;letter-spacing:normal;padding-top:5px;}
#contact #box-form .area-mailform .w01{width:98%;}
#contact #box-form .area-mailform .w02{width:43.7%;}

#contact #box-form .area-mailform .kakunin{padding:5px 5px;margin-bottom:20px;text-align:center;}
#contact #box-form .area-mailform .tb-01{}
#contact #box-form .area-mailform .tb-03{text-align:center;position:relative;left:-30px;}
#contact #box-form .area-mailform .tb-03 .chui{float:none;}
#contact #box-form .area-mailform .tb-02{text-align:center;}
#contact #box-form .area-mailform .tb-04{height:200px;overflow-y:scroll;padding:20px;border:#999 solid 1px;background:#FFF;margin:auto;margin-bottom:50px;}
#contact #box-form .area-mailform .p-03{font-weight:bold;margin-bottom:10px;}
#contact #box-form .area-mailform .p-04{font-weight:bold;}
#contact #box-form .area-mailform .p-05{margin-bottom:15px;}
#contact #box-form .area-mailform .ul-01{margin-bottom:15px;}
#contact #box-form .area-mailform h2{font-size:22px;font-weight:bold;margin-bottom:5px;}


#contact #box-form .submit button{width:400px;height:62px;border:1px solid #777;background:#fff;font-family:"Noto Serif JP",serif;font-size:15px;cursor:pointer;position:relative;transition:.4s;}
#contact #box-form .submit button span{position: relative;z-index:2;}
#contact #box-form .submit button:hover{background:#29262e;color:#fff;}
#contact #box-form .submit button:before{content:"";width:100%;height:100%;background:linear-gradient(90deg,#8f8795 0%,#b7aeba 50%,#8f8795 100%);position:absolute;left:0;top:0;opacity:0;transition:.45s;}

#contact #box-form .submit button:hover:before{opacity:1;}


/* ご依頼詳細 */
#contact #box-irai{width:1024px;padding:0 0 20px;}
#contact #box-irai .irai-date{text-align:center;font-size:13px;color:#897185;margin:-25px 0 70px;}
#contact #box-irai .irai-h3{display:block;width:auto;text-align:center;font-size:18px;font-weight:400;color:#897185;letter-spacing:.3em;margin:0 0 25px;}
#contact #box-irai .irai-h3:before,
#contact #box-irai .irai-h3:after{content:"";display:inline-block;width:40px;height:1px;background:#b7aeba;vertical-align:middle;margin:0 18px;}

/* 流れ：カード＋右向き矢印 */
#contact #box-irai .irai-flow{display:flex;justify-content:center;gap:36px;margin:0 0 90px;}
#contact #box-irai .irai-flow li{
  flex:1;
  position:relative;
  padding:22px 12px 20px;
  background:#f7f4f8;
  border:1px solid #e3dde6;
  border-radius:10px;
  text-align:center;
  font-size:14px;
  line-height:1.9em;
  letter-spacing:normal;
}
#contact #box-irai .irai-flow span{
  width:36px;height:36px;line-height:34px;
  display:block;
  margin:0 auto 8px;
  background:#fff;
  border:1px solid #897185;
  border-radius:50%;
  color:#897185;
  font-family:"Cormorant Garamond",serif;
  font-size:18px;
}
#contact #box-irai .irai-flow b{display:block;font-size:17px;font-weight:400;color:#6b5364;margin-bottom:6px;letter-spacing:.1em;}

/* 右向き矢印：カード間の余白の中央 */
#contact #box-irai .irai-flow li:not(:last-child):after{
  content:"";
  position:absolute;
  top:50%;
  right:-27px;
  left:auto;
  bottom:auto;
  margin-top:-10px;
  width:0;
  height:0;
  border-top:10px solid transparent;
  border-bottom:10px solid transparent;
  border-left:13px solid #897185;
  border-right:0;
}
/* 料金表 */
#contact #box-irai .irai-note{text-align:center;font-size:13px;line-height:2em;margin-bottom:30px;}
#contact #box-irai .irai-table{width:100%;margin-bottom:100px;}
#contact #box-irai .irai-table th,
#contact #box-irai .irai-table td{border:1px solid #ddd;padding:20px 10px;text-align:center;vertical-align:middle;font-family:"Cormorant Garamond","Noto Serif JP",serif;font-size:18px;letter-spacing:.12em;}
#contact #box-irai .irai-table thead th{background:#f1eff2;color:#6b5364;font-weight:500;font-size:16px;}
#contact #box-irai .irai-table thead th small{display:block;font-size:12px;margin-top:2px;}
#contact #box-irai .irai-table tbody th{background:#ebe8ec;color:#6b5364;font-weight:500;width:15%;}
#contact #box-irai .irai-table td{background:#fff;}

/* 各項目 */
#contact #box-irai .term{margin-bottom:65px;text-align:center;}
#contact #box-irai .term p{font-size:13px;line-height:2.1em;letter-spacing:.06em;}
#contact #box-irai .term ul{display:inline-block;text-align:left;margin-top:10px;}
#contact #box-irai .term li{font-size:13px;line-height:2em;padding-left:1em;text-indent:-1em;}
#contact #box-irai .term li:before{content:"・";}

/* キャンセル */
#contact #box-irai .irai-cancel{display:flex;gap:15px;margin-top:25px;}
#contact #box-irai .irai-cancel div{flex:1;border:1px solid #ddd;padding:18px 5px;font-size:13px;line-height:1.8em;letter-spacing:normal;}
#contact #box-irai .irai-cancel small{display:block;font-size:13px;color:#897185;margin-bottom:4px;}
#contact #box-irai .irai-cancel b{font-family:"Cormorant Garamond","Noto Serif JP",serif;font-size:22px;font-weight:500;color:#6b5364;padding:0 2px;}

/* 禁止事項以下の文字サイズ調整 */
#contact #box-irai .term p{font-size:15px;line-height:2.1em;}
#contact #box-irai .term li{font-size:15px;line-height:2em;}
#contact #box-irai .irai-cancel div{font-size:15px;}
#contact #box-irai .irai-cancel small{font-size:14px;}
#contact .contact-sign {display: flex;align-items: center;justify-content: center;gap: 24px;padding: 24px 0;border-top: 1px solid #29262e;width:1100px;margin:auto;}
#contact .contact-sign__name{white-space: nowrap; }
#contact .contact-sign__logo{width: 90px; height: auto; }
#contact .contact-sign__info {list-style: none;margin: 0;padding: 0 0 0 24px;border-left: 2px solid #000;font-size: 18px;line-height: 2;}
#contact .contact-sign__info a{color: inherit; text-decoration: none; }
#contact .contact-sign__qr{display: flex; gap: 16px; }
#contact .contact-sign__qr figure{margin: 0; text-align: center; font-size: 12px; }
#contact .contact-sign__qr img{width: 70px; height: auto; display: block; }
#contac .contact-sign__head {display: flex;align-items: center;gap: 24px;}


/* スマホ */
@media (max-width: 767px){.contact-sign{flex-direction: column; gap: 16px; }
  .contact-sign__info{border-left: 0; padding-left: 0; font-size: 16px; }
}

/*▼▼▼スクロールでふわっと表示▼▼▼*/
/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {transition-timing-function:cubic-bezier(.64,.04,.35,1);transition:0.9s ease-in-out;transform:translateY(30px);opacity:0;}

.scroll_up.on {transform:translateY(0);transition:0.9s ease-in-out;opacity:1.0;}
.scroll_on {transition-timing-function:cubic-bezier(.64,.04,.35,1);transition:0.9s ease-in-out;transform:translateY(0px);opacity:0;}

.scroll_on.on {transform:translateY(0);opacity:1.0;}


/*==================================================
スライダーのためのcss
===================================*/
/*ドラッグ無効化・選択無効化はギャラリー内の画像だけに限定*/
.gallery img,
.choice-btn img{-webkit-user-drag: none;user-drag: none;-webkit-user-select: none;user-select: none;}

/*メイン画像下に余白をつける*/
.gallery{margin:0 0 5px 0;list-style:none;}
.gallery li{aspect-ratio: 16 / 9;overflow: hidden;}
.gallery img{width: 100%;height: 100%;/*★autoではなく100%にする。これでobject-fitが効くようになる*/object-fit:contain;}

/*矢印の設定*/
.slick-prev, 
.slick-next {position: absolute;z-index: 3;top: 42%;cursor: pointer;outline: none;border-top: 2px solid #ccc;border-right: 2px solid #ccc;height: 18px;width: 18px;filter: drop-shadow(0 0 2px rgba(0,0,0,0.6));}
.slick-prev {left: 4%;transform: rotate(-135deg);}
.slick-next {right: 4%;transform: rotate(45deg);}

/*選択するサムネイル画像の設定*/
.choice-btn{position: relative;}
.choice-btn li{cursor: pointer;outline: none;background:#333;list-style:none;aspect-ratio: 1 / 1;overflow: hidden;}
.choice-btn li img{width: 100%;height: 100%;object-fit: cover;opacity: 0.4;}
.choice-btn li.slick-current img{opacity: 1;}
.slick-prev {left: 4%;}
.slick-next {right: 4%;}


/* モーダルウィンドウ */
.yoyaku-modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.5);
}

.yoyaku-modal-overlay.is-open {
  display: flex;
}

.yoyaku-modal-inner {
  position: relative;
  width: 90%;
  max-width: 600px;
  max-height: 85vh;
  overflow-y: auto;
  box-sizing: border-box;
  padding: 2.5rem 2rem 2rem;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
}

.yoyaku-modal-close {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 1;
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 50%;
  background: rgba(247, 121, 34, 0.7);
  color: #fff;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.yoyaku-modal-close:hover {
  background: #d9650f;
}

#yoyaku-modal .title {
  margin: 0 0 0.8rem;
  padding: 0;
  border: none;
  background: none;
  color: #f77922;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

#yoyaku-modal .text {
  margin: 0;
  padding: 1.5rem;
  border-left: 4px solid #f77922;
  border-radius: 4px;
  background: #fef2e9;
  color: #444;
  font-size: 18px;
  line-height: 2;
}
