/* ************************************************ * all * ************************************************ */ 
* { margin: 0px; padding: 0px; } html { overflow-y: scroll; height: 100%; } body { text-align:left; font-size: 14px;
  /* font-family:"Lora","ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif;*/ color: #111; background-color: #FFFFFF; background-image: url(#F2F2F2); } a { outline: none; color: #111; } a:visited,:link { text-decoration: none; } a:hover { text-decoration: underline; color: #3399FF; } br.clear { clear: both; font: 0pt/0pt sans-serif; line-height: 0; } hr { clear: left; margin: 10px 0; border: 0; } img { border: none; vertical-align: middle; } /* ************************************************ * clearfix * ************************************************ */ .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; content: ""; } .clearfix:after { clear: both; } 
/* ************************************************ * layout * ************************************************ */
/*ページ全体の幅、レイアウトをセンタリング*/
#container { margin:0px auto; width:960px; text-align:left; } #top_line{ margin: 0 0 15px; width: 100%; height: 3px; background: transparent url("https://img.shop-pro.jp/tmpl_img/67/border_bottom.png") repeat-x left top; } 
/*ヘッダー*/
#header { clear:both; padding: 20px 0; width:100%; }

/*サイド変更 26.06.04
#side { float: left; width: 200px; } 
*/

/*メイン一旦修正26.06.04
#main {  float: none; width: 100%;}
*/

/*フッター（コピーライト）*/
#footer { clear:both; padding: 30px 0 20px; width:100%; border-top: 1px solid #ccc; color: #666; text-align: center; }
/*スライダー*/
.slider{ margin: 0 0 70px; } 
/* ************************************************ * header * ************************************************ */
#header .header_link { float: right; margin-bottom: 15px; } #header .header_link ul { } #header .header_link ul li { float: left; margin-left: 20px; list-style-type: none; line-height: 16px; } #header .header_link ul li i { display: block; float: left; margin-right: 5px; width: 16px; height: 16px; } #header .header_link ul li a { text-decoration: none; } #header .header_link ul li.my_account { } #header .header_link ul li.my_account i.mail { background: url(https://img07.shop-pro.jp/PA01359/892/etc_base64/MjAyNTA4MTAtMTYxNmljb24tbWFpbG1hZ2F6aW5l.png) no-repeat left 0px; } #header .header_link ul li.my_account i.account { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -97px; } #header .header_link ul li.member_login_btn i.login { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -225px; } #header .header_link ul li.member_regist_btn i.regist { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat 0px -193px; } #header .header_link ul li.member_logout_btn i.logout { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat left -210px; } #header .member_login_name{ float: right; clear: right; margin: 0 0 13px; } #header .header_link ul li.view_cart { } #header .header_link ul li.view_cart i.cart { background: url(https://img.shop-pro.jp/tmpl_img/67/icons16.png) no-repeat 0px 0px; } #header .header_link ul li.view_cart span.count { margin-left: 5px; padding: 5px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #ff3355; color: #fff; font-weight: bolder; } #header .header_delivery_price { float: right; clear: right; margin: 0 0 17px; padding: .5em 1em .3em; border: solid 1px #aaa; list-style: none; line-height: 1.5; } #header .search { float: right; clear: right; margin-bottom: 40px; } #header h1.logo { max-width: 50%; word-wrap: break-word; font-size: 40px; } #header h1.logo a { text-decoration: none; } #header h1.logo img { max-width: 100%; }
/* ************************************************ * footer * ************************************************ */ 
#footer a { color: #666; } #footer .footer_menu { clear: both; margin-bottom: 10px; } #footer .footer_menu li { display: inline; margin: 0 5px; } .copyright { clear: both; padding: 1em 0; text-align: center; font-size: 76.923%; } .powered { display: inline; margin-left: 1em; text-align: center; line-height: 18px; } .powered a { color: #777; text-decoration: none; } .powered img { margin-left: .3em; width: 200px; height: 18px; } .foot_policy{ margin: 0 0 30px; padding: 0 0 20px; border-bottom: 1px solid #ccc; } .foot_sk_box{ float: left; padding: 0 25px; width: 200px; text-align: left; } .foot_sk_box h3{ margin: 0 0 1em; } .foot_sk_box h4{ font-size: 13px; } .foot_sk_box dt{ margin: 0 0 .5em; } .foot_sk_box dd{ margin: 0 0 1.5em; } #mobile{ width: 145px; } 
/* ************************************************ * main * ************************************************ */ 
#main .box { clear: both; overflow: hidden; margin-bottom: 60px; border-top: solid 1px #999; } #main .box h3 { font-size: 13px; vertical-align: middle; } .header_block{ clear: both; padding: 1.1em 0; background: transparent url("https://img.shop-pro.jp/tmpl_img/67/border_bottom.png") repeat-x left bottom; } .header_block .icon{ float: left; margin: 0 14px 0 0; width: 20px; height: auto; text-align: center; } .header_block .icon img{ max-width: 100%; } .header_block .title{ float: left; text-align: left; } .header_block h3{ padding: 0; border: none; text-align: left; } .header_block p{ margin-top: 4px; color: #999; } #main .header_block{ margin: 0 0 30px; } #main .header_block .icon{ padding: 0; }
/* ************************************************ * item_box * ************************************************ */
.item_box { display:inline-block; float: left; margin: 0 41px 45px 0; width: 205px; vertical-align:top; text-align: left; /display:inline; /zoom:1; } .item_box .item_image { margin: 0px; } .item_box .item_image img.item { max-width: 100%; border: solid 1px #ddd; } .item_box .item_detail { margin: 15px 0 0; padding-left: 10px; border-left: solid 1px #ddd; } .item_box .item_detail p{ overflow: hidden; width: 100%; text-overflow: ellipsis; white-space: nowrap; -o-text-overflow: ellipsis; } .item_box .item_detail p.item_name { margin-bottom: 5px; font-size: 16px; font-weight: bold; } .item_box .item_detail p.item_description{ text-overflow: initial; overflow: visible; white-space: normal; } p.item_regular_price, p.item_price, p.item_discount { margin-bottom: 10px; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } .box_last{ margin-right: 0; } .box_small .item_box { display:inline-block; margin: 0 33px 45px 0; width: 113px; vertical-align:top; text-align: left; /display:inline; /zoom:1; } .box_small p { overflow: hidden; width: 100%; text-overflow: ellipsis; white-space: nowrap; -o-text-overflow: ellipsis; } .box_small .item_box .item_detail a { margin-bottom: 5px; font-size: 14px; } .box_small .box_last { margin-right: 0; } .stock_error{ display:none; padding:10px 0; color:#DA5858; font-weight:bold; }
/* ************************************************ * Top_Page * ************************************************ */ 
#main #box_info p { line-height: 20px; } #main #box_free { padding: 20px; border: #aaa solid 1px; } #main #box_free p { line-height: 20px; } #main #box_news .header_block{ margin-bottom: 0; } #main #box_news ul{ margin-left: 0; list-style: none; } #main #box_news ul li{ border-top:#ddd solid 1px; } #main #box_news ul li:first-child{ border-top:none; } #main #box_news ul li div{ padding: 1.6em 0 1.4em; } #main #box_news p.news_date{ float: left; margin-right: 20px; width: 70px; } #main #box_news p.news_message{ float: left; } /* ************************************************ * product_detail_page * ************************************************ */ h2.product_name { margin-bottom: 0.8em; padding-bottom: 0.6em; background: transparent url("https://img.shop-pro.jp/tmpl_img/67/border_bottom.png") repeat-x left bottom; font-size: 18px; } .product_form{ margin: 0 0 62px; } .product_detail_area { position: relative; width: 100%; } .product_images { display: inline-block; float: left; width: 400px; } .product_images div img { max-width: 100%; max-height: 100%; width: auto; height:auto; border: 1px solid #ddd; } .product_images div p.detail { margin-top: 10px; line-height: 20px; } .add_cart { clear: right; float: right; overflow: hidden; width: 270px; } table.add_cart_table { margin-bottom: 10px; width: 100%; border-left: solid 1px #ccc; table-layout:fixed; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } table.add_cart_table th { display: inline-block; overflow: hidden; padding: 12px 4px 12px 18px; width: 35%; text-align: left; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; } table.add_cart_table td { display: inline-block; overflow: hidden; padding: 10px 0; width: 55%; text-align: left; text-overflow: ellipsis; white-space: nowrap; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; } table.add_cart_table td input { padding: 0 4px; width: 38px; height: 26px; font-size: 15px; line-height: 26px; vertical-align: middle; } table.add_cart_table td strong.price { font-size: 15px; } table.add_cart_table td input.text-titles-list__detail-text { width: 130px; } table#option_tbl { margin-bottom: 20px; width: 100%; } table#option_tbl th, table#option_tbl td.none { background: whiteSmoke; } table#option_tbl th, table#option_tbl td { padding: 10px; border: 1px solid #ccc; text-align: center; } table#option_tbl th { background: whiteSmoke; } table#option_tbl td div input { margin-bottom: 5px; } ul.option_price { margin: 0 0 20px 0; } ul.option_price li { list-style-type: none; } .option_box{ clear: both; width: 100%; overflow: hidden; } table td.pur_block{ margin: 0 5px 0 0; width: auto; white-space: normal; } .button_area input { width: 100%; } .product_description { clear: both; margin-bottom: 20px; word-wrap: break-word; font-size: 13px; line-height: 22px; } .product_image_extra { margin-bottom: 20px; text-align: center; } .product_image_extra img.item { margin-bottom: 20px; } .product_link_area { margin: 20px 0 0; padding: 20px 0 0; border-top: #ccc solid 1px; } .product_link_area div.twitter { float: left; width: 100px; } .product_link_area div.pinterest { float: left; margin-right: 30px; } .product_link_area div.fb-like { float: left; width: 200px; } .product_link_area ul.other_link { clear: both; margin-top: 20px; margin-left: 20px; } .product_link_area ul.other_link li { margin-bottom: 10px; } .share{ margin: 16px 0 0; list-style: none; } .share li{ display: inline-block; float: left; margin: 0 10px 10px 0; max-width: 125px; } .calamel-link{ margin-top: 10px; } #tb_cap_tb{ margin-top: 20px; } .tb { padding-top: 10px; padding-bottom: 10px; border-top: 1px solid #CCC; } #tb_stitle { margin-bottom: 20px; } .tb_date, .tb_title, .tb_body, .tb_state { margin-bottom: 5px; } 
/* ************************************************ * cloud_zoom * ************************************************ */ 
/* This is the moving lens square underneath the mouse pointer. */ 
.cloud-zoom-lens { margin:-4px;
  /* Set this to minus the border thickness. */ 
  border: 4px solid #888; background-color:#fff; cursor:move; }
/* This is for the title text. */ 
.cloud-zoom-title { position:absolute !important; top:0px; padding:3px; width:100%; background-color:#000; color:#fff; text-align:center; font-weight:bold; font-size:10px; font-family:Arial, Helvetica, sans-serif; }
/* This is the zoom window. */
.cloud-zoom-big { overflow:hidden; border: 4px solid #c86464; } 
/* This is the loading message. */
.cloud-zoom-loading { padding:3px; border:1px solid #000; background:#222; color:white; }
/* Feature section in ZoomEngine page */ 
.zoom-section { clear:both; } * html .zoom-section { display:inline; clear:both; } .zoom-small-image { float: left; margin-top: 4px; width: 400px; } .zoom-small-image #wrap { position: relative; top: 0px; z-index: 9999; } .cloud-zoom { margin-bottom: 20px; } .zoom-small-image .mousetrap { position: absolute; top:0px; left:0px; z-index:999; width: 100%; } 
/* Feature descriptions in ZoomEngine page */
.zoom-desc { clear: left; width: 100%; } a.cloud-zoom-gallery { display: block; float: left; margin: 0 22px 20px 0; width: 82px; height: 82px; cursor: pointer; } .zoom-tiny-image { padding: 3px; width: 100%; height: auto; border: 1px solid #ccc; background: #efefef; } .zoom-tiny-image.selected { border: 1px solid #c86464; background: #c86464; } .zoom-tiny-image:hover { border: 1px solid #c86464; } a.gallery_last{ margin-right: 0; }
/* ************************************************ * product_option_window * ************************************************ */
#product_option { margin: 20px; padding: 20px; background: #fff; } #product_option h2 { margin-bottom: 20px; } table.table_option { margin-bottom: 20px; border-top: 1px solid #ccc; border-right: 1px solid #ccc; background: #fff; } table.table_option th { padding: 10px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; background: #f5f5f5; } table.table_option td { padding: 10px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; } 
/* ************************************************ * product_list_page * ************************************************ */ 
.sub_category_area, .sub_group_area { margin-bottom: 20px; padding: 10px 10px 0px 10px; height: 100%; border: solid 1px #ccc; } .sub_category_area div.sub_category, .sub_group_area div.sub_group { float: left; margin: 0 20px 10px 0; } .sub_category_area div.sub_category img, .sub_group_area div.sub_group img { margin-right: 10px; border: solid 1px #ccc; } /* ************************************************ * search_page * ************************************************ */ .search_result { margin: 20px 0; padding: 10px 0; background: #ddd; text-align: center; } .none { margin: 50px 0; text-align: center; }
/* ************************************************ * policy * ************************************************ */
#policy { line-height: 1.8; font-size: 14px; } #policy h2 { margin-bottom: 30px; } .policy_box, #policy_lead{ margin-bottom: 30px; } .sk_box { margin-bottom: 70px; } .sk_box h3 { margin-bottom: 1em; font-size: 16px; } .sk_box table { width: 100%; border-top: 1px solid #ccc; border-collapse: separate; empty-cells:show; } .sk_box th { padding: 20px 40px 20px 0; width: 170px; text-align: left; } .sk_box th img.poricy_img { margin-bottom: 5px; } .sk_box td { padding: 20px 0; zoom: 1; content: ' '; } .sk_box th, .sk_box td { vertical-align: top; line-height: 1.8; position: relative; border-bottom: solid 1px #ccc; } #payment_method { margin-top: 40px; } #payment_method table.table { width: 100%; } #payment_method table.table th { width: 200px; text-align: center; } #shipping_method { margin-top: 40px; } #shipping_method table.table { width: 100%; } #shipping_method table.table th { width: 200px; text-align: center; }
/* ************************************************ * side * ************************************************ */ 
#side .box { clear: both; margin-bottom: 60px; border-top: solid 1px #999; border-bottom: solid 1px #999; word-wrap: break-word; position: relative; } #side .box h3 { text-align: left; font-weight: normal; font-size: 16px; } #side .box ul { margin-left: 0px; list-style: none; } #side .box ul li { border-top:#838383 dotted 1px; } #side .box ul li:first-child { border-top:none; } #side #side_nav { padding: 0; border-top: none; border-right: solid 2px #ccc; border-bottom: none; } #side #side_nav ul{ margin-right: 10px; } #side #side_nav ul li { margin: 0; } #side #side_nav .nav_item{ clear: both; padding: .9em 0 .9em; cursor: pointer; } #side #side_nav .nav_item .nav_icon{ float: left; padding: inherit; width: 20px; height: auto; } #side #side_nav .nav_item .nav_icon img{ max-width: 100%; } #side #side_nav .nav_item .nav_title{ float: right; text-align: right; } #side #side_nav .nav_item h3{ margin-bottom: 4px; padding: 0; border: none; text-align: right; } #side #side_nav .nav_item p{ color: #999; } .box_default ul li div{ position: relative; padding: 1.2em 0 1em; text-align: left; } .box_default ul li div img{ border: solid #ddd 1px; } .box_default ul li div p{ line-height : 1.6; } #side #box_cart { } #side #box_cart .cart_button { text-align: right; } #side #box_owner .inner{ padding: 1.2em 0 1em; } #side #box_owner .owner_photo{ margin: 0 0 10px; width: 100px; max-width: 100%; height: auto; border: solid #ddd 1px; } #side #box_owner p.name { font-size: 14px; } #side #box_owner p.memo { font-size: 11px; line-height: 18px; } #side #box_owner p.website { padding-left: 20px; } #qr_code{ padding: 20px 0; } #box_sellers .seller_box{ padding: 2.2em 0; } #box_sellers li{ position: relative; display: block; } #box_sellers .top_seller:before{ position: absolute; top: 18px; left: -6px; content: url(https://img.shop-pro.jp/tmpl_img/67/rank1.png); } #box_sellers .rank_2:before{ content: url(https://img.shop-pro.jp/tmpl_img/67/rank2.png); } #box_sellers .rank_3:before{ content: url(https://img.shop-pro.jp/tmpl_img/67/rank3.png); } #box_sellers .seller_image{ float: left; margin: 0 10px 0 0; width: 80px; border: solid #ddd 1px; } #box_sellers .seller_detail{ float: right; width: 104px; } #box_sellers .seller_rank{ margin: 0 0 10px; font-size: 12px; } #box_sellers .seller_rank > strong{ font-size: 15px; } #box_sellers .seller_name{ font-size: 13px; } #box_sellers .seller_teika{ float: left; font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } #box_sellers .more_seller{ display: none; } .more_btn{ padding: 8px 0; border-top: solid 1px #999; text-align: center; cursor: pointer; } .updown{ display: inline-block; margin: 0 3px 0 0; width: 13px; height: 8px; background: url(https://img.shop-pro.jp/tmpl_img/67/down_icon.png); background-repeat: no-repeat; } .more_up{ background: url(https://img.shop-pro.jp/tmpl_img/67/up_icon.png); } /* ************************************************ * Common Elements * ************************************************ */ /* @group Common Elements */ table { border-spacing: 0; border-collapse: collapse; } table.table { margin-bottom: 20px; border-top: 1px solid #ccc; border-right: 1px solid #ccc; } table.table th { padding: 5px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; background: #f5f5f5; } table.table td { padding: 5px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; } .footstamp { margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid #ddd; } .footstamp span { margin: 0 5px; color: #999; } .sort { float: right; margin-bottom: 20px; text-align: right; } .sort strong { margin-right: 5px; } .sort a { margin-right: 5px; text-decoration: underline; } .sort span { margin-right: 5px; background: #eee; text-decoration: none; font-weight: bolder; } .pager { clear: both; margin: 20px 0; text-align: center; } .pager a{ margin: 15px; } .none { clear: both; margin: 50px 0; text-align: center; } .sold_out { color: #DA5858; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; } .to_top{ float: right; clear: both; text-align: center; margin: 0 0 20px; padding: 1.3em 1em; border: solid 1px #aaa; font-size: 14px; color: #888; } .to_top:hover { text-decoration: none; color: #3399FF; border-color: #3399FF; } .tbl_calendar { margin: 20px 0; width: 100%; border: none !important; border-spacing: 0 !important; border-collapse: collapse !important; } .tbl_calendar th, .tbl_calendar td { padding: 4px !important; border-bottom: 1px solid #ccc !important; text-align: center !important; } /* @group button */ .btn { display: block; margin-top: 1em; border: none; border-radius: 0; color: #fff; text-align: center; font-weight: bold; font-size: 15px; font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif; line-height: 1; cursor: pointer; -webkit-appearance:none; } .btn:link, .btn:visited, .btn:hover, .btn:active{ color: #fff; text-decoration: none; } .btn-primary { margin: 1.2em 0 .9em; padding: 1.4em 0; background-color: #c86464; } .btn-contact { margin: 0.5em 0.3em; padding: 1.3em 0; background-color: #a0a0a0; font-weight: normal; font-size: 13px; } .btn-quick { margin: 0.9em 0; padding: 1.3em 0; background-color: #64b4c8; font-size: 13px; } /* 2025/8追加*/ /* iframeスマホ対応 htmlはこれ <div class="iframe-wrap"> 　<iframe src="埋め込むページのURL" frameboader="0"></iframe> </div> * */ .iframe-wrap { position: relative; width: 100%; padding-top: 56.25%; overflow:auto; -webkit-overflow-scrolling:touch; border:2px solid #ccc; } .iframe-wrap iframe { position:absolute; top:0; left:0; width:100%; height:100%; border:none; display:block; } 
/* ========================================= MODERN EC RESET（追加26.05.28） ========================================= */
body{ font-family: "Noto Sans JP", sans-serif; font-size:16px; line-height:1.8; color:#222; background:#faf8f5; -webkit-font-smoothing:antialiased; } 
/* ========================================= LAYOUT ========================================= */
#container{ width:min(90%, 1400px); margin-inline:auto; }  
/* ========================================= HEADER ========================================= */ 
#header{ display:flex; align-items:center; justify-content:space-between; padding:24px 0 40px; } #header h1.logo{ max-width:none; font-size:28px; letter-spacing:.08em; } #header .search{ display:none; } #header .header_delivery_price{ display:none; } #header .member_login_name{ display:none; } /* 上部リンク簡略化 */ #header .header_link ul{ display:flex; align-items:center; gap:18px; } #header .header_link ul li{ margin:0; font-size:13px; } /* ========================================= HERO ========================================= */ .hero{ position:relative; margin-bottom:120px; border-radius:24px; overflow:hidden; } .hero img{ width:100%; height:78vh; object-fit:cover; display:block; } .hero_content{ position:absolute; left:8%; bottom:10%; color:#fff; } .hero_content h2{ margin-bottom:20px; font-size:clamp(32px,5vw,64px); line-height:1.2; font-weight:500; letter-spacing:.06em; } .hero_content p{ margin-bottom:32px; font-size:16px; opacity:.9; } .hero_content a{ display:inline-flex; align-items:center; justify-content:center; padding:16px 32px; border-radius:999px; background:#fff; color:#222; text-decoration:none; transition:.3s; } .hero_content a:hover{ opacity:.75; } /* ========================================= SECTION ========================================= */ #main .box{ margin-bottom:120px; border:none; } .header_block{ margin-bottom:40px; padding:0; background:none; } .header_block .icon{ display:none; } .header_block h3{ font-size:28px; font-weight:500; letter-spacing:.04em; } /* ========================================= PRODUCT GRID ========================================= */ .item_box{ width:calc(33.333% - 24px); margin:0 36px 72px 0; } .item_box:nth-child(3n){ margin-right:0; } .item_box .item_image{ overflow:hidden; border-radius:18px; } .item_box .item_image img.item{ border:none; transition:transform .5s ease; } .item_box:hover img.item{ transform:scale(1.04); } .item_box .item_detail{ margin-top:20px; padding-left:0; border:none; } .item_box .item_detail p{ white-space:normal; } .item_box .item_name{ margin-bottom:10px; font-size:18px; font-weight:500; line-height:1.5; } .item_price{ color:#666; font-size:15px; } /* ========================================= BUTTON ========================================= */ .btn{ border-radius:999px; transition:.3s; } .btn:hover{ opacity:.75; } /* ========================================= FOOTER ========================================= */ #footer{ margin-top:140px; padding:80px 0; border-top:1px solid #e5e5e5; background:#fff; } .foot_policy{ display:flex; gap:60px; border:none; } .foot_sk_box{ width:100%; padding:0; } .footer_menu{ margin-top:32px; } /* ========================================= LINK ========================================= */ a{ transition:.3s; } a:hover{ opacity:.7; text-decoration:none; } /* ========================================= MOBILE ========================================= */
#side{
  display:block;
}
@media screen and (max-width: 768px){ body{ font-size:15px; } #container{ width:92%; } #header{ display:block; padding:20px 0 28px; } #header h1.logo{ margin-bottom:20px; font-size:24px; } #header .header_link{ float:none; } #header .header_link ul{ flex-wrap:wrap; gap:12px; } .hero{ margin-bottom:72px; border-radius:18px; } .hero img{ height:62vh; } .hero_content{ left:24px; right:24px; bottom:24px; } .hero_content h2{ font-size:34px; } .hero_content p{ font-size:14px; } .hero_content a{ width:100%; } #main .box{ margin-bottom:72px; } .header_block h3{ font-size:24px; } .item_box{ width:100%; margin:0 0 56px; } .foot_policy{ display:block; } .foot_sk_box{ margin-bottom:48px; } }　
body{
  font-family: "Noto Sans JP", sans-serif !important;
  font-size:16px !important;
  color:#222 !important;
  background:#faf8f5 !important;
}

/*幅見直し 26.06.04*/
#container::after {
  content: "";
  display: block;
  clear: both;
}
* {
  box-sizing: border-box;
}

/*サイドとメインを修正26.06.04*/
#side{
  float:left;
  width:200px;
}

#main{
  float:right;
  width:calc(100% - 240px); /* サイド+余白分 */
}