@charset "shift_jis";
/* ===================================================================
CSS information

 file name  :  popup.css
 style info :  ƒXƒ^ƒCƒ‹Žw’è

=================================================================== */

/* 
original : /sales/karuizawaandviala2/common/css/custom/pages/gallery.css
creation : 2017.9.29
--------------------------------------------------------------------*/
.inforTitle {
	position:relative;
	background:url(/sales/common/img/pages/lineup/nasu-retreat/popup_titleBG.jpg) 50% 50% no-repeat;
	background-size:cover;
	text-align:center;
	padding:6em 15px;
	margin-bottom:30px;
}
.blur{
	background:url(/sales/common/img/pages/lineup/nasu-retreat/popup_titleBG2.jpg) 50% 50% no-repeat;  
	background-size:cover;
}
.inforTitle::before {
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:1;
	background:rgba(113,54,46,.5);
}
.inforTitle > div {
	position:relative;
	z-index:10;
}
.inforTitle h2 {
	position:relative;
	font-size:3.5em;
	line-height:1.4;
	color:#fff;
	padding-bottom:.6em;
	margin-bottom:.6em;
}
.inforTitle h2 .attention {
	font-size:.8em;
}
.inforTitle h2::after {
	content:"";
	position:absolute;
	bottom:0;
	left:50%;
	z-index:1;
	width:30px;
	height:1px;
	background:#fff;
	margin-left:-15px;
}
.inforTitle h2 + p {
	color:#fff;
}
.inforTitle p{
	font-size:2em;
}

/*ƒy[ƒWƒƒ[—pCSS
--------------------------------------------------------------------*/
.list {
	width:100%;
	margin:20px auto;
}

.list ul {
	overflow:hidden;
	margin:0;
	padding:0;
}

.list li {
	display:block;
	float:left;
	width:100%;
  padding-bottom:30px;
  border-bottom:4px double #e0dada;
	margin-bottom:80px;
	list-style:none;
}

.list .pager {
	clear:both;
	margin:30px 0;
	text-align:center;
}

.list .pager span {
	margin:5px;
	padding:15px 20px;
	font-size:1.4em;
	color:#000;
	background:#f8f8f8;
	border:1px solid #000;
}
.list .pager span:hover {
	cursor:pointer;
	background:#999;
}

.list .pager span.current {
	color:#fff;
	background:#000;
}
.list .pager span.current:hover {
	cursor:default;
}

.list .pager span.invalid {
	display:none;
}
.list .pager span.invalid:hover {
	cursor:default;
}

.list .pager span.ellipsis {
	color:#000;
	background:none;
	border:none;
}
.list .pager span.ellipsis:hover {
	cursor:default;
}

.list .pager span.first,
.list .pager span.last,
.list .pager span.prev,
.list .pager span.next {
	background:#ddd;
}

.list .pager span.first:hover,
.list .pager span.last:hover,
.list .pager span.prev:hover,
.list .pager span.next:hover {
	background:#999;
}

.list .pageNum {
	margin:30px 0;
	text-align:center;
	font-size:1.4em;
}

.list li > div {
	word-spacing: normal;
	vertical-align: top;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	position:relative;
	width:49%;
}
.list li div.photo {
	width:50%;
}
.list li div.photo span {
	display:block;
	margin:1.5% 10% 0 0;
}
.list li h3 {
  margin-bottom:20px;
  padding:5px 0 5px 15px;
  border-left:5px solid #71362e;
  border-bottom:1px solid #71362e;
	font-size:2.5em;
	color:#71362e;
	line-height:1.6;
	text-align:left;
  text-indent: -0.5em;
}
.list li h3 span{
  display: inline-block;
  font-size:0.7em;
	font-family: Helvetica, Arial, YuGothic, 'ŸàƒSƒVƒbƒN', 'ƒqƒ‰ƒMƒmŠpƒS Pro W3', 'Hiragino Kaku Gothic Pro', 'ƒƒCƒŠƒI', Meiryo, Osaka, sans-serif;
}
.list li h4 {
	font-size:2.4em;
	color:#50442f;
	line-height:1.6;
	text-align:left;
	margin:0 auto 1.5em;
}
.list li p {
	margin-bottom:1em;
}


@media (max-width: 480px) {
  .inforTitle h2 {
    font-size:2.4em;
  }
  .inforTitle p{
    font-size:1.6em;
  }
  .list li div.photo {
    width:100%;
  }
  .list li div.photo span {
    display: block;
    margin: 0 0 2.5% 0;
  }
  .list li > div {
    width:100%;
  }
  .list li h3 {
    font-size:2em;
  }
  .list li p {
    font-size:1.4em;
  }
}


