@charset "utf-8";
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    max-width: 100%;
}

html {
    font-size: 62.5%;
    margin: 0;
    padding: 0;
    height: 100%;
    scroll-behavior: smooth;
}

@font-face {
    font-family: "AC";
    src: url("fonts/Aka-AcidGR-Fifindrel.ttf.woff") format("woff");
  }
body {
    font-family:'Lora', Meiryo,YuGothic, '游ゴシック', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif !important;
    background: url(images/bg.jpg);
    color: #3e3a39;
    font-weight: 500;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.8;
    height: 100%;
    position: relative;
}

a,
a:hover {color: #3e3a39;
    text-decoration: none;
    transition : 0.5s;
}
a:hover{
    opacity: 0.7;
}
img{
    vertical-align: bottom;
}
.ac{
    font-family: "AC",'Lora',Meiryo, YuGothic, '游ゴシック', 'Hiragino Kaku Gothic ProN', sans-serif !important;
}
.mincho {
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif !important;
}
.container{
    max-width: 106rem;
    padding-left: 3rem;
    padding-right: 3rem;
    margin: auto;
}
.sp-only {
    display: none !important;
}

.bgwh {
    background-color: #fff
}
.bb{
    background:linear-gradient(transparent 60%, #FFD8EB 60%);
}
.fadein {
    opacity: 0;
}
.fadein.scrollin {
    opacity: 1;
    transform: translate(0, 0);
}
.fadein01 {
    transform: translate(0, 150px);
    transition: all 700ms;
}
.mt15 {
    margin-top: 1.5rem;
}

.mt30 {
    margin-top: 3rem;
}

.fr {
    float: right;
}
.alignMiddle{
    position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.fl {
    float: left;
}

.tc {
    text-align: center;
}

.tr {
    text-align: right;
}

.row {
    clear: both;
    overflow: hidden;
  }
.ma{
     margin: auto;
  }
  .col-sm-1,
  .col-sm-10,
  .col-sm-11,
  .col-sm-12,
  .col-sm-2,
  .col-sm-3,
  .col-sm-4,
  .col-sm-5,
  .col-sm-6,
  .col-sm-7,
  .col-sm-8,
  .col-sm-9 {
    float: left;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
  
  .col-sm-1 {
    width: 8.333333%;
  }
  
  .col-sm-2 {
    width: 16.66666%;
  }
  
  .col-sm-3 {
    width: 25%;
  }
  
  .col-sm-4 {
    width: 33.3333%;
  }
  .col-sm-5 {
    width:41.66666%;
  }
  .col-sm-6 {
    width: 50%;
  }
  
  .col-sm-7 {
    width: 58.333333%;
  }
  
  .col-sm-8 {
    width: 66.66666%;
  }
  
  .col-sm-9 {
    width: 75%;
  }
  
  .col-sm-10 {
    width: 83.33333%;
  }
  
  .col-sm-12 {
    width: 100%;
  }
  
  .col-sm-offset-1 {
    margin-left: 8.333333%;
  }
  
  .col-sm-offset-2 {
    margin-left: 16.66666%;
  }
  
/* margin
-------------------------------------*/

.m15 {
    margin: 1.5rem;
}

.mt5 {
    margin-top: .5rem;
}

.mt10 {
    margin-top: 1rem;
}

.mt15 {
    margin-top: 1.5rem;
}

.mt20 {
    margin-top: 2rem !important;
}

.mt30 {
    margin-top: 3rem !important;
}

.mt60 {
    margin-top: 6rem !important;
}

.mr5 {
    margin-right: .5rem !important;
}

.mr10 {
    margin-right: 1rem;
}

.mr15 {
    margin-right: 1.5rem;
}

.mr20 {
    margin-right: 2rem;
}

.mr30 {
    margin-right: 3rem;
}

.mb5 {
    margin-bottom: .5rem;
}

.mb10 {
    margin-bottom: 1rem;
}

.mb15 {
    margin-bottom: 1.5rem;
}

.mb20 {
    margin-bottom: 2rem;
}

.mb30 {
    margin-bottom: 3rem;
}

.mb40 {
    margin-bottom: 4rem;
}

.mb50 {
    margin-bottom: 5rem;
}

.mb60 {
    margin-bottom: 6rem;
}

.ml5 {
    margin-left: .5rem;
}

.ml10 {
    margin-left: 1rem;
}

.ml15 {
    margin-left: 1.5rem;
}

.ml20 {
    margin-left: 2rem;
}

.ml30 {
    margin-left: 3rem;
}

/* padding
-------------------------------------*/

.pt5 {
    padding-top: .5rem;
}

.pt10 {
    padding-top: 1rem;
}

.pt15 {
    padding-top: 1.5rem;
}

.pt20 {
    padding-top: 2rem;
}

.pt30 {
    padding-top: 3rem;
}

.pt45 {
    padding-top: 4.5rem !important;
}

.pt60 {
    padding-top: 6rem !important;
}

.pr5 {
    padding-right: .5rem;
}

.pr10 {
    padding-right: 1rem;
}

.pr15 {
    padding-right: 1.5rem;
}

.pr20 {
    padding-right: 2rem;
}

.pr30 {
    padding-right: 3rem;
}

.pb5 {
    padding-bottom: .5rem;
}

.pb10 {
    padding-bottom: 1rem;
}

.pb15 {
    padding-bottom: 1.5rem;
}

.pb20 {
    padding-bottom: 2rem;
}

.pb30 {
    padding-bottom: 3rem;
}

.pb40 {
    padding-bottom: 4rem;
}

.pb50 {
    padding-bottom: 5rem;
}

.pb60 {
    padding-bottom: 6rem;
}

.pb120 {
    padding-bottom: 6rem;
}

.pl5 {
    padding-left: .5rem;
}

.pl10 {
    padding-left: 1rem;
}

.pl15 {
    padding-left: 1.5rem;
}

.pl20 {
    padding-left: 2rem;
}

.pl30 {
    padding-left: 3rem;
}

.p15 {
    padding: 1.5rem;
}

.p30 {
    padding: 3rem;
}

.p40 {
    padding: 4rem;
    overflow: hidden;
}

/* font-size
-------------------------------------*/

.fs8 {
    font-size: 0.8rem;
}

.fs10 {
    font-size: 1rem;
}

.fs11 {
    font-size: 1.1rem;
}

.fs12 {
    font-size: 1.2rem;
}

.fs13 {
    font-size: 1.3rem;
}

.fs14 {
    font-size: 1.4rem !important;
}

.fs16 {
    font-size: 1.6rem;
}

.fs18 {
    font-size: 1.8rem;
}

.fs20 {
    font-size: 2rem;
}

.fs21 {
    font-size: 2.1rem;
}

.fs24 {
    font-size: 2.4rem;
}

.fs28 {
    font-size: 2.8rem;
}

.fs32 {
    font-size: 3.2rem;
}

.b {
    font-weight: bold;
}

.fcRed {
    color: #c30d23;
}

.fcOrange {
    color: #e99a33;
}

.bgRed {
    color: #fff;
    text-align: center;
    background: #c30d23;
    display: inline;
    padding: .5rem;
}

.borderRed {
    border: .3rem solid #c30d23 !important;
    padding: 1.5rem !important;
    font-weight: bold;
}

.borderOrange {
    border: .3rem solid #e99a33 !important;
    padding: 1.5rem !important;
}

.borderOrange h3 {
    font-size: 5.6rem !important;
    padding-top: 1.5rem;
}

.Bshadow {
    box-shadow: 0 .2rem 1.2rem rgba(0, 0, 0, .3);
    -webkit-box-shadow: 0 .2rem 1.2rem rgba(0, 0, 0, .3);
    -moz-box-shadow: 0 .2rem 1.2rem rgba(0, 0, 0, .3);
    -khtml-box-shadow: 0 .2rem 1.2rem rgba(0, 0, 0, .3);
}

.opacity {
    background:rgba(255, 255, 255, 0.9)
}

h1,
header,
footer,
#reccomend,
#menu,
#access {
    width: 100%;
}

header {
    width: 100%;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
}

header h1 {
    color: #fff;
    font-size: 1rem;
    margin: 0;
    padding: 0;
    background: #666;
}

#gnav{
    float: right;
}
#gnav ul{
    height: 6.8rem;
    display: flex;
    align-items: center;
}
#gnav ul li{
    margin: 0 1rem;
}
#gnav ul li a{
    display: block;
    padding: 1rem;
}
#gnav ul li a:hover{
    color: #ff99cc;
}
h2,
h3,
h4,
.navbar-right li a,
.widgettitle,
.price{
    font-family: 'Lora', "游明朝体", "Yu Mincho", YuMincho, serif !important;
}

