﻿@charset "utf-8";

/*----------------------------------------------------------------------------------------------------

  Button
  
----------------------------------------------------------------------------------------------------*/

.p-btn {
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  display:inline-block;
  vertical-align:middle;
  border:none;
  margin:0;
  outline:none;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  line-height:1.2;
  position:relative;
  overflow:hidden;
  font-size:0.9em;
  padding:0.9em 2em;
}

.p-btn[btn-txt="left"] {
  text-align:left;
  padding-left:1em;
}

.ua-pc .p-btn { transition:border 0.2s ease-out, background 0.2s ease-out, color 0.2s ease-out; }

.p-btn,
.p-btn:visited,
.p-btn:hover,
.ua-pc .p-btn:hover,
.p-btn a,
.p-btn a:visited,
.p-btn a:hover,
.ua-pc .p-btn a:hover { color:inherit; text-decoration:none; }


/* 矢印 */
.p-btn--txt .p-arrow {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
}

.p-btn--txt:not([btn-arrow="prev"]) { padding-right:3em; }
.p-btn--txt[btn-arrow="prev"] { padding-left:3em; }

.p-btn--txt:not([btn-arrow="prev"]) .p-arrow { right:0.5em; }
.p-btn--txt[btn-arrow="prev"] .p-arrow { left:0.5em; }

.ua-pc .p-btn--txt:not([btn-arrow="prev"]):hover .p-arrow,
.ua-pc .p-btn--txt:not([btn-arrow="prev"]) a:hover .p-arrow { right:0.35em; }
.ua-pc .p-btn--txt[btn-arrow="prev"]:hover .p-arrow,
.ua-pc .p-btn--txt[btn-arrow="prev"] a:hover .p-arrow { left:0.35em; }

.ua-pc .p-btn--txt .p-arrow { transition:right 0.3s cubic-bezier(.23, 1, .32, 1), left 0.3s cubic-bezier(.23, 1, .32, 1); }
.ua-pc .p-btn--txt .p-arrow:before { transition:border-color 0.2s ease-out; }


/*--------------------------------------------------------------------------------
  Color
--------------------------------------------------------------------------------*/

/* 黒線
----------------------------------------------------------------------*/

.p-btn[btn-color="line"],
.p-btn[btn-color="line"]:visited,
.p-btn[btn-color="line"]:hover,
.p-btn[btn-color="line"] a,
.p-btn[btn-color="line"] a:visited,
.p-btn[btn-color="line"] a:hover {
  color:#0f1e3c;
  background-color:transparent;
  border:1px solid rgba(10,20,40,0.8);
}

.ua-pc .p-btn[btn-color="line"]:hover,
.ua-pc .p-btn[btn-color="line"] a:hover,
.ua-pc a:hover .p-btn[btn-color="line"] {
  color:#fff;
  background-color:#0f1e3c;
  border-color:#0f1e3c;
}

/* 矢印アイコン */
.ua-pc .p-btn[btn-color="line"]:hover .p-arrow:not([arrow="prev"]):not([arrow="down"]):before,
.ua-pc .p-btn[btn-color="line"] a:hover .p-arrow:not([arrow="prev"]):not([arrow="down"]):before {
  border-color:transparent transparent transparent #fff;
}

.ua-pc .p-btn[btn-color="line"]:hover .p-arrow[arrow="prev"]:before,
.ua-pc .p-btn[btn-color="line"] a:hover .p-arrow[arrow="prev"]:before {
  border-color:transparent #fff transparent transparent;
}

.ua-pc .p-btn[btn-color="line"]:hover .p-arrow[arrow="down"]:before,
.ua-pc .p-btn[btn-color="line"] a:hover .p-arrow[arrow="down"]:before {
  border-color:#fff transparent transparent transparent;
}


/* 金
----------------------------------------------------------------------*/

.p-btn[btn-color="gold"],
.p-btn[btn-color="gold"]:visited,
.p-btn[btn-color="gold"]:hover,
.p-btn[btn-color="gold"] a,
.p-btn[btn-color="gold"] a:visited,
.p-btn[btn-color="gold"] a:hover {
  color:#fff;
  background-color:#a0823c;
}

.ua-pc .p-btn[btn-color="gold"]:hover,
.ua-pc .p-btn[btn-color="gold"] a:hover,
.ua-pc a:hover .p-btn[btn-color="gold"] {
  color:#fff;
  background-color:#b99b55;
}