/* Œ©‚¦•û’²®ƒNƒ‰ƒX
--------------------------------------------------------------------*/
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}
@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table !important;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 947px;
  }
}
@media (min-width: 1100px) {
  .container {
    width: 1051px;
  }
}

body {
    background: url(/sales/common/img/pages/lineup/nasu-retreat/popupBG.png) top center repeat;
  	font-family: "Times New Roman", Times, "Ÿà–¾’©", YuMincho, "ƒqƒ‰ƒMƒm–¾’© ProN W3", "Hiragino Mincho ProN","HG–¾’©B","‚l‚r –¾’©",serif;
}

#allWrap {
	padding-top: 70px;
}
@media only screen and (max-width: 991px) {
  #allWrap {
    padding-top: 80px;
  }
}
@media only screen and (max-width: 767px) {
  #allWrap {
    padding-top: 0;
  }
}
p.bodyCopy {
	font-family: Helvetica, Arial, YuGothic, 'ŸàƒSƒVƒbƒN', 'ƒqƒ‰ƒMƒmŠpƒS Pro W3', 'Hiragino Kaku Gothic Pro', 'ƒƒCƒŠƒI', Meiryo, Osaka, sans-serif;
	font-size:1.6em;
	color:#000;
	line-height:2.4;
}
.bodyCopy span {
	font-weight:bold;
}
.fontSizeWrap{
    top: 35px;
    left: 0;
    width: 118px;
    margin-left: 230px;
}

.footerWrap{
    padding: 15px 0;
    margin: 0 auto;
    text-align: right;
    background: #000;
}
.footerWrap h1 {
    font-family: inherit;
    color: #ddd;
    padding: 0 20px 0 0;
}


/*ˆóüƒ{ƒ^ƒ“AƒNƒ[ƒYƒ{ƒ^ƒ“
--------------------------------------------------------------------*/
.popupBtnsWrap {
	text-align:center;
	padding:30px 0;
}
.popupBtnsWrap .popupBtnsDetails {
	display: inline-block;
	vertical-align: top;
	position:relative;
}
.popupBtnsWrap .popupBtnsDetails > div {
	margin:0 2px;
}
.popupBtnsWrap .popupBtnsDetails > div a {
	display:block;
	background:#000;
	padding:10px 20px;
}
.popupBtnsWrap .popupBtnsDetails > div a:hover {
	background:#444;
}


/*header.css
--------------------------------------------------------------------*/
header {
	position:relative;
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:9998;
	height: 70px;
	background:rgba(255,255,255,.9);
	box-shadow:0px -3px 11px -2px #000;
	-moz-box-shadow:0px -3px 11px -2px #000;
	-webkit-box-shadow:0px -3px 11px -2px #000;
}
header h2 {
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	width:217px;
	height:100px;
}
header h2 a {
	display:block;
	padding:14px 20px;
}
header h2 a::after {
	content:"ƒgƒbƒvƒy[ƒW‚Ö";
	position:absolute;
	top:100%;
	left:20px;
	right:20px;
	z-index:1;
	background:rgba(165,151,129,.9);
	font-size:1.2em;
	color:#fff;
	text-align:center;
	padding:5px 0;
	opacity:0;
	-webkit-transition: all .6s;
	transition: all .6s;
}
header h2.active a::after {
	opacity:1;
}
.topPage header h2 a::after,
.subwinPage header h2 a::after {
	display:none;
}
header #gnav {
	padding:0 235px 0 217px;
}
header #gnav ul li {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	width:14.2857142857%;
	font-size:1.6em;
	text-align:center;
}
header #gnav ul li::after {
	content:"";
	position:absolute;
	top:50%;
	right:0;
	z-index:1;
	width:1px;
	height:40px;
	background:#e5e5e5;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
header #gnav ul li.outlinePage::after {
	display:none;
}
header #gnav ul li a {
	position:relative;
	display:block;
	height: 70px;
	color:#000;
}
header #gnav ul li a::after {
	content:"";
	opacity: 0;
	position:absolute;
	bottom:0;
	left:50%;
	right:50%;
	z-index:1;
	height:3px;
	margin:auto;
	background:#000;
	-webkit-transition: all .6s;
	transition: all .6s;
}
header #gnav ul li a:hover::after {
	opacity: 1;
	left:0;
	right:0;
}
header #gnav ul li.current a::after {
	opacity: 1;
	left:0;
	right:0;
}
header #gnav ul li a > span {
	display:inline-block;
	position:absolute;
	top:50%;
	left:0;
	right:0;
	z-index:1;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