h2 {
    font-size: 24rem;
    font-weight: normal;
    color: #ccc;
    line-height: 1;
    line-height: 6rem;
    margin-bottom: 6rem;
    text-align: center;
    position: relative;
}

h2 span {
    font-size: 1.8rem;
        color: #3e3a39;
        display: block;
        font-weight: bold;
}
h2:after{
    content: "";
    display: block;
    height: 0.5rem;
    width: 15rem;
    margin: 2rem auto 0;
    background: #ccc;
}
#intro h2:after{
    display: none;
}
#linkBtn{
    font-size: 1.4rem;
    text-align: center;
    position: absolute;
    top: -20vh;
    right: -3.5rem;
    z-index: 9;
    transition : 0.5s;
    background: #fff;
    width: 15rem;
    padding: .5rem 1rem 1rem;
    transform: rotate(-90deg);
    border-radius: 2rem 2rem 0 0;    box-shadow: 0 0.2rem 1.2rem rgb(0 0 0 / 30%);
    -webkit-box-shadow: 0 0.2rem 1.2rem rgb(0 0 0 / 30%);
    -moz-box-shadow: 0 .2rem 1.2rem rgba(0, 0, 0, .3);
    -khtml-box-shadow: 0 .2rem 1.2rem rgba(0, 0, 0, .3);
}

