﻿@charset "utf-8";
/* default */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Hina+Mincho&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@600;700&display=swap');
@import url(https://use.fontawesome.com/releases/v5.10.2/css/all.css);
@import url("/css/usr/shared/responsive/lightbox.min.css");
@import url("/css/usr/nv/bootstrap-grid.css");
@import url("normalize.css");
@import url("common.css");


/* 共通 ************************************************************/
.block-category-list--header, .block-category-list--promotion-freespace, .block-category-list--promotion-freespace{display: none; height:0;}
.block-category-list--comment{display: none; border-bottom: 0; height:0;}
.qjLogo{
 min-height: 0%;
}
.qjLogo img{
 display: block;
 min-height: 0%;
 margin: 1.5em auto;
 text-align: center;
 max-width: 30vw;
}
.snsBtn{
 text-align: right;
}
.snsBtn a{
 background: #999;
 -webkit-border-radius: 3px;
 -moz-border-radius: 3px;
 border-radius: 3px;
 color: #fff;
 display: inline-block;
 font-size: 14px;
 letter-spacing: 0;
 margin: .5em .3em;
 padding: .3em .8em;
 text-align: center;
 text-decoration: none;
}
.snsBtn a.facebook:hover{
 background: #3b5998;
}
.snsBtn a.instagram:hover{
 background: #dd2a7b;
}
.snsBtn a i{
 font-size: 20px;
}

.container-fluid .containerQj .row{
 margin: 0;
}
.container-fluid .containerQj img{
 margin: 0;
}
.container-fluid .containerQj .iconArea .col-lg-4,
.container-fluid .containerQj .iconArea .col-md-6{
 padding: .5em 0;
}
.container-fluid .containerQj .mrgn-btm1{
 margin-bottom: 1em;
}
.container-fluid .containerQj .iconArea p{
 font-family: 'Noto Serif JP', serif;
 font-size: 13px;
 margin: 0;
 padding: .5em 0;
}
.container-fluid .containerQj .iconArea p span{
 background: #ccc;
 -moz-border-radius: 4px;
 -webkit-border-radius: 4px;
 border-radius: 4px;
 display: inline-block;
 font-size: 12px;
 margin: 1.5em auto;
 padding: .3em .5em;
 text-align: center;
 text-decoration: none;
 margin: 0;
 font-family: 'Noto Sans JP', sans-serif;
}
.container-fluid .containerQj h2.h2Ttl{
 font-family: 'Red Hat Display', sans-serif;
 font-size: 22px;
 font-weight: 600;
 line-height: 0;
 margin: 2.5em 1em;
 padding: 2rem;
 position: relative;
 text-align: center;
}
.container-fluid .containerQj h2:before {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 60px;
  height: 3px;
  content: '';
  border-radius: 10px;
  background: #999;
}
.container-fluid .containerQj #apology p::before{
 content: "\f111\00A0";
 color: #dddddd;
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
}
.container-fluid .containerQj .infoArea {
 margin-top: .5em;
}
.container-fluid .containerQj .infoArea li{
 border-bottom: 1px solid #dddddd;
 margin-bottom: 1.5em;
 padding-bottom: 1em;
}
.container-fluid .containerQj .infoArea li .infoL2 li{
  padding-left: 1.3em;
  text-indent: -1.3em;
  line-height: 1.5;
  margin: .5em 0 0 0;
 border-bottom: 0;
 padding-bottom: 0
}
.container-fluid .containerQj .infoArea li .infoL2 li:before {
  content: "";
  width: .8em;
  height: .8em;
  display: inline-block;
  background-color: #a87e16;
  border-radius: 50%;
  margin-right: .5em;
}
.container-fluid .containerQj .infoArea p.col-md-6{
 padding-left: 0;
 padding-right: 0;
}
.container-fluid .containerQj .infoArea li:last-child{
 border-bottom: 0;
 padding: 1em 0;
}
.container-fluid .containerQj .infoArea li li:last-child{
 border-bottom: 0;
 padding: 0 0 1em 1.3em;
}
.container-fluid .containerQj .infoArea h3{
 font-family: 'Noto Serif JP', serif;
 font-size: 25px;
 font-weight: 600;
 line-height: 1.1;
}
.container-fluid .containerQj .infoArea h4{
 margin-bottom: 1em;
}
.container-fluid .containerQj .infoArea p{
 font-size: 13px;
}
.container-fluid .containerQj .infoArea .wsArea{
 background: #efefef;
 padding: 1em 1.2em;
 margin: .5em 0 1em;
 font-size: 13px;
}
.container-fluid .containerQj .infoArea .wsArea em{
 font-weight: bold;
}
.container-fluid .containerQj .infoArea .sakuhinOubo{
 padding: 1em .5em;
 
}
.container-fluid .containerQj .infoArea .sakuhinOubo ol{
 font-size: 13px;
}
.container-fluid .containerQj .infoArea .sakuhinOubo ol li{
 border-bottom: 0;
 list-style: outside decimal;
 margin-bottom: 0;
 margin-left:  2em;
 padding-bottom: 0;
}
.container-fluid .containerQj .infoArea .sakuhinOubo ol li:last-child{
 padding: 0;
}
.container-fluid .containerQj a.btnQj{
 background:#fff;
 border: #c53665 solid 1px;
 -moz-border-radius: 8px;
 -webkit-border-radius: 8px;
 border-radius: 8px;
 color:#c53665;
 display: block;
 font-size: 13px;
 margin: 1.5em auto;
 padding: 1em;
 text-align: center;
 text-decoration: none;
 -webkit-transition: all .5s ease;
 -moz-transition: all .5s ease;
 -o-transition: all .5s ease;
 transition: all .5s ease;
 width: 100%;
}
.container-fluid .containerQj a.btnQj:hover{
 background: #c53665;
 color: #fff;
}
.btnTel::before{
 content: "\f095\00A0";
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
}
.btnForm::before{
 content: "\f044\00A0";
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
}
.btnMail::before{
 content: "\f0e0\00A0";
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
}
.btnMailA::after{
 content: "\00A0\f0e0";
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
}
.btnPdf::after{
 content: "\00A0\f1c1";
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
}
.btnYoutube::after{
 content: "\00A0\f167";
 font-family: "Font Awesome 5 Brands";
 font-weight: 400;
}
.btnInsta::after{
 content: "\00A0\f16d";
 font-family: "Font Awesome 5 Brands";
 font-weight: 400;
}
.btnRestore::after{
 content: "\00A0\f2d2";
 font-family: "Font Awesome 5 Free";
 font-weight: 400;
}

