@charset "euc-jp";
.slider {
  position: relative;
}
.bx-viewport {
  border: none !important;
  left: 0 !important;
}
#slider div {
  width: 100% !important;
}

.more_prd {
  display: none;
  background-color: #aaa;
  color: #fff;
  font-size: 123.076%;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.free_space_block {
  margin-top: 3em;
}



/* Scss Document */
.title-common {
  font-size: 20px;
  line-height: 54px;
  letter-spacing: 0.05em;
  /*font-family: 'Noto Sans JP', sans-serif;*/
}
.title-common span {
  font-size: 28px;
  display: block;
  font-weight: 500;
}


/*------------------------------------------------------------------------*/




.index_key {
  background:url(https://www.lanternamagica.jp/shop-pro00/img/key.jpg) no-repeat center 0;
}


.btn-cus a {
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font-size: 13px;
  line-height: 30px;
	border: 1px solid #352c23;
	font-size:16px;
	padding:6px 0;
  border-radius: 20px; }

.btn-cus a:hover {
		color: #fff;
	background: #352c23;
    text-decoration: none; }

#about .btn-cus {
        width: 600px;
	margin:0px auto 80px;
  position:relative;
  top:50px;
}
#about a:before{
	background-color: #30230d;
}


@media only screen and (max-width: 767px) {
  #key-top {

  }


}
.lead_col{
  text-align: center;
  padding:80px 0;
}
.lead_col h2{
  font-family: 'Roboto Condensed', sans-serif;
  font-size:30px;
  font-weight: bolder;
  letter-spacing: 3px;
}
.lead_col h3{
  font-family: 'Playfair Display', serif;
  font-size:116px;
  line-height: 130%;
  font-weight: bolder;
}
.lead_col .txt{
  padding:40px 0;
}

@media only screen and (max-width: 767px) {
  .lead_col h2{
  font-size:6vw;
}
.lead_col h3{
  font-size:15vw;
}
.lead_col img{
  width:90vw;
  }
 .lead_col .txt{
  width:96%;
   text-align: left;
   margin:0 auto;
}
 } 
  
.shop_col{
      display:flex;
    flex-direction: row;
    -ms-flex-pack: distribute;
justify-content: space-around;
flex-wrap : wrap;
    justify-content:space-between;
  width:82vw;
  margin:0 auto 200px;
}
.shop_col .col{
  width:45%;
}
.shop_col .img{
  text-indent: -9999px;
  background-size: cover;
  width:100%;
  height:500px;
}
.shop_col .img a{
  width:100%;
  display: block;
  height:100%;
}
.shop_col .img a:hover{
  background: rgba(255,255,255,0.2)
}
.shop_col #img1{
  background: url(https://www.lanternamagica.jp/shop-pro00/img/shop01.jpg) no-repeat center 0;
}
.shop_col #img2{
  background: url(https://www.lanternamagica.jp/shop-pro00/img/shop02.jpg) no-repeat center 0;
}
.shop_col #img3{
  background: url(https://www.lanternamagica.jp/shop-pro00/img/shop03.jpg) no-repeat center 0;
}
.shop_col .coll{
  border:1px solid #000;
  width:80%;
  margin:20px auto;
  padding:20px 10% 40px;
}

.shop_col .coll h3{
  text-align: center;
  font-family: 'Playfair Display', serif;
  font-size:48px;
  line-height:100%;
  padding-bottom:30px;
}
.shop_col .coll h3 span{
  font-size:50%;
}
.shop_col .coll h4{
  text-align: center;
  padding-bottom:40px;
  position: relative;
  line-height: 180%;
}
.shop_col .coll h4:before{
  content:"";
  height:1px;
  width:40%;
  border-bottom:1px dotted #000;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top:80px;
}
.shop_col .coll .tel{
  text-align: center;
  padding-bottom:30px;
  position:relative;
}
.shop_col .coll .tel:before{
  content:"";
  background: url(https://www.lanternamagica.jp/shop-pro00/img/icon_tel.png) no-repeat center 0;
  background-size: cover;
  height:30px;
  width:30px;
  position: absolute;
  left:calc( 50% - 114px);
  top:0;
}
.shop_col .coll .tel a{
  font-size:26px !important;
  display: inline-block;
}
.shop_col .coll .info{
  margin-bottom:30px;
}
.shop_col .coll .btn{
  text-align: center;
  padding-bottom:30px;
  position:relative;
}

.shop_col .coll .btn a{
display: block;
  background: #000;
  color:#fff;
  padding:15px 0;
  text-indent: 1em;
}
.shop_col .coll .btn a:before{
  content:"";
  width:32px;
  height:32px;
  background: url(https://www.lanternamagica.jp/shop-pro00/img/icon_cart.png) no-repeat center 0;
  background-size: cover;
  position:absolute;
  left:40px;
  top:12px;
}
.shop_col .coll .btn a:hover{
  text-decoration: none;
  background: #3a3a3a;
}
@media only screen and (max-width: 767px) {
  .shop_col{
  width:90vw;
  margin:0 auto 100px;
}
.shop_col .col{
  width:100%;
}
.shop_col .coll{
  padding:20px 10% 10px;
}
  }
  
.about_col{
padding:100px 0 0 0;
border-top:1px solid #c2c2c2;
 border-bottom:1px solid #c2c2c2;
  width:90vw;
  margin:0 auto;
}
.sec_col {  
    position: relative;
    z-index: 2;
	clear:both;
	margin-bottom:80px;
  }
.sec_col h2 {
  padding: 0px 0 0px;
  font-size:6vw;
  font-family: 'Playfair Display', serif;
  line-height:120%;
  float:left;
  width:40vw;
}
.sec_col h3{
  font-family: 'Roboto Condensed', sans-serif;
  font-size:20px;
  font-weight: bolder;
  letter-spacing: 3px;
}

.sec_col .col{
width:45vw;
	float:right;
  padding:20px 0 40px 4%;
  border-left:1px solid #000;
}
.sec_col .img img{
  width:100%;
}





@media only screen and (max-width: 767px) {

  .title-common {
    font-size: 20px;
    line-height: 40px;
  }
  .title-common span {
    font-size: 26px;
  }

.sec_col {
  clear:both !important;
  float:none;
	width:100% !important;
	margin:0 auto 30px 0 !important;
  }
.sec_col .img,.sec_col .col{
		float: none !important;
		clear:both;
  width:100% !important;
	}

  .sec_col h2 {
    padding: 20px 10% 20px 1%;
    float: none;
    width:96vw;
    font-size:15vw;
  }
.sec_col .col{
	float:none;
  padding:0px 0 30px 1%;
  border-left:none;
  clear:both;
}
  .sec_col .txt {
    width:96vw;
  }

  .sec_col .txt br {
    display: none;
  }
  .about_col{
    padding:30px 0 0 0;
 border-bottom:none;
}
#about img{
  width:100vw;
}


}