#linkBtn.show{
    position: fixed;
    top: 30vh;
    right: -3.5rem;
}
#linkBtn a{
    display: block;
    margin-top: 0.5rem;
}
#logo {
    float: left;
}

#logo img {
    width: 21rem;
 margin: 1rem 0 0;
}
#intro {
    position: relative;
    z-index: 0;
}

#intro .container {
    height: calc(100vh - 27rem);
}
#intro .scroll{
    display: block;
    width: 8rem;
    font-size: 1.8rem;
    text-align: center;
    margin: 3rem auto;
}
#intro .scroll .fa{
    display: block;
    font-size: 2.4rem;
}
.mainLogo{
    max-width:65rem;
   margin: -3rem auto 3rem;
}
.bg01{
position: relative;
padding-bottom: 50rem;
}
.bg01::before {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100vw;
    height: 100vh;
    background: url(images/bg01.jpg) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
    content: "";
    z-index: -2;
}

.bg02 {
    background: url(images/bg02.jpg);
    position: relative;
}
.bg03{
    background: url(images/bg03.jpg) center top no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    height:90vh;
}


article {
    min-height: 100vh;
    padding: 18rem 0 9rem;
}
.toInsta{
    color: #FFF;
    background: #888;
    font-size: 1.7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 14rem;
    height: 50px;
}
.toInsta:hover{
    opacity: 1;
    color: #FFF;
    background:#ff99cc;
}
#new dl {
    margin-top: 3rem;
}

#new dd {
    border-bottom: .1rem solid #999;
    padding-bottom: 1rem;
    margin: 1rem 0;
}

#about h2,#about h2 span{
    color: #fff;
}
#about .fadein{
    padding: 3rem;
    margin-bottom: 6rem;
    background: rgba(255, 255, 255, 0.9);
}

#menu .row.fadein.fadein01.mb30{
    background: #fff;
    border-left: .3rem solid #ccc;
    margin-bottom: 3rem;
    display: flex;
    align-items: center;
}
#menu dl {
    padding:1.5rem;
    overflow: hidden;
}
#menu .col-sm-4{
    padding: 0;
}
#menu dt {
    font-weight: normal;
    font-size: 2rem;
}

#menu dd {
    clear: both;
    font-size: 2.4rem;
    overflow: hidden;
}



