﻿@charset "UTF-8";
/*----------------------------------------
 特集ページ
-----------------------------------------*/
#LogoMain h1 {
  font-size: 1em;
  margin: 0 auto 0 0;
}

.feature-page-view-item {
    position: relative;
}

.View-more {
  font-size: calc(var(--s-val)*1.2);
  border-bottom: 2px solid #4FC4D4;
  display: inline;
  margin: 0.5em;
}

#list-title {
  text-align: center;
  padding-bottom: 25px;
}

.feature-item-list {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.feature-item {
  text-align: center;
  width: 25%;
  margin-bottom: 70px;
}

.feature-item #productImage {
  width: 185px;
height: 200px;object-fit: contain;/* display: block; *//* margin: 0 auto; */
}

.feature-item-product-id {
  text-align: center;
  font-size: 10px;
  color:gray;
}

.feature-item-name {
  text-align: center;
  line-height: 1.6;
  font-size: 12px;
  font-weight: bold;
  color: #111;
}

.feature-item-outline
{
	text-align: center;
}

.pure-u-1-1 a .feature-item-outline {
  width: 370px;
}

.pure-u-1-2 a .feature-item-outline {
  width: 300px;
}

.pure-u-1-3 a .feature-item-outline {
  width: 220px;
}

#divProductArrivalMail {
  font-size: 11px;
  line-height: 1.3em;
  text-align: left;
  padding: 1em;
  background-color: #f8f8f8;
  margin-bottom: 0 1em;
}

#divProductArrivalMail span{
  font-size: 10px;
}

#divProductArrivalMail table {
  width: 100%;
}

#divProductArrivalMail th {
  display: inline-block;
  width: 95%;
  padding: 0.5em;
  background-color: #ccc;
}
#divProductArrivalMail td > .mailAddr {
  display: flex;
  width: 100%;
}

.btnClose {
  margin-top: 1em;
  text-align: center;
}

.feature-item-sold-out {
	color: #fff;
	word-wrap: normal;
	position: absolute;
	top: 0px;
	left: 0;
	text-align: center;
	width: 185px;
	height: 26px;
	line-height: 26px;
	background-color: #000;
	opacity: 0.5;
	display: inline-block;
}

.feature-item-img {
	position: relative;
}

#ctl00_ContentPlaceHolder1_UpdatePanel1 {
    max-width: 780px;
    margin: 0 auto;
    z-index: 100;
    position: relative;
}

/* 特集ページ一覧 */

.kv {
  position: relative;
}

.Feature-list_content {
  position: absolute;
  top: 5%;
  left: 8%;
}

.feature-page-view-list {
  font-family: Times, serif;
  font-size: calc(var(--s-val)*2.4);
  margin: 5% auto;
  max-width: 1240px;
  width: 80%;
}

.feature-page-view-items {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0 auto;
    gap: calc(var(--s-val)*5);
}

.feature-page-view-item {
    background-color: #fff;
    width: calc(33.33% - calc(var(--s-val) * 3.6));
}

.feature-page-view-title {
  margin: 0.5em;
  font-size: calc(var(--s-val)*1.8);
}

.feature-page-view-thumb {
  text-align: center;
}

.feature-page-view-thumb img {
  width: 100%;
}

.feature-page-view-no-item {
  text-align: center;
  font-size: 123.1%;
  padding: 20px 0;
}

#tblLayout {
    margin: 0 auto;
}

.below.clearFix.page-No {
    text-align: center;
}

span#ctl00_ContentPlaceHolder1_lPager2 {
    display: flex;
    flex-direction: column;
    line-height: 2;
}

@media screen and (max-width: 768px) {
  .feature-page-view-items {
    gap: calc(var(--s-val) * 5);
    flex-direction: column;
    align-items: center;
    gap: calc(var(--s-val) * 5);
    width: 100%;
}

div#ctl00_ContentPlaceHolder1_UpdatePanel1 {
    font-size: calc(var(--s-val)*1.4);
}

#upper-contents-area img {
    width: 100%;
}

div#upper-contents-area {
        padding: 5% 0;
        width: 80%;
        margin: 0 auto;
}

h1#page-title {
  font-size: calc(var(--s-val)*2);
}

.feature-page-view-title {
  font-size: calc(var(--s-val)*1.8);
}

.feature-page-view-item {
    width: 100%;
}
}

/* 特集ページ詳細 */


div#header-banner img {
    height: 600px;
}

div#divTopArea {
    margin: 2em 4rem;
    font-size: 14px;
}

div#divTopArea #breadcrumb {
    padding: 0;
    margin: 0;
}

#upper-contents-area ul,
#upper-contents-area ol {
      margin-left: 30px;
    padding-left: 0;
    list-style-position: outside;
}

#upper-contents-area ul li {
      list-style: disc;
}

#upper-contents-area ol li {
      list-style: decimal;
}

#upper-contents-area li {
      padding: 5px 0;
      font-size: calc(var(--s-val)*1.4);
}

#upper-contents-area p:not(:last-child), #upper-contents-area ul:not(:last-child), #upper-contents-area ol:not(:last-child) {
    margin-bottom: 1.6em;
}

.Table th, .Table td, #upper-contents-area table th, #upper-contents-area table td {
    padding: 18px 10px;
    border-bottom: 1px solid #e0e0e0;
    text-align: left;
}

#upper-contents-area tbody {
  font-size: calc(var(--s-val)*1.2);
}

#upper-contents-area {
    background-color: #fff;
    margin-top: -70px;
    padding: 5%;
}

#upper-contents-area h1 span {
  font-size: calc(var(--s-val)*2);
  margin-bottom: 3rem;
}

#upper-contents-area span {
  font-size: calc(var(--s-val)*1.6);
}

#upper-contents-area h3 {
      margin: 2.2em 0 1.2em;
      letter-spacing: .2em;
}

#upper-contents-area p {
  font-size: calc(var(--s-val)*1.6);
  margin-bottom: 1.6em;
}

#upper-contents-area img {
    display: flex;
    margin: 2rem auto;
    width: 70%;
    height: 100%;
}

/*ページャー*/

span.pager-current {
    color: #333;
    border-bottom-color: var(--text-color);
    box-shadow: 0 -2px #333 inset;
    padding-left: 28px;
    padding-right: 28px;
}

a.pager-link {
      padding-left: 28px;
    padding-right: 28px;
    
}

.link-item {
      padding: 16px 20px;
      border-bottom: 1px solid #e0e0e0;
      font-size: calc(var(--s-val)*1.2);
}

.pager-wrapper {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.pager-inner {
  display: flex;
}

.link-item.disabled {
  display: none;
}