/* 矢印アイコン */
.p-btn[btn-color="gold"] .p-arrow:not([arrow="prev"]):not([arrow="down"]):before,
.ua-pc .p-btn[btn-color="gold"]:hover .p-arrow:not([arrow="prev"]):not([arrow="down"]):before,
.ua-pc .p-btn[btn-color="gold"] a:hover .p-arrow:not([arrow="prev"]):not([arrow="down"]):before {
  border-color:transparent transparent transparent #fff;
}

.p-btn[btn-color="gold"] .p-arrow[arrow="prev"]:before,
.ua-pc .p-btn[btn-color="gold"]:hover .p-arrow[arrow="prev"]:before,
.ua-pc .p-btn[btn-color="gold"] a:hover .p-arrow[arrow="prev"]:before {
  border-color:transparent #fff transparent transparent;
}

.p-btn[btn-color="gold"] .p-arrow[arrow="down"]:before,
.ua-pc .p-btn[btn-color="gold"]:hover .p-arrow[arrow="down"]:before,
.ua-pc .p-btn[btn-color="gold"] a:hover .p-arrow[arrow="down"]:before {
  border-color:#fff transparent transparent transparent;
}


/* 赤
----------------------------------------------------------------------*/

.p-btn[btn-color="red"],
.p-btn[btn-color="red"]:visited,
.p-btn[btn-color="red"]:hover,
.p-btn[btn-color="red"] a,
.p-btn[btn-color="red"] a:visited,
.p-btn[btn-color="red"] a:hover {
  color:#fff;
  background-color:#aa0500;
}

.ua-pc .p-btn[btn-color="red"]:hover,
.ua-pc .p-btn[btn-color="red"] a:hover,
.ua-pc a:hover .p-btn[btn-color="red"] {
  color:#fff;
  background-color:#cb1d17;
}

/* 矢印アイコン */
.p-btn[btn-color="red"] .p-arrow:not([arrow="prev"]):not([arrow="down"]):before,
.ua-pc .p-btn[btn-color="red"]:hover .p-arrow:not([arrow="prev"]):not([arrow="down"]):before,
.ua-pc .p-btn[btn-color="red"] a:hover .p-arrow:not([arrow="prev"]):not([arrow="down"]):before {
  border-color:transparent transparent transparent #fff;
}

.p-btn[btn-color="red"] .p-arrow[arrow="prev"]:before,
.ua-pc .p-btn[btn-color="red"]:hover .p-arrow[arrow="prev"]:before,
.ua-pc .p-btn[btn-color="red"] a:hover .p-arrow[arrow="prev"]:before {
  border-color:transparent #fff transparent transparent;
}

.p-btn[btn-color="red"] .p-arrow[arrow="down"]:before,
.ua-pc .p-btn[btn-color="red"]:hover .p-arrow[arrow="down"]:before,
.ua-pc .p-btn[btn-color="red"] a:hover .p-arrow[arrow="down"]:before {
  border-color:#fff transparent transparent transparent;
}


/*----------------------------------------------------------------------------------------------------

  Photo hover
  
----------------------------------------------------------------------------------------------------*/

.p-hvPhoto {
  position:relative;
  overflow:hidden;
}

.p-hvPhoto__img {
  transition:transform 0.8s cubic-bezier(.23, 1, .32, 1);
  width:100%;
  height:100%;
  object-fit:cover;
  font-family:"object-fit:cover;"
}
  
.ua-pc .p-hvPhoto:hover .p-hvPhoto__img,
.ua-pc .js__linkBox:hover .p-hvPhoto__img {
  transform:scale(1.04);
}


/*----------------------------------------------------------------------------------------------------

  Icon
  
----------------------------------------------------------------------------------------------------*/

.p-icon {
  display:inline-block;
  margin-bottom:-0.2em;
}

.p-icon:before,
.p-icon[icon-ps="right"]:after {
  content:"";
  width:1em;
  height:1em;
  display:inline-block;
  background-position:left center;
  background-repeat:no-repeat;
  background-size:contain;
  vertical-align:middle;
  margin-bottom:0.2em;
}

