@charset "utf-8";
/*--------------------------------------------------------------
   BASIC
--------------------------------------------------------------*/
html {
  font-size: 62.5%;
}
body {
  position: relative;
  width:100%;
  min-height: 100vh;
  line-height: 1;
  font-size: 1.3rem;
  letter-spacing: .1rem;
  font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',YuGothic,'Yu Gothic','Arial',sans-serif;
}
a{
  color: initial;
  text-decoration: none;
  display: inline-block;
}
a.btn{
  display: block;
}
img{
  width:100%;
  max-width:100%;
  height:auto;
}
p a{
  text-decoration: underline;
}
.pc{
  display: none;
}
.sp{
  display: block;
}
.cf {
  display: block;
}
.cf:after,
.cf:before{
  display: block;
  clear: both;
}
.en{
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
}
.before::before,
.after::after{
  content: '';
  background-repeat: no-repeat
}

@media screen and (min-width: 768px){
  body {
    font-size: 1.4rem;
  }
  img{
    width:auto;
    max-width:100%;
    height:auto;
  }
  .pc{
    display: block;
  }
  .sp{
    display: none;
  }
}
/*--------------------------------------------------------------
   SMALL PARTS
--------------------------------------------------------------*/
.bgImg{
  background-size: cover;
  background-position: center;
}
.fW__b{
  font-weight: bold;
}
/* shadow */
.imgShadow{
  -webkit-filter: drop-shadow(0px 0px 10px rgba(0,0,0,.2));
  filter: drop-shadow(0px 0px 10px rgba(0,0,0,.2));
}
.imgShadow__white{
  -webkit-filter: drop-shadow(0px 0px 10px rgba(255,255,255,.2));
  filter: drop-shadow(0px 0px 10px rgba(255,255,255,.2));
}
.txtShadow{
  text-shadow:0px 0px 5px rgba(0,0,0,.5);
}
.txtShadow__white{
  text-shadow:0px 0px 5px rgba(255,255,255,.5);
}
.boxShadow{
  -webkit-box-shadow:0px 0px 20px 0px rgba(0,0,0,.2);
  box-shadow:0px 0px 20px 0px rgba(0,0,0,.20);
}
.boxShadow__white{
  -webkit-box-shadow:0px 0px 20px 0px rgba(255,255,255,.2);
  box-shadow:0px 0px 20px 0px rgba(255,255,255,.2);
}
/*imgSize*/
.imgSize__gold{
  padding-top: 61.875%;
}
.imgSize__square{
  padding-top: 100%;
}
/*boarderR*/
.bR{
   border-radius: 1000px;
}
/*nowrap*/
.nowrap{
  white-space: nowrap;
}

/*--------------------------------------------------------------
   width
--------------------------------------------------------------*/