/* Instagram　埋め込み */
ul.insta-list {
  display: flex;
  flex-wrap: wrap;
}
ul.insta-list li {
  list-style: none;
  position: relative;
}
ul.insta-list li:before {
  content: "";
  display: block;
  padding-top: 100%;
}
ul.insta-list li img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  object-fit: cover;
}

@media screen and (max-width : 767px) {
.instaArea{
 padding-bottom: 450px;
}
  ul.insta-list li {
    width: 33.3333%;
  }
  ul.insta-list li:nth-child(n+10) {
    display: none;
  }
}

@media screen and (min-width : 768px) {
.instaArea{
 padding-bottom: 400px;
}
  ul.insta-list li {
    width: 25%;
  }
  ul.insta-list li:nth-child(n+9) {
    display: none;
  }
}


/* *******************************************************************　*/
/* *******************************************************************　*/
/* *******************************************************************　*/
@media print, screen and (min-width: 600px) {
}
/* *******************************************************************　*/
/* *******************************************************************　*/
/* *******************************************************************　*/
@media screen and (min-width : 768px) {
.qjLogo img{
 width: 20vw;
}
.container-fluid .containerQj .iconArea .col-lg-4,
.container-fluid .containerQj .iconArea .col-md-6{
 padding: .5em;
}
.container-fluid .containerQj .iconArea p{
 font-size: 14px;
}
.container-fluid .containerQj .iconArea p span{
 font-size: 13px;
}
.container-fluid .containerQj h2.h2Ttl{
 font-size: 35px;
}
}
/* *******************************************************************　*/
/* *******************************************************************　*/
/* *******************************************************************　*/
@media screen and (min-width : 992px) {
.qjLogo img{
 max-width: 200px;
}
.container-fluid .containerQj a.btnQj{
 font-size: 14px;
}
}
/* *******************************************************************　*/
/* *******************************************************************　*/
/* *******************************************************************　*/
@media screen and (min-width : 1200px) {
.container-fluid .containerQj a.btnQj{
 font-size: 16px;
}
}