@charset "utf-8";

body .container-777_30th{
  font-family:"游ゴシック", YuGothic, "ヒラギノ角ゴ Pro",
    "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}

.container{
  max-width:1240px;
  margin:0 auto;
  padding:0 2rem;
}

.title-h2{
  margin-bottom:1.6rem;
  color:#00146e;
  font-weight:600;
  font-size:2.8rem;
  font-family:"Noto Serif JP", serif;
  line-height:1.6
}

.color-blue{
  color:#00146e;
}

.mv{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -webkit-align-items:center;
      -ms-flex-align:center;
          align-items:center;
  -webkit-box-pack:center;
  -webkit-justify-content:center;
      -ms-flex-pack:center;
          justify-content:center;
  height:300px;
  padding:2rem 1rem;
  background-image:url(/group/777_30th/images/mv_bg_sp.jpg);
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover
}

.mv__title{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -webkit-align-items:center;
      -ms-flex-align:center;
          align-items:center;
  -webkit-box-pack:center;
  -webkit-justify-content:center;
      -ms-flex-pack:center;
          justify-content:center;
  height:100%
}

.mv__title img{
    width:100%;
    max-width:100%;
    max-height:100%;
  }

.contents-777_30th{
  padding:0 0 8rem;
  background-image:url(/group/777_30th/images/bg_sp.jpg);
  background-repeat:no-repeat;
  background-position:right bottom;
  background-size:cover
}

.news{
  padding-top:3.5rem
}

.news__inner{
  max-width:1080px;
  margin:0 auto;
  background:rgba(255, 255, 255, 1);
  border-top:1px solid #ccc;
  border-bottom:1px solid #ccc
}

.news__items{
  list-style:none
}

.news__item{
  margin-bottom:1.6rem
}

.news__item:first-child{
  }

.news__item:last-child{
    margin-bottom:0;
    border-bottom-width:0;
  }

.news__link{
  display:block;
  font-size:1.6rem
}

.news__link:hover,
  .news__link.focus-visible:focus{
    text-decoration:none;
  }

.news__link .image{
    display:block;
    margin-bottom:8px
  }

.news__link .texts{
    display:block
  }

.news__link .label{
    display:inline-block;
    margin-right:5px;
    padding:1px 10px;
    color:#333;
    font-weight:bold;
    font-size:1.25rem;
    line-height:1.5;
    text-align:center;
    vertical-align:middle
  }

.news__link .label.label__interview{
      background-color:#d5f2cd;
    }

.news__link .label.label__event{
      background-color:#ffd8ba;
    }

.news__link .label.label__trivia{
      background-color:#c9ddff;
    }

.news__link .update{
    display:inline-block;
    margin-right:5px;
    padding:1px 5px;
    color:#9a0956;
    font-weight:bold;
    font-size:1.2rem;
    line-height:1.2;
    text-align:center;
    vertical-align:middle;
    border:1px solid #9a0956;
    border-radius:10px
  }

.news__link .date{
    display:block;
    color:#333;
    font-weight:bold;
    font-size:1.3rem;
    text-decoration:none !important
  }

.news__link .text{
    display:block;
    color:#00146e;
    font-weight:bold;
    line-height:1.6;
    text-decoration:underline
  }

.introduction{
}

.introduction__textarea{
  padding-top:4rem
}

.introduction__textarea p{
    font-size:1.5rem
  }

.introduction__image{
  position:relative
}

.information{
  margin-top:6rem
}

.information__inner{
  max-width:708px;
  margin:0 auto
}

.information-list{
  margin-top:2rem;
  font-weight:bold
}

.information-list dt{
    width:100%;
    color:#00146e;
    font-size:1.6rem;
    border-bottom:1px solid #00146e
  }

.information-list dd{
    width:100%;
    font-size:1.6rem
  }

.information-list__row{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
  -webkit-flex-direction:column;
      -ms-flex-direction:column;
          flex-direction:column;
  margin-bottom:2rem
}

.information-list__row:last-child{
    margin-bottom:0;
  }

.information-btn{
  margin-top:4rem;
  text-align:center;
}

.reserve-button{
  position:relative;
  display:inline-block;
  width:100%;
  padding:1.6rem 3rem;
  color:#fff;
  font-weight:bold;
  font-size:1.8rem;
  line-height:1.4;
  vertical-align:middle;
  background:#ff6f00;
  border:none;
  border-radius:0;
  outline:none;
  cursor:pointer;
  -webkit-transition:none;
  -o-transition:none;
  transition:none;
  -webkit-appearance:none;
     -moz-appearance:none;
          appearance:none
}

.reserve-button:hover,
  .reserve-button.focus-visible:focus{
    text-decoration:none;
    opacity:0.7;
  }

.reserve-button .ico{
    position:absolute;
    top:50%;
    right:1.5rem;
    -webkit-transform:translateY(-50%);
        -ms-transform:translateY(-50%);
            transform:translateY(-50%);
  }

.information__footer{
  margin-top:6rem;
}

.information__footer-text{
  color:#00146e;
  font-weight:600;
  font-size:1.6rem;
  font-family:"Noto Serif JP", serif;
  line-height:1.6;
  text-align:center
}

.sns-link > :nth-child(1),
  .sns-link > :nth-child(4){
    border-left:none;
  }

html[lang="en"] .sns-link .sns-link__item a{
        padding-right:10px;
        padding-left:10px;
      }

 .header{
  height:60px;
  background-image:url(/group/777_30th/images/hd_bg_sp.jpg);
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover
} 

.hd__title{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -webkit-align-items:center;
      -ms-flex-align:center;
          align-items:center;
  max-width:1080px;
  height:100%;
  margin:0 auto;
  text-align:left
}

.hd__title img{
  }

.breadcrumb{
  padding:8px 0 8px 2rem;
  overflow:hidden;
  font-size:1.35rem;
  background-color:#e9f5ff
}

.breadcrumb ul{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    max-width:1080px;
    margin-right:auto;
    margin-left:auto;
    white-space:nowrap;
    list-style:none
  }

.breadcrumb ul li:after{
        display:inline-block;
        margin-right:5px;
        margin-left:5px;
        content:">";
      }

.breadcrumb ul li:last-of-type:after{
          content:"";
        }

.breadcrumb ul li a{
        text-decoration:underline;
      }

.event__list{
  position:relative;
  padding:1.6rem 0.8rem
}

.event__list:before{
    position:absolute;
    top:3rem;
    left:10%;
    width:calc(90% - 0.8rem);
    border-top:1px solid #8b92ae;
    content:""
  }

.event__list .list__title{
    position:relative;
    display:inline-block;
    padding-right:0.6em;
    color:#00146e;
    font-weight:bold;
    font-size:2.2rem;
    background-color:#fff;
  }

.event__list .news__items{
    padding-top:1rem;
    padding-right:0;
    padding-left:0;
    border-top-width:0
  }

.back__button{
  display:inline-block;
  width:100%;
  margin-bottom:30px;
  text-align:center;
  border:1px solid #00146e
}

.back__button a{
    position:relative;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -webkit-align-items:center;
        -ms-flex-align:center;
            align-items:center;
    -webkit-box-pack:center;
    -webkit-justify-content:center;
        -ms-flex-pack:center;
            justify-content:center;
    height:5.5rem;
    font-weight:bold;
    line-height:1
  }

.back__button a:before{
      position:absolute;
      top:calc(50% - 0.6em);
      left:20px;
      display:block;
      font-weight:400;
      font-size:0.5em;
      font-family:anagroup-icons;
      font-style:normal;
      font-variant:normal;
      line-height:1;
      text-transform:none;
      -webkit-transform:rotate(180deg);
          -ms-transform:rotate(180deg);
              transform:rotate(180deg);
      content:"\EA16";
      -webkit-font-feature-settings:normal;
      font-feature-settings:normal;
      speak:none;
      -webkit-font-smoothing:antialiased;
    }

.back__button a:hover{
      color:#fff;
      text-decoration:none;
      background-color:#00146e
    }

.back__button a:hover:before{
        color:#fff;
      }

.event{
}

.event__inner{
  max-width:1080px;
  margin:0 auto;
  padding:1.6rem 0.8rem;
  background:#fff
}

.event__content{
  padding:1.6rem 0.8rem
}

.event__img{
  display:block;
  margin-top:30px
}

.event__img img{
    width:100%;
  }

.img__caption{
  padding-top:0.4rem;
  font-size:1.2rem;
  line-height:1.6;
}

.event__labels{
  margin-top:20px;
}

.event__label{
  display:inline-block;
  width:160px;
  margin-right:5px;
  padding:1px 3px;
  font-weight:bold;
  font-size:1.35rem;
  line-height:1.6;
  text-align:center;
  vertical-align:middle
}

.event__label.label__interview{
    background-color:#d5f2cd;
  }

.event__label.label__event{
    background-color:#ffd8ba;
  }

.event__label.label__trivia{
    background-color:#c9ddff;
  }

.label__update{
  display:inline-block;
  width:120px;
  margin-right:5px;
  padding:1px 2px;
  color:#00146e;
  font-size:1.2rem;
  line-height:1.4;
  text-align:center;
  vertical-align:middle;
  border:1px solid #8b92ae;
  border-radius:3px;
}

.trivia__labels{
  padding-bottom:10px;
  border-bottom:1px solid #8b92ae;
}

.trivia__label{
  display:inline-block;
  max-width:176px;
  margin-right:25px;
  vertical-align:middle
}

.trivia__update{
  display:inline-block;
  margin-top:10px;
  margin-bottom:10px;
  padding-top:10px;
  padding-left:25px;
  color:#00146e;
  font-size:1.3rem;
  font-family:"Noto Serif JP", serif;
  vertical-align:middle;
  /* border-left:1px solid #8b92ae; */
}

.event__title{
  color:#00146e;
  font-weight:bold;
  font-size:2.4rem
}

.event__text{
  margin-top:30px;
}

.content__2column{
}

.content__2column .inner{
  }

.content__2column_1-3{
}

.content__2column_1-3 .inner_2-3{
    margin-bottom:1.5rem
  }

.gallery{
  margin-top:35px
}

.gallery__container{
}

.gallery__items{
  margin-right:-6px;
  margin-left:-6px;
  padding:0;
  list-style:none
}

.gallery__item{
  width:50%;
  margin-bottom:12px;
  padding-right:6px;
  padding-left:6px
}

.gallery__item img{
    width:100%;
  }

.gallery__button{
  padding:0;
  background-color:transparent;
  border:none;
  outline:none;
  cursor:pointer;
  opacity:1;
  -webkit-transition:0.3s;
  -o-transition:0.3s;
  transition:0.3s;
  -webkit-appearance:none;
     -moz-appearance:none;
          appearance:none
}

.gallery__button:focus,
  .gallery__button:hover{
    opacity:0.8;
  }

.gallery-modal{
  height:0;
  visibility:hidden
}

.modaal-wrapper .gallery-modal{
    height:auto;
    visibility:visible
}

.gallery-modal__container{
}

.gallery-modal__items{
  position:relative
}

.gallery-modal__items .slick-arrow{
    position:absolute;
    top:50%;
    z-index:1;
    width:44px;
    height:44px;
    padding:0;
    overflow:hidden;
    font-size:0;
    text-indent:-9999px;
    background:#00146e;
    border:none;
    border-radius:100px;
    outline:none;
    -webkit-transform:translateY(-22px);
        -ms-transform:translateY(-22px);
            transform:translateY(-22px);
    cursor:pointer;
    -webkit-appearance:none;
       -moz-appearance:none;
            appearance:none
  }

.gallery-modal__items .slick-arrow:before{
      position:absolute;
      top:50%;
      left:50%;
      display:block;
      width:10px;
      height:16px;
      background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2219.093%22%20viewBox%3D%220%200%2012%2019.093%22%3E%20%3Cpath%20d%3D%22M180.311%2C685.982l8.409-7.776-8.444-7.805%2C1.773-1.774%2C10.227%2C9.543-10.227%2C9.55Z%22%20transform%3D%22translate(-180.276%20-668.627)%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
      background-size:100% 100%;
      content:"";
    }

.gallery-modal__items .slick-prev{
    left:-20px
  }

.gallery-modal__items .slick-prev:before{
      -webkit-transform:translate(-50%, -50%) rotate(-180deg);
          -ms-transform:translate(-50%, -50%) rotate(-180deg);
              transform:translate(-50%, -50%) rotate(-180deg);
    }

.gallery-modal__items .slick-next{
    right:-20px
  }

.gallery-modal__items .slick-next:before{
      -webkit-transform:translate(-50%, -50%);
          -ms-transform:translate(-50%, -50%);
              transform:translate(-50%, -50%);
    }

.gallery-modal__item{
  -webkit-transition:opacity 0.3s;
  -o-transition:opacity 0.3s;
  transition:opacity 0.3s
}

.gallery-modal__item img{
    width:100%;
  }

.gallery-modal__items.is-open .gallery-modal__item{
    opacity:1
}

.gallery-modal__close-btn{
  position:relative;
  right:0;
  display:inline-block;
  padding:2px 5px;
  color:#00146e;
  background-color:#fff;
  border:none;
  outline:none;
  cursor:pointer;
  opacity:1;
  -webkit-transition:0.3s;
  -o-transition:0.3s;
  transition:0.3s;
  -webkit-appearance:none;
     -moz-appearance:none;
          appearance:none
}

.gallery-modal__close-btn .icon{
    margin-right:5px;
  }

.gallery-modal__header{
  margin-bottom:10px;
  text-align:right;
}

.gallery-modal__footer{
  margin-top:30px;
}

.gallery-modal__footer-close-btn{
  position:relative;
  display:block;
  width:100%;
  max-width:320px;
  margin:auto;
  padding:8px 15px;
  color:#00146e;
  background-color:#fff;
  border:none;
  border:1px solid #00146e;
  outline:none;
  cursor:pointer;
  opacity:1;
  -webkit-transition:0.3s;
  -o-transition:0.3s;
  transition:0.3s;
  -webkit-appearance:none;
     -moz-appearance:none;
          appearance:none
}

.gallery-modal__footer-close-btn .icon{
    position:absolute;
    right:15px;
  }

.gallery-modal-item__title{
  margin-top:15px;
}

.gallery-modal-item__title-label{
  margin:0 !important;
  color:#00146e;
  font-weight:bold;
  font-size:1.4rem;
}

.modaal-outer-wrapper,
.modaal-inner-wrapper{
  display:-webkit-box !important;
  display:-webkit-flex !important;
  display:-ms-flexbox !important;
  display:flex !important;
  -webkit-box-align:center;
  -webkit-align-items:center;
      -ms-flex-align:center;
          align-items:center;
  -webkit-box-pack:center;
  -webkit-justify-content:center;
      -ms-flex-pack:center;
          justify-content:center;
}

.modaal-inner-wrapper{
}

.modaal-container{
  max-width:700px !important;
  max-height:100%;
  margin:0 !important;
  overflow-x:hidden;
  overflow-y:auto;
}

.modaal-content-container{
  padding:20px !important;
  padding-top:10px !important
}

.modaal-close{
  display:none;
}

.gallery-modal-item{
}

.modaal-outer-wrapper{
  opacity:0 !important;
  -webkit-transition:0.3s;
  -o-transition:0.3s;
  transition:0.3s;
}

.modaal-outer-wrapper.is-active{
  opacity:1 !important;
}

@media only screen and (min-width: 768px){

.title-h2{
    font-size:3.2rem
}

.mv{
    height:400px;
    background-image:url(/group/777_30th/images/mv_bg_pc.jpg)
}

.contents-777_30th{
    padding:0 0 12rem;
    background-image:url(/group/777_30th/images/bg_pc.jpg)
}

.news{
    padding-top:5.4rem
}

.news__inner{
    padding:3rem 3rem
}

.news__items{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
            flex-wrap:wrap;
    -webkit-box-pack:start;
    -webkit-justify-content:flex-start;
        -ms-flex-pack:start;
            justify-content:flex-start;
    margin:-1.5rem
}

.news__item{
    width:25%;
    padding:1.5rem
}

.introduction__inner{
}

.introduction__textarea{
    margin-right:auto;
    margin-left:auto;
    padding-top:5rem
}

.introduction__textarea p{
      font-size:1.6rem
  }

.information{
    margin-top:10rem
}

.information__inner{
}

.information-list{
    margin-top:4rem
}

.information-list dt{
      -webkit-box-flex:0;
      -webkit-flex:none;
          -ms-flex:none;
              flex:none;
      width:132px;
      font-size:1.8rem;
      border-bottom:none
  }

.information-list__row{
    position:relative;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -webkit-flex-direction:row;
        -ms-flex-direction:row;
            flex-direction:row;
    -webkit-box-align:center;
    -webkit-align-items:center;
        -ms-flex-align:center;
            align-items:center;
    border-bottom:1px solid #cccccc
}
    .information-list__row::after{
      position:absolute;
      top:100%;
      left:0;
      width:110px;
      height:1px;
      background:#00146e;
      content:"";
    }

.reserve-button{
    max-width:326px
}

.information__footer-text{
    font-size:3.2rem
}

html[lang="en"] .sns-link .sns-link__item{
        -webkit-box-pack:center;
        -webkit-justify-content:center;
            -ms-flex-pack:center;
                justify-content:center
    }

html[lang="en"] .sns-link > :nth-child(4){
        border-left:1px solid #d4d4d4
    }

 .header{
    height:100px;
    background-image:url(/group/777_30th/images/hd_bg_pc.jpg)
} 

.event__list{
    padding:0
}

.event__list:before{
      top:1.8rem;
      left:0;
      width:100%
  }

.event__list .news__items{
      border-bottom-width:0
  }

.back__button{
    margin-top:20px
}

.event__inner{
    padding:3.2rem 3.7rem
}

.event__content{
    max-width:880px;
    margin:0 auto;
    padding:0 0 3.2rem 0
}

.event__img{
}

.event__title{
    font-size:3rem
}

.content__2column{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -webkit-justify-content:space-between;
        -ms-flex-pack:justify;
            justify-content:space-between;
    margin-bottom:0
}

.content__2column > *{
      width:49%
  }

.content__2column_1-3{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -webkit-justify-content:space-between;
        -ms-flex-pack:justify;
            justify-content:space-between;
    margin-bottom:0
}

.content__2column_1-3 .inner_2-3{
      width:66%
  }

.content__2column_1-3 > .inner_1-3{
      width:33%
  }

.gallery{
    margin-top:45px
}

.gallery__items{
    margin-right:-12px;
    margin-left:-12px
}

.gallery__item{
    width:33.3%;
    margin-bottom:24px;
    padding-right:12px;
    padding-left:12px
}

.gallery-modal__items .slick-arrow{
      width:44px;
      height:44px
  }

.gallery-modal__items .slick-prev{
      left:-50px
  }

.gallery-modal__items .slick-next{
      right:-50px
  }

.modaal-content-container{
    padding-top:15px !important;
    padding-right:60px !important;
    padding-left:60px !important
}
  }

@media only screen and (min-width: 0px) and (max-width: 767px){

.news__item{
    padding-bottom:1.6rem;
    border-bottom:1px solid #ccc
}

.news__link{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -webkit-justify-content:space-between;
        -ms-flex-pack:justify;
            justify-content:space-between
}

.news__link .image{
      width:33%;
      margin-bottom:0
  }

.news__link .texts{
      width:63%
  }

.news__link .label{
      font-size:1rem
  }

.news__link .update{
      font-size:1rem
  }

.news__link .date{
      font-size:1.2rem
  }

.news__link .text{
      font-size:1.4rem
  }

.information-list dd{
      margin-top:1rem
  }

.hd__title{
    margin-left:2rem
}

.hd__title img{
      width:75%
  }

.event__container{
    padding:0
}

.trivia__label{
    width:45%
}
  }

@media only screen and (min-width: 768px) and (max-width: 1024px){

.introduction__image{
    left:-3rem;
    width:50%
}

.back__button{
    width:60%;
    max-width:350px
}
  }

@media only screen and (min-width: 1025px){

.introduction__image{
    left:-6rem
}

html[lang="en"] .sns-link .sns-link__item{
        width:20%
    }

.breadcrumb{
    padding:8px 0
}

.back__button{
    width:40%;
    max-width:350px
}
  }
