/*  共通CSS */
@charset "utf-8";
@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Light-cstm.woff2) format('woff2'),
       url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Light-cstm.woff) format('woff'),
       url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Light-cstm.otf) format('opentype');
}
@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 400;
   font-display: swap;
   src: url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Regular-cstm.woff2) format('woff2'),
        url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Regular-cstm.woff) format('woff'),
        url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Regular-cstm.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 500;
   font-display: swap;
   src: url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Medium-cstm.woff2) format('woff2'),
        url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Medium-cstm.woff) format('woff'),
        url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Medium-cstm.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 900;
   font-display: swap;
   src: url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Black-cstm.woff2) format('woff2'),
        url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Black-cstm.woff) format('woff'),
        url(https://ayanokoji.itembox.design/item/font/NotoSansJP-Black-cstm.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Serif Japanese';
   font-style: normal;
   font-weight: 400;
   font-display: swap;
   src: url(https://ayanokoji.itembox.design/item/font/NotoSerifCJKjp-Regular-cstm.woff) format('woff'),
        url(https://ayanokoji.itembox.design/item/font/NotoSerifCJKjp-Regular-cstm.woff2) format('woff2'),
        url(https://ayanokoji.itembox.design/item/font/NotoSerifCJKjp-Regular-cstm.otf) format('opentype');
 }
/* clearfix */
.cf:after {content: "."; display: block;clear: both;height: 0;visibility: hidden;font-size:0;}
html,body{font-family: Arial,'Noto Sans Japanese',"メイリオ","Meiryo","ＭＳ Ｐゴシック","MS P Gothic", sans-serif;font-weight: normal;color: #000;font-size: 14px;line-height: 1.5;-webkit-text-size-adjust: 100%;margin: 0;padding: 0;width: 100%;}

/* フォント詳細指定 */
.mincho {font-family: 'Noto Serif Japanese' !important;}
p.center {text-align: center;}

/* フォントサイズや色指定 */
.bold {font-weight: bold;}
.normal {font-weight: normal !important;}
.txt_c{text-align: center;}
.lh1{line-height: 1;}
.lh12{line-height: 1.2;}
.lh15{line-height: 1.5;}
.f16 {font-size: 16px !important;}
.f18 {font-size: 18px !important;}
.f20 {font-size: 20px !important;}
.f22 {font-size: 22px !important;}
.f24 {font-size: 24px !important;}
.f30 {font-size: 30px !important;}
.f32 {font-size: 32px !important;}
.f34 {font-size: 34px !important;}
.f36 {font-size: 36px !important;}
.f40 {font-size: 40px !important;}
.f44 {font-size: 44px !important;}
.f48 {font-size: 48px !important;}
.f50 {font-size: 50px !important;}
.f52 {font-size: 52px !important;}
.f54 {font-size: 54px !important;}
.f56 {font-size: 56px !important;}
.f60 {font-size: 60px !important;}
.red{color: #ff0000 !important;}

/* リンク指定 */
a{color: #000;text-decoration: none;}

h1,h2,h3{font-weight: normal;margin: 0;padding: 0;}
ul,li{list-style: none;margin: 0;padding: 0;}
p{margin: 0;padding: 0;}
img{vertical-align: bottom;border: none;}

.sp{display: none !important;}
@media only screen and (max-width: 840px) {
    .pc{display: none !important;}
    .sp{display: block !important;}
}
.link_over{opacity: 1;transition: opacity,0.4s color,0.4s;display: inline-block;}
.link_over:hover{opacity: 0.7;color: #00b8ee !important;}

.mt10{margin-top: 10px !important;}
.mt15{margin-top: 15px !important;}
.mt20{margin-top: 20px !important;}
.mt25{margin-top: 25px !important;}
.mt30{margin-top: 30px !important;}
.mt35{margin-top: 35px !important;}
.mt40{margin-top: 40px !important;}
.mt50{margin-top: 50px !important;}
.mt60{margin-top: 60px !important;}
.mt70{margin-top: 70px !important;}
.mt80{margin-top: 80px !important;}
.mt90{margin-top: 90px !important;}
.mt100{margin-top: 100px !important;}

.mb10{margin-bottom: 10px !important;}
.mb15{margin-bottom: 15px !important;}
.mb20{margin-bottom: 20px !important;}
.mb25{margin-bottom: 25px !important;}
.mb30{margin-bottom: 30px !important;}
.mb35{margin-bottom: 35px !important;}
.mb40{margin-bottom: 40px !important;}
.mb50{margin-bottom: 50px !important;}
.mb60{margin-bottom: 60px !important;}
.mb70{margin-bottom: 70px !important;}
.mb80{margin-bottom: 80px !important;}
.mb90{margin-bottom: 90px !important;}
.mb100{margin-bottom: 100px !important;}
.mb150{margin-bottom: 150px !important;}

/* iOS reset */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}

/* slick */
.slider {display:none;}
.slider.slick-initialized {display: block;}
.slick-dots{position: static;bottom: auto;}
.slick-dots li button {width: 10px;height: 10px;padding: 0;}
.slick-dots li button:before {content: "" !important;width: 10px !important;height: 10px !important;border-radius: 10px;background: #cdcdcd;position: static !important;opacity: 1 !important;transition: background-color,0.4s;display: inline-block;}
.slick-dots li.slick-active button:before {background-color: #000; opacity: 1 !important;}
.slick-dots li{margin: 10px 10px 0 !important;width: 10px;height: 10px;}

/* guide scroll */
#scrollUp {display: none !important;}

/* 191121 カゴ回りバナー */
#FS2_body_Goods .FS2_InquiryButton_area:before{content: url(https://ayanokoji.itembox.design/item/common/images/bn-cart.gif);display: inline-block;margin: 10px auto;}

/* column */
.slide3{font-size: 14px;font-family: 'Noto Serif Japanese' !important;text-align: center;margin: 0 auto;}
.slide5{font-size: 12px;line-height: 20px; text-align: center;margin: 0 auto;}
.slide3 li,.slide5 li{padding: 0 10px;box-sizing: border-box;}
.slide3 img,.slide5 img{display: block;margin-bottom: 12px;width: 100%;}
.slide3 .slick-dots li,.slide5 .slick-dots li{margin: 30px 10px 0 !important;padding: 0;}
.slide5 .date{font-weight: bold;}
.column5,.column3{text-align: center;font-size: 0;width: 100%;margin: 0 auto;}
.column5 li{padding: 0 10px;margin: 30px 0 0;display: inline-block;font-size: 12px;width: 220px;vertical-align: top;box-sizing: content-box;}
.column3 li img,.column5 li img{display: block;}
.column5 p{letter-spacing: 0.05em !important;}
.column5 .name{font-weight: bold;margin-top: 10px;}
.column5 .brand{color: #666666;margin-top: 5px;}
.column5 .date{color: #fff;background: #ff5a5a;padding: 5px 10px;margin-top: 0;}
.column5 .late{color: #fff;background: #ccc;padding: 5px 10px;margin-top: 0;}
.btn-gray{display: inline-block;margin: 60px auto 0;padding: 16px 20px;font-size: 14px;letter-spacing: 0.05em !important;background: #ededed;cursor: pointer;}
.column3 li{padding: 0 10px;margin: 30px 0 0;display: inline-block;font-size: 14px;width: 380px;vertical-align: top;font-family: 'Noto Serif Japanese' !important;box-sizing: content-box;}
.column3 li img{width: 100%;display: block;margin-bottom: 10px;}
@media only screen and (max-width: 1680px) {
    .slide3,.column3{width: 800px;}
}
@media only screen and (max-width: 1440px) {
    .slide5,.column5{width: 720px;}
}
@media only screen and (max-width: 840px) {
    .slide3,.column3,.slide5,.column5,.column3 li,.column5 li{width: 100%;box-sizing: border-box;}
    .slide3 li,.slide5 li{padding: 0 4vw;}
    .mt100{margin-top: 70px !important;}
    .column5 li{padding: 0 2vw 0 0;width: 50%;}
    .column5 li:nth-child(2n){padding: 0 0 0 2vw;}
    .btn-gray{margin: 40px auto 0;}
}

/* 200227 戻りバナー 24/10/03 marginの下を100px→0に変更 */
.bn_other{display: block;width: 400px;margin: 0 auto;}
.bn_other img{width: 100%;}

/* 200907 information calendar */
#cal_info{padding: 20px 0;text-align: center;background: #ededed;}
#cal_info .calendar-table{width: 100%;max-width: 360px; margin: 0 auto 10px;text-align: center;background: transparent;}
#cal_info .calendar-table td{font-size: 12px;background: #fff;border: 5px solid #fff;padding: 3px 0;line-height: 22px;width: auto;}
#cal_info .calendar-table .d2 td {font-size: 16px;background: transparent;padding: 0 0 5px;border: none;font-weight: normal;font-family: 'Noto Serif Japanese' !important;}
#cal_info .calendar-table .d3,#cal_info .calendar-table .d3a,#cal_info .calendar-table .d4,#cal_info .calendar-table .d4a  {color: #ff0000;}
#cal_info .calendar-table .d6 .d4,#cal_info .calendar-table .d6 .d4a {color: #0000ff;}
#cal_info .calendar-table .d3 {background: #ffd9d9;}
#cal_info .calendar-table .d4 {background: #ffd9d9;}
#cal_info .square {position: relative;padding-left: 35px;line-height: 26px;color: #ff0000;clear: both;display: inline-block;}
#cal_info .square:before {position: absolute;top: 0px;left: 0px;width: 28px;height: 26px;background: #ffd9d9;content: "";}
@media only screen and (max-width: 840px) {
    #cal_info .calendar-table{width: 92%;}
}
.info18 b{font-weight: bold;}


/* 25/02/10 other_topics */
.other_topics-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px 20px;
  margin: 0 auto;
  width: 100%;
}
.other_topics-list li {
  box-sizing: content-box;
  display: inline-block;
  font-family: 'Noto Serif Japanese';
  font-size: 14px;
  vertical-align: top;
  width: 380px;
}
.other_topics-list li img {
  display: block;
  margin-bottom: 10px;
  width: 100%;
}
@media only screen and (max-width: 840px) {
    .other_topics-list li{width: calc(100% - 20px);}
}

