@charset "UTF-8";
/* CSS Document */
/* ###################  ブレイクポイントの設定  ################### */
/*ブレイクポイント*/
/* ####  マージン　パディング  #####*/
.mt_00 { margin-top: 0px !important; }

.mb_00 { margin-bottom: 0px !important; }

.pt_00 { padding-top: 0px !important; }

.pb_00 { padding-bottom: 0px !important; }

.mt_10 { margin-top: 10px !important; }

.mb_10 { margin-bottom: 10px !important; }

.pt_10 { padding-top: 10px !important; }

.pb_10 { padding-bottom: 10px !important; }

.mt_20 { margin-top: 20px !important; }

.mb_20 { margin-bottom: 20px !important; }

.pt_20 { padding-top: 20px !important; }

.pb_20 { padding-bottom: 20px !important; }

.mt_30 { margin-top: 30px !important; }

.mb_30 { margin-bottom: 30px !important; }

.pt_30 { padding-top: 30px !important; }

.pb_30 { padding-bottom: 30px !important; }

.mt_40 { margin-top: 40px !important; }

.mb_40 { margin-bottom: 40px !important; }

.pt_40 { padding-top: 40px !important; }

.pb_40 { padding-bottom: 40px !important; }

.mt_50 { margin-top: 50px !important; }

.mb_50 { margin-bottom: 50px !important; }

.pt_50 { padding-top: 50px !important; }

.pb_50 { padding-bottom: 50px !important; }

.mt_60 { margin-top: 60px !important; }

.mb_60 { margin-bottom: 60px !important; }

.pt_60 { padding-top: 60px !important; }

.pb_60 { padding-bottom: 60px !important; }

.mt_70 { margin-top: 70px !important; }

.mb_70 { margin-bottom: 70px !important; }

.pt_70 { padding-top: 70px !important; }

.pb_70 { padding-bottom: 70px !important; }

.mt_80 { margin-top: 80px !important; }

.mb_80 { margin-bottom: 80px !important; }

.pt_80 { padding-top: 80px !important; }

.pb_80 { padding-bottom: 80px !important; }

.mt_90 { margin-top: 90px !important; }

.mb_90 { margin-bottom: 90px !important; }

.pt_90 { padding-top: 90px !important; }

.pb_90 { padding-bottom: 90px !important; }

.mt_100 { margin-top: 100px !important; }

.mb_100 { margin-bottom: 100px !important; }

.pt_100 { padding-top: 100px !important; }

.pb_100 { padding-bottom: 100px !important; }

/*    タグリセット      */
html { scroll-behavior: smooth; }