.menuLower {
    padding: 4.5rem 0 3rem;
}

#menu ul {
    text-align: center;
}

#menu li {
    display: inline-block;
    background: url(images/listMark.png) no-repeat;
    background-position: 0 .3rem;
    padding-left: 2.5rem;
    font-size: 1.8rem;
    font-weight: bold;
    margin: .8rem 3%;
}
#voice{
    background: rgba(255,255,255,0.8);
}
#voice h2{
    color: #3e3a39;
}
#voice dl{
    position: relative;
    border-radius: 6rem;
    padding: 4.5rem;
    margin-bottom: 6rem;
    display: inline-block;
    border: 5px solid #ccc;
}
#voice dl:before {
    content: "";
    position: absolute;
    bottom: -50px;
    left: 15%;
    margin-left: -15px;
    border: 20px solid transparent;
    border-top: 30px solid #FFF;
    z-index: 2;
  }
  
  #voice dl:after {
    content: "";
    position: absolute;
    bottom: -58px;
    left: 15%;
    margin-left: -17px;
    border: 22px solid transparent;
    border-top: 32px solid #ccc;
    z-index: 1;
  }
#voice dt{

}
#voice dd{
    text-align: left   ;
margin-bottom: 1rem;
}
#access {
    color: #fff;
    background: #333;
}

#access h2 span,#access a{
    color: #fff;
}
#access .fa {
    font-size: 2.4rem;
}

.ggmap {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}

.bannnerOuter{
    display: flex;
    align-items: center;
    justify-content: center;
}
footer {
    color: #fff;
    background: #454545;
    height: 8rem;
    padding-top: 3rem;
    text-align: center;
}
#page-top{
    position: fixed;
    z-index: 9;
    right: 1rem;
    bottom: -6rem;
    height: 6rem;
    width: 6rem;
    display: flex;
    justify-content: center;
    text-align: center;
    flex-flow: column;
    border-radius: 50%;
    color: #fff;
    background: #3e3a39;;

}
#page-top.show{
    position: fixed;
    bottom: 1rem;
}
#page-top .fa{
    display: block;
    font-size: 2rem;
}
#page-top:hover{
    opacity: 1;
    color: #fff;
    background: #ff99cc;
}
@media screen and (max-width: 768px) {
    .pc-only {
        display: none !important;
    }

    .sp-only {
        display: inherit !important;
    }
    .col-lg-1,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-md-1,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-sm-1,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-xs-1,
    .col-xs-10,
    .col-xs-11,
    .col-xs-12,
    .col-xs-2,
    .col-xs-3,
    .col-xs-4,
    .col-xs-5,
    .col-xs-6,
    .col-xs-7,
    .col-xs-8,
    .col-xs-9 {
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
h2{
    font-size: 16rem;
    line-height: 3rem;
    margin-bottom: 5rem;
}
h2 span{
    margin-top: 2rem;
}
h2:after{
    width: 10rem;
    margin: 2rem auto 0;
    background: #ccc;
}
article {
    min-height: 100vh;
    padding: 12rem 0 6rem;
}
    header.header.sp-only {
      display: flex !important;
      justify-content: space-between;
      height: 6.2rem;
    }
    .acMenu dd li,
    .flexCenter,
    .logo,
    .logo a {
      display: block;
    }
    .logo {
      float: left;
      width: 32%;
      margin: 0.9rem 0 0 3%;
    }
    .logo img {
      width: 10rem;
    }
   #menuButton,
    #menuButton span {
      display: block;
      position: absolute;
    }
    #menuButton {
      width: 5rem;
      height:5rem;
      top: 0;
      right: 0;
      z-index: 999;
      background: #3e3a39;
    }
    #menuButton span {
      height: 0.1rem;
      left: 1rem;
      transition: all 0.4s;
      -webkit-transition: all 0.4s;
      -moz-transition: all 0.4s;
      background: #fff;
      width: 3rem;
    }
    .menuButtonTxt {
      font-size: 1.2rem;
      color: #fff;
      position: absolute;
      bottom: 0.2rem;
      margin: 0;
      width: 100%;
      text-align: center;
    }
    #menuButton span:first-child {
      top: 1.5rem;
    }
    #menuButton span:nth-child(2) {
      top: 2.5rem;
    }
    #menuButton span:nth-child(3) {
      top: 3.5rem;
    }
    #menuButton.active span:first-child {
      width: 2.4rem;
      left: 1.4rem;
      top: 1.4rem;
      background: #fff;
      -webkit-transform: translateY(1rem) rotate(45deg);
      -moz-transform: translateY(1rem) rotate(45deg);
      -ms-transform: translateY(1rem) rotate(45deg);
      transform: translateY(1rem) rotate(45deg);
    }
    #menuButton.active span:nth-child(2) {
      display: none;
    }
    #menuButton.active span:nth-child(3) {
      left: 1.4rem;
      top: 3.4rem;
      width: 2.4rem;
      background: #fff;
      -webkit-transform: translateY(-1rem) rotate(-45deg);
      -moz-transform: translateY(-1rem) rotate(-45deg);
      -ms-transform: translateY(-1rem) rotate(-45deg);
      transform: translateY(-1rem) rotate(-45deg);
    }
    .ac-check:checked+.ac-label+.ac-content, .acMenu dd.visible {
        left: 0;
    }.ac-content, .acMenu dd {
        position: fixed;
        overflow-y: scroll;
        top: 5rem;
        padding: .5rem;
        z-index: 99;
        left: -100%;
        background: rgba(0, 0, 0, .75);
        width: 100%;
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
    }
    #intro .container {
        height: calc(100vh - 18rem);
    }
    .anchor {
      height: 5rem;
      margin-top: -5rem;
    }
    #gnav,
    .gNavi {
      position: relative;
    }
    .container {
      padding-left: 1rem;
      padding-right: 1rem;
      max-width: auto;
      min-width: auto;
    }
    .row {
      margin: auto;
    }
    .col-xs-4 {
      width: 33.333%;
    }
    .col-xs-6 {
      width: 50%;
    }
    .col-xs-8 {
      width: 66.666%;
    }
    .acMenu,
    .acMenu dd li,
    .col-xs-12 {
      width: 100%;
    }
    .col-sm-offset-1,
    .col-sm-offset-2 {
      margin-left: 0;
    }

    #wrap {
        position: relative;
    }