.w__base,
.w__base__sp,
.w__base__pc{
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width:413px) {
  .w__base,
  .w__base__sp{
    width: 90%;
  }
}
@media screen and (min-width:414px) and (max-width:767px) {
  .w__base,
  .w__base__sp{
    width: 87.4%;
  }
}
@media screen and (min-width: 768px){
  .w__base,
  .w__base__pc{
    width: 1100px;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px){
  .w5__pc{ width: 5%;}
  .w10__sp{ width: 10%;}
  .w15__sp{ width: 15%;}
  .w20__sp{ width: 20%;}
  .w25__sp{ width: 25%;}
  .w30__sp{ width: 30%;}
  .w35__sp{ width: 35%;}
  .w40__sp{ width: 40%;}
  .w45__sp{ width: 45%;}
  .w50__sp{ width: 50%;}
  .w55__sp{ width: 55%;}
  .w60__sp{ width: 60%;}
  .w65__sp{ width: 65%;}
  .w70__sp{ width: 70%;}
  .w75__sp{ width: 75%;}
  .w80__sp{ width: 80%;}
  .w85__sp{ width: 85%;}
  .w90__sp{ width: 90%;}
  .w95__sp{ width: 95%;}
  .w100__sp{ width: 100%;}
}
@media screen and (min-width: 768px){
  .w5__pc{ width: 5%;}
  .w15__pc{ width: 15%;}
  .w20__pc{ width: 20%;}
  .w25__pc{ width: 25%;}
  .w30__pc{ width: 30%;}
  .w35__pc{ width: 35%;}
  .w40__pc{ width: 40%;}
  .w45__pc{ width: 45%;}
  .w50__pc{ width: 50%;}
  .w55__pc{ width: 55%;}
  .w60__pc{ width: 60%;}
  .w65__pc{ width: 65%;}
  .w70__pc{ width: 70%;}
  .w75__pc{ width: 75%;}
  .w80__pc{ width: 80%;}
  .w85__pc{ width: 85%;}
  .w90__pc{ width: 90%;}
  .w95__pc{ width: 95%;}
  .w100__pc{ width: 100%;}
}
/*--------------------------------------------------------------
   font-size
--------------------------------------------------------------*/
.fS__sizeSS{
  font-size: 1rem;
}
.fS__sizeS{
  font-size: 1.1rem;
}
.fS__sizeM{
  font-size: 1.3rem;
}
.fS__sizeL{
  font-size: 1.4rem;
}
.fS__sizeXL{
  font-size: 2.1rem;
}
@media screen and (max-width: 767px){
  .fS__size10--sp{
    font-size: 1rem;
  }
  .fS__size11--sp{
    font-size: 1.1rem;
  }
  .fS__size12--sp{
    font-size: 1.2rem;
  }
  .fS__size13--sp{
    font-size: 1.3rem;
  }
  .fS__size14--sp{
    font-size: 1.4rem;
  }
  .fS__size15--sp{
    font-size: 1.5rem;
  }
  .fS__size16--sp{
    font-size: 1.6rem;
  }
  .fS__size17--sp{
    font-size: 1.7rem;
  }
  .fS__size18--sp{
    font-size: 1.8rem;
  }
  .fS__size19--sp{
    font-size: 1.9rem;
  }
  .fS__size20--sp{
    font-size: 2rem;
  }
}
@media screen and (min-width: 768px){
  .fS__sizeS{
    font-size: 1.4rem;
  }
  .fS__sizeM{
    font-size: 2rem;
  }
  .fS__sizeL{
    font-size: 2.4rem;
  }
  .fS__sizeXL{
    font-size: 3.2rem;
  }
  .fS__size10--pc{
    font-size: 1rem;
  }
  .fS__size11--pc{
    font-size: 1.1rem;
  }
  .fS__size12--pc{
    font-size: 1.2rem;
  }
  .fS__size13--pc{
    font-size: 1.3rem;
  }
  .fS__size14--pc{
    font-size: 1.4rem;
  }
  .fS__size15--pc{
    font-size: 1.5rem;
  }
  .fS__size16--pc{
    font-size: 1.6rem;
  }
  .fS__size17--pc{
    font-size: 1.7rem;
  }
  .fS__size18--pc{
    font-size: 1.8rem;
  }
  .fS__size19--pc{
    font-size: 1.9rem;
  }
  .fS__size20--pc{
    font-size: 2rem;
  }
}
/*--------------------------------------------------------------
   text-align
--------------------------------------------------------------*/
@media screen and (max-width: 767px){
  .t__c--sp{
    text-align: center;
  }
  .t__r--sp{
    text-align: right;
  }
  .t__l--sp{
    text-align: left;
  }
}
@media screen and (min-width: 768px){
  .t__c--pc{
    text-align: center;
  }
  .t__r--pc{
    text-align: right;
  }
  .t__l--pc{
    text-align: left;
  }
}
/*--------------------------------------------------------------
   line-height
--------------------------------------------------------------*/
@media screen and (max-width: 767px){
  .lH__size14--sp{
    line-height: 1.4;
  }
  .lH__size15{
    line-height: 1.5;
  }
  .lH__size17{
    line-height: 1.7;
  }
  .lH__size20{
    line-height: 2;
  }
}
@media screen and (min-width: 768px){
  .tC__pc{
    text-align: center;
  }
  .tR__pc{
    text-align: right;
  }
  .tL__pc{
    text-align: left;
  }
}