.p-icon--mgR:before,
.p-icon--mgR:after { margin-right:0.75em; }
.p-icon--mgL:before,
.p-icon--mgL:after { margin-left:0.75em; }
.p-icon--mgR-s:before,
.p-icon--mgR-s:after { margin-right:0.25em; }
.p-icon--mgL-s:before,
.p-icon--mgL-s:after { margin-left:0.25em; }

.p-icon[icon-ps="right"]:before {
  display:none;
}

/* TEL */
.p-icon[icon="tel"]:before,
.p-icon[icon="tel"]:after {
  width:0.8em;
  background-image:url(../image/icon/tel.svg);
  background-size:auto 0.8em;
}

/* カート */
.p-icon[icon="cart"]:before,
.p-icon[icon="cart"]:after {
  width:1.2em;
  height:1.2em;
  background-image:url(../image/icon/cart.svg);
  margin-left:0.2em;
}

/* 送料 */
.p-icon[icon="track"]:before,
.p-icon[icon="track"]:after {
  width:1.2em;
  background-image:url(../shopping/image/icon/track.svg);
}

/* クール便 */
.p-icon[icon="cool"]:before,
.p-icon[icon="cool"]:after {
  width:1.2em;
  background-image:url(../shopping/image/icon/cool.svg);
}

/* ダウンロード */
.p-icon[icon="dl"]:before,
.p-icon[icon="dl"]:after {
  background-image:url(../image/icon/dl.svg);
}

/* ファイル */
.p-icon[icon="file"]:before,
.p-icon[icon="file"]:after {
  width:1.1em;
  height:1.1em;
  background-image:url(../image/icon/file.svg);
}


/*----------------------------------------------------------------------------------------------------

  矢印
  
----------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------
  線無
--------------------------------------------------------------------------------*/

.p-arrow {
  width:1.2em;
  height:1.2em;
  display:inline-block;
  position:relative;
  vertical-align:middle;
}

.p-arrow:before {
  content:"";
  width:0;
  height:0;
  border-style:solid;
  display:inline-block;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
}

.p-arrow:not([arrow="prev"]):not([arrow="down"]):before {
  border-width:3px 0 3px 6px;
  border-color:transparent transparent transparent #0a1428;
}

.p-arrow[arrow="prev"]:before {
  border-width:3px 6px 3px 0;
  border-color:transparent #0a1428 transparent transparent;
}

.p-arrow[arrow="down"]:before {
  border-width:6px 4px 0 4px;
  border-color:#0a1428 transparent transparent transparent;
}


/*--------------------------------------------------------------------------------
  線有
--------------------------------------------------------------------------------*/

.p-lineArrow {
  width:2em;
  min-height:1em;
  display:inline-block;
  position:relative;
  vertical-align:baseline;
}

