@charset "utf-8";
/* =============================================================================
   page
   ========================================================================== */
   /* mandala ----------------------*/
   /* header */
.p-mandala__h{
   height: calc(1268/1920*100vw);
   background: url(../../assets/images/mandala/header_bg.jpg);
   background-size: cover;
   margin-bottom: calc(120/1920*100vw);
}
.p-mandala__title{
   position: absolute;
   top:0;
   right:0;
   bottom:0;
   left: 0;
   margin: calc(150/1920*100vw) auto auto auto;
   display: block;
   /* height: 30%; */
   text-align: center;
}
.p-mandala__titleMain{
   display: block;
   font-size: calc(50/1920*100vw);
   font-weight: bold;
}
.p-mandala__titleSub{
   display: block;
   font-size: calc(20/1920*100vw);
   font-style: italic;
   margin-bottom: calc(70/1920*100vw);
}
.p-mandala__titleImg{
   width: calc(734/1920*100vw);
}
@media only screen and (max-width: 1024px) {
   .p-mandala__titleMain{
      font-size: calc(30/1024*100vw);
   }
   .p-mandala__titleSub{
      font-size: calc(20/1024*100vw);
   }
   
}

@media only screen and (max-width: 768px) {
   .p-mandala__h{
      background-repeat: no-repeat;
      background-position: top center;
      margin-top: 0; 
      height: calc(960/750*100vw);
      margin-bottom: calc(120/750*100vw);
   }
   .p-mandala__title{
      margin: auto 0 0 0;
      height: calc(160/750*100vw);
      background-color: rgba(0, 0, 0, .6);
      text-align: center;
      padding-top: calc(40/750*100vw);
      position: relative;
   }
   
   .p-mandala__titleMain{
      font-size: calc(50/750*100vw);
      line-height: 1.0em;
      position: absolute;
      top:0;
      right:0;
      bottom:0;
      left: 0;
      margin: calc(830/750*100vw) auto auto auto;

   }
   .p-mandala__titleSub{
      font-size: calc(20/750*100vw);
      position: absolute;
      top:0;
      right:0;
      bottom:0;
      left: 0;
      margin: calc(890/750*100vw) auto auto auto;
   }
   .p-mandala__titleImg{
      width: calc(630/750*100vw);
      position: absolute;
      top:0;
      right:0;
      bottom:0;
      left: 0;
      margin: calc(50/750*100vw) auto auto auto;
   }
}


.p-mandala__main{
}
@media only screen and (max-width: 768px) {
   .p-mandala__main{
      margin-bottom: calc(120/750*100vw);
   }
}