header #gnav ul li a span.block {
	display:block;
}
header #gnav ul li.hdrReqBtn {
	position:absolute;
	top:0;
	right:0;
	z-index:1;
	display:block;
	width:235px;
	font-size:1.4em;
	line-height:1.4;
	text-align:center;
}
header #gnav ul li.hdrReqBtn::after {
	display:none;
}
header #gnav ul li.hdrReqBtn a {
	background:url(/sales/common/img/pages/lineup/nasu-retreat/popup_leather_black.jpg) 0 0 repeat;
	color:#ffde97;
}
header #gnav ul li.hdrReqBtn a::after {
	opacity: 1;
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:1;
	height:auto;
	margin:auto;
	background:rgba(240,200,110,.6);
	-webkit-transition: all .6s;
	transition: all .6s;
}
header #gnav ul li.hdrReqBtn a:hover::after {
	opacity: 1;
	top:0;
	bottom:0;
	left:100%;
	right:0;
}
header #gnav ul li.hdrReqBtn a span {
	z-index:10;
}
header #gnav ul li.hdrReqBtn .hdrReqIcon {
	position:relative;
	display:block;
	width:29px;
	height:29px;
	margin: 0 auto 7px;
}
header #gnav ul li.hdrReqBtn br {
	display:none;
}

/* /subwin/information.html
--------------------------------------------------------------------*/
header.subwin h2{max-width: 195px;}
.subwinTitle .inforTitle {
	position:relative;
	background:url(/sales/common/img/pages/subwin/information/popup_titleBG.jpg) 50% 50% no-repeat;
	background-size:cover;
	text-align:center;
	padding:6em 15px;
	margin-bottom:30px;
}
.subwinTitle .inforTitle::before {
    background: rgba(112,92,14,.8);
}
.informationDataWrap {
	position:relative;
}
.informationDataWrap .textWrap {
	padding:5% 2%;
  width:48%;
  float:left;
}
.informationDataWrap .textWrap.wide {
  width:96%;
}
.informationDataWrap .textWrap p {
	letter-spacing:0;
}
.informationDataWrap .imgWrap {
  width:48%;
  float:left;
}
.informationDataWrap::before {
	display:block;
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:1;
	border:#baa039 solid 2px;
}
.informationDataWrap > .row {
	position:relative;
	z-index:10;
	padding-top:15px;
	padding-bottom:15px;
}
.informationDataWrap h3 {
	font-size:2.8em;
	line-height:1.4;
}
.informationDataWrap h3 .area {
	position:relative;
	top:-.2em;
	vertical-align:middle;
	display:inline-block;
	font-size:.5em;
	color:#fff;
	padding:.15em .5em;
	margin-left:.5em;
	background:#847A35;
}
.informationDataWrap h3 .small {
	font-size:80%;
	position:relative;
	top:-.2em;
	vertical-align:middle;

    font-weight: normal;
    line-height: 1;
    color: #777;

}
.informationDataWrap p.appeal {
	font-size:1.9em;
	line-height:1.4;
	color:#847A35;
}
.informationDataWrap p.appeal .number {
	font-size:1.2em;
}
.informationDataWrap p.date {
	font-size:1.6em;
	line-height: 1.4;
}
.informationDataWrap p.date .number {
	font-size:2em;
}
.informationDataWrap .caption {
	font-size:.8em;
	padding-top:0;
	margin-bottom:1.5em;
}
.informationDataWrap p.dataDetails {
	font-size:1.4em;
}
.informationDataWrap dl {
	font-size:1.6em;
	line-height:1.4;
	padding-top:.5em;
	margin-bottom:1em;
	border: #ccc dotted 1px;
	border-width:1px 0;
}
.informationDataWrap dt {
	font-weight:400;
	float:left;
	padding-right:15px;
	margin-bottom:.5em;
}
.informationDataWrap dd {
	font-size:1.2em;
	margin-bottom:.5em;
}
.informationDataWrap dd:after{
	clear:both;
}

.informationDataWrap p.rute {
	font-size:1.2em;
	padding-top:.5em;
}

@media only screen and (max-width: 991px) {
.informationDataWrap .textWrap {
	padding-top:15px;
}
}
@media only screen and (max-width: 767px) {
}
@media only screen and (max-width: 679px) {
.inforTitle h2 {
	font-size:2.4em;
}
.inforTitle h2 + p {
	text-align:left;
}
.inforTitle h2 + p br {
	display:none;
}
}
@media only screen and (max-width: 479px) {
}
/*

/*otherBtn*/

