@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond&family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@400;500;600;700&display=swap');

/* ===================================================================

 file name  :  common.css

=================================================================== */
button,hr,input{overflow:visible;padding:0;}progress,sub,sup{vertical-align:baseline;}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0;}html{line-height:1;-webkit-text-size-adjust:100%}body{margin:0}details,main{display:block}h1{margin:.67em 0;font-size:2em;}hr{box-sizing:content-box;height:0}code,kbd,pre,samp{font-size:1em;font-family:monospace,monospace;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{margin:0;font-size:100%;font-family:inherit;line-height:1;}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none;}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{padding:.35em .75em .625em}legend{display:table;max-width:100%;color:inherit;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px-webkit-appearance:textfield;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button;}summary{display:list-item}[hidden],template{display:none}table{border-spacing:0;border-collapse:collapse;}td,th{padding:0;font-weight:normal;}ul{margin:0;padding:0;}ul li{margin:0;padding:0;list-style:none;}ol{margin:0;padding:0;}ol li{margin:0;padding:0;list-style:none;}
main,figure,figcaption,time,address,dl,dt,dd{display: block;margin:0;padding:0;}h1,h2,h3,h4,h5{margin:0;font-size:100%;}p{margin:0; padding:0;}address{font-style: normal;}*,*:after,*:before{outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);scrollbar-color: transparent transparent;scrollbar-width: 0px;-ms-overflow-style: none;}h1,h2,h3,h4{font-weight:normal;}mark{background: none;}html{box-sizing:border-box;}*,*:before,*:after{box-sizing:border-box;}