a.p-lineArrow--txt,
a.p-lineArrow--txt:visited,
a.p-lineArrow--txt:hover,
.p-lineArrow--txt a,
.p-lineArrow--txt a:visited,
.p-lineArrow--txt a:hover { color:inherit; text-decoration:none; }
.ua-pc a.p-lineArrow--txt:hover,
.ua-pc .p-lineArrow--txt a:hover { color:#2c4683; }

.p-lineArrow--txt .p-lineArrow { margin-bottom:0.25em; }
.p-lineArrow--txt .p-lineArrow:not([arrow="prev"]) { margin-left:0.5em; }
.p-lineArrow--txt .p-lineArrow[arrow="prev"] { margin-right:0.5em; }

.p-lineArrow:before,
.p-lineArrow:after {
  content:"";
}

.p-lineArrow:before {
  width:1.75em;
  height:1px;
  background-color:#0a1428;
  position:absolute;
  bottom:0;
}

.p-lineArrow:not([arrow="prev"]):before { right:0; }
.p-lineArrow[arrow="prev"]:before { left:0; }

.ua-pc .p-lineArrow:before {
  transition:width 0.4s cubic-bezier(.23, 1, .32, 1);
}
.ua-pc .p-lineArrow--txt:hover .p-lineArrow:before,
.ua-pc .p-lineArrow-link:hover .p-lineArrow:before,
.ua-pc .p-lineArrow--ic:hover.p-lineArrow:before {
  width:1.5em;
}

.p-lineArrow:after {
  width:0;
  height:0;
  border-style:solid;
  display:inline-block;
  position:absolute;
  bottom:0;
}

.p-lineArrow:not([arrow="prev"]):after {
  border-width:0.4rem 0 0 0.7rem;
  border-color:transparent transparent transparent #0a1428;
  right:-1px;
}

.p-lineArrow[arrow="prev"]:after {
  border-width:0.4rem 0.7rem 0 0;
  border-color:transparent #0a1428 transparent transparent;
  left:-1px;
}

.p-lineArrow--ic:before,
.p-lineArrow--ic:after {
  bottom:50%;
  margin-bottom:-0.2rem;
}


/*----------------------------------------------------------------------------------------------------

  List
  
----------------------------------------------------------------------------------------------------*/

ul.p-list,
ol.p-list { margin-left:1.25em; }

ul.p-list li,
ol.p-list li {
  line-height:1.6;
}

ul.p-list li:not(:first-child),
ol.p-list li:not(:first-child) {
  padding-top:0.25em;
}


/*--------------------------------------------------------------------------------
  マーク
--------------------------------------------------------------------------------*/

ul.p-listMk {
  list-style:none;
  line-height:1.6;
}

ul.p-listMk[listmk="dot"] li:before,
:not(ul).p-listMk[listmk="dot"]:before {
  content:"・";
}

ul.p-listMk[listmk="annot"] li:before,
:not(ul).p-listMk[listmk="annot"]:before {
  content:"※";
}

ul.p-listMk[listmk="dot"] li,
:not(ul).p-listMk[listmk="dot"],
ul.p-listMk[listmk="annot"] li,
:not(ul).p-listMk[listmk="annot"] { padding-left:1.2em; }

ul.p-listMk[listmk="dot"] li:before,
:not(ul).p-listMk[listmk="dot"]:before,
ul.p-listMk[listmk="annot"] li:before,
:not(ul).p-listMk[listmk="annot"]:before {
  margin-left:-1.2em;
  margin-right:0.2em;
  display:inline-block;
}


/*----------------------------------------------------------------------------------------------------

  ページネーション
  
----------------------------------------------------------------------------------------------------*/

.p-pagination {
  width:100%;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
}

.p-pagination__list {
  list-style:none;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
  margin-left:-0.25em;
  margin-right:-0.25em;
}

.p-pagination__list li {
  line-height:1;
  margin:0 0.25em;
}

.p-pagination__list li:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

.p-pagination a { display:block; }

.p-pagination__list a,
.p-pagination__list a:visited,
.p-pagination__list a:hover,
.ua-pc .p-pagination__list a:hover { color:inherit; text-decoration:none; }
.p-pagination__list span.active { color:#fff; text-decoration:none; }

.p-pagination__list li,
.p-pagination__list li span,
.p-pagination__list li a {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
}

.p-pagination__list li span {
  line-height:1;
  min-width:2.2em;
  height:2.5em;
  color:inherit;
  padding-left:0.5em;
  padding-right:0.5em;
  background-color:#fff;
}

.p-pagination__list li span.is-active {
  background-color:#1e325f;
  color:#fff;
}

.p-pagination__list li.first:after,
.p-pagination__list li.last:before {
  content:"...";
  line-height:1;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
}

.p-pagination__list li.first:after { margin-left:0.5em; }
.p-pagination__list li.last:before { margin-right:0.5em; }

.ua-pc .p-pagination__list li a span {
  transition:background ease-out 0.1s, border ease-out 0.1s, color ease-out 0.1s;
}

.ua-pc .p-pagination__list li a span:hover { background-color:#bbc1cf; color:#fff; }

.p-pagination .more {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  line-height:1;
  padding-bottom:0.25em;
}

.p-pagination .more a {
  display:block;
  text-decoration:none;
}
  
.p-pagination .more-prev a {
  padding-right:0.75em;
}
  
.p-pagination .more-next a {
  padding-left:0.75em;
}

@media print,screen and (min-width:641px) {
  .p-pagination {
    font-size:0.9em;
    padding-top:20px;
  }

  .p-pagination .more-prev {
    margin-right:1em;
  }
  
  .p-pagination .more-next {
    margin-left:1em;
  }
}

@media screen and (max-width:640px) {
  .p-pagination {
    padding-top:2.5em;
    padding-bottom:0.5em;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
  }
  
  .p-pagination__list {
    font-size:0.9em;
    width:100%;
    -webkit-box-ordinal-group:3;
    -ms-flex-order:2;
    order:2;
  }
  
  .p-pagination .more {
    padding-bottom:2em;
  }
  
  .p-pagination .more-prev {
    -webkit-box-ordinal-group:1;
    -ms-flex-order:0;
    order:0;
    margin-right:0.5em;
  }
  
  .p-pagination .more-next {
    -webkit-box-ordinal-group:2;
    -ms-flex-order:1;
    order:1;
    margin-left:0.5em;
  }
}


/*----------------------------------------------------------------------------------------------------

  ブログパターン
  
----------------------------------------------------------------------------------------------------*/

.p-glog {
  text-align:left;
}

.p-glog:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

.p-glog a { text-decoration:underline; }
.p-glog a:hover { text-decoration:none; }

.p-glog ul,
.p-glog ol {
  margin-left:1.25em;
}

.p-glog__hdLine {
  padding-bottom:1em;
  line-height:1.6;
}

.p-glog__txt {
  word-break:break-all;
  display:inline;
}

.p-glog__txt--column,
.p-glog__img--center,
.p-glog__datafile {
  width:100%;
}

.p-glog__img--center {
  text-align:center;
}

.p-glog__img--left,
.p-glog__img--right {
  display:inline-block;
}

.img--center__item {
  display:inline-block;
}

.p-glog__datafile + .p-glog__txt {
  padding-top:2em;
}
.p-glog__txt + .p-glog__datafile {
  padding-top:2em;
}

.p-glog__img__cp {
  color:#848993;
  display:block;
  text-align:center;
  line-height:1.4;
  font-size:0.88em;
  padding-top:0.75em;
}

@media print,screen and (min-width:641px) {  
  .p-glog {
    padding-top:60px;
  }

  .p-glog__img--left {
    float:left;
    margin-right:2.5em;
  }
  
  .p-glog__img--right {
    float:right;
    margin-left:2.5em;
  }
  
  .p-glog__img--left:not([data-mg="0"]),
  .p-glog__img--right:not([data-mg="0"]) {
    margin-bottom:1.5em;
  }
  
  .img--center__item[data-ps="top"]:not([data-mg="0"]) {
    margin-bottom:60px;
  }
  
  .img--center__item[data-ps="bottom"]:not([data-mg="0"]) {
    margin-top:60px;
  }

  .p-glog__img--left img,
  .p-glog__img--right img,
  .img--center__item img {
    max-width:100% !important;
  }
}

@media screen and (max-width:640px) {
  .p-glog:first-of-type {
    padding-top:2em;
  }
  
  .p-glog:not(:first-of-type) {
    padding-top:3em;
  }

  .p-glog__img--left,
  .p-glog__img--right,
  .p-glog__img--left + .p-glog__txt,
  .p-glog__img--right + .p-glog__txt {
    width:100% !important;
  }

  .p-glog__img--left,
  .p-glog__img--right {
    max-width:100% !important;
    text-align:center;
  }
  
  .p-glog__img--left:not([data-mg="0"]),
  .p-glog__img--right:not([data-mg="0"]) {
    margin-bottom:1.5em;
  }
  
  .img--center__item[data-ps="top"]:not([data-mg="0"]) {
    margin-bottom:1.5em;
  }
  
  .img--center__item[data-ps="bottom"]:not([data-mg="0"]) {
    margin-top:1.5em;
  }

  .p-glog__img--left img,
  .p-glog__img--right img,
  .img--center__item img {
    width:100% !important;
  }
}


/*--------------------------------------------------------------------------------
  非公開
--------------------------------------------------------------------------------*/

.private-alert p {
  text-align:left;
  background-color:#f2dad9;
  line-height:1.4;
  color:#aa0500;
  padding:0.75em;
  font-size:1.1em;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
}

.private-alert b {
  font-size:0.77em;
  font-weight:500;
  background-color:#aa0500;
  color:#fff;
  padding:0.4em 0.4em 0.5em 0.4em;
  vertical-align:middle;
  margin-right:1em;
  white-space:nowrap;
}

.private-alert small {
  font-size:0.8em;
  -webkit-flex:1;
  flex:1;
}

@media print,screen and (min-width:641px) {
  .private-alert {
    padding-bottom:50px;
  }
}

@media screen and (max-width:640px) {
  .private-alert {
    padding-bottom:2em;
  }
}
