@charset "utf-8";
/* --------------------------------------------------
	reset
-------------------------------------------------- */
* { margin: 0; padding: 0; box-sizing: border-box;}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
form, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0; padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

img{ vertical-align: bottom;
 width:88px;}
ol,ul{ list-style: none;}
ol li,
ul li{ list-style-type: none;}
figure { margin: 0;}


/* =============================================================================
   Forms
   ========================================================================== */
form { margin: 0;}
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}
legend { border: 0;}
button,
input,
select,
textarea { font-size: 100%; margin: 0; vertical-align: baseline;}
button,
input { line-height: normal;}
button,
input[type="button"], 
input[type="reset"], 
input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"],
input[type="radio"] { box-sizing: border-box; padding: 0;}
input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none;}

button::-moz-focus-inner,
input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top;}
input[type="search"]:focus { outline: none;}

table {
    border-collapse: collapse;
    border-spacing: 0;
}


/*	Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box;
-webkit-user-select: none;
   -moz-user-select: none;
    -ms-user-select: none;
        user-select: none;

-webkit-touch-callout: none;
	-khtml-user-select: none;
	-ms-touch-action: pan-y;
  	  touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}

.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus { outline: none;}
.slick-list.dragging{ cursor: pointer; cursor: hand;}
.slick-slider .slick-track,
.slick-slider .slick-list{
-webkit-transform: translate3d(0, 0, 0);
   -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
     -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
}
.slick-track { position: relative; top: 0; left: 0; display: block;}
.slick-track:before,
.slick-track:after { display: table; content: '';}
.slick-track:after { clear: both;}
.slick-loading .slick-track { visibility: hidden;}
.slick-slide { display: none; float: left; height: 100%; min-height: 1px;}
[dir='rtl'] .slick-slide { float: right;}
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none;}
.slick-slide.dragging img { pointer-events: none;}
.slick-initialized .slick-slide { display: block; outline: none;}
.slick-loading .slick-slide { visibility: hidden;}
.slick-vertical .slick-slide{ display: block; height: auto;}
.slick-arrow.slick-hidden { display: none;}

.slick-arrow{ width: 40px; height: 40px; position: absolute; top: 50%; transform: translateY(-50%);
 background: #b8a16b; border: none; border-radius: 50%; z-index: 100;
 text-indent: -9999em; outline: none;
}
.slick-prev { left: 0px;}
.slick-next { right: 0px;}
.slick-arrow:before{ position: absolute; content: ''; display: block; width: 0px; height: 0px; top: 50%; transform: translateY(-50%);}
.slick-prev:before { left: 30%; border: solid 7px transparent; border-right: solid 12px #fff; border-left: 0;}
.slick-next:before { right: 30%; border: solid 7px transparent; border-left: solid 12px #fff; border-right: 0;}
@media (max-width: 481px) {
	.slick-prev { left: -10px;}
	.slick-next { right: -10px;}
	.slick-arrow{ width: 30px; height: 30px;}
	.slick-prev:before { border: solid 5px transparent; border-right: solid 10px #fff; border-left: 0;}
	.slick-next:before { border: solid 5px transparent; border-left: solid 10px #fff; border-right: 0;}
}


/*		font-style
-------------------------------------------------- */
body { width: 100%;
 color: #fff;
 font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
 font-size: 16px;
 line-height: 1.6;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
}
input, textarea {font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}
body.fixed { position: fixed;}
.gothic { font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}
.jp { font-family: "Noto Sans JP", sans-serif;}
.eng{ font-family: "Times New Roman", serif;}

