
@media screen and (min-width:1200px) {
  /* ネガティブマージン 設定
  ---------------------------------------- */
  .mt-20{
    margin-top: -20px !important;
  }
  .mt-5{
    margin-top: -5px !important
  }
}

@media screen and (max-width:1200px) {
  /* 共通CSS
  ---------------------------------------------------------- */
  /* リンクスタイル */
  .btnSty--cart {
    border: solid 1px #FFF;
    padding: 15px 20px;
    background: #000 url(images/common/ico_cart.svg) no-repeat right 20px center!important;
    background-size: 25px!important;
  }
  .btnSty--contact {
    border: solid 1px #FFF;
    padding: 15px 20px;
    background: #000 url(images/common/ico_contact.png) no-repeat right 20px center!important;
    background-size: 25px!important;
  }

  /* パンくず */
  .breadCrumb {
    display: none;
  }

  /* 下層ページタイトルh1 */
  .subPageTitleH1 {
    margin: 0px auto 20px;
  }

  /* フッター
  ---------------------------------------- */
  .footerNavBox{
    width:100%;
    margin:0 auto;
    padding:0 3.9%;
    display: flex;
    justify-content: space-between;
    box-sizing:border-box;
    flex-wrap:wrap;
    color:#FFF;
  }
  .footerNavBox .footerNavBox__col {
    max-width:32%;
    width:32%;
    margin-bottom:25px;
  }

  /* コンセプト
  ---------------------------------------- */
  .conceptSlider .slick-prev  {
    left: -20px;
  }
  .conceptSlider .slick-next  {
    right: -20px;
  }

  /* ヘッダー
  ---------------------------------------- */
  /* ヘッダー黒帯 */
  .headerBlockTop {
    padding: 8px 20px;
  }
  .headerBlockTop__language,
  .headerBlockTop__onlineShop,
  .headerBlockTop__search {
    display: none;
  }

  /* ヘッダー白帯 */
  .headerBlockBottom__logo {
    width: 30%;
  }
  .headerBlockBottom__logo img {
    max-width:255px;
    width:100%;
    height:auto;
  }
  .headerBlockBottom__nav {
    width: 70%;
  }
  .headerBlockBottom__nav--pc {
    display: none;
  }
  .headerBlockBottom__nav--sp {
    display: block;
  }
  /* ハンバーガーメニュー */
  .menuTrigger {
    width: 30px;
    height: 40px;
    position: absolute;
    right: 20px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .menuTrigger span,
  .menuTrigger span::before,
  .menuTrigger span::after {
    display: block;
    transition: all 0.4s;
    box-sizing: border-box;
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #000;
    border-radius: 4px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .menuTrigger span::before,
  .menuTrigger span::after {
    content: '';
  }
  .menuTrigger span::before {
    top: -9px;
  }
  .menuTrigger span::after {
    top: 10px;
  }
  .headerSpMenu {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0px;
    padding-top: 0px;
    background-color: rgba(0,0,0,0.9);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    opacity: 0;
    pointer-events: none;
    z-index: 3;
    -webkit-transition: opacity 0.6s cubic-bezier(0.52, 0.08, 0.18, 1);
    transition: opacity 0.6s cubic-bezier(0.52, 0.08, 0.18, 1);
    padding-top: 50px;
  }
    body.is-navShow,
    html.is-navShow {
    overflow: hidden;
  }
   .is-navShow .headerSpMenu {
    opacity: 1;
    pointer-events: auto;
    z-index: 100;
  }
  .menuToggle {
    display: block !important;
    z-index: 99999;
    position: absolute;
    right: 0px;
    top: 0px;
    background: transparent;
    border: none;
    padding: 15px;
  }
  .menuToggle img {
    width: 30px;
  }
  .menuToggle:before {
    display: none;
  }
  .menuToggle:focus {
    outline: none;
  }
  .menuToggle.close,
  .menuToggle.show {
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
  }
  .menuToggle.close {
    opacity: 0!important;
  }
  .menuToggle.close img {
    height: 22px;
    width: auto;
    margin-right: 4px;
    margin-bottom: 0px;
  }
  .scrollOverFlow {
    height: calc(100vh - 150px);
    overflow-y: scroll;
    overflow-x: hidden;
  }
  .scrollOverFlow_inner {
    padding: 0 25px;
    box-sizing: border-box;
  }
  .breadCrumbSp {
    margin-bottom: 20px;
  }
  .breadCrumbSp li {
    display: inline-block;
    font-size: 12px;
    color: #FFF;
    padding: 0 15px 0 0!important;
    background: url(images/common/ico_arr_spmenu.png) no-repeat right center;
    background-size: 5px;
    margin-right: 10px;
  }
  .breadCrumbSp li:last-child {
    background: none;
    padding-right: 0;
    margin-right: 0;
  }
  .searchBoxSp {
    margin-bottom: 25px;
  }
  input.searchAreaSp__box__text {
    border-radius: 20px;
    border: none;
    padding: 0px 10px;
    font-size: 17px;
    height: 30px;
    width: 100%;
    box-sizing: border-box;
    line-height:30px;
  }
  .searchAreaSp__box {
    position: relative;
  }
  .searchAreaSp__box__button {
    position: absolute;
    right: 0px;
    top: 0px;
    padding-right: 10px;
    z-index: 999;
    background: transparent;
    border: none;
    bottom: 0;
  }
  .searchAreaSp__box__button img {
    width: 18px;
    margin-top: -3px;
  }
  .headerSpMenu ul li {
    padding-top: 16px;
    padding-bottom: 16px;
    font-size: 13px;
  }
  .headerSpMenu ul li a {
    color: #FFF;
    font-weight: normal;
    text-decoration: none;
  }
  .headerSpMenu ul li span {
    color: #FFF;
    font-weight: normal;
    display: block;
    cursor: pointer;
  }
  ul.headerSp__language li span {
    background: url(images/common/ico_language.svg) no-repeat left center;
    background-size: 17px;
    padding-left: 25px;
  }
  .headerSpMenu ul li ul {
    padding: 25px 0 0 25px;
    display: none;
    transition: none;
  }
  .headerSpMenu ul li ul li:last-child {
    padding-bottom: 0;
  }
  .headerSpMenu ul li ul li a {
    color: #DDD;
  }
  .headerSpMenu ol li {
    padding-top: 25px;
  }

  .scrollOverFlow_inner  .li-border-bottom {
    border-bottom: 1px solid #666666;
  }
  .scrollOverFlow_inner .item-collapse {
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: transform 2s ease-in-out;
  }
  .scrollOverFlow_inner .item-collapse .svg-collapse {
    transform: rotate(180deg);
  }
  .scrollOverFlow_inner .active .svg-collapse {
    transform: rotate(0deg);
  }
} /* End Media 1200px */

@media screen and (max-width:767px) {

  /* 共通CSS
  ---------------------------------------------------------- */
  .pc, .pc-inline {
    display: none;
  }
  .sp {
    display: block;
  }
  .sp-inline {
    display: inline;
  }
  .contents:last-child section:last-child {
    margin-bottom: 130px!important;
  }
  .box {
    margin-bottom: 40px;
  }
  .section {
    margin-bottom: 60px;
  }
  .container {
    margin-bottom: 30px;
  }
  .case {
    margin-bottom: 20px;
  }
  #contactForm7Box .case {
    margin-bottom: 30px;
  }
  .mbClear--sp {
    margin-bottom: 0!important;
  }

  /* フォントサイズ */
  .fontSize10--sp {
    font-size: 10px!important;
  }
  .fontSize14--sp {
    font-size: 14px!important;
  }
  .fontSize16--sp {
    font-size: 16px!important;
  }
  .fontSize18--sp {
    font-size: 18px!important;
  }
  .fontSize22--sp {
    font-size: 22px!important;
  }

  /* リンクスタイル */
  .btnSty {
    height: 50px;
    line-height:50px;
    padding-top:0;
    padding-bottom:0;
  }
  .btnStyOutLine {
    height: 50px;
    line-height:50px;
    padding-top:0;
    padding-bottom:0;
  }
  .btnSize--small {
    max-width: 100%;
  }
  .btnExhibition {
    margin: 0 auto;
    max-width: inherit;
  }

  /* align設定 */
  .textCenterSP {
    text-align: center;
  }

  /* 下層ページタイトルh1 */
  .subPageTitleH1 {
    font-size: 24px;
    margin: 0 auto 35px;
    padding: 20px 20px 0;
    line-height:1.4em;
  }

  .subPageTitleH1.detail {
    padding-top: 5px;
    margin-bottom: 40px !important;
  }

  /* 下層ページタイトルh3 */
  .subPageTitleH3 {
    font-size: 18px;
  }

  /* テーブルスタイル */
  .tbSty th {
    width: 100%;
    display: block;
    padding: 30px 0 20px;
    border-bottom: none;
  }
  .tbSty td {
    width: 100%;
    display: block;
    padding: 0 0 30px;
  }
  .tbSty tr td:first-child {
    padding-top: 30px;
  }

  /* 2カラム左画像小 */
  .colPicBox--small .imgBox {
    max-width: 80px;
    width: 24%;
    padding-right: 6%;
  }
  .colPicBox--small .textBox {
    max-width: 70%;
    width: 70%;
  }
  .colPicBoxTitle{
    font-size:16px;
  }

  /* 2カラム（画像） */
  .col2Box {
    display: block;
  }
  .col2Box .col {
    width: 100%;
    max-width: 100%;
    margin-right: 0%;
    margin-top: 30px;
  }
  .col2Box .col:nth-child(2) {
    margin-top: 30px;
  }
  .bgCollectionLink .col2Box .col:nth-child(2) {
    margin-top: 30px;
  }

  /* 4カラム（画像） */
  .col4Box .col {
    width: 48%;
    max-width: 48%;
    margin-right: 4%;
    margin-top: 20px;
  }
  .col4Box .col:nth-child(even) {
    margin-right: 0;
  }
  .col4Box .col:nth-child(3),
  .col4Box .col:nth-child(4){
    margin-top: 20px;
  }

  /* カルーセルスライダー */
  .slideBox__col {
    padding: 0;
    margin-bottom: 20px;
  }
  .slideBox__col:last-child {
    margin-bottom: 0;
  }

  /* モーダルウィンドウ */
  .modal_inner {
    margin: 0 30px;
  }
  .modal_content {
    padding: 30px;
  }
  .modal.modalIndex .modal_content {
    padding: 40px 20px;
  }
    .modal.modalIndex .modal_content section {
    max-height: 50vh;
  }
  .modalClose {
    top: 30px;
    right: 30px;
    width: 30px;
  }

  /* フォームスタイル */
  .submitArea input[type="submit"] {
    max-width: 300px;
    width: 100%;
  }
  .bacyBtArea button[type="button"] {
    max-width: 300px;
    width: 100%;
  }
  .seletBox{
    background-size:10px auto;
  }

  .press_date {
    width: 100%;
  }

  /* ヘッダー
  ---------------------------------------- */
  /* ヘッダー白帯 */
  .headerBlockBottom__logo {
    width: 73%;
  }
  .headerBlockBottom__logo img {
    max-width: 254px;
  }
  .headerBlockBottom__nav {
    width: 32%;
  }

  /* フッター
  ---------------------------------------- */
  footer {
    padding: 50px 0;
  }
  .footerBox{
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    display: block;
    padding: 0 20px;
  }
  .footerBox .trigger{
    cursor: pointer;
    color: #FFF;
    height: 30px;
  }
  .footerBox .trigger span {
    display: inline-block;
    width: 30px;
    height: 30px;
    position: relative;
    margin-right: 20px;
    vertical-align: middle;
  }
  .footerBox .trigger span em:first-child {
    width: 18px;
    height: 2px;
    display: block;
    position: absolute;
    background: #FFF;
    bottom: 14px;
    left: 0;
    transform: rotate(45deg);
  }
  .footerBox .trigger span em:nth-child(2) {
    width: 2px;
    height: 18px;
    display: block;
    position: absolute;
    background: #FFF;
    bottom: 6px;
    right: 9px;
    transform: rotate(45deg);
  }
  .footerBox .trigger.active span em:first-child {
    width: 30px;
    display: block;
    position: absolute;
    background: #FFF;
    transform: rotate(135deg);
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
  }
  .footerBox .trigger.active span em:nth-child(2) {
    height: 30px;
    transform: rotate(135deg);
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
  }
  .footerBox .footerBox--acordion{
    display: none;
    transition: none;
    margin: 45px auto 0;
  }
  .footerBox__col {
    width: 100%;
    display: block;
  }
  .footerBox__navSp{
    padding-bottom:15px;
  }
  .footerBox__navSp li{
    margin-bottom:20px;
  }
  .footerBox__navSp li a{
    color:#FFF;
  }
  .footerBoxTitle {
    text-align: center;
    color:#FFF;
    margin-bottom: 20px;
  }
  footer .btnSty--cart {
    padding: 0px 20px;
  }
  .footerBoxSns {
    padding-bottom: 45px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width:206px;
    margin:0 auto;
  }
  .footerBoxSns li {
    width:15.3%;
  }
  .footerBoxSns li img {
    width: 100%;
  }
  .copyrightBoxSp {
    margin-top: 50px;
    padding: 0 20px;
  }
  .copyrightBoxSp .copyrightBox_text {
    margin-top: 45px;
    font-size:10px;
  }
  .copyrightBoxSp .copyrightBox_image {
    max-width: 205px;
    width: 61.2%;
    margin-bottom: 25px;
  }


  /* margin-bottom設定
  ---------------------------------------- */

  .mb0--sp{
    margin-bottom:0px!important;
  }
  .mb5--sp{
    margin-bottom:5px!important;
  }
  .mb10--sp{
    margin-bottom:10px!important;
  }
  .mb15--sp{
    margin-bottom:15px!important;
  }
  .mb20--sp{
    margin-bottom:20px!important;
  }
  .mb25--sp{
    margin-bottom:25px!important;
  }
  .mb30--sp{
    margin-bottom:30px!important;
  }
  .mb35--sp{
    margin-bottom:35px!important;
  }
  .mb40--sp{
    margin-bottom:40px!important;
  }
  .mb45--sp{
    margin-bottom:45px!important;
  }
  .mb50--sp{
    margin-bottom:50px!important;
  }
  .mb55--sp{
    margin-bottom:55px!important;
  }
  .mb60--sp{
    margin-bottom:60px!important;
  }
  .mb65--sp{
    margin-bottom:65px!important;
  }
  .mb70--sp{
    margin-bottom:70px!important;
  }
  .mb75--sp{
    margin-bottom:75px!important;
  }
  .mb80--sp{
    margin-bottom:80px!important;
  }
  .mb85--sp{
    margin-bottom:85px!important;
  }
  .mb90--sp{
    margin-bottom:90px!important;
  }
  .mb95--sp{
    margin-bottom:95px!important;
  }
  .mb100--sp{
    margin-bottom:100px!important;
  }
  .mb130--sp{
    margin-bottom:130px!important;
  }
  .mb140--sp{
    margin-bottom:140px!important;
  }

  /* ネガティブマージン 設定
  ---------------------------------------- */
  .mt-10--sp{
    margin-top: -10px !important;
  }

  /* テンプレート 設定
  ---------------------------------------- */

  .colFlexBox__spNoFlex{
    display:block;
  }
  .colFlexBox__spCol {
    flex-direction: column;
  }
  .colFlexBox__sp2Col{
    flex-wrap:wrap;
  }
  .slideContents{
    margin:0 0px !important;
  }

  .colFlexBox__spNoFlex .w460{
    max-width:100%;
    width:100%;
  }
  .colFlexBox__spNoFlex .w300{
    max-width:100%;
    width:100%;
  }
  .colFlexBox__sp2Col .w210{
    max-width:48%;
    width:48%;
  }
  .w225{
    max-width:48%;
    width:48%;
    margin-bottom:20px;
  }
  .w340Img{
    width:100%;
  }
  .w340Txt{
    width:100%;
  }
  .w160Img{
    width:23.9%;
  }
  .w160Txt{
    width:70.1%;
  }

  .tempListDl dl{
    display: block;
  }
  .tempListDl dl dt{
    width:100%;
    font-size:16px;
    margin-bottom:10px;
  }
  .tempListDl dl dd{
    width:100%;
  }

  ul.tempListUl li{
      display: block;
  }
  .tempListUl__box{
    width:100%;
    margin-bottom:10px;
  }
  .tempListUl__box--txt{
    width:100%;
  }


  /* 投稿系ページ 設定
  ---------------------------------------- */
  /*右→ボタン*/
  a.arrowBt{
    max-width: inherit;
  }
  a.btnSty--gray, .userListBox a.arrowBt{
    max-width: inherit;
  }
  /*PDF リンクリスト*/
  ul.pdfLinkList li a{
    display:block;
  }
  .pdfLinkList__box--day{
    width:100%;
      margin-bottom:10px;
  }
  .pdfLinkList__box{
    width:100%;
  }

  /*右側に2つのリンクボタン*/
  ul.right2BtList{
    display: block;
  }
  ul.right2BtList li{
    width:100%;
  }
  ul.right2BtList li:nth-child(1){
    display:none;
  }
  ul.right2BtList li:nth-child(3){
    display: block;
    margin-top:20px;
  }

  /*ページ下部グレイエリア*/
  .grayArea{
    padding:20px 30px;
  }

  /*画像ループリスト*/
  .imgLoopConrenrs .col{
    width:48%;
    margin-bottom:15px;
    margin-right:4%;
  }
  .imgLoopConrenrs .col:nth-child(2n){
    margin-right:0;
  }



  /* 問い合わせ 設定
  ---------------------------------------- */

  a.contactFaqBt{
    left: 50%;
    transform: translate(-50%, 0);
  }

  /* 検索・404 設定
  ---------------------------------------- */

  .searchFormBox{
    display:block;
  }
  .searchFormBoxText{
    width:100%;
    margin-bottom:15px;
  }
  .searchFormBoxSubmit{
    width:100%;
  }
  .searchFormBoxSubmit input[type="submit"]{
    max-width:100%;
    width:100%;
  }
  a.arrowBtBk{
    padding:0px 40px 0px 20px;
    color:#FFF;
    height:50px;
    line-height:50px;
  }
  .box404{
    font-size:10vw;
    line-height:1em;
  }

/* チケット用モーダル 設定
---------------------------------------- */
.modalMainContenstTiketModal__box{
  width:90%;
  padding: 20px;
}
  /* 活動レポート用モーダル 設定
  ---------------------------------------- */

  dl.reportModalTri dt div.trimBox:hover{
    opacity: 1;
  }

  /* コンタクトフォーム7 設定
  ---------------------------------------- */
  #contactForm7Box .bacyBtArea input[type="button"] {
    max-width: 300px;
    width: 100%;
  }

  /* 当館について 設定
  ---------------------------------------- */
  .aboutmuseumH2{
    font-size: 22px !important;
  }


} /* End Media 767px */