html, body { margin: 0; padding: 0; font-family: "Noto Sans", 'NotoSansCJKjp', "Noto Sans CJK JP", "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif; }

ul, dl, ol { margin: 0; padding: 0; }

main, section, article, div { box-sizing: border-box; }

li { margin: 0; padding: 0; list-style: none; }

a { text-decoration: none; box-sizing: border-box; }

img { vertical-align: top; }

@media screen and (max-width: 640px) { .disp_pc { display: none !important; } }

@media screen and (max-width: 800px) { .disp_pad { display: none !important; } }

.disp_sp { display: none !important; }
@media screen and (max-width: 640px) { .disp_sp { display: block !important; } }

.center { text-align: center; }

.go_top a { display: block; color: #fff; background: #000; text-decoration: none; padding: 8px 0; width: 90%; margin: auto; text-align: center; }

input[type="submit"]:hover, input[type="image"]:hover { cursor: pointer; }

.cart_area { background: #c00; padding: 10px; box-sizing: border-box; margin-bottom: 10px; }
.cart_area .cart_h { color: #fff; text-align: center; padding-bottom: 8px; }
.cart_area form { background: #fff; display: flex; align-items: center; gap: 10px; box-sizing: border-box; }
@media screen and (max-width: 640px) { .cart_area form { flex-wrap: wrap; padding: 10px; text-align: center; } }
.cart_area form .cart_img_area { width: 30%; max-width: 300px; }
@media screen and (max-width: 640px) { .cart_area form .cart_img_area { text-align: center; width: 100%; max-width: inherit; } }
.cart_area form .cart_info_area { width: 70%; padding: 0 10px; text-align: center; }
@media screen and (max-width: 640px) { .cart_area form .cart_info_area { width: 100%; padding: 0; } }
.cart_area form p { color: #c00; font-size: 28pt; font-weight: bold; margin: 0; }
@media screen and (max-width: 640px) { .cart_area form p { font-size: 6.5vw; } }
.cart_area form p small { font-size: 10pt; }
@media screen and (max-width: 640px) { .cart_area form p small { font-size: 8pt; } }
.cart_area form button { background: #000; color: #fff; border: none; font-size: 16pt; padding: 4px; font-weight: bold; border-radius: 4px; width: 80%; margin: 20px auto 0 auto; display: block; }
@media screen and (max-width: 640px) { .cart_area form button { width: 80%; font-size: 5vw; line-height: 1; padding: 10px 0px; } }
.cart_area form button:hover { cursor: pointer; }
.cart_area h3 { font-size: 16pt; margin: 0; }
@media screen and (max-width: 640px) { .cart_area h3 { font-size: 4.3vw; } }
.cart_area .cart_img { width: 100%; max-width: 260px; height: auto; }

.kiyaku { margin: 40px auto; border-width: 3px; border-style: solid; border-color: #333; padding: 10px 20px; border-radius: 8px; box-sizing: border-box; }
@media screen and (max-width: 640px) { .kiyaku { width: 96%; } }
.kiyaku dl { margin: 0; padding: 0; }
.kiyaku dt { margin: 0 0 6px 0; padding: 10px 10px 0 10px; font-weight: 700; font-size: 14pt; }
@media screen and (max-width: 640px) { .kiyaku dt { font-size: 10pt; } }
.kiyaku dd { font-size: 12pt; margin: 0; padding: 0 10px 10px 10px; border-bottom: 1px solid #ddd; line-height: 1.4; }
@media screen and (max-width: 640px) { .kiyaku dd { font-size: 8pt; } }
.kiyaku dd:last-child { border: none; }
.kiyaku dd ul { margin-left: 1rem; }
.kiyaku dd li { list-style: disc; margin-bottom: 6px; }

.go_top a { display: block; color: #fff; background: #000; text-decoration: none; padding: 8px 0; width: 90%; margin: auto; text-align: center; }

html { scroll-behavior: smooth; }

body { background: #EBE7D8; }

#iroha_singles_day2026 { width: 100%; max-width: 800px; margin: auto; background: #EBE7D8; }
#iroha_singles_day2026 img { width: 100%; height: auto; }
#iroha_singles_day2026 a { position: relative; display: flex; align-items: center; justify-content: center; color: #fff; background: #746057; font-size: clamp(14px, 3.5vw, 16px); padding: 8px 0; border-radius: 6px; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 a { line-height: 1; } }
#iroha_singles_day2026 a span { position: absolute; right: 1%; margin-bottom: 2px; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 a span { line-height: 1; } }
#iroha_singles_day2026 button { display: flex; justify-content: center; align-items: center; color: #fff; border-radius: 6px; padding: 10px 0; text-align: center; border: none; font-size: clamp(12px, 3.8vw, 18px); width: 100%; background: #4B9AA1; line-height: 1; }
#iroha_singles_day2026 button:hover { cursor: pointer; }
#iroha_singles_day2026 button span { margin-right: 10px; }
#iroha_singles_day2026 .unker_area a { background: none; padding: 0; }
#iroha_singles_day2026 .shindan ul { display: flex; }
#iroha_singles_day2026 .shindan a { background: none; padding: 0; }
#iroha_singles_day2026 .iroha_item { display: flex; flex-wrap: wrap; justify-content: space-between; width: 95%; margin: auto; text-align: center; }
#iroha_singles_day2026 .iroha_item div { width: 49%; display: flex; flex-direction: column; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .iroha_item div { width: 46%; } }
#iroha_singles_day2026 .iroha_item div img { margin: 0; }
#iroha_singles_day2026 .iroha_item div .brand_logo { width: 70%; height: auto; margin: 0 auto 0px auto; }
#iroha_singles_day2026 .iroha_item .center { text-align: center; margin: auto; }
#iroha_singles_day2026 .iroha_item p { margin: 0; text-align: left; }
#iroha_singles_day2026 .item_list { padding: 0 0%; box-sizing: border-box; }
#iroha_singles_day2026 .item_list h2 { margin: 0; padding-bottom: 20px; color: #AD8D36; text-align: center; font-size: clamp(22px, 4vw, 36px); }
#iroha_singles_day2026 .item_list div a { color: #fff; border: none; }
#iroha_singles_day2026 .item_list .col_items { display: flex; gap: 10px; padding: 20px 0; color: #77706E; }
#iroha_singles_day2026 .item_list .col_items article { text-align: center; display: flex; flex-direction: column; font-weight: bold; }
#iroha_singles_day2026 .item_list .col_items article img { margin-bottom: 8px; }
#iroha_singles_day2026 .item_list .col_items .price { color: #c00; }
#iroha_singles_day2026 .item_list .col_items p { margin: 0; text-align: center; font-size: clamp(12px, 3vw, 18px); }
#iroha_singles_day2026 .item_list .col_items p small { font-size: 10px; }
#iroha_singles_day2026 .item_list .col_items p.price { font-size: clamp(15px, 3vw, 21px); }
#iroha_singles_day2026 .item_list .col_items s { font-size: 16px; margin-left: 6px; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .item_list .col_items s { font-size: 10px; } }
#iroha_singles_day2026 .item_list .col_items form { margin-top: auto; }
#iroha_singles_day2026 .item_list .col_items form button { width: 90%; margin: 10px auto; }
#iroha_singles_day2026 .item_list .w3 article { width: 33%; }
#iroha_singles_day2026 .products_list div { margin-bottom: 20px; }
#iroha_singles_day2026 .products_list p { margin: 10px 0; font-size: clamp(12px, 3vw, 14px); }
#iroha_singles_day2026 .products_list a { width: 100%; margin: auto auto 0 auto; }
#iroha_singles_day2026 .products_list .blue { background: #91AFBA; }
#iroha_singles_day2026 .products_list .green { background: #9EBD9E; }
#iroha_singles_day2026 .products_list .paple { background: #C09FB7; }
#iroha_singles_day2026 .products_list .price { margin: 8px 0 0 0; color: #E74B4D; text-align: center; font-size: clamp(16px, 3.5vw, 18px); font-weight: bold; }
#iroha_singles_day2026 .flex_wrap { display: flex; justify-content: center; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .flex_wrap { flex-wrap: wrap; gap: 10px 0; } }
#iroha_singles_day2026 .flex_wrap article { display: flex; flex-direction: column; align-items: center; padding: 0 10px; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .flex_wrap article { width: 48%; } }
#iroha_singles_day2026 .flex_wrap h3 { text-align: center; margin: 0; }
#iroha_singles_day2026 .flex_wrap ul { display: flex; flex-direction: column; margin-top: 10px; width: 100%; }
#iroha_singles_day2026 .flex_wrap ul li { width: 100%; margin-bottom: 8px; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .flex_wrap ul a { padding: 0; height: 40px; } }
#iroha_singles_day2026 .flex_wrap a { width: 100%; margin: auto auto 0 auto; padding: 10px 0; }
#iroha_singles_day2026 .flex_wrap form { margin: 0; width: 100%; }
#iroha_singles_day2026 .flex_wrap button { width: 100%; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .flex_wrap button { padding: 0; height: 40px; } }
#iroha_singles_day2026 .flex_wrap select { width: 100%; padding: 10px 0; margin-bottom: 6px; border-radius: 6px; text-align: center; }
#iroha_singles_day2026 .img_a { background: none !important; padding: 0 !important; margin: 0 !important; border: none !important; }
#iroha_singles_day2026 .kiyaku { background: #fff; }
#iroha_singles_day2026 .cate_link { width: 95%; margin: 20px auto 40px auto; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .cate_link { width: 94%; margin-top: 10px; } }
#iroha_singles_day2026 .cate_link a { padding: 14px 0; margin: auto auto 0 auto; font-size: clamp(16px, 3.5vw, 20px); border: none; background: #FD8280; }
#iroha_singles_day2026 .tow_columun { margin-top: 20px; }
#iroha_singles_day2026 .tow_columun ul { display: flex; justify-content: space-around; }
#iroha_singles_day2026 .tow_columun ul li { width: 48%; }
#iroha_singles_day2026 .tow_columun a { width: 100%; margin: auto auto 0 auto; padding: 17px 0; border-radius: 6px; font-size: clamp(16px, 3.5vw, 18px); }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .tow_columun a { padding: 0; height: 44px; } }
#iroha_singles_day2026 .tow_columun button { padding: 18px 0; }
@media screen and (max-width: 640px) { #iroha_singles_day2026 .tow_columun button { padding: 0; height: 44px; } }
#iroha_singles_day2026 .anime_area { position: relative; aspect-ratio: 800 / 700; width: 100%; overflow: hidden; }
#iroha_singles_day2026 .anime_area img { position: absolute; height: auto; opacity: 0; transform: scale(0.8); will-change: transform; }
#iroha_singles_day2026 .anime_area.is-visible img { animation: scaleIn 0.5s ease-out forwards; }
#iroha_singles_day2026 .anime_area.is-visible .ani1 { animation-delay: 0s; }
#iroha_singles_day2026 .anime_area.is-visible .ani2 { animation-delay: 0.3s; }
#iroha_singles_day2026 .anime_area.is-visible .ani3 { animation-delay: 0.6s; }
#iroha_singles_day2026 .anime_area .ani1 { width: 50%; top: 5%; left: 0; }
#iroha_singles_day2026 .anime_area .ani2 { width: 50%; top: 7%; left: 50%; }
#iroha_singles_day2026 .anime_area .ani3 { width: 69%; top: 48%; left: 14%; }
@keyframes scaleIn { 0% { opacity: 0; transform: scale(0.8); }
  60% { opacity: 1; transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { #iroha_singles_day2026 .anime_area img, #iroha_singles_day2026 .anime_area.is-visible img { opacity: 1; transform: none; animation: none; } }

.end_area { width: 100%; max-width: 800px; margin: 60px auto 40px auto; }
.end_area .go_top a { background: #6E5F5D; }

.fixed { position: fixed; bottom: 0; width: 100%; text-align: center; z-index: 999; opacity: 0; visibility: hidden; }
.fixed.is-show { visibility: visible; pointer-events: auto; animation: poyoyon2 1s ease-in-out forwards; }
.fixed img { width: 100%; max-width: 800px; height: auto; }

@keyframes poyoyon2 { 0% { transform: translateY(40px) scale(0.8); }
  15% { transform: scale(0.98, 0.9) translate(0, 5px); }
  30% { transform: scale(1.02, 1) translate(0, 8px); }
  50% { transform: scale(0.98, 1.05) translate(0, -8px); }
  70% { transform: scale(1, 0.9) translate(0, 5px); }
  100% { transform: scale(1, 1) translate(0, 0); }
  0%, 100% { opacity: 1; } }
@keyframes floating { 0%, 100% { transform: translate(0, 0); }
  25% { transform: translate(3px, -8px); }
  50% { transform: translate(0, -14px); }
  75% { transform: translate(-3px, -6px); } }
@keyframes scaleIn { 0% { opacity: 0; transform: scale(0.8); }
  60% { opacity: 1; transform: scale(1.07); }
  100% { opacity: 1; transform: scale(1); } }
