@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lato&family=Noto+Sans+JP:wght@300;400;700&family=Noto+Serif+JP:wght@300;500;700&family=Playfair+Display:wght@400;700&display=swa");
/*------------------------2023年6月号------------------------*/
/*----------------------------------------------改行----------------------------------------------*/
@media screen and (min-width:768px) and ( max-width:921px) {
	br.br-pc {
		display: none !important;
}
	br.br-sp {
        display: none !important;
}}

@media screen and (min-width:922px) and ( max-width:1184px) {
	br.br-sp {
        display: none !important;
}}

@media screen and (max-width: 767px) {
	br.br-pc {
        display: none !important;
}}
 
@media screen and (min-width: 768px) {
	br.br-sp {
        display: none !important;
}}

* {
    font-family: 'Playfair Display', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", 'Noto Sans JP', serif;
    color: #000;
    letter-spacing: .15em;
}

.container-main{
	max-width: 1200px;
	margin: auto;
}
@media screen and (max-width: 767px) {
	.container-main{
		max-width: 1200px;
		margin: auto;
		padding-left: 20px;
		padding-right: 20px;
}}
.container-main-1{
	max-width: 1200px;
	margin: auto;
}
@media screen and (max-width: 767px) {
	.container-main-1{
		margin: auto;
}}

.breadcrumbs_1 {
  padding: 0 40px;
  margin-top: 100px;
  margin-bottom: -100px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
  z-index: 1;
}

.breadcrumbs_1.sp {
  display: none;
}

