@charset "UTF-8";
@media all and (max-width: 680px) {
  article {
    max-width: 100vw;
  }
  /*-- 一覧ページ --*/
  .ms-bn .view-header h2 {
    text-align: center;
    font-size: 5vw;
    padding: 0 0 2em;
  }
  .ms-bn .item-list {
    width: 94vw;
    margin: auto;
    padding: 0 0 30vw;
    background: url(img/ms-bu-ill.webp) bottom right no-repeat;
    background-size: 40vw;
  }
  .ms-bn .item-list ul {
  }
  .ms-bn .item-list ul li {
    padding: 0 0 6vw;
  }
  .ms-bn .item-list ul li dl {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: end;
    font-size: 3.8vw;
  }
  .ms-bn .item-list ul li dl dt {
    width: 24%;
  }
  .ms-bn .item-list ul li dl dt img {
    width: 100%;
  }
  .ms-bn .item-list ul li dl dd {
    width: 75%;
  }
  .ms-bn .item-list ul li dl dd span {
    display: block;
    line-height: 1em;
  }
  .ms-bn nav.pager {
    font-size: 3.6vw;
    padding: 1em 0;
  }
  .ms-bn nav.pager ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    font-size: 3.6vw;
  }
  .ms-bn nav.pager ul li a {
    display: inline-block;
    padding: .5em 1em;
  }

  /*-- 個別ページ --*/
  .node-wrap {
    width: 94vw;
    margin: auto;
    padding: 10vw 0;
  }
  .node-wrap aside {
    text-align: center;
    font-size: 4vw;
    padding: 0 0 1em;
  }
  .node-wrap .item-imgs {
    position: relative;
    padding: 0 0 20vw;
  }
  .node-wrap .item-imgs .main {
    width: 100%;
  }
  .node-wrap .item-imgs .main img {
    width: 100%;
  }
  .node-wrap .item-imgs .main .field--name-field-cartlink {
    position: absolute;
    bottom: 0;
    width: 100%;
    font-size: 3.8vw;
    padding: 2em 2em 0;
    text-align: center;
  }
  .node-wrap .item-imgs .main .field--name-field-cartlink .field__item a {
		display: block;
		text-align: center;
		background: rgb(255, 225, 225);
		border: rgb(140, 94, 94) solid 1px;
		border-radius: 5px;
		padding: .4em 0;
	}
	.node-wrap .item-imgs .main .field--name-field-cartlink .field__item a:link,
	.node-wrap .item-imgs .main .field--name-field-cartlink .field__item a:visited {
		color: rgb(130, 25, 25);
	}
	.node-wrap .item-imgs .main .field--name-field-cartlink .field__item a:hover {
		background: rgb(250, 195, 195);
	}
  .node-wrap .item-imgs .sub .field--name-field-img-sub {
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
  }
  .node-wrap .item-imgs .sub .field--name-field-img-sub .field__item {
    width: 48%;
    padding: 4em 0 0;
  }
  .node-wrap .item-imgs .sub .field--name-field-img-sub .field__item img {
    width: 100%;
  }
}


@media all and (min-width: 680px) {
  article {
    max-width: 1040px;
    margin: auto;
  }
  /*-- 一覧ページ --*/
  .ms-bn .view-header h2 {
    text-align: center;
    font-size: 20px;
    padding: 1em 0 2em;
  }
  .ms-bn .item-list {
    width: 1040px;
    margin: auto;
    padding: 0 0 110px;
    background: url(img/ms-bu-ill.webp) bottom right no-repeat;
    background-size: 200px;
  }
  .ms-bn .item-list ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
  }
  .ms-bn .item-list ul li {
    width: 500px;
    padding: 0 0 15px;
  }
  .ms-bn .item-list ul li dl {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: end;
    font-size: 16px;
  }
  .ms-bn .item-list ul li dl dt {
    width: 100px;
  }
  .ms-bn .item-list ul li dl dd {
    width: 380px;
  }
  .ms-bn .item-list ul li dl dd span {
    display: block;
    line-height: 1em;
  }
  .ms-bn nav.pager {
    padding: 0 0 100px;
  }
  .ms-bn nav.pager ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    font-size: 16px;
  }
  .ms-bn nav.pager ul li a {
    display: inline-block;
    padding: .5em 1em;
  }

  /*-- 個別ページ --*/
  .node-wrap {
    padding: 80px 0;
  }
  .node-wrap aside {
    text-align: center;
    font-size: 16px;
    padding: 0 0 1em;
  }
  .node-wrap .item-imgs {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
  }
  .node-wrap .item-imgs .main {
    width: 480px;
  }
  .node-wrap .item-imgs .main .field--name-field-cartlink {
    font-size: 16px;
    padding: 2em;
    text-align: center;
  }
  .node-wrap .item-imgs .main .field--name-field-cartlink .field__item a {
		display: block;
		text-align: center;
		background: rgb(255, 225, 225);
		border: rgb(140, 94, 94) solid 1px;
		border-radius: 5px;
		padding: .4em 0;
	}
	.node-wrap .item-imgs .main .field--name-field-cartlink .field__item a:link,
	.node-wrap .item-imgs .main .field--name-field-cartlink .field__item a:visited {
		color: rgb(130, 25, 25);
	}
	.node-wrap .item-imgs .main .field--name-field-cartlink .field__item a:hover {
		background: rgb(250, 195, 195);
	}
  .node-wrap .item-imgs .sub .field--name-field-img-sub {
    width: 530px;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
  }
  .node-wrap .item-imgs .sub .field--name-field-img-sub .field__item {
    width: 250px;
    padding: 0 0 15px;
  }
  .node-wrap .item-imgs .sub .field--name-field-img-sub .field__item img {
    width: 100%;
  }
}