a.otherBtn {
	position:relative;
	display:block;
	background:#444444;
	font-size:1.8em;
	text-align:center;
	line-height:1;
	color:#ddd;
	width:100%;
	max-width:300px;
	padding:15px 3em 15px;
	margin:0 auto 20px;
  text-decoration: none;
}
a.otherBtn::before {
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:100%;
	bottom:0;
	z-index:1;
	margin:auto;
	-webkit-transition: all .6s ease-in-out;
	transition: all .6s ease-in-out;
	background:rgba(150,150,150,.3);
}
a.otherBtn:hover::before {
	right:0;
}
a.otherBtn::after {
	content:"";
	position:absolute;
	top:50%;
	right:16px;
	z-index:2;
	background:url(/sales/karuizawaandviala2/common/img/arrow_s_white.png) 0 0 no-repeat;
	background-size: cover;
	width:11px;
	height:7px;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
a.otherBtn:hover::after {
	right:8px;
}
/*/otherBtn*/

/*infoFooter*/

.infoFooterWrap .textWrap {
	padding: 0 4% 0 0;
  width:46%;
  float:left;
}
.infoFooterWrap .imgWrap {
  width:48%;
  float:left;
}
@media only screen and (max-width: 479px) {
  .infoFooterWrap .textWrap,
  .infoFooterWrap .imgWrap{
    width:100%;
  }
}


.infoFooter{
  /*margin:20px 0;*/
  text-align: center;
}
.infoFooter p{
  display: inline-block;
}
.infoFooter .tel-linkText {
	font-size:4.2em;
	letter-spacing:0;
	line-height:1;
	margin-bottom: .2em;
}
.infoFooter .tel-linkText img {
	vertical-align:baseline;
	width:34px !important;
	height:20px !important;
	margin-right:10px;
}
.infoFooter .tel-linkText + p {
	font-size:1.4em;
	letter-spacing:0;
	margin-bottom:2.3em;
}
/*/infoFooter*/

.infoFooter a.reqBtn {
	position:relative;
	display:block;
	background:#805e32;
	font-size:1.8em;
	line-height:1;
	color:#f2eae0;
/*	padding:25px 26px 25px 16px;
	margin-bottom:30px;*/
    padding: 15px 26px 15px 16px;
    margin-bottom: 10px;
  text-decoration: none;
}
.infoFooter a.reqBtn.bk{
	background:#444444;
	color:#ddd;
}
.infoFooter a.reqBtn::before {
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:100%;
	bottom:0;
	z-index:1;
	margin:auto;
	-webkit-transition: all .6s ease-in-out;
	transition: all .6s ease-in-out;
	background:rgba(226,192,112,.3);
}
.infoFooter a.reqBtn.bk::before{
	background:rgba(150,150,150,.3);
}
.infoFooter a.reqBtn:hover::before {
	right:0;
}
.infoFooter a.reqBtn::after {
	content:"";
	position:absolute;
	top:50%;
	right:16px;
	z-index:2;
	background:url(/sales/karuizawaandviala2/common/img/arrow_s_white.png) 0 0 no-repeat;
	background-size: cover;
	width:11px;
	height:7px;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
.infoFooter a.reqBtn:hover::after {
	right:8px;
}
.infoFooter a.reqBtn br {
	display:none;
}

.infoFooter a.reqBtn.reqBtn2{
 	background:#992b56;
}
.infoFooter a.reqBtn.reqBtn2::before{
	background:rgba(193,120,148,.3);
}
/*--------------------------------------------------------------------*/


@media only screen and (max-width: 1200px) {
header #gnav {
	padding:0 150px 0 217px;
}
header #gnav ul li.hdrReqBtn {
	width:150px;
}
header #gnav ul li.hdrReqBtn .hdrReqIcon {
	margin:0 auto 10px;
}
header #gnav ul li.hdrReqBtn br {
	display:block;
}

}
@media only screen and (max-width: 1024px) {
header #gnav ul li {
	font-size:1.2em;
}
  
}
@media only screen and (max-width: 991px) {
header {
	height:80px;
}
header h2 {
	width:170px;
	height:auto;
}
header #gnav {
	padding:0 150px 0 170px;
}
header #gnav ul li a {
    height: 80px;
}
header #gnav ul li.hdrReqBtn {
	font-size:1.2em;
}
header #gnav ul li.hdrReqBtn .hdrReqIcon {
    width: 24px;
    height: 24px;
	margin-bottom:5px;
}

}
@media only screen and (max-width: 768px) {
header #gnav {
	padding:0 140px 0 170px;
}
header #gnav ul li::after {
	display:none;
}
header #gnav ul li.hdrReqBtn {
	width:140px;
}
  
}
@media only screen and (max-width: 767px) {
header {
	position:relative;
	top:auto;
	left:auto;
	right:auto;
	z-index:9999;
}
header h2 a::after {
	display:none;
}
header #gnav {
	display:none;
}
}