@media screen and (max-width: 767px) {
  .breadcrumbs_1.sp {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media screen and (max-width: 767px) {
  .breadcrumbs_1 {
    padding: 0 16px;
    position: relative;
    top: 100px;
	flex-wrap: nowrap;
  }
}

@media screen and (max-width: 767px) {
  .breadcrumbs_1 {
    top: -30px;
    position: absolute;
  }
}

.breadcrumbs_1.news {
  margin: 0;
  margin-bottom: 80px;
  position: relative;
  top: 100px;
}

@media screen and (max-width: 767px) {
  .breadcrumbs_1.news {
    margin-bottom: 0;
    top: 70px;
  }
}

.breadcrumbs_1 div {
  padding-right: 29px;
}

@media screen and (max-width: 767px) {
  .breadcrumbs_1 div {
    height: 27px;
  }
}

.breadcrumbs_1 div a {
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Noto Sans JP";
  font-size: 12px;
  line-height: 32px;
  text-align: left;
  color: #3b3b3b;
  position: relative;
}

@media screen and (max-width: 767px) {
  .breadcrumbs_1 div a {
    font-weight: 300;
    font-size: 10px;
    letter-spacing: 0.05em;
    line-height: 32px;
    line-height: 1;
    display: block;
    margin-top: 9px;
  }
}

.breadcrumbs_1 div a::before {
  content: '';
  background-image: url(../images/common/breadcrumbs_arrow.svg);
  background-size: contain;
  background-repeat: no-repeat;
  right: -18px;
  top: 3px;
  width: 6px;
  height: 7px;
  position: absolute;
}

@media screen and (max-width: 767px) {
  .breadcrumbs_1 div a::before {
    top: 3px;
    width: 5px;
  }
}

.breadcrumbs_1 div span {
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Noto Sans JP";
  font-size: 12px;
  line-height: 32px;
  text-align: left;
  color: #3b3b3b;
  letter-spacing: 0;
}

@media screen and (max-width: 767px) {
  .breadcrumbs_1 div span {
    font-weight: 300;
    font-size: 10px;
    letter-spacing: 0.05em;
    line-height: 27px;
    line-height: 1;
    display: block;
    margin-top: 9px;
  }
}


/*----------------------------------------------KV----------------------------------------------*/
.main_top{
	margin-top: 20%;
	margin-bottom: 13%;
}
/*--PC--*/
@media screen and (min-width: 768px) and (max-width: 964px){ .main_top{ margin-left: 8%;}}
@media screen and (min-width: 965px) and (max-width: 985px){ .main_top{ margin-left: 7%;}}
@media screen and (min-width: 986px) and (max-width: 1027px){ .main_top{ margin-left: 7%; margin-top: 16%;}}
@media screen and (min-width: 1028px) and (max-width: 1090px){ .main_top{ margin-left: 7%;}}
@media screen and (min-width: 1091px) and (max-width: 1174px){ .main_top{ margin-left: 10%;}}
@media screen and (min-width: 1175px) and (max-width: 1276px){ .main_top{ margin-left: 10%; margin-top: 16%;}}
@media screen and (min-width: 1277px) and (max-width: 1336px){ .main_top{ margin-left: 9%; margin-top: 16%;}}
@media screen and (min-width: 1337px) and (max-width: 1400px){ .main_top{ margin-left: 7%; margin-top: 16%;}}
@media screen and (min-width: 1401px) and (max-width: 1450px){ .main_top{ margin-left: 6%; margin-top: 16%;}}
@media screen and (min-width: 1401px){ .main_top{ margin-left: 3%;}}
@media screen and (min-width: 1477px) and (max-width: 1650px){ .main_top{ margin-left: 1%; margin-top: 16%;}}
@media screen and (min-width: 1651px) and (max-width: 1699px){ .main_top{ margin-left: -2%; margin-top: 16%;}}
@media screen and (min-width: 1700px){ .main_top{ margin-left: -5%; margin-top: 16%;}}


/*----------------------------------------------Font-size----------------------------------------------*/
.fist-txt{
	font-size: 30px;
	font-family: "游明朝", "YuMincho", serif;
	font-weight: normal;
	color: #262626;
	letter-spacing: 0em;
	line-height: 1.6;
}
/*--SP--*/
@media screen and (min-width: 300px) and (max-width: 310px){ .fist-txt{ margin-top: 38%; }}
@media screen and (min-width: 311px) and (max-width: 354px){ .fist-txt{ margin-top: 36%; }}
@media screen and (min-width: 355px) and (max-width: 387px){ .fist-txt{ margin-top: 34%; }}
@media screen and (min-width: 388px) and (max-width: 429px){ .fist-txt{ margin-top: 32%; }}
@media screen and (min-width: 430px) and (max-width: 450px){ .fist-txt{ margin-top: 30%; }}
@media screen and (min-width: 642px) and (max-width: 662px){ .fist-txt{ margin-top: 5%; }}
@media screen and (min-width: 663px) and (max-width: 683px){ .fist-txt{ margin-top: 7%; }}
@media screen and (min-width: 684px) and (max-width: 767px){ .fist-txt{ margin-top: 8%; }}
@media screen and (max-width: 767px){
	.fist-txt{ font-size: 22px;
}}
/*--PC--*/
@media screen and (min-width: 768px) and (max-width: 1069px){ .fist-txt{ font-size: 26px; }}
@media screen and (min-width: 1070px) and (max-width: 1111px){ .fist-txt{ font-size: 28px; }}
@media screen and (min-width: 1112px) and (max-width: 1400px){ .fist-txt{ font-size: 30px; }}
@media screen and (min-width: 1401px){ .fist-txt{ font-size: 30px; }}
@media screen and (min-width: 1543px){ .fist-txt{ font-size: 30px; }}
@media screen and (min-width: 1900px){ .fist-txt{ font-size: 30px; }}


.second-txt{
	margin-top: 46px;
	font-size: 16px;
	font-family: "游明朝", "YuMincho", serif;
	font-weight: normal;
	color: #262626;
	letter-spacing: 0px;
	line-height: 1.9em;
}
/*--SP--*/
@media screen and (min-width: 300px) and (max-width: 429px){ .second-txt{ margin-top: 8%; }}
@media screen and (min-width: 430px) and (max-width: 662px){ .second-txt{ margin-top: 7%; }}
@media screen and (min-width: 663px) and (max-width: 683px){ .second-txt{ margin-top: 6%; }}
@media screen and (min-width: 684px) and (max-width: 746px){ .second-txt{ margin-top: 5%; }}
@media screen and (min-width: 747px) and (max-width: 767px){ .second-txt{ margin-top: 6%; }}
/*--PC--*/
@media screen and (min-width: 768px) and (max-width: 964px){ .second-txt{ font-size: 12px; margin-top: 5%; }}
@media screen and (min-width: 965px) and (max-width: 1069px){ .second-txt{ font-size: 12px; margin-top: 4%; }}
@media screen and (min-width: 1070px) and (max-width: 1111px){ .second-txt{ font-size: 14px; margin-top: 4%; }}
@media screen and (min-width: 1112px) and (max-width: 1276px){ .second-txt{ font-size: 16px; margin-top: 5%; }}
@media screen and (min-width: 1277px) and (max-width: 1400px){ .second-txt{ font-size: 16px; margin-top: 4%; }}
@media screen and (min-width: 1401px){ .second-txt{ font-size: 16px; margin-top: 4%; }}
@media screen and (min-width: 1543px){ .second-txt{ font-size: 16px; margin-top: 4%; }}
@media screen and (min-width: 1900px){ .second-txt{ font-size: 16px; margin-top: 4%; }}


.third-txt{
	margin-top: 38px;
	font-size: 16px;
	font-family: "游明朝", "YuMincho", serif;
	font-weight: normal;
	color: #262626;
	letter-spacing: 0px;
	line-height: 1.9em;
}
/*--SP--*/
@media screen and (min-width: 300px) and (max-width: 343px){ .third-txt{ margin-top: 8%; }}
@media screen and (min-width: 344px) and (max-width: 409px){ .third-txt{ margin-top: 9%; }}
@media screen and (min-width: 410px) and (max-width: 429px){ .third-txt{ margin-top: 8%; }}
@media screen and (min-width: 430px) and (max-width: 662px){ .third-txt{ margin-top: 7%; }}
@media screen and (min-width: 663px) and (max-width: 725px){ .third-txt{ margin-top: 5%; }}
@media screen and (min-width: 726px) and (max-width: 767px){ .third-txt{ margin-top: 6%; }}
/*--PC--*/
@media screen and (min-width: 768px) and (max-width: 964px){ .third-txt{ font-size: 12px; margin-top: 5%; }}
@media screen and (min-width: 965px) and (max-width: 1048px){ .third-txt{ font-size: 12px; margin-top: 4%; }}
@media screen and (min-width: 1049px) and (max-width: 1111px){ .third-txt{ font-size: 14px; margin-top: 4%; }}
@media screen and (min-width: 1112px) and (max-width: 1174px){ .third-txt{ font-size: 16px; margin-top: 3%; }}
@media screen and (min-width: 1175px) and (max-width: 1200px){ .third-txt{ font-size: 16px; margin-top: 4%; }}
@media screen and (min-width: 1201px) and (max-width: 1400px){ .third-txt{ font-size: 16px; margin-top: 3%; }}
@media screen and (min-width: 1401px){ .third-txt{ font-size: 16px; margin-top: 3%; }}
@media screen and (min-width: 1543px){ .third-txt{ font-size: 16px; margin-top: 3%; }}
@media screen and (min-width: 1900px){ .third-txt{ font-size: 16px; margin-top: 3%; }}


/*----------------------------------------------KVSlider----------------------------------------------*/
.items-slider {
	width: 96%;
    padding: 5%;
}
@media screen and (max-width: 767px) {
	.items-slider {
		width: 86%;
}}

.lp6-slider{
	margin-bottom: 15%;
}
@media screen and (max-width: 767px) { .lp6-slider{ margin-top: 10%; margin-bottom: 42%;}}
@media screen and (min-width: 768px) and (max-width: 921px){ .lp6-slider{ margin-bottom: 25%;}}


/*----------------------------------------------#Style1 01〜03----------------------------------------------*/
.stylebox{
	display: flex;
	justify-content: space-around;
}
@media screen and (max-width: 767px) {
	.stylebox{
		display: block;
}}


.stylebox-1{
	display: flex;
	justify-content: space-around;
}
@media screen and (max-width: 767px) {
	.stylebox-1{
		display: block;
}}


.stylein{
	width: 45.3%;
}
@media screen and (max-width: 767px) {
	.stylein{
	width: 72.3%;
}}


.stylein-1{
	width: 45.3%;
}
@media screen and (max-width: 767px) {
	.stylein-1{
	width: auto;
}}


.styleimg{
	width: 94%;
    margin-left: auto;
    margin-right: auto;
}
@media screen and (max-width: 767px) {
	.styleimg{
		width: 100%;
    	margin-left: auto;
    	margin-right: auto;
}}


.styletxtbox{
	width: 107.2%;
	margin-top: -10%;
}
@media screen and (max-width: 767px) { .styletxtbox{ width: 100%; margin-top: 10%; }}
@media screen and (min-width: 768px) and (max-width: 921px){ .styletxtbox{ width: 48%; margin-top: -10%; margin-left: 2%; }}


.styletxt-left{
	width: 108%;
	margin-top: -10%;
	margin-left: 49.6%;
}
@media screen and (max-width: 767px) { .styletxt-left{ width: 100%; margin-top: 10%; margin-left: 0%; }}
@media screen and (min-width: 768px) and (max-width: 1024px){ .styletxt-left{ width: auto; margin-top: -10%; margin-left: 51.6%; }}


.txt-1{
	font-size: 18px;
	font-family: "游明朝 Demibold", "YuMincho", serif;
	font-weight: normal;
    color: #262626;
    letter-spacing: 0px;
	line-height: 1.9em;
}
@media screen and (max-width: 767px) { .txt-1{ font-size: 16px; }}
@media screen and (min-width: 768px) and (max-width: 921px){ .txt-1{ font-size: 16px; }}


span.txt-2{
	font-size: 22px;
	font-family: "游明朝 Demibold", "YuMincho", serif;
    font-weight: normal;
    color: #262626;
    letter-spacing: 0px;
}
@media screen and (max-width: 767px) { span.txt-2{ font-size: 18px; }}
@media screen and (min-width: 768px) and (max-width: 921px){ span.txt-2{ font-size: 18px; }}


.txt-3{
	margin-top: 40px;
	font-size: 16px;
	font-family: "游ゴシック体 Medium", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック Medium", "Yu Gothic", sans-serif;
    font-weight: 300;
	letter-spacing: 0em;
	line-height: 1.9em;
}
.txt-4{
	margin-top: 40px;
	font-size: 16px;
	margin-bottom: 200px;
	font-family: "游ゴシック体 Medium", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック Medium", "Yu Gothic", sans-serif;
    font-weight: 300;
	text-decoration:underline;
	letter-spacing: 0em;
}


.imglow{
	margin-top: 14%;
}
@media screen and (max-width: 767px) {
	.imglow{
		margin-left: auto;
}}


.imglow1{
	margin-top: 14%;
}
@media screen and (max-width: 767px) {
	.imglow1{
		margin-top: -22%;
		margin-left: auto;
}
	.imglow2{
		margin-top: 14%;
}}


/*----------------------------------------------背景画像----------------------------------------------*/
.parallax {
	margin-top: 16%;
	margin-bottom: 16%;
  	padding: 300px 0;
    background: url(../images/lp/202306/background.jpg);
    background-size: cover;
   	background-position: right;
}
@media screen and (max-width: 767px) {
	.parallax {
		margin-top: -20%;
		margin-bottom: 35%;
		padding: 130px;
		background: url(../images/lp/202306/background-1.jpg);
		background-position: center;
}}
@media screen and (min-width: 768px) and (max-width: 1024px){
	.parallax {
		margin-bottom: 200px;
		padding: 140px;
		background: url(../images/lp/202306/background-2.jpg);
		background-position: center;
}}
@media screen and (min-width: 1024px) and (max-width: 1165px){
	.parallax {
		margin-bottom: 200px;
		padding: 140px;
		background: url(../images/lp/202306/background-3.jpg);
		background-position: center;
}}


/*----------------------------------------------Total Coordinate----------------------------------------------*/
.total-title{
	margin-bottom: 93px;
	font-size: 22px;
	font-family: "游明朝 Demibold", "YuMincho", serif;
    font-weight: normal;
    color: #262626;
    letter-spacing: 0px;
	text-align: center;
}
@media screen and (max-width: 767px) {
	.total-title{
		margin-top: -18%;
		margin-bottom: 18%;
		font-size: 18px;
}}


h2{
	position:relative;
}


h2::before{
	content:"";
   	display:inline-block;
   	width: 5px;
   	height: 90px;
   	background-color: #7E7E7E;
   	position: absolute;
   	top: 2px;
   	left: 0px;
}
@media screen and (max-width: 767px) { h2::before{ top: 6px; height: 112px; }}
@media screen and (min-width: 768px) and (max-width: 921px){ h2::before{ top: 6px; height: 110px; }}


.totaltxt{
	margin-top: 33px;
	margin-bottom: 33px;
	margin-left: 4%;
	font-size: 16px;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	font-weight: 300;
	letter-spacing: 0.03em;
	line-height: 1.9em;
}
@media screen and (max-width: 767px) { .totaltxt{ margin-left: 4%; }}
@media screen and (min-width: 768px) and (max-width: 921px){ .totaltxt{ margin-left: 5%; }}


.totalitem{
	font-size: 16px;
	font-family: "游ゴシック体 Medium", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック Medium", "Yu Gothic", sans-serif;
    font-weight: 300;
	text-decoration:underline;
	letter-spacing: 0.03em;
	line-height: 1.9em;
}
@media screen and (max-width: 767px) {
	.totalitem-bottom{
		margin-bottom: 24%;
}}


/*----------------------------------------------Archive----------------------------------------------*/
.archive__ttl{
	margin-top: 24%;
    margin-bottom: 3em;
    font-size: 22px;
    letter-spacing: 0.05em;
    font-family: "游明朝 Medium", "YuMincho", serif;
    font-weight: normal;
	text-align: center;
}
@media screen and (max-width: 767px) { .archive__ttl{ font-size: 18px; }}
@media screen and (min-width: 768px) and (max-width: 921px){ .archive__ttl{ margin-top: 17%; }}


.archivetxt__ttl{
	margin-top: 5%;
    margin-bottom: 3%;
    font-size: 22px;
    letter-spacing: 0.05em;
	font-family: "游明朝 Medium", "YuMincho", serif;
    font-weight: normal;
	text-align: center;
}
@media screen and (max-width: 767px) {
	.archivetxt__ttl{
		margin-top: 10%;
    	font-size: 16px;
}}


p.slider-p {
    font-size: 16px;
	text-align: center;
	font-family: "游ゴシック体 Medium", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック Medium", "Yu Gothic", sans-serif;
    font-weight: 300;
}
@media screen and (max-width: 767px) {
	p.slider-p {
		width: 85%;
    	font-size: 14px;
		margin-top: 5%;
		margin-left: auto;
    	margin-right: auto;
}}


.lpbtn_box a.lpbtn{
    color: #262626;
	font-family: "游明朝 Medium", "游明朝", "YuMincho", serif;
    font-weight: normal;
	font-size: 18px;
}
@media screen and (max-width: 767px) {
	.lpbtn_box a.lpbtn{
		font-size: 16px;
}}


.lpbtn_box {
    border-radius: 100vh;
    width: 17%;
	padding: 7px;
    border: solid 1px #707070;
    text-align: center;
	margin-top: 5%;
    margin-left: auto;
    margin-right: auto;
}
@media screen and (max-width: 767px) { .lpbtn_box { width: 46%; padding: 4px; margin-top: 10%; }}
@media screen and (min-width: 768px) and (max-width: 921px){ .lpbtn_box { width: 27%; }}


/*----------------------------------------------Archiveスライダー▶︎----------------------------------------------*/
.slick-next:before {
    content: "→";
}


.slick-prev, .slick-next {
	width: 62px;
	z-index: 1;
	top: unset;
	bottom: -53%;
	margin-left: auto;
	margin-right: auto;
    background: #fff;
}
@media screen and (max-width: 767px) {
	.slick-prev, .slick-next {
		width: 18px;
		bottom: -60%;
}}
@media screen and (min-width: 768px) and (max-width: 921px){ .slick-prev, .slick-next{ bottom: -73%;}}
@media screen and (min-width: 1700px){ .slick-prev, .slick-next{ bottom: -42%;}}


.slick-prev::before, .slick-next::before {
    width: 140%;
    font-size: 50px;
    color: #262626;
    display: block;
    background-repeat: no-repeat;
    background-size: 4.8px 10px;
    font-family: 'Playfair Display';
    transition: all .3s;
}
@media screen and (max-width: 767px) {
	.slick-prev::before, .slick-next::before {
		font-size: 30px;
}}


.slick-prev { /*←*/
    left: 14.5%;
}
@media screen and (max-width: 767px) { .slick-prev { left: 2.5%; }}
@media screen and (min-width: 768px) and (max-width: 921px){ .slick-prev { left: 7.5%; }}


.slick-next { /*→*/
    right: 14.5%;
}
@media screen and (max-width: 767px) { .slick-next { right: 5.5%; }}
@media screen and (min-width: 768px) and (max-width: 921px){ .slick-next { right: 7.5%; }}


/*----------------------------------------------Archive画像----------------------------------------------*/
.slider-lp {
    width:94%;
    margin:0 auto;
}
@media screen and (max-width: 767px) {
	.slider-lp {
    	width:100%;
    	margin:0 auto;
}}

.slider-lp img {
    width: 30vw; /*画像のレスポンシブ化*/
    height: auto;
}
@media screen and (max-width: 767px) {
	.slider-lp img {
    	width: 100vw;
    	height: auto;
}}

.slider-lp .slick-slide {
	transform: scale(0.8);
	transition: all .5s;
	opacity: 0.5;
}

.slider-lp .slick-slide.slick-center{
	transform: scale(1);
	opacity: 1;
}


/*----------------------------------------------Archive+shop/onlinebtn----------------------------------------------*/
.container-btn {
  max-width: 1200px;
  margin: 30px auto;
  margin-top: 16%;
  margin-bottom: 16%;
}
.btnsbox {
  display: flex; /*flexbox化*/
  flex-direction: column;
  align-items: center;
}

@media screen and (min-width: 768px),print {
.btnsbox {
		flex-direction: row;
		justify-content: center;
}}

.btnsbox a {
	color: #fff;
	font-family: "游明朝 Light", "游明朝", "YuMincho", serif;
}

.btns__item {
	margin: 10px;
  	width: 80%;
  	max-width: 300px;
}
.btnlink {
	width: 60%;
	margin-left: auto;
    margin-right: auto;
	display: block;
	padding: 6px;
	background: #969696;
	text-align: center;
	text-decoration: none;
}


@media screen and (max-width: 768px) {
	.container-btn {
    margin-top: 20%;
    margin-bottom: -8%;
}}

@media screen and (min-width:768px) and ( max-width:768px) { .container-btn { margin-top: -7%; margin-bottom: 13%; }}

@media screen and (min-width:430px) and ( max-width:450px) {.container-btn { margin-top: 20%; margin-bottom: -7%; }}

@media screen and (min-width:451px) and ( max-width:470px) { .container-btn { margin-top: 20%; margin-bottom: -5%; }}

@media screen and (min-width:471px) and ( max-width:599px) { .container-btn { margin-top: 20%; margin-bottom: -2%; }}

@media screen and (min-width:600px) and ( max-width:767px) { .container-btn { margin-top: 20%; margin-bottom: 20%; }}

@media screen and (min-width:768px) and ( max-width:921px) { .container-btn { margin-top: 14%; margin-bottom: 17%; }}