/* --------------------------------------------------
 common
--------------------------------------------------- */
body{
    min-width: 1100px;
    width: 100%;
    background: #f6f4f0;
    color: #333;
    letter-spacing: .02em;
    font-weight: 400;
    font-size: 12px;
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1;
}
a{ color: #333; text-decoration: none;}
a[href^="tel:"]{ pointer-events: none;}
a:hover, a:active{ color: #B38D39;}
.ctr:before,
.ctr:after{ display: block; overflow: hidden; content: "";}
.ctr:after{ clear: both;}
.ctr{ zoom: 1;}
.ctr-left{ float: left;}
.ctr-right{ float: right;}
.table{ display: table;}
.table-left{ display: table-cell;}
.table-right{ display: table-cell;}
em{ color: #ff5400; font-style: normal;}
.pagetop{ position: fixed; bottom: -50px; left: 50%; z-index: 9999; display: none; transform: translate(-50%,0);}
.pagetop a{ position: relative; display: flex; padding: 30px 0 0; width: 100px; height: 100px; border-radius: 100%; background: #fff; box-shadow: 2px 2px 1px rgba(0,0,0,.05); justify-content: center;}
.pagetop a:after{ display: block; width: 15px; height: 15px; border-top: 2px solid; border-right: 2px solid; color: #B38D39; content: ""; transform: rotate(-45deg);}
.cs{ padding: 150px 0 100px; text-align: center;}
.cs span{ display: inline-block; padding: 10px 30px; border: 1px solid; color: #dfc89b; font-size: 14px;}
#wrap{ overflow: hidden;}
.pc{ display: block;}
.sp{ display: none;}

/* --------------------------------------------------
 header
--------------------------------------------------- */
.header{ position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 132px; background: #fff; font-family: "Noto Serif JP", serif;}
.header-inner{ position: relative; box-sizing: border-box; margin: 0 auto; padding: 20px 45px 0; width: 100%; height: 132px; background: url("/img/bg_shadow_1.gif") no-repeat bottom center;}
.header a{ color: #b48e3a;}
.header a:hover{ color: #333;}
.header .logo{ display: inline-block;}
.header .logo a{ display: block;}
.header .logo a img{ width: auto; height: 47px;}
.header .gnav{ box-sizing: border-box; margin: 5px auto 0; width: 100%;}
.header .gnav > ul{ display: flex; justify-content: space-between;}
.header .gnav > ul > li{ position: relative;}
.header .gnav > ul > li > a{ display: block; height: 60px; letter-spacing: .2em; line-height: 60px;}

.header .gnav > ul > li > ul{ position: absolute; top: 50%; left: 50%; z-index: 100000; display: block; visibility: hidden; padding: 4px 15px; min-width: 210px; border-radius: 0 0 7px 7px; background: #fff; opacity: 0; transition: all .3s; transform: translate(-50%,0);}
.header .gnav > ul > li:hover > ul{ top: 100%; visibility: visible; opacity: 1;}
.header .gnav > ul > li > ul > li{ display: block; padding: 0; width: 100%;}
.header .gnav > ul > li > ul > li > a{ display: block; padding: 15px; height: auto; border-top: 1px dotted #e9e1d1; white-space: nowrap; letter-spacing: .2rem; line-height: 1;}
.header .gnav > ul > li > ul > li:first-child > a{ border: none;}

.header .gnav .row{ position: absolute; top: 50%; left: 50%; z-index: 100000; display: flex; visibility: hidden; padding: 0 15px; border-radius: 0 0 6px 6px; background: #fff; color: #b48e3a; letter-spacing: .2em; opacity: 0; transition: all .3s; transform: translate(-50%,0);}
.header .gnav li:hover{ cursor: pointer;}
.header .gnav li:hover > .row{ top: 100%; visibility: visible; opacity: 1;}
.header .gnav .row1{ margin: 0 30px 0 0; padding: 15px 0 0 15px;}
.header .gnav .row1 dl{ display: flex; flex-direction: column;}
.header .gnav .row1 dt{ display: flex; flex-direction: column; line-height: 1.5;}
.header .gnav .row1 dt span{ font-size: 10px;}
.header .gnav .row1 dd{ margin: 30px 0 0;}
.header .gnav .row1 dd a{ display: flex; flex-direction: column; width: 230px;}
.header .gnav .row1 dd a img{ width: 100%;}
.header .gnav .row1 dd a:hover img{ opacity: .5;}
.header .gnav .row1 dd a span{ margin: 1em 0 0; font-size: 10px;}
.header .gnav .row1 .logo2 a{ color: #727171;}
.header .gnav .row1 .logo2 a:hover{ color: #333;}
/*
.header .gnav .row1 dd{ margin: 15px 0 0;}
.header .gnav .row1 dd a{ display: block; overflow: hidden; width: 230px; height: 38.5375px; background: url("/collection/img/original/index/logo.svg") no-repeat center / 230px 38.5375px; text-indent: 100%; white-space: nowrap; transition: all .3s;}
.header .gnav .row1 dd a:hover{ background: url("/collection/img/original/index/logo2.svg") no-repeat center / 230px 38.5375px;}
*/
.header .gnav .row2 a{ display: flex; flex-direction: column; padding: 15px; border-top: 1px dotted #e9e1d1; white-space: nowrap; line-height: 1.5; align-items: flex-start;}
.header .gnav .row2 span{ font-size: 10px;}
.header .gnav .row2 li:first-child a{ border: none;}

.header .app{ position: absolute; top: 20px; right: 210px; padding: 20px 12px; background: #f8f4ed;}
.header .app ul{ display: flex;}
.header .app ul li{ padding: 0 8px; letter-spacing: .2rem; font-weight: 700;}
.header .app a{ color: #333;}
.header .app a:hover{ color: #b48e3a;}
.header .sns{ position: absolute; top: 30px; right: 45px;}
.header .sns ul{ display: flex; align-items: center;}
.header .sns li{ padding: 0 0 0 8px; letter-spacing: .1em;}
.header .sns img{ vertical-align: middle;}
.header .sns a{ display: block; color: #333; font-size: 30px;}
.header .sns a:hover{ color: #b48e3a;}

.header,
.header-inner,
.header .logo,
.header nav ul,
.header .app,
.header .app ul li,
.header .gnav{ transition: all .2s;}

.sticky{ height: 60px;}
.sticky .header-inner{ box-sizing: border-box; padding: 0 45px; height: 60px;}
.sticky .logo{ display: none;}
.sticky .app{ display: none;}
.sticky .sns{ display: none;}
.sticky .gnav{ margin: 0 auto;}

.snav{ position: fixed; top: 50%; right: 20px; z-index: 999999; margin-top: -34px;}
.snav li{ overflow: hidden; margin: 0 0 15px; text-indent: 100%; white-space: nowrap;}
.snav a{ display: block; width: 10px; height: 10px; border-radius: 100%; background: rgba(255,255,255,.8);}
.snav .current a{ background: #e9e1d1;}

/* --------------------------------------------------
 hero
--------------------------------------------------- */
.hero{ overflow: hidden; padding: 132px 0 0; height: 700px; background: #fff;}

.fixbn{ position: absolute; top: 132px; right: 0; z-index: 200; visibility: hidden; opacity: 0;}
.fixbn.is-show{ visibility: visible; opacity: 1;}
.fixbn .inner{ position: relative; z-index: 200; display: flex; flex-direction: column; padding: 0 0 0 2.777vw; width: 25vw; height: 284px; background: #8B8075; color: #fff; justify-content: center;}
.fixbn .close-btn {
    position: absolute;
    top: 1.388vw;
    right: 1.388vw;
    display: block;
    overflow: visible;
    width: 1.736vw;
    height: 1.736vw;
    cursor: pointer;
    transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.fixbn .close-btn:before,
.fixbn .close-btn:after{ position: absolute; top: 50%; right: 0; width: 1.736vw; height: 1px; background: #FFFFFF; content: ""; transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);}
.fixbn .close-btn:before{ transform: translate(0,-50%) rotate(45deg);}
.fixbn .close-btn:after{ transform: translate(0,-50%) rotate(-45deg);}
.fixbn .close-btn:hover:before{ transform: translate(0,-50%) rotate(0deg);}
.fixbn .close-btn:hover:after{ transform: translate(0,-50%) rotate(0deg);}

.fixbn .inner{ color: #fff; letter-spacing: .1em; font-weight: 400; font-family: "Cormorant Garamond", serif;}
.fixbn .inner .tl1{ font-size: 24px; line-height: 1.25;}
.fixbn .inner .tl2{ padding: 20px 0 0; font-size: 14px; font-family: "Noto Serif JP", serif; line-height: 1.57;}
.fixbn .inner .more{ display: flex; padding: 20px 0 0;}
.fixbn .inner .more a{ position: relative; display: flex; width: 9.722vw; height: 30px; border: 1px solid; color: #fff;font-size: 12px; align-items: center; justify-content: center;}
.fixbn .inner .more a:before{ position: absolute; top: 50%; right: 1.43vw; width: 5px; height: 8px; background: url("/img/arrow_slide.png") no-repeat center / contain; content: ""; transform: translate(0,-50%);}
.fixbn .inner .more a:after{ position: absolute; top: 0; left: 0; z-index: -1; width: 0; height: 100%; background: #8B8075; content: ""; transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);}
.fixbn .inner .more a:hover:after{ width: 100%;}

/* --------------------------------------------------
 note
--------------------------------------------------- */
.notes{ box-sizing: border-box; margin: 0 0 50px; padding: 30px; width: 1040px; border: 3px double #b38d41; background: rgba(255,255,255,.5); text-align: center;}
.notes a{ color: #ff5400; font-size: 18px;}
.notes a:hover{ text-decoration: underline;}

.notes2{ box-sizing: border-box; margin: 50px auto; padding: 30px; width: 1040px; border: 3px double #b38d41; background: rgba(255,255,255,.5); text-align: center; font-size: 14px; line-height: 1.8;}
.notes2 h2{ text-align: center; font-weight: bold; font-size: 18px;}
.notes2 p{ margin: 10px 0 0;}
.notes2 a{ color: #ff5400; text-decoration: underline;}
.notes2 a:hover{ text-decoration: none;}
.notes2 .imp{ text-align: left; font-size: 12px; line-height: 1.5;}
.notes2 table{ margin: 10px 0 0; width: 100%; border: 1px solid #b38d41; font-size: 13px; line-height: 1.5;}
.notes2 th{ padding: 5px; border: 1px solid #b38d41; background: #f1ede6; text-align: center; white-space: nowrap;}
.notes2 td{ padding: 10px 0; border: 1px solid #b38d41; vertical-align: middle; text-align: center;}
.notes2 table span{ display: block; font-size: 12px;}
.notes2 .exp{ padding: 10px; text-align: left;}

.note3{ text-align: center;}
.note3 a{ display: inline-block; box-sizing: border-box; padding: 15px 30px; border: 1px solid #B4AE97; text-align: center; font-size: 14px; font-family: "Noto Serif JP", serif;}

.bn{ margin: 70px 0 0; text-align: center;}
.bn a{ display: block;}
.bn img{ width: 100%;}

.anchor{ position: relative; z-index: -1;}
.anchor:before { display: block; margin-top: -60px; width: 100%; height: 60px; content: ""; vertical-align: top;}

#insta-window{ padding: 0 !important; border: none !important; border-radius: none !important;  background: none !important;}
.iswd-copyright-wrapper{ display: none !important;}

/* --------------------------------------------------
 content
--------------------------------------------------- */
.top{ margin: 0 auto; padding: 132px 0 120px; width: 1100px;}
.top img{ max-width: 100%; width: 100%;}

.ani { opacity: 0;}
.fadein { animation: fadein 1.2s ease forwards;}

@keyframes fadein {
    0% { opacity: 0;}
    100% { opacity: 1;}
}

.sec{ margin: 90px auto 0; padding: 108px 0 0; background: url("/img/blt.gif") no-repeat top center / 1100px 18px;}
.sec h2{ display: flex; flex-direction: column; color: #b48e3a; letter-spacing: .1em; font-size: 28px; font-family: "Noto Serif JP", serif; align-items: center;}
.sec h2 span{ margin: 1em 0 0; color: #333; letter-spacing: .1em; font-size: 14px;}

.sec1{ margin: 0 calc(50% - 50vw);}
.sec1 .slide{ opacity: 0; transition: opacity 1.2s ease;}
.sec1 .slide.slick-initialized{ opacity: 1;}
.sec1 .slick-slide{ padding: 0 3px; height: 35.67708333vw; backface-visibility: hidden; transform-style: preserve-3d;}
.sec1 .slick-slide img{ width: auto; height: 100%;}
.sec1 .slide a{ position: relative; display: block; height: 35.67708333vw;}
.sec1 .slide .caption{ position: absolute; right: 50px; bottom: 40px; display: flex; flex-direction: column; color: #fff; text-align: right; letter-spacing: .1em; font-weight: 400; font-size: 24px; font-family: "Cormorant Garamond", serif; line-height: 1.5; align-items: flex-end;}
.sec1 .slide .caption span{ margin: 1em 0 0; font-size: 12px;}

.slick-dotted.slick-slider{ margin-bottom: 0;}
.slick-dots{ bottom: -30px;}
.slick-dots li{ margin: 0 5px; width: 10px; height: 10px;}
.slick-dots li button{ padding: 0; width: 10px; height: 10px;}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before{ opacity: 1;}
.slick-dots li button:before{ width: 10px; height: 10px; border: 1px solid #b38d41; border-radius: 100%; content: ''; opacity: 1;}
.slick-dots li.slick-active button:before{ background: #b38d41; opacity: 1;}

.top h1{ margin: 90px 0 0; text-align: center; letter-spacing: .1em; font-size: 20px; font-family: "Noto Serif JP", serif; line-height: 2;}

.sec2 h3{ display: flex; flex-direction: column; justify-content: center; align-items: center;}
.sec2 h3 span{ margin: 1em 0 0; color: #333; letter-spacing: .1em; font-size: 14px;}
.sec2 ul > li{display: flex;  margin: 90px 0 0; align-items: center; justify-content: space-between;}
.sec2 ul > li:nth-child(even){ flex-direction: row-reverse;}
.sec2 ul figure{ width: calc(50% - 90px); filter: drop-shadow(0px 6px 6px rgba(0, 0, 0, 0.16));}
.sec2 ul .detail{ width: calc(50%); text-align: center;}
.sec2 ul .detail p{ margin: 60px 0 0; letter-spacing: .1em; font-size: 18px; font-family: "Noto Serif JP", serif; line-height: 2;}

.sec .more{ margin: 60px 0 0;}
.sec .more a{ display: flex; margin: 0 auto; width: 160px; height: 35px; border: 1px solid #b38d41; color: #b38d41; white-space: nowrap; letter-spacing: .1em; align-items: center; justify-content: center;}
.sec .more-wd a{ width: 180px;}
.sec .more a:hover{ background: #b38d41; color: #f6f4f0;}

.sec3 ul{ display: flex; margin: -20px -10px 0; justify-content: center; flex-wrap: wrap;}
.sec3 ul > li{ padding: 20px 10px 0; width: 50%;}
.sec3 ul a{ display: block; filter: drop-shadow(0px 6px 6px rgba(0, 0, 0, 0.16));}
.sec3 h1{ margin: 60px 0 0; text-align: center; letter-spacing: .1em; font-size: 20px; font-family: "Noto Serif JP", serif; line-height: 2;}

.list-news{ display: flex; margin: 60px 0 0; justify-content: space-between;}
.list-news > li{ width: calc(100% / 3 - 30px);}
.list-news a{ display: flex; height: 100%; justify-content: space-between;}
.list-news figure{ position: relative; overflow: hidden; padding-top: 50%; width: 50%; height: 0;}
.list-news figure img{ position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transition: all .3s ease-in-out; transform: translate(-50%,-50%); object-fit: cover;}
.list-news a:hover figure img{ transform: translate(-50%,-50%) scale(1.1);}
.list-news .detail{ position: relative; padding: 0 0 0 15px; width: 50%; height: 100%; letter-spacing: .05em; line-height: 1.75;}
.list-news .detail .cat{ position: relative; margin: 0 0 1em; padding: 0 0 .5em; color: #b38d41; font-size: 10px; font-family: "Noto Serif JP", serif;}
.list-news .detail .cat:after{ position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: #b38d41; content: "";}
.list-news .detail .cat.is-animated:after{ animation: 1.2s stroke-width .6s cubic-bezier(0.22, 1, 0.36, 1) forwards;}

@keyframes stroke-width {
    0% { width: 0; opacity: 1;}
    100% { width: 100%; opacity: 1;}
}

.list-news .detail h3{ word-break: break-all; letter-spacing: .05em; font-weight: 400; font-size: 14px;}
.list-news .detail time{ position: absolute; bottom: 0; left: 15px;}

.list-sns{ display: flex; justify-content: space-between;}
.list-sns > li{ width: calc(50% - 30px);}
.list-sns .insta-wrap{ margin: 60px 0 0;}
.list-sns .more a{ width: 210px;}

.sec6 ul > li{ display: flex; margin: 120px 0 0; align-items: center;}
.sec6 ul > li:nth-child(even){ flex-direction: row-reverse;}
.sec6 ul > li:first-child{ margin: 60px 0 0;}
.sec6 ul figure{ width: 60%; filter: drop-shadow(0px 6px 6px rgba(0, 0, 0, 0.16));}
.sec6 ul .detail{ display: flex; flex-direction: column; width: 40%; text-align: center; align-items: center; justify-content: center;}
.sec6 ul .detail h3{ display: flex; flex-direction: column; color: #b38d41; letter-spacing: .1em; font-weight: 500; font-size: 24px; font-family: "Noto Serif JP", serif; line-height: 1.5; align-items: center; justify-content: center;}
.sec6 ul .detail h3 span{ color: #333; font-size: 14px;}
.sec6 ul .detail p{ margin: 30px 0 0; letter-spacing: .1em; font-size: 18px; font-family: "Noto Serif JP", serif; line-height: 2;}
.sec6 ul .detail .more{ margin: 60px 0 0;}

.list-shop-wrap{ margin: 60px calc(50% - 50vw) 0;}
.list-shop{ opacity: 0; transition: opacity 1.2s ease;}
.list-shop.slick-initialized{ opacity: 1;}
.list-shop .slick-slide{ padding: 0 30px; width: 420px; backface-visibility: hidden; transform-style: preserve-3d;}
.list-shop a{ display: block;}
.list-shop a:hover{ color: #333;}
.list-shop figure{ overflow: hidden;}
.list-shop figure img{ width: 100%; transition: all .3s ease-in-out;}
.list-shop a:hover figure img{ transform: scale(1.1);}
.list-shop .detail{ padding: 15px 0 0; text-align: left; letter-spacing: .05em; line-height: 1.75;}
.list-shop h3{ color: #b38d41; font-weight: 500; font-size: 21px; font-family: "Noto Serif JP", serif;}
.list-shop p{ margin: 1em 0 0;}
.list-shop table{ margin: 1em 0 0; width: 100%; border-top: 3px double #e0c898; border-bottom: 3px double #e0c898; font-size: 12px; line-height: 1.5;}
.list-shop table th{ padding: 10px 10px 10px 0; width: 25%; border-top: 1px solid #e0c898; vertical-align: top; text-align: left; white-space: nowrap; font-weight: normal;}
.list-shop table td{ padding: 10px 0 10px 10px; border-top: 1px solid #e0c898; border-left: 1px solid #e0c898;}
.sec7 .more{ margin: 75px 0 0;}


/* --------------------------------------------------
 article
--------------------------------------------------- */
article{ padding: 132px 0 0;}
article header{ height: 360px;}
article header h1{ display: none;}
article .content{ overflow: hidden; margin: 0 auto; padding: 60px 0 120px; width: 1100px;}
article .sidebar{ float: left; width: 200px;}
article .main{ float: right; width: 820px;}

article > nav ul{ display: flex; border-left: 1px solid #e9e1d1; letter-spacing: .1em; font-size: 14px; font-family: "Noto Serif JP", serif; justify-content: center;}
article > nav ul > li{ padding: 20px 40px; border-right: 1px solid #e9e1d1;}
article > nav ul > li:first-child{ border-left: 1px solid #e9e1d1;}
article > nav a{ display: inline; padding: 0 0 5px;}
article > nav .current a{ border-bottom: 1px solid; color: #b48e3a;}

/* --------------------------------------------------
 .flow
--------------------------------------------------- */
main > .flow{ margin: 0 auto; padding: 108px 0 90px; background: url("/img/blt.gif") no-repeat top center / 1100px 18px;}
main > .flow h2{ color: #b48e3a; text-align: center; letter-spacing: .1em; font-size: 28px; font-family: "Noto Serif JP", serif;}
.list-flow{ position: relative; display: inline-block; margin: 45px auto 0; counter-reset: number; font-size: 14px;}
main > .flow .list-flow{ font-size: 16px;}
.list-flow:before{ position: absolute; top: 0; left: 15px; width: 1px; height: 100%; background: #e9e1d1; content: "";}
.list-flow > li{ position: relative; padding: 0 0 0 3em; counter-increment: number; text-align: left;}
.list-flow > li:before{ position: absolute; top: 50%; left: 0; display: flex; width: 30px; height: 30px; border-radius: 100%; background:  #e9e1d1; content: counter(number); font-size: 12px; font-family: "Noto Serif JP", serif; transform: translate(0,-50%); align-items: center; justify-content: center;}
.list-flow > li + li{ margin: 45px 0 0;}

/* --------------------------------------------------
 .shop
--------------------------------------------------- */
main > .shop{ margin: 0 auto; padding: 108px 0 0; background: url("/img/blt.gif") no-repeat top center / 1100px 18px;}
main > .shop h2{ color: #b48e3a; text-align: center; letter-spacing: .1em; font-size: 28px; font-family: "Noto Serif JP", serif;}
main > .shop .list-shop .slick-slide{ padding: 0 20px; width: 20vw; backface-visibility: hidden; transform-style: preserve-3d;}
main > .shop .list-shop h3{ font-size: 16px;}
main > .shop .list-shop p{ margin: 0;}
main > .shop .list-shop table{ font-size: 11px;}
main > .shop .more{ margin: 75px auto 0;}


/* --------------------------------------------------
 .relate
--------------------------------------------------- */
main > .relate{ display: flex; margin: 0 auto; padding: 69px 0 60px; width: 1100px; background: url("/img/blt.gif") no-repeat top center;}
main > .shop + .relate{ margin: 90px auto 0; justify-content: center;}
main > .relate .box{ position: relative; padding: 0 27px; width: 25%; height: 250px;}
main > .relate .box h2{ position: relative; display: flex; height: 40px; text-align: center; letter-spacing: .12em; font-weight: 600; font-size: 16px; font-family: "Noto Serif JP", serif; justify-content: center; align-items: center;}
main > .relate .box h2:before,
main > .relate .box h2:after{ position: absolute; top: 0; width: 10px; height: 100%; border: 1px solid #e9e1d1; content: "";}
main > .relate .box h2:before{ left: 0; border-right: none;}
main > .relate .box h2:after{ right: 0; border-left: none;}
main > .relate .box p{ margin: 30px 0 0; padding: 0 10px; line-height: 1.8;}
main > .relate .box .btn{ position: absolute; bottom: 0; left: 27px;}
main > .relate .box .btn a{ display: block; width: 221px; height: 45px; background: #b28c39; color: #fff; text-align: center; line-height: 45px;}
main > .relate .box .btn a:hover,
main > .relate .box .btn a:active{ background: #fff; color: #b28c39;}

/* --------------------------------------------------
 form
--------------------------------------------------- */
.form article{ margin: 0 auto; padding: 205px 0 68px; width: 1100px; background: url("/img/blt.gif") no-repeat bottom center;}
.form article header{ padding: 68px 0 0; height: auto; background: url("/img/blt.gif") no-repeat top center;}
.form article header h1{ display: block; color: #b28c39; text-align: center; letter-spacing: .2em; font-size: 28px; font-family: "Noto Serif JP", serif;}
.form article header h1 a{ color: #b28c39;}
.form article header .lead{ margin: 25px 0 0; padding: 25px; background: #f1ede6; text-align: center; font-size: 14px; line-height: 1.8;}
.form article header .lead p{ margin: 25px 0 0;}
.form article header .lead p:first-child{ margin: 0;}
.form article header .lead a{ color: #ff5400; text-decoration: underline;}
.form article header .lead a:hover{ text-decoration: none;}
.form article header .lead ul{ margin: 25px 0 0; text-align: center;}
.form article header .lead ul li{ position: relative; display: inline-block; margin: 0 25px; padding: 0 0 0 14px; font-weight: bold;}
.form article header .lead ul li:after{
    position: absolute;
    top: 9px;
    left: 0;
    display: block;
    width: 4px;
    height: 4px;
    border-right: 2px solid #333;
    border-bottom: 2px solid #333;
    content: "";
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.form article header .lead2{ margin: 25px 0 0; padding: 25px; background: #f1ede6; text-align: center; font-size: 14px; line-height: 1.8;}
.form article header .lead2 .list{ display:inline-block; line-height: 2;}
.form article header .lead2 .list > li{ list-style: disc; text-align: left;}
.form .fin{ margin: 50px 0 0; padding: 15px 0; border: 1px solid; color: #f00; text-align: center; font-size: 15px; line-height: 1.8;}
.form article .note{ margin: 50px 0 0;}
.form article h3{ text-align: center; font-weight: bold; font-size: 18px;}

.form article table{ margin: 25px 0 0; width: 100%; border: 3px double #e0c898; border-collapse: collapse; font-size: 14px; line-height: 1.8;}
.form article table:first-child{ margin: 15px 0 0;}
.form article table th{ padding: 15px 30px; width: 350px; border: 1px solid #e0c899; border-collapse: collapse; background: #f1ede6; text-align: left; font-weight: normal;}
.form article table td{ padding: 15px 30px; border: 1px solid #e0c899; border-collapse: collapse;}
.form article table td div{ padding: 5px 0;}
.form article table td div p{ padding: 1em 0 0;}

.form article .order th{ width: 275px;}
.form article .order td{ padding: 15px; width: 275px; vertical-align: middle;}
.form article .order .size{ padding: 15px 30px;}
.form article .order a{ color: #b28c39; text-decoration: underline;}
.form article .order a:hover{ text-decoration: none;}
.form article .order input[type="text"],
.form article .order input[type="email"],
.form article .order input[type="tel"]{ padding: 0 .2em; width: 100%;}
.form article .order input.short{ width: 25%;}
.form article .order input.short2{ width: 15%;}
.form article .order input.long{ width: 60%;}
.form article .order td label{ display: flex; width: 100%; align-items: center;}
.form article .order3 tbody th{ width: 25%;}
.form article .order3 tbody td{ width: 75%;}

.form article .type2{ margin: 25px 0 0; width: 100%; border: 1px double #e0c898; border-collapse: collapse; font-size: 14px; line-height: 1.8;}
.form article .type2 th{ padding: 10px 0; border: 1px solid #e0c899; border-collapse: collapse; background: #f1ede6; text-align: center; white-space: nowrap; font-weight: normal;}
/*.form article .type2 tbody th{ background: #fff; width: 25%;}*/
.form article .type2 tbody th{ width: calc(100% / 6); background: #fff;}
.form article .type2 a{ color: #b48e3a; text-decoration: underline; font-weight: 600;}
.form article .type2 a:hover{ text-decoration: none;}
/*.form article .type2 td{ padding: 10px 0; width: 25%; border: 1px solid #e0c899; border-collapse: collapse; background: #fff; text-align: center; font-size: 13px;}*/
.form article .type2 td{ padding: 10px 0; width: calc(100% / 6); border: 1px solid #e0c899; border-collapse: collapse; background: #fff; text-align: center; font-size: 13px;}
.form article .type2 td span{ display: block; color: #f00;font-size: 10px; }

.form article input.long{ width: 100%;}
.form article input.md{ width: 50%;}
.form article textarea{ box-sizing: border-box; padding: 10px; width: 100%; line-height: 1.5;}
.form article .jqLabel{ position: relative;}
.form article .jqLabel label{ position: absolute; top: 5px; left: 5px;}
.form article .agree{ margin: 25px 0 0; padding: 25px; border: 3px double #e0c899; border-collapse: collapse; font-size: 14px; line-height: 1.8;}
.form article .agree h2{ font-weight: bold;}
.form article .agree p{ margin: 25px 0 0;}
.form article .agree ul{ margin: 0 0 0 1.5em;}
.form article .agree li{ list-style: disc;}
.form article .agree table{ border: none;}
.form article .submit{ margin: 25px 0 0; text-align: center;}
.form article button{ width: 150px; height: 45px; border: none; background: #b28c39; color: #fff; font-size: 14px; line-height: 45px;}
.form article button:hover,
.form article button:active{ background: #fff; color: #b28c39;}
.form article .thanks{ margin: 50px 0 0; text-align: center;}
.form article .thanks h2{ text-align: center; font-weight: 600; font-size: 20px;}
.form article .thanks p{ margin: 25px 0 0; font-size: 14px; line-height: 1.8;}
.form article .thanks .btn{ margin: 50px auto 0; text-align: center;}
.form article .thanks .btn a{ display: inline-block; width: 150px; height: 50px; background: #b28c39; color: #fff; font-size: 14px; line-height: 50px;}
.form .footer{ margin: 60px 0 0;}

/* --------------------------------------------------
 footer
--------------------------------------------------- */
.footer1{ position: relative; box-sizing: border-box; padding: 0 45px; width: 100%; background: #fff; font-family: "Noto Serif JP", serif;}
.footer1 .inner{ position: relative; box-sizing: border-box; margin: 0 auto; width: 100%; height: 60px;}
.footer1 a{ color: #b48e3a;}
.footer1 a:hover{ color: #333;}
.footer1 nav > ul{ display: flex; justify-content: space-between;}
.footer1 nav > ul > li{ position: relative;}
.footer1 nav > ul > li > a{ display: block; height: 60px; letter-spacing: .2rem; line-height: 60px;}
.footer1 nav > ul > li > ul{ position: absolute; bottom: 50%; left: 50%; z-index: 100000; display: block; visibility: hidden; padding: 4px 15px; min-width: 210px; border-radius: 6px 6px 0 0; background: #fff; opacity: 0; transition: .4s; transform: translate(-50%,0);}
.footer1 nav > ul > li:hover > ul{ bottom: 100%; visibility: visible; opacity: 1;}
.footer1 nav > ul > li > ul > li{ display: block; padding: 0; width: 100%;}
.footer1 nav > ul > li > ul > li > a{ display: block; padding: 15px; border-top: 1px dotted #e9e1d1; white-space: nowrap; letter-spacing: .2rem;}
.footer1 nav > ul > li > ul > li:first-child > a{ border: none;}
.footer1 nav{ -webkit-transition: all .4s ease-out; transition: all .4s ease-out;}

.footer1 .gnav .row{ position: absolute; bottom: 50%; left: 50%; z-index: 100000; display: flex; visibility: hidden; padding: 0 15px; border-radius: 6px 6px 0 0; background: #fff; color: #b48e3a; letter-spacing: .2em; opacity: 0; transition: all .3s; transform: translate(-50%,0);}
.footer1 .gnav li:hover{ cursor: pointer;}
.footer1 .gnav li:hover > .row{ bottom: 100%; visibility: visible; opacity: 1;}
.footer1 .gnav .row1{ margin: 0 30px 0 0; padding: 15px 0 0 15px;}
.footer1 .gnav .row1 dl{ display: flex; flex-direction: column;}
.footer1 .gnav .row1 dt{ display: flex; flex-direction: column; line-height: 1.5;}
.footer1 .gnav .row1 dt span{ font-size: 10px;}
.footer1 .gnav .row1 dd{ margin: 30px 0 0;}
.footer1 .gnav .row1 dd a{ display: flex; flex-direction: column; width: 230px;}
.footer1 .gnav .row1 dd a img{ width: 100%;}
.footer1 .gnav .row1 dd a:hover img{ opacity: .5;}
.footer1 .gnav .row1 dd a span{ margin: 1em 0 0; font-size: 10px;}
.footer1 .gnav .row1 .logo2 a{ color: #727171;}
.footer1 .gnav .row1 .logo2 a:hover{ color: #333;}
.footer1 .gnav .row2 a{ display: flex; flex-direction: column; padding: 15px; border-top: 1px dotted #e9e1d1; white-space: nowrap; line-height: 1.5; align-items: flex-start;}
.footer1 .gnav .row2 span{ font-size: 10px;}
.footer1 .gnav .row2 li:first-child a{ border: none;}

.footer2{ position: relative; margin: 0 auto; padding: 25px 0 120px; width: 1100px; text-align: center;}
.footer2 .privacy{ position: absolute; top: 25px; left: 0; text-align: left;}
.footer2 .copy{ display: inline-block; text-align: center;}
.footer2 .sns{ position: absolute; top: 15px; right: 0;}
.footer2 .sns ul{ display: flex; align-items: center;}
.footer2 .sns li{ padding: 0 0 0 10px;}
.footer2 .sns img{ vertical-align: middle;}
.footer2 .sns a{ display: block; color: #333; font-size: 30px;}
.footer2 .sns a:hover{ color: #b48e3a;}

.footer3{ display: flex; box-sizing: border-box; width: 100%; background: #fff; font-family: "Noto Serif JP", serif; justify-content: center; align-items: center;}
.footer3 ul{ display: flex; justify-content: center;}
.footer3 ul > li{ padding: 0 45px;}
.footer3 ul > li a{ display: flex; height: 60px; color: #333; letter-spacing: .2rem; font-weight: 700; font-size: 13px; align-items: center;}
.footer3 ul > li a:hover{ color: #b48e3a;}