::selection{ background: #feffaf; color: #000;}
::-moz-selection{ background: #feffaf; color: #000;}


a { color:#002159; text-decoration: underline;}
a:link   { color:#002159;}
a:visited{ color:#002159;}
a:hover  { color:#002159;}
a:active { color:#002159;}

em{ font-style: normal;}


/*		utility
-------------------------------------------------- */
.cf{ clear: both;}
.cf:after{ content: ''; display: block; clear: both;}

@media (max-width: 641px) {
}





#hd { position: fixed; left: 0; top: 0; width: 100%; background: #191919; z-index: 101;}
#hd .inner-hd { position: relative; padding: 16px 30px; padding-right: 240px;}
#hd h1 { float: left; width: 40%; max-width: 240px;}
#hd h1 img { width: 100%;}
#hd h1 a:hover img { opacity: 0.85;}
#hd ul { font-size: 0; text-align: right;}
#hd ul li { position: relative; display: inline-block; padding: 12px 25px; font-size: 16px; line-height: 1;}
#hd ul li:before { content: ''; display: block; width: 1px; height: 30px; background: #fff;
 position: absolute; left: 0; top: 50%; transform: translate(0,-50%) rotate(20deg);
}
#hd ul li:first-child:before { content: none;}
#hd ul li a { color: #fff; font-weight: 700; text-decoration: none;}
#hd ul li.on a { color: #c8b079;}
#hd ul li a:hover { color: #c8b079;}
#hd .hd-btn { position: absolute; width: 240px; right: 0; top: 0;}
#hd .hd-btn a { display: block; padding: 25px 0 26px; background: #c8b079; color: #fff; text-decoration: none; text-align: center;
 transition: 0.2s linear;
}
#hd .hd-btn a svg { display: inline-block; width: 30px; height: 21px; margin-right: 12px; fill: #fff; vertical-align: middle;}
#hd .hd-btn a:before{ content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0px;
 border: solid 75px transparent; border-left: solid 23px #191919; border-top: 0px;
}
#hd .hd-btn a span { display: inline-block; font-size: 18px; font-weight: 700; line-height: 1; vertical-align: middle;}
#hd .hd-btn a:hover { opacity: 0.8;}

#sp-menu { display: none; position: absolute; right: 0; top: 50%; width: 35px; height: 35px; transform: translate(0,-50%); z-index: 10;}
#sp-menu div { position: relative; width: 100%; height: 100%;}
#sp-menu div:after { content: 'MENU'; position: absolute; left: 0; bottom: 0; width: 100%; text-align: center;
 font-size: 9px; line-height: 1;
}
#sp-menu div span { display: block; width: 100%; height: 2px; background: #fff; position: absolute; left: 0; transition: 0.4s linear; opacity: 1;}
#sp-menu div span:nth-of-type(1){ top: 0;}
#sp-menu div span:nth-of-type(2){ top: 8px;}
#sp-menu div span:nth-of-type(3){ top: 17px;}
#sp-menu.active div span:nth-of-type(1){ transform: translate(0,8px) rotate(30deg);}
#sp-menu.active div span:nth-of-type(2){ opacity: 0;}
#sp-menu.active div span:nth-of-type(3){ transform: translate(0,-8px) rotate(-30deg);}

@media (max-width: 1001px) {
	#hd h1 { max-width: 200px;}
	#hd .inner-hd { padding: 14px 20px; padding-right: 200px;}
	#hd ul li { padding: 10px 15px; font-size: 14px;}
	#hd .hd-btn { position: absolute; width: 200px; right: 0; top: 0;}
	#hd .hd-btn a { display: block; padding: 20px 0;}
	#hd .hd-btn a svg { width: 20px; height: 14px; margin-right: 8px;}
	#hd .hd-btn a:before{ border: solid 65px transparent; border-left: solid 20px #191919; border-top: 0px;}
	#hd .hd-btn a span { font-size: 16px;}
}
@media (max-width: 801px) {
	#hd .inner-hd { width: calc(100% - 40px); margin: 0 auto; padding: 15px 0;}
	#hd h1 { float: none; width: 40%;}
	#hd ul { display: none;}
	#hd .hd-btn { display: none;}
	#sp-menu { display: block;}
}
@media (max-width: 481px) {
	#hd .inner-hd { padding: 12px 0;}
	
}


#spNav { display: none; position: fixed; left: 0; top: -500px; z-index: 100; width: 100%; background: rgba(0,0,0,.85);
 transition: 0.4s linear;
}
#spNav .inner { padding: 80px 30px 50px;}
#spNav ul { margin: 0 auto 40px;}
#spNav ul li { padding: 10px; border-bottom: solid 1px #fff; font-size: 16px;}
#spNav ul li:last-child { border-bottom: none;}
#spNav ul li a { position: relative; display: block; color: #fff; text-decoration: none;}
#spNav ul li a:after { content: ''; display: block; width: 8px; height: 8px; border-top: solid 1px #fff; border-right: solid 1px #fff;
 position: absolute; right: 0; top: 50%; transform: translate(0,-50%) rotate(45deg);
}
#spNav .sp-btn { width: 60%; max-width: 240px; margin: 0 auto; }
#spNav .sp-btn a { display: block; padding: 15px 0; background: #c8b079; color: #fff; text-decoration: none; text-align: center;}
#spNav .sp-btn a svg { display: inline-block; width: 30px; margin-right: 12px; fill: #fff; vertical-align: middle;}
#spNav .sp-btn a span { display: inline-block; font-size: 18px; font-weight: 700; line-height: 1; vertical-align: middle;}
#spNav.open { top: 0;}
@media (max-width: 801px) {
	#spNav { display: block;}	
}



.ft-contact { background: url(./img/bg-ptn-1.jpg) 50% 20%;}
.ft-contact .inner { width: 90%; max-width: 1080px; margin: 0 auto; padding: 60px 0;}
.ft-contact h2 { margin-bottom: 50px; color: #111; font-size: 32px; text-align: center;}
/*.ft-contact .ctn { display: flex; border-left: solid 2px #a9a897; border-right: solid 2px #a9a897;}（20230801）下記に修正 marukin */
.ft-contact .ctn { display: flex; justify-content: center; }
.ft-contact .ctn .tel,
.ft-contact .ctn .mail{ width: 50%; padding: 15px 0 40px;}
/*.ft-contact .ctn .tel { border-right: solid 2px #a9a897;}（20230801）下記に修正 marukin */
.ft-contact .ctn .tel { border-left: solid 2px #a9a897; border-right: solid 2px #a9a897; }
.ft-contact .ctn .tel p { text-align: center;}
.ft-contact .ctn .mail p { margin-bottom: 25px; text-align: center;}
.ft-contact .ctn .tel p img,
.ft-contact .ctn .mail p img { width: 80%; max-width: 400px;}
.ft-contact .ctn .mail a { display: block; width: 80%; max-width: 340px; margin: 0 auto; background: #fff; box-shadow: 0 0 8px #999;
 color: #fff; font-size: 20px; font-weight: 700; text-align: center; text-decoration: none;
}
.ft-contact .ctn .mail a span{ display: block; padding: 25px 0; background: linear-gradient(#b59e68,#c8b17a); transition: 0.4s linear;}
.ft-contact .ctn .mail a:hover span { opacity: 0.85;}

@media (max-width: 801px) {
	.ft-contact h2 { margin-bottom: 30px; font-size: 30px;}
	.ft-contact .ctn { display: block; border: none;}
	.ft-contact .ctn .tel,
	.ft-contact .ctn .mail{ width: 100%; padding: 30px 0; border-top: solid 2px #a9a897;}
	/*.ft-contact .ctn .tel { border-right: 0px;}（20230801）下記に修正 marukin */
	.ft-contact .ctn .tel { border-bottom: 2px solid #a9a897; border-left: 0; border-right: 0px;}
	.ft-contact .ctn .mail{}
	.ft-contact .ctn .mail a span{ padding: 20px 0;}
}
@media (max-width: 481px) {
	.ft-contact { background-position: 50% 50%; background-size: cover;}
	.ft-contact .inner { padding: 40px 0;}
	.ft-contact h2 { font-size: 21px;}
	.ft-contact .ctn .tel,
	.ft-contact .ctn .mail{ padding: 20px 0;}
	.ft-contact .ctn .mail p { margin-bottom: 15px;}
	.ft-contact .ctn .mail a { font-size: 15px;}
	.ft-contact .ctn .mail a span{ padding: 15px 0;}
}


#ft { position: relative; padding: 25px 0 40px; text-align: center;}
#ft h2 { margin-bottom: 15px;}
#ft h2 img { width: 70%; max-width: 350px;}
#ft p { color: #959595; font-size: 11px;}

#ft .pagetop { position: absolute; right: 40px; top: 50%; width: 72px; height: 72px; transform: translate(0,-50%);}
#ft .pagetop a { position: relative; display: block; width: 100%; height: 100%; background: #b8a16b; border-radius: 50%; transition: 0.3s linear;}
#ft .pagetop a:before { content: ''; display: block; width: 0; height: 0; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
 border: solid 10px transparent; border-bottom: solid 18px #fff; border-top: 0;
}
#ft .pagetop a:hover { background: #cdbd97;}

@media (max-width: 801px) {
	#ft { padding: 15px 0 20px;}
}
@media (max-width: 801px) {
	#ft .pagetop { right: 30px; width: 50px; height: 50px;}
	#ft .pagetop a:before { border: solid 6px transparent; border-bottom: solid 12px #fff; border-top: 0;}
}
@media (max-width: 481px) {
	#ft p { font-size: 10px;}
	#ft .pagetop { right: 20px; width: 40px; height: 40px;}
	#ft .pagetop a:before { border: solid 6px transparent; border-bottom: solid 9px #fff; border-top: 0;}
}




.sct .inner-sct { width: 94%; max-width: 1180px; margin: 0 auto; padding: 80px 0 30px;}
.sct .stl { margin-bottom: 30px; text-align: center;}
.sct .stl h2 { 	font-size: 36px; line-height: 1.4; text-shadow: 2px 2px 5px #000;}
.sct .stl p { font-size: 22px; text-shadow: 2px 2px 5px #000;}
@media (max-width: 481px) {
	.sct .inner-sct { padding: 40px 0;}
	.sct .stl { margin-bottom: 15px;}
	.sct .stl h2 { font-size: 24px;}
	.sct .stl p { font-size: 18px;}
}


.pageNav .inner { position: relative; width: 90%; max-width: 1200px; margin: 0 auto; padding: 30px 0;}
.pageNav p { margin-bottom: 30px; color: #fff; font-size: 18px; line-height: 1.8; text-align: center;}
.pageNav ul { position: relative; margin: 0 auto; font-size: 0; text-align: center;}
.pageNav ul li { display: inline-block; width: 16.5%; vertical-align: top;}

.pageNav ul li a { position: relative; display: block; width: 92%; margin: 0 auto; padding-top: 55%; background: #c6c6c6; text-decoration: none;
 box-shadow: 0px 0px 10px #000; color: #000; transition: 0.4s linear;
}

.pageNav ul li.now a { background: #c8b079;}
.pageNav ul li a:after { content: ''; display: block; position: absolute;}
.pageNav ul li a:after { width: 100%; height: 100%; background: url(./img/bg-ptn-3.png) 50% 50%; left: 0; top: 0; z-index: 1;}
.pageNav ul li a span { display: block; width: 100%; text-align: center; position: absolute; left: 0; top: 50%; transform: translate(0,-50%);
 color: #000; font-size: 21px; font-weight: 600; letter-spacing: 0.1rem; z-index: 3;
}
.pageNav ul li a span img { display: block; width: 60%; max-width: 112px; margin: 0 auto 8px;}
.pageNav ul li a em { display: block; width: 100%; font-size: 16px; font-weight: 600; letter-spacing: 0.1rem; line-height: 1.4; text-align: center;}
.pageNav ul li a em.eng { font-size: 24px;}
.pageNav ul li a:hover { background: #fff;}
@media (max-width: 1001px) {
	.pageNav ul li a em.eng { font-size: 20px;}
}
@media (max-width: 801px) {
	.pageNav .inner { padding: 0;}
	.pageNav ul li { display: inline-block; width: 50%; margin: 0 auto 20px;}
	.pageNav ul li a { padding-top: 32%;}
	.pageNav ul li a em.eng { font-size: 20px;}
	.pageNav ul li.txt a { padding: 25px 0;}
	.pageNav ul li.txt a span { position: relative; top: 0; transform: translate(0,0);}
	.pageNav ul li.txt a em { position: relative; top: 0%; transform: translate(0,0); font-size: 18px;}	
}

@media (max-width: 641px) {
	.pageNav ul li a { width: 95%; padding-top: 50%;}
	.pageNav ul li.txt a { padding: 15px 0;}
	.pageNav ul li a span img { margin: 0 auto 10px;}
}
@media (max-width: 481px) {
	.pageNav p { font-size: 15px;}
	.pageNav p span { display: block;}

	.pageNav ul li { margin: 0 auto 10px;}
	.pageNav ul li a { padding-top: 42%;}
	.pageNav ul li.txt a { padding: 10px 0;}
	.pageNav ul li a span { font-size: 15px;}
	.pageNav ul li a span img { margin: 0 auto 6px;}
	.pageNav ul li a em,
	.pageNav ul li.txt a em { font-size: 14px;}
	.pageNav ul li a em.eng { font-size: 18px;}
}




.ctn { display: flex; width: 100%;}
.model-box .inner { position: relative; width: 94%; margin: 0 auto; background: #e8e8e8; box-shadow: 0px 0px 8px #000;}
.model-box .icn { position: absolute; left: 0; top: -15px; z-index: 2;}
.model-box .icn.new { width: 92px;}
.model-box .icn.sold { width: 110px;}
.model-box .icn img { width: 100%;}
.model-box a { position: relative; z-index: 1; text-decoration: none; transition: 0.3s linear;}
.model-box img.thumb { width: 100%;}
.model-box ul { width: 90%; margin: 0 auto; font-size: 0; vertical-align: top;}
.model-box ul li { position: relative; padding: 1px; color: #111;}
.model-box ul li.type { width: 100%; margin: 0 auto 15px; padding-left: 0 !important;}
.model-box ul li span { position: absolute; position: absolute; left: 0; background: #262626; color: #fff; text-align: center;}
.model-box ul li.type span { position: relative; display: block; width: 70% !important; max-width: 180px !important; margin: 0 auto; padding: 2px;
	background: #868686; border-radius: 50px;
 font-size: 14px;
}
.model-box ul li.type span.nouse { background: #c8b079;} 

.model-box span.more { display: block; padding: 5px; background: #c8b079;
 color: #fff; font-size: 18px; letter-spacing: 1rem; text-align: center; text-decoration: none;
}
.model-box span.more em { display: inline-block; vertical-align: middle;}
.model-box span.more:after { content: '>'; display: inline-block; vertical-align: middle;}
.model-box a:hover { opacity: 0.85;}


/* ▼（20211014）add marukin ▼ */
.ctn.ossm .model-box .inner{ border: 5px solid #c8b079; }
/* ▲（20211014）add marukin ▲ */



@media (max-width: 481px) {
	.model-box .icn.new { width: 60px;}
	.model-box .icn.sold { width: 75px;}
	.model-box span.more { font-size: 15px;}
}


.ctn.quartet { width: 100%; flex-wrap: wrap;}
.ctn.quartet .model-box { width: 25%; margin: 0 0 40px;}
.ctn.quartet .model-box ul { padding: 10px 0 20px;}
.ctn.quartet .model-box ul li { padding-left: 100px; font-size: 14px;}
.ctn.quartet .model-box ul li span { top: 2px; width: 85px; font-size: 12px;}
.ctn.quartet .model-box span.more { font-size: 16px;}
@media (max-width: 801px) {
	.ctn.quartet .model-box { width: 50%;}
	.ctn.quartet .model-box ul li { padding-left: 80px; font-size: 14px;}
	.ctn.quartet .model-box ul li span { top: 6px; width: 70px; font-size: 11px;}
}
@media (max-width: 481px) {
	.ctn.quartet .model-box { width: 50%;}
	.ctn.quartet .model-box ul li { padding: 2px; padding-left: 65px; font-size: 12px;}
	.ctn.quartet .model-box ul li span { top: 3px; width: 60px; font-size: 10px;}
	.ctn.quartet .model-box span.more { font-size: 14px;}
}