@charset "utf-8";
/* CSS Document */

.bd-placeholder-img {
	font-size: 1.125rem;
	text-anchor: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

@media (min-width: 768px) {
.bd-placeholder-img-lg {
	font-size: 3.5rem;
}
}

/*** fixed menu ***/
.navbar {
  background-color: rgba(255,255,255,0.8);
}

.pcmenu {
  position: fixed;
  bottom: 5%;
  right: 0;
  width: 60px;
  z-index: 100;
}

.spmenu {
  background-color: #ffdc00;
}

.linkbox {
    position: relative;
}
.linkbox a {
    position: absolute;
    top: 0;
    left: 0;
    height:100%;
    width: 100%;
}

/*** font ***/
@font-face {
	font-family: EB Garamond;
	src: url('../font/EBGaramond-Regular.ttf') format("truetype");
}

@font-face {
	font-family: Shippori Mincho;
	src: url('../font/ShipporiMincho-Medium.ttf') format("truetype");
}

body{
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
  color: #1a1a1a;
  background-color: #ffdc00; /* 季節ごとに変更　*/
  background-image: linear-gradient(0deg, #ffdc00 0%, #fff199 100%); /* 季節ごとに変更　*/
}

main, footer {
  margin: 0 auto;
  max-width: 720px;
}

main {
  text-align: center;
  overflow: hidden;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
}

@media (max-width: 576px) {
footer {
  margin-bottom: 20%;
}
}

p {
  margin-bottom: 0;
}

a:link { color: #BF565F; }
a:visited { color: #BF565F; }
a:hover { color: #BF565F; }
a:active { color: #BF565F; }

.font-en {
	font-family: 'EB Garamond', serif;
}

h1, h2 {
  margin-bottom: 0;
}

.copy,
.x-small {
  font-size: 0.8rem;
}

.color1 {
  color: #BF565F;
}

.color2 {
  color: #D95F8C;
}

.color3 {
  color: #3F618C;
}

.caution {
  color: #A40321;
}

@media (max-width: 576px) {
.wrap span {
  display: block;
  }
  
.wrap span.bg-notice {
  display: inline;
  }
  
.font-notice {
  font-size: 0.8rem !important;
  }
}

.heading {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	text-align: center;
}

.heading::before,
.heading::after {
	content: '';
	width: 1px;
	height: 1.2em;
	background-color: #3B3A40;
}

.heading::before {
	margin-right: 0.5em;
	transform: rotate(-35deg)
}
.heading::after {
	margin-left: 0.5em;
	transform: rotate(35deg)
}

.heading2 {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	text-align: center;
}

.heading2::before,
.heading2::after {
	content: '';
	width: 1px;
	height: 1.2em;
	background-color: #FFFFFF;
}

.heading2::before {
	margin-right: 0.5em;
	transform: rotate(-35deg)
}
.heading2::after {
	margin-left: 0.5em;
	transform: rotate(35deg)
}

.lead-ls {
  letter-spacing: 0.25em;
}

/*** background color ***/
.bg-gray {
  background: #3B3A40;
  color: #FFF;
}

.bg-beige {
  background-color: #EDE4CD;
}

.bg-pink {
  background-color: #f5b2b2;
}

.bg-red {
  background-color: #d70035;
}

.bg-lightblue {
  background-color: #cce3ee;
}

.bg-blue {
  background-color: #0073a8;
}

.bg-purple {
  background-color: #d1bada;
}

.bg-orange {
  background-color: #f8c999;
}

.bg-green {
  background-color: #bee0c2;
}

.bg-tokuten {
  background-color: #b3737b;
}

.bg-line {
  background: #06C656;
}

.bg-notice {
  background: #FBEFF3;
  color: #A40321;
  padding: 1px 4px;
}

/*** ボタンの色カスタマイズ ***/

.btn-primary {
    background: #A34769; /*ボタンの背景色*/
    color: #FFFFFF; /*ボタンのテキストの色*/
    border-color: #A34769;
}

.btn-primary:hover, .btn-primary:focus, 
.btn-primary:active, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary:active.focus,
.btn-primary.active, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary, 
.open > .dropdown-toggle.btn-primary:hover,
.open > .dropdown-toggle.btn-primary:focus, 
.open > .dropdown-toggle.btn-primary.focus,
.btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus {
    background: #7a354f; /*ボタンの上にポインタを持ってきたり、クリックしたりした時の背景色*/
    color: #FFFFFF; /*ボタンの上にポインタを持ってきたり、クリックしたりした時のテキストの色*/
    border-color: #7a354f;
    outline: none !important;
    box-shadow:none !important;
}

.btn-primary.outline {
    border: 3px solid #A34769; /*アウトラインのみのボタンの線の色*/
    color: #A34769; /*アウトラインのみのボタンのテキストの色*/
}

button:focus,
.btn:focus {
  outline: none !important;
}

button:focus,
.btn:focus {
 box-shadow:none !important;
}

.btn-more {
  font-size: 1rem;
/*  border: solid 1px #3B3A40;*/
/*  padding: 0.5em 0.75em;*/
  border-radius: 0;
  margin-top: 1rem;
  margin-bottom: 1rem;
  color: #fff;
  background-color: #1a1a1a;
}

.btn-more:hover {
  color: #fff;
}

.btn-more:link { 
  color: #fff; 
}

.nav-link.yoyaku {
  padding: 0;
}

/*** img hover ***/
a img {
  opacity: 1;
  -webkit-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}
a:hover img:hover {
  opacity: .5;
}

/*** delayed ***/
.delayed-image {
	/* じわっと画像が表示される */
 	animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}
 
/* じわっと画像が表示される ---------　一度追加していたら不要*/
@keyframes fadeIn { /*上のbody内で呼び出しているアニメーションと名前をそろえる*/
    0% {opacity: 0} /* 始め */
    100% {opacity: 1} /* 終わり */
}
 
/*古いブラウザ用　---------　一度追加していたら不要*/
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

/*** fade ***/
.fadeup {
  opacity: 0;
  transform: translate(0, 50px);
  transition: all 1500ms;
}

.fadeup.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}

/*** reflection ***/
.reflection {
  position: relative;
  overflow: hidden;
}

.reflection::after {
  content: "";
  display: block;
  width: 40px;
  height: 100%;
  position: absolute;
  top: -180px;
  left: 0;
  background-color: #FFF;
  opacity: 0;
  animation: reflect 2s ease-in-out infinite;
  -webkit-transform: rotate(45deg);
  -webkit-animation: reflect 2s ease-in-out infinite;
  transform: rotate(45deg);
}

@keyframes reflect {
  0% {
    transform: scale(0) rotate(45deg);
    opacity: 0;
  }
  80% {
    transform: scale(0) rotate(45deg);
    opacity: 0.5;
  }
  81% {
    transform: scale(4) rotate(45deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(45deg);
    opacity: 0;
  }
}

@-webkit-keyframes reflect {
  0% {
    transform: scale(0) rotate(45deg);
    opacity: 0;
  }
  80% {
    transform: scale(0) rotate(45deg);
    opacity: 0.5;
  }
  81% {
    transform: scale(4) rotate(45deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(45deg);
    opacity: 0;
  }
}

/*** blinking ***/
.blinking {
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink {
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

/*** navbar ***/
.navbar-toggler:focus {
	box-shadow: none;
}

/*** mv ***/
.mv {
  width: 100%;
}

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

@media (min-width: 992px) {
.mv {
  height: 600px;
  overflow: hidden;
}
}

/*** pickup ***/
.pickup {
  max-width: 960px;
}

.pickup div {
  padding: 0 20px;  
}

.slick-prev:before,
.slick-next:before {
  color: #BFBFBF;
}

/*** accordion ***/
.accordion-button:not(.collapsed) {
  color: initial;
  background-color: transparent;
}

.accordion-button:focus {
  z-index: 0;
  border-color: rgba(0,0,0,.125);
  outline: 0;
  box-shadow: none;
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/*** collection ***/
.collection {
  width: 100%;
  height: auto;
}
  
.collection div img {
  width: 400px;  
}

.mb-10p {
  margin-bottom: 10% !important;
}

@media (max-width: 576px) {
.mb-10p {
  margin-bottom: 20% !important;
}
  
.collection div img {
  width: 300px;  
}  
}

.brand1 {
  background: #D71718;
  color: #FFFFFF;
}

.brand2 {
  background: #00B2BF;
  color: #000000;
}

.brand3 {
  background: #FFE800;
  color: #000000;
}

.brand4 {
  background: #000000;
  color: #FFFFFF;
}

.brand5 {
  background: #E62E8B;
  color: #FFFFFF;
}

.brand6 {
  background: #796A56;
  color: #FFFFFF;
}

.brand7 {
  background: #5D253A;
  color: #FFFFFF;
}

.brand8 {
  background: #DCC56D;
  color: #000000;
}

.brand9 {
  background: #EC6D74;
  color: #000000;
}

/*** plan ***/
.plan div {
  max-width: 1000px;
  margin: 0 auto;
  background: #FFFFFF;
}

.set-rental {
  background-color: #DFECE7;
}

.set-buy {
  background-color: #FBEEF1;
}

div.set div {
  text-indent: -1em;
  padding-left: 2em;
}

/*** modal ***/
.modal-body {
  text-align: left;
}

/*** shoplist ***/
.shoplist div {
  max-width: 960px;
  margin: 0 auto;
}

ul.shopinfo {
  padding-inline-start: 0;
  list-style-type: none;
}

.shopinfo li {
  text-indent: -5em;
  padding-left: 5em;
  padding-top: 0.5em;
}

/*** footer ***/
@media (max-width: 576px) {
.text-end img {
  width: 40px;
}
}

/*** ボタンアニメ ***/
.anim-box.poyopoyo {
  animation: poyopoyo 2s ease-out infinite;
  opacity: 1;
}
@keyframes poyopoyo {
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.95);
  }
}

/*** ボタンアニメ2 ***/
.bound {
  animation: key .3s ease infinite alternate;
}
@keyframes key {
  0% {transform: translateY(0px);}
  100% {transform: translateY(-10px);}
}

/*** 下線だけ吹き出し ***/
.balloon {
    position: relative;
    display: inline-block;
    background-color: #fff;
    border-bottom: solid 1px #525252;
    padding: 16px;
    min-width: 240px;
    max-width: 100%;
    text-align: center;
}
.balloon:before,
.balloon:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.balloon:before {
    border: solid 12px transparent;
    border-top: solid 12px #525252;
}
.balloon:after {
    border: solid 15px transparent;
    border-top: solid 15px #fff;
    margin-top: -5px;
}
.balloon p {
    line-height: 1.8;
    margin: 0;
    padding: 0;
}

/*** modal ***/
.modal-body {
  text-align: left;
}

.modal-content {
  border-radius: 0 !important;
}

@media (min-width: 992px) {
  .modal-dialog {
    max-width: 960px !important;  
  }
}

.price {
  font-size: 2.4rem;
  line-height: 2.8rem;
}

@media (max-width: 576px) {
  .price {
    font-size: 2.0rem;
    line-height: 2.4rem;
  }
}

/*** 振袖詳細 ***/
ul {
  list-style: none;
  padding-left:1em;
	text-indent:-1em;
}