header{
    height:5rem;
}
    #logo img {
        width: 16rem;
        margin-top:.7rem;
    }
    .acMenu dd li{
        margin: 1.5rem 0;
    }
    .acMenu dd li a{
        color: #fff !important;
        padding: 1rem;
    }


    .bg03 {
        background: url(images/bg03.jpg) no-repeat top left;
        background-size: cover;
    }

    .photo {
        float: none;
        width: 100%;
    }

    .prof {
        width: 100%;
        min-height: 18rem;
    }

    #menu .row.fadein.fadein01.mb30 {
       display: block;
    }

    button,
    input,
    optgroup,
    select,
    textarea {
        max-width: 26rem;
        border-radius: .4rem;
        -webkit-border-radius: .4rem;
        /* Safari,Google Chrome用 */
        -moz-border-radius: .4rem;
        /* Firefox用 */
    }

    #voice dl{
        padding: 2rem;
    }
    #voice dl:before,#voice dl:after{
        left: 20%;
    }
    /*footer*/
    footer{
        padding-bottom: 10rem;
    }
    #page-top {
        right: 1rem;
        height: 4.8rem;
        width: 4.8rem;
        font-size: 1.4rem;
        bottom:-6rem;
        }
#page-top.show{
            bottom: 0.4rem;
        }
    #page-top .fa {
        font-size: 1.6rem;
    }
    #linkBtn.show {
        top: auto;
        right: 0;
        bottom: 0;
    }
    #linkBtn {
        right: 0;
        top:auto;
        bottom:-6rem;
        transform: rotate(0);
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: .5rem;
        white-space: nowrap;border-radius: 0;
    }
    #linkBtn p{
        display: flex;
        align-items: center;

    }
    #linkBtn a {
        margin-top: 0;
        margin-left: .5rem;
        max-width: 14rem;
    }
    #linkBtn a .fa{
        display: block;
    }