@charset "utf-8";
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---- default settings <<<------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
/*-- default css ------------------------------*/
body{font-size:75%; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kakugo Pro W3", Verdana, Helvetica, "ＭＳ Ｐゴシック", "MS P Gothic", "メイリオ", "Meiryo", Osaka, sans-serif;color: #343434;}
*{font-size:1em; margin:0; padding:0;}
fieldset, img, iframe{border:0;}
ol, ul{list-style:none;}
li{list-style:none;}
caption, th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:1em; font-weight:normal;}
abbr,acronym{border:0;}
hr{display:none;}
a{text-decoration:none; color:#466C8A;}
a:hover{text-decoration:underline;}
a:hover img{filter:alpha(opacity=80); opacity:0.8;}
textarea{overflow:auto;}
.wfix{width:auto;}

.fringePointBox div img {
border: 1px solid #B0B0B0;
padding: 1px;
/*filter:brightness(105%);*/
}
* html .wfix{width:100%;} /* IE6 hack */

html{scroll-behavior: smooth;}

/*-- class default css ------------------------------*/
.bold{font-weight:bold;}
.fleft{float:left;}
.clear{clear:both;}
.center{text-align:center;}
.right{text-align:right;}
.check{*margin:-4px -1px 0 -4px; vertical-align:top;}
.nospace{font-size:0px; height:0; line-height:0px;}
.png{tmp:expression(setPng24(this));}
.noimage{border:2px solid #818181; background:#ffffff url(../img/noimage.jpg) no-repeat 50% 50%;}
.maru{-moz-border-radius-topleft:10px; -webkit-border-top-left-radius:10px; -moz-border-radius-topright:10px; -webkit-border-top-right-radius:10px; -moz-border-radius-bottomleft:10px; -webkit-border-bottom-left-radius:10px; -moz-border-radius-bottomright:10px; -webkit-border-bottom-right-radius:10px;}
.inputTxt{border:1px solid #ddd; background-color:#fff; padding:1px;}
.line{height:1px; background-color:#dfdfdf; font-size:0px; line-height:0px; overflow:hidden;}
.ten{height:1px; background-image:url(../img/ten.jpg); font-size:0px; line-height:0px; overflow:hidden;} /*・・・*/
.dot{height:1px; background-image:url(../img/dot.jpg); font-size:0px; line-height:0px; overflow:hidden;} /* ---- */
.sukima{height:2px; font-size:0px; line-height:0px; overflow:hidden;}
.absmiddle{vertical-align:middle; display:inline-block;}
* html .absmiddle{margin-bottom :2px;} /* IE6 hack */
.nonedis{display:none;}
.hidden_phrase{visibility:hidden; width:0; height:0; line-height:0; overflow:hidden; position:absolute; top:-10000px;}
.red{color:#ff0000;}
.boxSizing{box-sizing:border-box;/* W3C */ -o-box-sizing:border-box;/* Opera */ -ms-box-sizing:border-box;/* IE */ -moz-box-sizing:border-box;/* Firefox */ -webkit-box-sizing:border-box; /* Safari&Chrome */}
.heightUnify{display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;}

/*-- HTML 5 Reset Styles - article, aside, header, nav, section, footer, figure, hgroup ------------------------------*/
section, nav, aside, figure, hgroup, header, article, footer{display:block;}

/*-- index ------------------------------*/
#home{width:100%;}
#head_outline{background-color:#fff;}
#web_outline{margin:0 auto; text-align:left;}
#btm_outline, #copy_outline{text-align:center;}
.index_outline_backup{width:1200px; margin:0 auto; text-align:left;}

/*-- header ------------------------------*/
#head_outline .headWrap{width:1220px; margin:0 auto; position:relative; display: flex; align-items: center;}
.logo{width: 10%;}
.y-logo{filter: invert(1);}
.tmenu {width: 61%;}
.tmenu ul{display: flex; top: 10px; left: 18px;}
.tmenu li{float:left; width:120px; border-bottom:5px solid #fff; height: 45px;}
.tmenu li:hover{border-bottom:5px solid #000;}
.tmenu li a{height:45px; line-height:50px; text-align:center; display:block; color:#000;}
.tmenu li a:hover, .tSideMenu li a:hover{text-decoration:none;}
.tSideMenu{position:absolute; bottom:0; right:5px;}
.tSideMenu li{display: flex; color:#000; height: 45px;}
.tSideMenu li a{display:block; height:45px; line-height:50px; color:#000; padding-left:30px; margin-right: 12px; font-size: .8rem;}
.tSideMenu li a:last-child {margin: 0 auto;}
.tSideMenu li:nth-child(1) a{background:url('../img/topAccount.png') 0 50% no-repeat;}
.tSideMenu li:nth-child(2) a{background:url('../img/topCart.png') 0 50% no-repeat;}
.tSideMenu li.gotocart #c_cnt{text-align:right; width:20px; display:inline-block;}
.tSideMenu li.gotocart #c_price{width:50px; text-align:right; display:inline-block;}
.goLogin{position:relative;}
.goLogin ul{display:none; position:absolute; left:0; top:40px; z-index:999; border-radius:0 5px 5px 5px; box-shadow:#dddddd 1px 1px 3px; height:auto !important; overflow:hidden;}
.goLogin:hover ul{display:block;}
.goLogin li{background-color:#ffffff; width:124px;}
.goLogin li a{display:block; color:#5d5d5d; width: 100%; height:45px; line-height:40px; text-align:left; border-right:none !important; background:none !important;}
.goLogin li a:hover{background-color:#efefef !important; color:#ff3300; filter: none;}

/*.headtext{margin:4px;}*/

/*-- Google Customer Search --------------------------------*/
#head_outline hgroup{position:relative;}
#YotsubaCse{position:absolute; width:140px; right:6px; bottom:22px; z-index:30;}
#YotsubaCse .gsc-input{padding-right:2px !important;}
#YotsubaCse .gsc-input-box{height:24px !important;}
#YotsubaCse input.gsc-search-button-v2{padding:4px 8px !important;}

/*-- index 関連アウトライン ------------------------------*/
#index_image{float:left; margin:4px 0px; font-size:0px; line-height:0px;}
#index_center{width: 78%; margin-left: 2%;}
#index_center, #index_text, #index_left{float:left;}
#index_right{float:right;}

/*-- basic latest skin ------------------------------*/
.latest_outline{margin:4px; padding:0; height:auto; list-style:none; border:1px solid #dfdfdf; overflow:auto;}
.latest_outline .more{position:relative; top:-1px; right:-1px; float:right;}
.latest_outline .subtitle{height:20px; line-height:20px; margin-left:10px;}
.latest_outline .indata{margin:5px;}
.latest_outline .indata li{padding:5px; float:left;}

/*-- basic latest skin (inbox) ------------------------------*/
.latest_inbox{margin:4px; padding:0;}
.latest_inbox .subtitle{height:20px; line-height:20px; margin-left:10px;}
.latest_inbox .indata{display:inline; text-align:center; padding:10px;}
.latest_inbox .indata li{text-align:center; padding:5px;}
.latest_inbox .sub{width:100px;}

/*-- basic latest skin (shop) ------------------------------*/
.latest_shop{margin:4px; padding:0; height:auto; list-style:none; min-height:170px; border:1px solid #dfdfdf; overflow:hidden;}
* html .latest_shop{height:180px; overflow:hidden;} /* IE6 hack, 20100127 scrollbarが出来ないようにoverflow追加 */
.latest_shop .more{position:relative; top:-1px; right:-1px; float:right;}
.latest_shop .subtitle{height:20px; line-height:20px; margin-left:10px;}
.latest_shop .indata{display:inline; text-align:center; padding:10px;}
.latest_shop .indata li{float:left; text-align:center; padding:5px;}
.latest_shop .sub{width:100px; font-size:9pt; color:#6A6A6A;}

/*-- basic latest skin (notice) ------------------------------*/
#latest_notice{margin:4px; padding:0; list-style:none;  overflow-x:hidden;}
#latest_notice .subtitle{line-height:24px;margin: 10px 0px;padding-left: 8px;font-size: 18px;}
#latest_notice .indata{/*height:220px; overflow-y:scroll;*/}
#latest_notice .indata li{padding:2px; height:22px; line-height:22px; border-bottom:1px solid #ebeced; text-indent:5px;}
#latest_notice .indata .time{font-size:0.8em; color:#1e8ac8;}
#latest_notice .liover{background-color:#eeeeee;}
/*shortcut*/
#latest_shortcut{margin:0 4px 10px 4px; padding:0; height:auto; list-style:none; overflow:hidden;}
#latest_shortcut dl{margin-top:10px; width:186px; float:left;}
#latest_shortcut dt{height:24px; line-height:24px; border:1px solid #dedede; background:#f3f3f3 url(../img/notice_sub.jpg) repeat-x; padding-left:8px;}
#latest_shortcut dd{margin-top:2px; height:180px; padding:2px; border:1px solid #dedede;}
#latest_shortcut dd span{padding:3px; display:inline-block; width:174px\9;}
#latest_shortcut dd span a{color:#ff0000;}
#latest_shortcut .skima{margin-left:5px; margin-right:5px;}

.BannerList{overflow:hidden;}
.BannerList a, .BannerList span{display:block; float:left; margin:0.5%;}
.BannerList a img, .BannerList span img{width:100%;}
.BannerList .wHarf{width:49%; position: relative; z-index: 0;}
.wHarf.sl::before{
content: "";
display: inline-block;
position: absolute;
width: 40px;
height: 40px;
margin: 5px;
border-radius: 5px;
background: url("https://www.yotsuba-insatsu.com/wp/wp-content/uploads/2020/03/logo.jpg") no-repeat;
background-size: contain;
z-index: 0;
}

.sl2::after{
content: "";
position: absolute;
width: 40px;
height: 40px;
margin-top: 160px;
background: url("https://www.yotsuba-insatsu.com/wp/wp-content/uploads/2025/03/pricedown_icom-1.png") no-repeat;
background-size: contain;
z-index: 0;
}

.BannerList .wFix{width:99%;}

/* outlogin ------------------------------*/
/*
.outlogin{clear:left; border:1px solid #dfdfdf; margin:4px; padding:5px; height:auto;}
.outlogin .login_title{height:20px; margin:1px; background-color:#cdcdcd;}
.outlogin .indata{margin:5px 0px;}
.outlogin .indata .login_form{float:left; width:60%;}
.outlogin .indata .login_form input{width:100%; border:1px solid #dfdfdf; font-size:12px; color:#7dacd8; height:18px;}
.outlogin .indata .login_btn{float:right; padding:1px;}
.outlogin .indata .login-button input{width:60px; height:41px;}
.outlogin .indata .member_image{float:left; width:58px; height:58px; padding:2px; margin:1px; border:1px solid #dfdfdf;}
.outlogin .indata .member_data{width:108px; float:right; height:auto; line-height:1.8em; padding-left:2px;}
.outlogin .indata .member_info{float:right; position:absolute; padding:0 0.5em;}
.outlogin .indata dd{line-height:1.8em; padding-left:2px;}
.outlogin .login_link{padding:4px; clear:both; background-color:#ededed;}
*/

/* outlogin New ------------------------------*/
.accountWrap{width:400px; margin:200px auto; border:8px solid #bcc56a; padding:30px; position:relative; font-size:1.2em;}
.accountWrap h2{background:url('../img/account/Logo.png') 0 50% no-repeat; color:#1f8c4b; text-indent:45px; font-size:1.2em; font-weight:bold; height:40px; line-height:40px; margin-bottom:30px;}
.accountWrap .osiraseText{display:none; color:#cd282e; border:2px solid #cd282e; border-radius:8px; padding:10px 10px 10px 35px; background:#fffed4 url('../img/account/caption.png') 10px 50% no-repeat; position:relative; margin-bottom:20px;}
.accountWrap .osiraseText p{margin-right:20px; text-align:justify;}
.accountWrap .osiraseText p #popMark{cursor:pointer;}
.accountWrap .osiraseText span.closeX{position:absolute; top:10px; right:10px; cursor:pointer;}
.accountWrap .osiraseText span.popText{background-color:#ffffff; width:250px; position:absolute; padding:10px 15px; border:2px solid #585951; color:#585951; border-radius:10px; text-align:justify; left:110px; top:-5px; z-index:5; display:none;}
.accountWrap .osiraseText span.popText em{width:19px; height:11px; position:absolute; top:35px; left:-19px; background:url('../img/account/popTextEm.png') 0 0 no-repeat;}

.accountWrap .osiraseText span.popText b{color:#cd282e;}
.accountWrap fieldset{margin-bottom:50px;}
.accountWrap input[type=text], .accountWrap input[type=password]{width:378px; padding:10px; margin-bottom:20px; border:1px solid #a1a1a1; color:#a1a1a1; border-radius:8px;}
.accountWrap input[type=submit]{background-color:#26884f; color:#ffffff; position:absolute; bottom:30px; right:30px; border:none; padding:10px 30px; border-radius:8px; cursor:pointer;}
.accountWrap input[type=submit]:hover{background-color:#09bc5e;}
.accountWrap .newAccount{position:absolute; top:30px; right:30px; padding:10px 22px; border:2px solid #26884f; border-radius:8px; color:#656764;}
.accountWrap .accountText{color:#26884f; margin-bottom:10px;}

/* signup ------------------------------*/
.accountWrap .acCheck{overflow:hidden; color:#656764; line-height:1.7em;}
.accountWrap .acCheck a{color:#26884f;}
.accountWrap .acCheck p{float:right; padding:5px 22px; border:2px solid #26884f; border-radius:8px; margin-top:10px;}
.accountWrap .acCheck p input[type="checkbox"]{vertical-align:text-top; margin-top:3px; width:13px; height:13px !important;}

/*-- calendar ------------------------------*/
#calendar_outline{margin:0 4px; clear:left; padding:0px; list-style:none; border:1px solid #a3a7a8; text-align:center;}
#calendar_outline .subtitle dt{background-color:#60686b; height:25px; line-height:25px; color:#fff;}
#calendar_outline .subtitle dd{padding-top:5px;}
#calendar_outline .indata{margin:0; display:inline-block; text-align:center;}
#calendar_outline .indata ul{margin:0; padding:0; list-style:none; font-size:0.9em; display:inline-block;}
* html #calendar_outline .indata ul{display:inline;} /* IE6 hack - IEお前!!! */
#calendar_outline .indata li{float:left; width:24px; height:24px; line-height:24px;}
#calendar_outline .indata .sunday{color:#ff0000;}
#calendar_outline .indata .saturday{/*color:#0000ff;*/color:#ff0000;}
#calendar_outline .indata .today{text-decoration:underline; font-weight:bold;}
#calendar_outline .indata .weekday{}

/*-- bottom menu NAV --------------------------*/
.btmNavMENU{background-color:#EEEEEE; color:#000000; overflow:hidden; padding:50px 0 0;}
.btmNavMENU nav .btmNav2{width:1200px; margin:0 auto;text-align:left;overflow:hidden;}
.btmNavMENU nav .btmNav2 dl {float:left; width:180px; margin-right:60px; margin-bottom:30px;text-align:left;}
.btmNavMENU nav .btmNav2 dl:nth-child(5n){margin-right:0 !important;}
.btmNavMENU nav .btmNav2 dl:nth-child(5n+1){clear:both;}
.btmNavMENU nav .btmNav2 dt {font-size:14px; padding:5px 0; border-bottom:1px solid #000000; margin-bottom:5px;text-align:left;margin-top: 30px;}
.btmNavMENU nav .btmNav2 dd {padding:5px 0;text-align:left;}
.btmNavMENU nav .btmNav2 dd a{color:#000000;}
.btmNavMENU nav .btmNav2 dd a:hover{text-decoration:underline;}

/*-- bottom menu NAV2 --------------------------*/
.btmNavMENU2{background-color:#ffffff; color:#000000; overflow:hidden; padding:50px 0 20px;}
.btmNavMENU2 nav .btmNav3{width:1200px; margin:0 auto;text-align:left;overflow:hidden;}
.btmNavMENU2 nav .btmNav3 dl {float:left; width:180px; margin-right:60px; margin-bottom:30px;text-align:left;}
.btmNavMENU2 nav .btmNav3 dl:nth-child(5n){margin-right:0 !important;}
.btmNavMENU2 nav .btmNav3 dl:nth-child(5n+1){clear:both;}
.btmNavMENU2 nav .btmNav3 dt {font-size:14px; padding:5px 0; border-bottom:1px solid #000000; margin-bottom:5px;text-align:left;margin-top: 30px;}
.btmNavMENU2 nav .btmNav3 dd {padding:5px 0;text-align:left;}
.btmNavMENU2 nav .btmNav3 dd a{color:#000000;}
.btmNavMENU2 nav .btmNav3 dd a:hover{text-decoration:underline;}

/*-- bottom menu --------------------------*/
#btm_outline{padding-top:20px;}
.btmNavBlock{background-color:#000000; color:#ffffff; overflow:hidden; padding:50px 0 20px;}
.btmNavBlock nav{width:960px; margin:0 auto; text-align:left; overflow:hidden;}
.btmNavBlock nav .compInfo{width:360px; float:left;}
.btmNavBlock nav .btmNav{width:600px; float:left}
.btmNavBlock nav .btmNav dl{float:left; width:160px; margin-right:60px; margin-bottom:30px;}
.btmNavBlock nav .btmNav dl:nth-child(3n){margin-right:0 !important;}
.btmNavBlock nav .btmNav dl:nth-child(3n+1){clear:both;}
.btmNavBlock nav .btmNav dt{font-size:14px; padding:5px 0; border-bottom:1px solid #ffffff; margin-bottom:5px;}
.btmNavBlock nav .btmNav dd{padding:5px 0;}
.btmNavBlock nav .btmNav dd a{color:#ffffff;}
.btmNavBlock nav .btmNav dd a:hover{text-decoration:underline;}

#copy_outline{background-color:#000000; color:#ffffff; padding-bottom:20px;}

#bottom_menu{margin-top:10px; margin-bottom:20px;}
#bottom_menu ul{padding:5px 0;}
#bottom_menu li{float:left; text-align:center; width:160px; height:25px; line-height:25px;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---- Yotsuba insatsu settings <<<----------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
/*-- topt menu --------------------------*/
.ddsubmenustyle, .ddsubmenustyle ul{margin:0 0 0 2px; padding:0; position:absolute; left:0; top:0; list-style-type:none; background:white; border:1px solid #b3cc1e; border-top-width:0; visibility:hidden; z-index:300;} /* topmost and sub ULs, respectively */
.ddsubmenustyle li{line-height:0;}
.ddsubmenustyle li a{display:block; width:123px; color:black; background-color:#ffffe0; text-decoration:none; padding:5px 0; border-top:1px solid #b3cc1e; line-height:1; text-align:center;}
* html .ddsubmenustyle li a{display:inline-block;} /* IE6 CSS hack */
.ddsubmenustyle li a:hover{background-color:#ffcc00; color:#ffffff;}
/* Neutral CSS */
.downarrowpointer{padding-left:4px; border:0; display:none;} /* CSS for "down" arrow image added to top menu items */
.rightarrowpointer{position:absolute; padding-top:3px; right:2px; border:0; display:none;} /* CSS for "right" arrow image added to drop down menu items */
.ddiframeshim{position:absolute; z-index:500; background:transparent; border-width:0; width:0; height:0; display:block;}
/* Matt Black Strip Main Menu Bar CSS */
#ddtopmenubar {width:762px; text-align:center;}
.mattblackmenu ul{margin:0; padding:0; list-style-type:none; overflow:hidden; width:100%;}
.mattblackmenu li{display:inline; margin:0;}
.mattblackmenu li a{float:left; display:block; text-decoration:none; margin:0; height:31px; line-height:31px; text-align:center; border-left:2px solid #ffffff; color:#60686b; background:#c0d735; width:125px;} /* padding inside each tab, right divider between tabs */
.mattblackmenu li a:visited{color:#60686b;}
.mattblackmenu li a:hover{background:#b3cc1e;} /* background of tabs for hover state */
.mattblackmenu a.selected{background:#b3cc1e;} /* background of tab with "selected" class assigned to its LI */
.ytb_topmenu {width:184px; height:31px; line-height:31px; float:left; display:block; text-decoration:none; margin:0; border-left:4px solid #ffffff; border-right:6px solid white; color:#60686b; text-align:center; background-color:#c0d735;}
.myAcount{display:block; background-color:#f4c716;}
.myAcount:hover{background-color:#ffdb4c; text-decoration:none;}

/*-- topt menu New --------------------------*/
.topmenu{position:relative;}
.topmenu ul{display:none; position:absolute; top:50px; left:0; z-index:999; border-radius:0 0 5px 5px; box-shadow:#dddddd 1px 1px 3px; height:auto !important; overflow:hidden;}
.topmenu:hover ul{display:block;}
.topmenu li{background-color:#ffffff; width:210px; border-bottom:none !important;}
.topmenu li a{display:block; color:#5d5d5d; padding:5px 20px; height:40px; line-height:40px; text-align:left;}
.topmenu li a:hover{background-color:#efefef; color:#ff3300;}

/*-- left menu --------------------------*/
#dhtmlgoodies_slidedown_menu{margin:4px; visibility:hidden; padding:0px;}
#dhtmlgoodies_slidedown_menu div{margin:0px; padding:0px;}
#dhtmlgoodies_slidedown_menu ul{margin:0px; padding:0px; position:relative; list-style:none;}
#dhtmlgoodies_slidedown_menu li{list-style-type:none; position:relative; display:block;}
/* All A tags - i.e menu items. */
#dhtmlgoodies_slidedown_menu a{display:block; clear:both;}
#dhtmlgoodies_slidedown_menu .slMenuItem_depth1{padding-left:10px; background:#ffffff; height:25px; line-height:25px; text-decoration:none; margin:2px 0; border:1px solid #909495;} /* Main menu items */
#dhtmlgoodies_slidedown_menu .slMenuItem_depth2{padding:5px; background:#ffffff url(../img/lm_back_sub.jpg) 8px 0px no-repeat; border-bottom:1px dotted #e5e5e5; text-indent:15px;} /* Sub menu items */
#dhtmlgoodies_slidedown_menu .slMenuItem_depth3{padding:5px; text-indent:15px;} /* Sub menu items */
#dhtmlgoodies_slidedown_menu .slMenuItem_depth4{padding:5px;} /* Sub menu items */
#dhtmlgoodies_slidedown_menu .slMenuItem_depth5{padding:5px;} /* Sub menu items */
#dhtmlgoodies_slidedown_menu .slideMenuDiv1 ul{padding:0px;}
#dhtmlgoodies_slidedown_menu .slideMenuDiv2 ul{padding:0px;}
#dhtmlgoodies_slidedown_menu .slideMenuDiv3 ul{text-indent:10px; padding:0px; border-bottom:1px dotted #e5e5e5;}
#dhtmlgoodies_slidedown_menu .slMenuItem_depth4 ul{text-indent:20px; padding:0px;}
#menu_div{margin:4px; padding:0px; text-align:center; height:24px; background:#ffffff url(../img/lmenuback.png) no-repeat;}
#menu_div #print_mn, #menu_div #nbt_mn{width:90px; height:24px; line-height:24px; display:inline-block;}
*html #menu_div, *html #menu_div{height:auto;}
*html #menu_div #print_mn{margin-right:4px;}
*html #menu_div #print_mn, *html #menu_div #nbt_mn{cursor:pointer;}
*+html #menu_div, *+html #menu_div{height:auto;}
*+html #menu_div #print_mn{margin-right:4px;}
*+html #menu_div #print_mn, *+html #menu_div #nbt_mn{cursor:pointer;}
#print_mn_target li{position:relative;}
#print_mn_target li .moveHandler{position:absolute; left:0; top:0; width:20px; height:26px; text-align:center; font-size:1.4em; background:#888888 url('../img/Smart/moveHandler.png') 50% 50% no-repeat; color:#ffffff; text-indent:-2000px; /*cursor:pointer;*/}
#print_mn_target li .moveHandler:hover{background-color:#66cc00;}
.placeholderMn{background-color:#fafafa !important; height:28px;}

/*-- index --------------------------*/
/* slide */
.duo__cell{width:100%; height:300px; overflow:hidden;}
.flickity-viewport{overflow:hidden; position:relative; height:100%;}
.flickity-slider{position:absolute; width:100%; height:100%;}
.flickity-enabled{position:relative;}
.carousel{background:#ffffff; margin-bottom:20px; counter-reset:carousel-cell;}
.carousel-cell{width:860px; height:280px; margin-right:0; background:#ffffff; counter-increment:carousel-cell; opacity:0.5;}
.is-selected{opacity:1;}
.flickity-prev-next-button{position:absolute; top:50%; width:44px; height:44px; border:none; border-radius:50%; background:white; background:hsla(0, 0%, 100%, 0.75); cursor:pointer; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.flickity-prev-next-button.previous{left:10px;}
.flickity-prev-next-button.next{right:10px;}
.flickity-prev-next-button:hover{background:white;}
.flickity-prev-next-button:disabled{opacity:0.3; cursor:auto;}
.flickity-page-dots{position:absolute;width:100%;bottom: 10px;padding:0;margin:0;list-style:none;text-align:center;line-height:1;}
.flickity-page-dots .dot{display:inline-block;width: 6px;height: 6px;margin:0 8px;background:#333;border-radius:50%;opacity:1;cursor:pointer;background:transparent;border:2px solid white;}
.flickity-page-dots .dot.is-selected{opacity:1; background:white;}

/* slide old */
#latest_slide{height:280px; position:relative; background:url(../img/backlogo.jpg) no-repeat 350px 125px;}
#latest_slide ul.ui-tabs-nav{position:absolute; left:860px; background:#dddddd;}
#latest_slide ul.ui-tabs-nav li{font-size:12px; float:left; width:100px;}
#latest_slide ul.ui-tabs-nav li img{border:1px solid #eeeeee; margin:1px;}
#latest_slide li.ui-tabs-nav-item a{display:block; height:56px;}
#latest_slide li.ui-tabs-nav-item a:hover{background:#cccccc;}
#latest_slide li.ui-tabs-selected{background:#ffcc00;}
#latest_slide li.ui-tabs-active{background:#ffcc00;}
#latest_slide ul.ui-tabs-nav li.ui-tabs-selected a{}
#latest_slide .ui-tabs-panel{width:860px; height:280px; background:#ffffff; position:relative;}
#latest_slide .ui-tabs-panel .info{position:absolute; top:210px; left:0; height:70px; background:url(../img/mainimg/transparent-bg.png);}
#latest_slide .info h3{font-size:18px; color:#ffffff; padding:5px 10px; margin:0; overflow:hidden;}
#latest_slide .info h3 a{color:#ffffff;}
#latest_slide .info p{margin:0 10px; font-size:11px; line-height:15px; color:#f0f0f0;}
#latest_slide .ui-tabs-hide{display:none;}
/*スライドコンテンツ
#latest_slide #fragment-2{background:#ffffff url('../img/mainimg/image2.jpg') no-repeat center; position:relative;}
#latest_slide #fragment-2 span{display:inline-block; width:250px; position:absolute; top:10px; right:10px; line-height:1.2em;}*/

/*-- accordion skin ------------------------------*/
#accordion{margin:4px 1px 4px 4px;}
#accordion h3{height:30px; line-height:30px; background:#505659 url(../img/cell.png) no-repeat; margin-top:1px; text-indent:20px; cursor:pointer; color:#ffffff; _background:none; _background-color:#505659; zoom:1; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=./img/cell.png, sizingMethod=crop);}
#accordion #accordion_left{margin-right:4px; float:left; width:49%;}
#accordion #accordion_right{margin-left:4px; float:left; width:49%;}
#accordion .accimg{padding-top:5px; padding-right:10px;}
#accordion span{line-height:1.5em;}
.accditext{display:block\9; width:190px\9;}
#accordion p{text-align:right; padding:2px;}
#accordion p a{color:#8c8c8c; text-decoration:underline;}
#accordion .bnrimg{margin-top:5px;}
#accordion .hover{background-color:#49691f;}

/*-- right ------------------------------*/
.latest_right{margin:5px 4px 4px 2px;}
* html .latest_right{margin-top:5px; margin-left:3px; position:absolute;} /* IE6 CSS hack */
*+ html .latest_right{margin-top:5px; margin-left:3px; position:absolute;} /* IE7 CSS hack */
.latest_right h3{margin-bottom:4px;}
/*.latest_right .twitter{position:relative;}
* html .latest_right .twitter, *+ html .latest_right .twitter{margin-top:4px;}
.latest_right .twitter{border:1px solid #a3a7a8; width:184px; min-height:17px;}
.latest_right .twitter dt{background-color:#c0d735; height:25px; line-height:25px; color:#60686b; text-align:center;}
.latest_right .twitter dd .twtr-hd, .latest_right .twitter dd .twtr-ft{visibility:hidden; width:0; height:0; line-height:0; overflow:hidden; position:absolute; top:-10000px;}
.latest_right .twitter dd .ytb-join-conv{position:absolute; color:#ffffff; bottom:8px; right:10px;}
.latest_right .twitter dd .twlogo{position:absolute; color:#ffffff; bottom:25px; left:10px;}
.latest_right .twitter #twitter_btm{height:55px; background-color:#c0d735;}
.latest_right .twitter #twitter_btm span{visibility:hidden; width:0; height:0; line-height:0; overflow:hidden; position:absolute; top:-10000px;}*/
.latest_right .imgbnr img{margin-top:4px;}
.latest_right .socialLink{padding:2px 0 3px 54px; background:url(../img/mainimg/voice.png) no-repeat 0 2px;}

.socialBnr a{float:left;}
.socialBnr a img{width:100%;}
#twitter-widget-0{margin-bottom:10px !important;}
.btmMenuList{background-color:#f6f6f6; padding:10px; overflow:hidden; margin-bottom:10px;}
.btmMenuList dl{margin:0 10px 20px 10px;/* float:left; width:167px;*/}
.btmMenuList dt{border-bottom:1px solid #828a8c; color:#828a8c; height:40px; line-height:40px; margin-bottom:5px;}
.btmMenuList dd{height:25px; line-height:25px; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; overflow: hidden;}
.btmMenuList dd a{color:#828a8c;}
.btmMenuList dd a:hover{}
#index_left .btmMenuList{padding:0 !important; margin:4px !important;}
#index_left .btmMenuList dl{margin:0 10px 5px;}

/*-- go to cart --------------------------*/
#gotocart{margin:4px; clear:left; height:60px; padding:0px; text-align:center; background:#ffffff url(../img/gocart.jpg) no-repeat 50% 50%; cursor:pointer;}
#gotocart span{color:#ffffff; margin-top:40px; display:inline-block;}
#gotocart a{color:#ffffff; text-decoration:none;}
#gotocart #c_cnt{text-align:right; width:80px; margin-right:15px;}
#gotocart #c_price{text-align:right; width:68px; margin-right:20px;}
.cart_errmsg {color:#ff0000; font-size:14px }

/*-- use soft --------------------------*/
#soft_outline{margin:4px; clear:left; padding:0px; list-style:none; text-align:center;}
#soft_outline .subtitle{background-color:#c0d735; height:25px; line-height:25px; color:#60686b;}
#soft_outline .indata{margin:0; text-align:center;}

/*-- printing page css ----------------------------------------------------*/
#ytb_outline{padding:0px 4px;}
#ytb_outline .menuTitle{font-size:1.4em; font-weight:bold; padding:10px; background-color:#e9e9e9; height:10px; line-height:10px; position:relative;}
#ytb_outline .menuTitle span{position:absolute; top:2px; right:5px;}
#ytb_outline .menuText{padding:5px; line-height:1.5em;}
/*#ytb_outline .menuText{padding:5px; width:60%; line-height:1.5em;}*/
#ytb_outline .line{height:1px; background-color:#c0d735; font-size:0px; line-height:0px; overflow:hidden;}
#ytb_outline .lineMargin{margin:3px 0;}
#ytb_outline .titleLine{height:45px;}
#ytb_outline .priceLine{height:35px;}
#ytb_outline .priceLine div{position:relative; text-align:center;}
#ytb_outline .priceLine p{position:absolute; display:none; color:#ffffff; text-align:center; top:-75px; z-index:999; padding:20px; font-size:1.2em; font-weight:bold; white-space:nowrap; border:rgba(116, 25, 25, 0.8) solid 1px; border-radius:5px; padding:10px; background-color:rgba(151, 31, 31, 0.8); border:rgb(116, 25, 25) solid 1px\9; background:url('../img/price_back.png')\9;}
#ytb_outline .priceLine a{padding:2px;}
.addtdtext{text-shadow:rgba(150, 150, 150, 0.8) 1px 2px 1px;}
#ytb_outline .maisu{text-indent:10px;}
#ytb_outline #banner{margin:5px 0; overflow:hidden;}
#ytb_outline #banner li{float:left; text-align:center; padding-left:4px; font-size:0.8em; min-width:68px;}
* html #ytb_outline #banner li{width:68px;}
#ytb_outline .price{clear:both; padding-top:2px; font-size:0.9em;}
#ytb_outline .obimg{margin:5px 0 5px 10px; width:284px; float:right;}
#ytb_outline #tgt_img{height:250px; background-color:#000000;}
#ytb_outline .smartLink{padding:0 0 10px 20px;}
#ytb_outline .smartP{margin:30px 0 10px 10px; background:url('../img/smartSimbol.jpg') center left no-repeat; text-indent:15px; height:24px; line-height:24px;}
#ytb_outline .smartBtn{overflow:hidden; margin-bottom:10px;}
#ytb_outline .smartBtn li{float:left; margin:0 5px;}

#printText dl{clear:both;}
#printText dt{float:left; padding:7px 3px; width:50px; text-align:center; color:#c0d735; background:#ffffff url(../img/subtitle.jpg) no-repeat 50% 50%; height:30px; line-height:30px;}
#printText dd{float:left; padding:7px 3px; width:678px;}

/* order */
#order_info, #order_info .plus_opt{margin-top:10px;}
#order_info ul{border-top:1px solid #bbbbbb; border-left:1px solid #bbbbbb;}
#order_info li{border-right:1px solid #bbbbbb; border-bottom:1px solid #bbbbbb; overflow:hidden;}
* html #order_info li{height:30px;}
#order_info dt, #order_info dd{line-height:30px; height:30px;}
#order_info dt.dbHg, #order_info dd.dbHg{height:60px;}
#order_info dt.autoHg, #order_info dd.autoHg{height:auto; overflow:hidden;}
#order_info dt{width:15%; padding:0 10px; border-right:1px solid #bbbbbb; text-align:center; font-weight:bold; background-color:#e2e2e2; color:#474747; box-sizing: border-box;}
#order_info dd{width: 85%; padding:0 10px; box-sizing: border-box;}
#order_info dd label.inblock{display: inline-block;}
#order_info .opttitle{padding:0 10px; line-height:30px; font-weight:bold; background-color:#e2e2e2; color:#466c8a;}
#order_info .ytb_price{height:50px; line-height:50px; border:1px solid #bbbbbb; text-align:right; padding:10px; font-size:2em; font-weight:bold; margin:10px 0;}
#order_info .oriopt{}

#order_info .ovUl dd{width: 80%;}

#order_foot {text-align:right;}
#opt_box ul{margin-top:10px;}
* html #opt_box .boxli, #opt_box .tdtitle{height:90px;}
#opt_box .kakoutitle{line-height:30px; padding-left:10px;}
#opt_box td{vertical-align:middle; text-align:center; padding:10px;}
#opt_box .tdtitle{border-right:1px solid #bbbbbb; padding:0 10px; line-height:20px; background-color:#e2e2e2; width:180px}
.radiobtn{margin:2px -1px 0 75px; vertical-align:top;}
.bankText{color:#ff4000; display:block; padding:5px 5px 5px 120px; display:none;}

/* order success */
#success{margin:30px;}
#success .end{height:45px; background:#ffffff url(../img/success/end.jpg) no-repeat 13px 0; text-indent:-5000px;}
#success ul{border:3px solid #e4e4e4; padding:10px; overflow:auto;}
* html #success ul{height:370px;}
#success li{float:left;}
#success .s_mleft{width:385px; padding:3px 13px 3px 3px; border-right:1px solid #c1c1c1;}
#success .s_mright{width:260px; padding-left:10px; text-align:center;}
* html #success .s_mright{padding-left:8px;}
#success .arigato{height:72px; background:#ffffff url(../img/success/arigato.jpg) no-repeat; text-indent:-5000px; padding-bottom:15px;}
#success .tokubnr{text-align:center; margin-top:30px;}
#success .gomain{text-align:right; text-decoration:underline; margin-top:30px;}
#successCredit ul{margin:50px auto; width:500px;}
#successCredit li.goCreditText{background-color:#fffde6; border:2px solid #cd282e; border-radius:10px; padding:30px 15px; text-align:justify; margin-bottom:20px;}
#successCredit li.goCreditText p{font-size:20px; font-weight:bold; text-align:center; color:#cd282e; margin-bottom:20px;}
#successCredit li.goCreditForm{padding-top:50px; background:url('../img/success/CreditYaji.jpg') 50% 0 no-repeat; text-align:center;}
#successCredit li.goCreditForm input[type=submit]{padding:10px 20px; background-color:#cd282e; color:#ffffff; font-size:20px; border:none; border-radius:10px; cursor:pointer;}
#successCredit li.goCreditForm input[type=submit]:hover{background-color:#8a8a8a;}
#successCredit .thanksMsg{margin:50px auto; width:500px; border:2px solid #cd282e; border-radius:5px; overflow:hidden;}
#successCredit .thanksMsg p{background-color:#fbc82e; color:#ffffff; font-size:18px; text-indent:10px; margin-bottom:5px;}
#successCredit .thanksMsg div{padding:20px 30px; font-size:14px; line-height:1.7em;}
#successCredit .thanksMsg div span{color:#cd282e; font-size:18px;}
#successCredit .thanksMsg div strong{color:#cd282e; font-size:30px; display:block; margin:10px 0;}

/*-- insatsu infomation page css ----------------------------------------------------*/
#insatsu{margin:10px;}
#insatsu a{color:#ee0000;}
#insatsu img{margin:5px;}
#insatsu p{font-weight:bold; font-size:1.4em; height:30px; line-height:30px; color:#333333; background:#ffffff url(../img/t_logo.jpg) no-repeat 5px 0; text-indent:35px; margin-top:10px; margin-bottom:20px;}
#insatsu dl{margin-bottom:80px;}
#insatsu dt{font-size:1.2em; height:25px; line-height:25px; border-left:10px solid #c0d735; text-indent:10px; background-color:#505659; color:#ffffff;}
#insatsu dd{padding:5px; color:#4e4e4e;}
#insatsu .insert{padding:10px; color:#4e4e4e; border:1px dashed #cdcdcd; margin-bottom:10px;}
#insatsu .checkpoint{padding:10px; border:1px dashed #1e8ac8; margin-bottom:10px;}
#insatsu .red{color:#ee0000;}
#insatsu .sub{font-weight:bold; border-bottom:1px dashed #cdcdcd;}
#insatsu .imgtext{padding:5px 0; display:inline-block; color:#000000;}
#insatsu div .template{width:19%; height:20px; line-height:20px; display:inline-block;}
#insatsu dd .template{width:33%; height:20px; line-height:20px; text-align:center; display:inline-block;}
#insatsu .udline{border-bottom:1px dotted #c1c1c1;}
#insatsu .tem_a{color:#000000;}
#insatsu table{border-left:1px solid #787878; border-top:1px solid #787878;}
#insatsu th{background-color:#4e6ca4; color:#ffffff;}
#insatsu th, #insatsu td{border-right:1px solid #787878; border-bottom:1px solid #787878; width:150px; height:25px; line-height:25px; text-align:center;}
#insatsu #paper table{border-left:1px solid #787878; border-top:1px solid #787878;}
#insatsu #paper th{background-color:#4e6ca4; color:#ffffff; border-right:1px solid #787878; border-bottom:1px solid #787878; width:auto;}
#insatsu #paper .kind{width:250px;}
#insatsu #paper td{border-right:1px solid #787878; border-bottom:1px solid #787878; padding:5px 5px 5px 10px; text-align:left; width:auto; line-height:1.4em;}
#insatsu #paper .dotline{border-bottom:1px dotted #787878;}
#insatsu dd .linkLine{text-decoration:underline;}

.iPhoneBtn{background-color:#585858; padding:10px; font-size:1.6em; font-weight:bold; text-align:center; color:#ffffff; display:inline-block; border-radius:8px; margin:20px 10px;}
.iPhoneBtn:hover{text-decoration:none; background-color:#8a8a8a;}

/*-- yotsuba infomation page css ----------------------------------------------------*/
#yotsuba{margin:10px;}
#yotsuba a{color:#ee0000;}
#yotsuba p{font-weight:bold; font-size:1.4em; height:30px; line-height:30px; color:#333333; background:#ffffff url(../img/t_logo.jpg) no-repeat 5px 0; text-indent:35px; margin-top:10px; margin-bottom:6px;}
#yotsuba dl{margin-bottom:20px;}
#yotsuba dt{font-size:1.2em; height:25px; line-height:25px; border-left:10px solid #c0d735; text-indent:10px; background-color:#505659; color:#ffffff;}
#yotsuba dd{padding:5px; color:#4e4e4e;}
#yotsuba .insert{padding:10px; color:#4e4e4e; border:1px dashed #cdcdcd; margin-bottom:10px;}
#yotsuba .red{color:#ee0000;}


/*-- テンプレートページ変更スタイル ----------------------------------------------------*/
.menu-item {background: #fff;color: #000;cursor: default;display: block;margin-bottom: 1px;position: relative;border: 1px solid #c0d735;}
.menu-item_link {color: #000 !important;display: block;padding: 1rem;text-decoration: none;}
.menu-item_link:hover{text-decoration: underline;background: #c0d735;color: #00000075 !important}
.submenu {background: #fff;display: none;}
.submenu:target{height: auto; display: block;padding-top: 80px;margin-top: -80px;}
.submenu-item {border-bottom: 1px dotted #c1c1c1;color: #222;padding: 1rem;list-style: none;}
.submenu-item:hover{background: #c0d735;color: #fff !important;}
.template {width: 33%;height: 20px;line-height: 20px;text-align: center;display: inline-block;}






/*-- お知らせ(yotsuba_basic) ----------------------------------------------------*/
#osirase{margin:4px;}
/* view */

/*#osirase fieldset{margin-bottom:5px; padding:5px; overflow:hidden; border:1px solid #cccccc;}#osirase p{padding:5px;}#osirase .dash{border-bottom:1px dashed #dddddd;}#osirase label{width:10%; text-align:right; float:left; padding-right:10px;}#osirase .text{width:85%;}#osirase .info{width:50%;}*/

/*-- ライターリスト ----------------------------------------------------*/
#lighter{margin:4px;}
#lighter .explain_title{height:27px; line-height:27px; color:#878787; font-size:1.4em; font-weight:bold; border-bottom:6px solid #dedede; text-indent:30px; background:url(../img/n_title.jpg) no-repeat;}
#lighter .explain_text{padding-top:5px; border-bottom:6px solid #dedede;}
#lighter .explain_text table{margin:6px 0; border-top:1px solid #949494; border-left:1px solid #949494;}
#lighter .explain_text td{padding:5px; border-bottom:1px solid #949494; border-right:1px solid #949494;}
#lighter .explain_text .item{background-color:#edecee; text-align:center; width:20%;}
#lighter .lighter_list .lighterimg{border:2px solid #bebebe; margin:0 10px 0 -5px;}
#lighter .lighter_list li{padding:5px; border:1px solid #dedede; width:363px; float:left; margin:5px 0; background-color:#f1f1f1;}
#lighter .lighter_list .rightmargin{margin-right:5px;}
#lighter .lighter_list .leftmargin{margin-left:5px;}
#lighter .lighter_list dt{height:30px; line-height:30px; font-size:1.2em; color:#333333; text-indent:10px; font-weight:bold; background-color:#dedede;}
#lighter .lighter_list dd{padding:5px; float:left; overflow:hidden;}
#lighter .lighter_list .list_text{height:130px;}

/*-- shop page css ----------------------------------------------------*/
#shop_outline{padding:0px 4px;}
#shop_outline .menuTitle{font-size:1.4em; font-weight:bold; padding:10px; background-color:#e9e9e9; height:10px; line-height:10px; position:relative;}
#shop_outline .menuline{background-color:#e9e9e9; height:10px; line-height:10px; margin-top:5px;}
#shop_outline .menuTitle span{position:absolute; top:2px; right:5px;}
#shop_outline .menuText{padding:5px; width:364px;}
#shop_outline .menuTextItem_ver{padding:5px; width:430px;}
#shop_outline .obimg{margin:5px 8px 5px 0; width:378px;}
#shop_outline .obimgitem_ver{margin:5px 8px 5px 0;}
#shop_outline .obimgitem_ver img{width:300px;}
#shop_outline table{border-left:1px solid #bbbbbb; border-top:1px solid #bbbbbb; margin:5px 0;}
#shop_outline th{border-right:1px solid #bbbbbb; border-bottom:1px solid #bbbbbb;}
#shop_outline td{border-right:1px solid #bbbbbb; border-bottom:1px solid #bbbbbb;}
#shop_outline .cell{height:25px; line-height:25px; text-align:center;}
#shop_outline .green{background-color:#c0d735;}
#shop_outline .gray{background-color:#ededed;}
#shop_outline .obimg img{border:1px solid #bbbbbb;}
#shop_outline .unit{text-align:center; color:#8b0a0a;}
#shop_outline .price{height:30px; line-height:30px; text-align:right; padding:10px; font-size:2em; font-weight:bold;}
#shop_outline .opttitle{text-indent:10px; height:30px; line-height:30px; font-weight:bold; background-color:#e2e2e2; color:#466c8a; border:1px solid #bbbbbb;}
#shop_outline .norberti_price{margin-top:5px;}

/*-- event menu --------------------------*/
#event_menu{margin:4px;}
#event_menu ul{margin:0px; padding:0px; position:relative; list-style:none;}
#event_menu li{list-style-type:none; position:relative; display:block; padding-left:20px; background:#ffffff url(../img/lm_back.jpg) no-repeat; height:25px; line-height:25px; text-decoration:none; margin:2px 0; border:1px solid #909495;}
#event_menu .subtitle{background-color:#c0d735; height:25px; line-height:25px; color:#60686b; text-align:center; border:1px solid #a3a7a8;}
#event_menu a{display:block; clear:both; text-decoration:none;}

/*-- ウェブフライヤー ----------------------------------------------------*/
/* Feature section in ZoomEngine page - Cloud Zoom(http://www.professorcloud.com/mainsite/) */
.zoom-section{margin:4px;}
.zoom-section h2{height:30px; line-height:30px; background-color:#949494; color:#ffffff; text-indent:15px; font-size:1.3em; font-weight:bold;}
/* Feature descriptions in ZoomEngine page */
.zoom-small-image{border:2px solid #cccccc; float:left;}
.zoom-section .yotsuba_call{text-align:right; padding-right:5px; height:20px; line-height:20px;}
.yotsuba_call_flyer{text-align:center;}
/* This is the moving lens square underneath the mouse pointer. */
.cloud-zoom-lens{border:4px solid #888888; margin:-4px; /* Set this to minus the border thickness. */ background-color:#fff; cursor:move;}
/* This is for the title text. */
.cloud-zoom-title{font-family:Arial, Helvetica, sans-serif; position:absolute !important; background-color:#000; color:#fff; padding:3px; width:100%; text-align:center; font-weight:bold; font-size:10px; top:0px;}
/* This is the zoom window. */
.cloud-zoom-big{border:2px solid #cccccc; overflow:hidden; margin-top:2px; margin-left:2px;}
/* This is the loading message. */
.cloud-zoom-loading{color:white; background:#222222; padding:3px; border:1px solid #000000;}

/* bttomピックアップ アコーディオンの更新*/
#bttom_pickup{padding-right:5px; padding-left:5px;}
#bttom_pickup_title{margin-bottom:5px; background-color:#515659; height:29px;}
#bttom_pickup ul li h3{font-size:11px; color:#D60050; font-weight:bold; margin-bottom:3px;}
#bttom_pickup ul li .pickup_list_left{float:left; width:105px; margin-right:6px; margin-left:12px;}
#bttom_pickup ul .li_left{display:block; float:left; width:282px; padding-top:13px; padding-left:0px; background-color:#FFF; height:100%; margin-top:0px; margin-right:1px; margin-bottom:-100px; margin-left:0px; padding-bottom:100px;}
#bttom_pickup ul .li_right{display:block; float:left; width:283px; padding-top:13px; padding-left:0px; margin-right:0px; background-color:#FFF; min-height:100%; height:auto; margin-bottom:-100px; padding-bottom:100px;}
.pickup_list_right{display:block; width:148px; float:right; padding-right:10px;}
.spec_box{border:1px solid #515359; margin-bottom:15px; padding-top:5px; padding-right:5px; padding-bottom:5px; padding-left:10px; background-color:#f5f5f5; line-height:130%; font-size:11px; word-spacing:1px;}
.pickup_list_right p{font-size:10px; display:block; margin-bottom:5px; line-height:150%;}
.pickup_list_right h3 a{color:#D60050;}
.pickup_list_right a{color:#000;}
.pickup_list_right a:hover{text-decoration:none;}
#bttom_pickup ul li{border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:#000; display:block; overflow:hidden; margin:0px; padding:0px; height:100%; background-color:#000; border-top-width:thin; border-top-style:none; border-right-style:none; border-left-style:none;}
#bttom_pickup_title span{float:right; font-size:10px; color:#FFF; display:block; padding-top:15px;}
.smartInfoTable{margin-bottom:25px; }
.smartInfoTable table{margin:6px 0; border-top:1px solid #949494; border-left:1px solid #949494;}
.smartInfoTable td{padding:5px; border-bottom:1px solid #949494; border-right:1px solid #949494;}
.smartInfoTable .item{background-color:#edecee; text-align:center; width:20%;}
.cation{font-weight:bold; color:#F00;}

/* account Line */
.accountTopMenu{position:relative; height:40px; border-bottom:4px solid #c0d735; margin:8px 4px 35px; padding:0 30px;}
.accountTopMenu ul{position:absolute; bottom:-4px; overflow:hidden;}
.accountTopMenu li{float:left; width:150px; margin:0 2px;}
.accountTopMenu li a{text-align:center; height:40px; line-height:40px; border:4px solid #c0d735; display:block; border-radius:10px 10px 0 0; color:#000000; font-size:1.2em;}
.accountTopMenu li a.selectedTab{border-bottom:4px solid #ffffff;}
#account_outline{margin:0 40px 50px;}
#account_outline h2{font-size:1.2em; height:25px; line-height:25px; border-left:10px solid #c0d735; text-indent:10px; background-color:#505659; color:#ffffff; margin:20px 0;}
#account_outline .accountTable{width:100%; border:1px solid #9d9d9d; border-collapse:collapse; margin-bottom:30px;}
#account_outline .accountTable #CompanyTr{display:none;}
#account_outline .accountTable th{width:150px; text-align:center; border:1px solid #9d9d9d; background-color:#e2e2e2;}
#account_outline .accountTable td{padding:20px 100px; border:1px solid #9d9d9d; position:relative;}
#account_outline .accountTable td input[type=radio]{margin-top:2px; margin-right:5px; vertical-align:top;}
#account_outline .accountTable td span.Required{position:absolute; top:22px; left:40px; color:#ffffff; background-color:#e4101f; border-radius:5px; padding:5px 10px;}
#account_outline .accountTable td span.accRadio{margin-right:50px; display:inline-block;}
#account_outline .accountTable td input[type=text], #account_outline .accountTable td input[type=password], #account_outline .accountTable td select{height:30px; padding:0 5px; box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box; -webkit-box-sizing:border-box; margin-bottom:5px;}
#account_outline .accountTable td .accInfo{width:100%;}
#account_outline .accSubmit{}
#account_outline .center{text-align:center;}
#account_outline .accBtn{overflow:hidden; margin-bottom:30px;}
#account_outline .accBtn input[type=submit]{background-color:#26884d; color:#ffffff; height:40px; width:150px; border:none; border-radius:10px; font-size:1.4em; cursor:pointer;}
#account_outline .accBtn .rSubmit{float:right;}
#account_outline .accBtn .rBtn{float:right; background-color:#26884d; color:#ffffff; height:40px; line-height:40px; text-align:center; width:120px; border:none; border-radius:10px; font-size:1.4em; display:inline-block;}
#account_outline .accBtn .returnBtn{background-color:#b1c049; color:#ffffff; height:40px; line-height:40px; text-align:center; width:80px; border:none; border-radius:10px; font-size:1.4em; display:inline-block;}
#account_outline .addAddrH2{margin-top:50px;}
.addrSerchBlock{/*margin-bottom:20px; */verflow:hidden; font-size:1.2em;}
.addrSerchBlock .addrSerch{margin:20px 0; overflow:hidden;}
.addrSerchBlock .addrSerch input[type=text]{height:30px; width:150px;}
.addrSerchBlock .addrSerch span{float:right;}
.addrSerchBlock .addrSerch span select{height:30px;}
.addrSerchBlock .addrSerch input[type=button]{display:inline-block; background-color:#3186c7; border:none; border-radius:5px; color:#ffffff; padding:5px 10px; font-size:12px !important;}
.addrList{border-top:1px solid #a0a0a0; border-left:1px solid #a0a0a0; margin-bottom:30px;}
.addrList li{position:relative; padding:20px 30px; border-right:1px solid #a0a0a0; border-bottom:1px solid #a0a0a0; font-size:1.2em;}
.addrList li .LinkBlock{position:absolute; right:12px; top:15px;}
.addrList li .LinkBlock a{display:inline-block; margin:0 3px; border-radius:5px; color:#ffffff; padding:5px 10px; font-size:12px !important;}
.addrList li .LinkBlock a.modBtn{background-color:#b0c248;}
.addrList li .LinkBlock a.delBtn{background-color:#da151f;}
.sales_page{text-align:center; margin-bottom:30px;}
.sales_page span{border:1px solid #cbcbcb; border-collapse:collapse; display:inline-block; padding:6px 12px; font-size:1.2em; cursor:pointer;}
.sales_page span:first-child{border-radius:5px 0 0 5px;}
.sales_page span:last-child{border-radius:0 5px 5px 0;}
.sales_page span.move_list_spot{background-color:#d5d5d5;}

/* admin */
#account_outline .serchForm{text-align:center; margin-bottom:10px;}
#account_outline .adminTable{width:100%; border:1px solid #9d9d9d; border-collapse:collapse; margin-bottom:30px;}
#account_outline .adminTable th{text-align:center; border:1px solid #9d9d9d; background-color:#e2e2e2; padding:10px;}
#account_outline .adminTable td{border:1px solid #9d9d9d; position:relative; padding:10px;}
#account_outline .adminTable td .infoNot{color:#ff0000; display:inline-block; margin-right:5px; font-weight:bold;}
#account_outline .adminTable td .infoYes{color:#0000ff; display:inline-block; margin-right:5px; font-weight:bold;}
#account_outline .accBtn .returnListBtn{background-color:#adadad; color:#ffffff; height:40px; line-height:40px; width:150px; border-radius:10px; font-size:1.4em; margin-left:20px; display:inline-block; vertical-align:top;}
#account_outline .accBtn .returnListBtn:hover{text-decoration:none;}
#myChart{width:100%; height:auto; margin-bottom:10px;}

/* nekopos */
.nekopos{font-family:"Meiryo UI"; font-size:1.2em; line-height:1.7em; color:#727171;}
.nekopos h3{margin-bottom:30px; font-size:2.2em; font-weight:bold; color:#d8677e;}
.nekopos ul{margin-bottom:80px;}
.nekopos li{padding-left:160px; position:relative; margin-bottom:30px;}
.nekopos li.nekoposImg{background:url('../img/nekoposImg.png') right bottom no-repeat;}
.nekopos li.dmImg{background:url('../img/dmImg.png') right bottom no-repeat;}
.nekopos li h4{position:absolute; width:125px; text-indent:10px; height:22px; line-height:20px; color:#ffffff; background-color:#f9c02c; top:6px; left:0;}
.nekopos li b{font-size:2.0em;/* font-weight:bold;*/ color:#009fe9; line-height:1.1em;}
.nekopos li span{color:#009fe9; font-weight:bold;}
.nekopos li span.ableSize{font-size:1.4em;}
.nekopos li .mgbt10{margin-bottom:10px; display:inline-block;}

/* 大量注文用フォーム */
#formWrap {
width:100%;
margin:100px auto 0 auto;
color:#555;
line-height:120%;
font-size:100%;
}

#formWrap h3{
text-align:center;
font-size:24px;
line-height:200%;
}

#formWrap p{
text-align:center;
font-size:18px;
margin-bottom:50px;
}

#formWrap span{
text-align:center;
font-size:8px;
color:#fff;
background:red;
border-radius: 5px;
padding:1px 5px;
margin-left:5px;
}

#formWrap .submit{
margin-top:50px;
}

#formWrap .submit input {
display: inline-block;
width: 200px;
height: 54px;
text-align: center;
text-decoration: none;
line-height: 54px;
outline: none;
border-radius: 20px;
}
#formWrap .submit input::before,
#formWrap .submit input::after {
position: absolute;
z-index: -1;
display: block;
content: '';
}
#formWrap .submit input,
#formWrap .submit input::before,
#formWrap .submit input::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;
}

#formWrap .submit input{
background-color: #333;
color: #fff;
}
#formWrap .submit input:hover {
background-color: #59b1eb;
}


table.formTable{
width:100%;
margin:0 auto;
border-collapse:collapse;
}

table.formTable td,table.formTable th{
border:1px solid #ccc;
padding:10px 20px;
}
table.formTable th{
width:40%;
font-weight:normal;
background:#efefef;
text-align:left;
}
table.formTable td{
width:50%;
}

table.formTable input{
padding:4px;
}

input::placeholder {
font-size: 0.8em;
}

textarea::placeholder {
font-size: 0.8em;
}

.foot_nav{clear: both;}
.foot_nav section{padding: 20px;}
.foot_nav section h4{margin-bottom: 10px; color: #1797d8; font-size: 14px;}
.foot_nav section:first-of-type{background-color: #faeff5;}
.foot_nav section:first-of-type h4{color: #af2d73;}
.foot_nav section div{margin-bottom: 20px;}
.foot_nav section div h5{font-weight: bold;}
.foot_nav section div:last-of-type{margin-bottom: 0;}
.foot_nav section div a{display: inline-block; padding: 5px; color: #000000;}

/*.foot_nav > ul{position: relative; margin: 0 auto; width: 990px; overflow: hidden;}
.foot_nav > ul > li{float: left; width: 25%;}
.foot_nav li h4, .foot_nav li h4 a{margin-bottom: 20px; color: #00bcc7; font-weight: bold;}
.foot_nav li ul{margin-bottom: 30px;}
.foot_nav li ul li{margin-bottom: 5px; padding: 3px 0;}
.foot_nav li ul li a{display: inline-block; color: #000;}*/


/*---------------------------*/
/*------ For Responsive -----*/
/*Changed 2019/12/06 kume*/
/*---------------------------*/
/*---------------------------*/


.pickup_list_right {display: block;
width: 148px;
float: right;
padding-right: 10px;
}
.spec_box {
border: 1px solid #515359;
margin-bottom: 15px;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 10px;
background-color: #f5f5f5;
line-height: 130%;
font-size: 11px;
word-spacing: 1px;
text-align: center;
}

.BannerList img{
height:auto !important;
}

.BannerList h3{
clear: both;
margin: 60px 0px 30px 0px;
font-weight: bold;
padding: 10px 20px 10px 20px;
/*border-top: solid 2px #c8d85b;*/
/*border-bottom: solid 2px #c8d85b;*/
}

.BannerList p{
font-size: 14px;
margin-bottom:20px;
}

.BannerList h4{
font-size: 20px;
margin-bottom:10px;
}

/*ベーシックフォントの記述を改善*/
body {
font-family: "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}

/*body {
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}*/


.BannerList h3 {
/*letter-spacing: .06em;*/
font-size: 2.5em;
line-height: 1.75;
/*border-top: solid 5px #c8d85b !important;*/
/*border-bottom: solid 5px #c8d85b !important;*/
margin-left: .5%;
}

.BannerList h4 {
letter-spacing: .06em;
font-size: 1.67em;
line-height: 1.75;
font-weight: bold;
margin-left: .5%;
}

.BannerList p {
letter-spacing: .06em;
line-height: 1.75;
font-size: 1.34em;
margin-left: .5%;
}

.headWrap .tmenu li a {
font-weight: bold;
letter-spacing: .1em;
font-size: 1em;
cursor: pointer;
}


.tmenu li,.topmenu li a:hover {
transition: .3s cubic-bezier(0.170, 0.935, 0.305, 1.000);
}
.topmenu>ul {
opacity: 0;
animation:tmenuAnimation .5s cubic-bezier(0.170, 0.935, 0.305, 1.000) forwards;
}

@keyframes tmenuAnimation{
from {
opacity:0;
}
to {
opacity:1;
}
}


.duo__cell{
height: unset;
}




header#head_outline {
padding: 10px 0px;
position: fixed;
z-index: 100;
margin-bottom: .1em;
width: 100%;
top: 0;
border-bottom: 1px solid #D0D0D0;
height: 65px;
}


h1.logo {
padding-top: 0px;/*padding-top: 15px*/
}

h1.logo img {width: 100%;}
.headWrap {
padding-top: 0em !important;
}

ul.tSideMenu {
top: auto;
display: flex;
width: 25%;

}

div#dhtmlgoodies_slidedown_menu {
font-size: 1.083em;
}

#dhtmlgoodies_slidedown_menu .slMenuItem_depth1 {
height: 35px;
line-height: 35px;
margin-bottom: .275em;
transition: all .07s ease;
}

#dhtmlgoodies_slidedown_menu .slMenuItem_depth1:hover {
border-color: #bababa;
background: #c8d85b;
color: white;
}



/*---------------------------*/
/*------ For Responsive -----*/
/*Changed 2019/12/06 kume*/
/*---------------------------*/
/*---------------------------*/

/*---------------------------*/
/*------TABLET---------------*/
/*---------------------------*/

@media (max-width:960px) {
.index_outline_backup,#head_outline .headWrap,.btmNavBlock nav{width:unset;}
h1.logo img.absmiddle{width: 150px;}
header#head_outline {
height: unset;
position: fixed;
width: 100%;
top: 0;
opacity: 0.8;
display: flex;
border-bottom: 1px solid #D0D0D0;
}
}



/*---------------------------*/
/*------MOBILE---------------*/
/*---------------------------*/
@media (max-width:430px) {

#latest_notice .indata li {
line-height: 1.75;
height: auto;
min-height: 24px;
}

#latest_notice .indata li a {
color: #555;
letter-spacing: .06em;
font-size: .95em;
}

#latest_notice .indata .time {
color: #999;
}

#latest_notice .subtitle {
padding: 7px 10px;
background-size: cover;
margin-bottom: 1em;
border: none;
box-shadow: 0px 1px 5px #ccc;
border-radius: 3px;
margin: 0 5px 1em 5px;
background: #f3f3f3 url(../img/notice_sub.jpg) no-repeat;
background-position: 0px 0px;
}

#latest_notice {
margin-bottom: 5em;
margin-top: 0em;
}

.flickity-page-dots .dot {
display: none;
}


.flickity-prev-next-button {
display: none;
}

/*-----------スマホ表示トップ画像（2021/11/16山本）----------------*/	
#ytopbana img {
width: 100%;
height: 400px;
object-fit: cover;
}	


/*---------------------------*/
/*--------ここ以下は無理やりです！　今後修正-----------*/
/*---------------------------*/

section {}

section.duo__cell img {
transform: scale(.481);
position: absolute;
top: -73px;
}

.duo__cell {max-height: 147px;/* background: beige; */position: relative;overflow: hidden;}
/*---------------------------*/
/*--------ここまでは無理やりです！　今後修正-----------*/
/*---------------------------*/
.BannerList h3 {
/*font-size: 1.74em;*/
font-size: 24px !important;
letter-spacing: .06em;
margin-bottom: 3em;
margin-top: 4em;
}

#web_outline{
width:unset;
}

article#ytb_outline{
padding: 0px 20px;
}

.glitterTypeH3::before, .glitterTypeH3::after {
display: none;
}

}


article#ytb_notice img {
max-width: 100%;
height: unset;
}

/*---------------------------*/
/*--------ヨツバインフォメーションバナー-----------*/
/*---------------------------*/

#YotsubaInfo{
font-size: 14px;
word-spacing: 1px;
text-align: center;
background: #e12e00;
padding: 12px 0;
color: white;
margin-top: 85px;
}

#YotsubaInfo2 {
font-size: 14px;
word-spacing: 1px;
text-align: center;
background: #00ace1;
padding: 12px 0;
color: white;
font-family: "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}


/* ヘッダー [入稿方法]、[デザイン]非表示 */
.off:nth-child(1),.off:nth-child(5) {display: none;}


/*-------- サイドメニュー&下層ページ編集2020年8月25日 -----------*/

.addMrg50 img{
width:100% !important;
}

.side-navi li {
/*padding: 14px 2.5% !important;*/
border-bottom: 1px dotted gray !important;
}

.side-navi ul {
width: 95% !important;
border: none !important;
margin-left: 0% !important
}

#web_outline {
width: 1200px !important;
}

.BannerList h4 {
font-size: 18px !important;
margin-bottom: 40px !important;
text-align: center !important;
font-weight:normal !important;
}

.BannerList h3 {
margin: 60px 0px 30px 0px !important;
font-size: 36px !important;
text-align: center !important;
border-top: none !important;
border-bottom: none !important;
}

/*-------- サイドナビ編集2020年9月1日 -----------*/

.side-navi li a::before{
display: block;
content: "";
position: absolute;
top: 50%;
left: 5px;
width: 0;
height: 0;
margin-top: -5px;
border: 5px solid transparent;
border-left: 5px solid #ffb3d9;
}

.side-navi li a{
margin-left: 5px;
padding: 10px 2.5% !important;
}

.side-navi li a:hover{
text-decoration: underline;
color:#ffb3d9;
}

/*-------- カテゴリ商品一覧2020年8月27日 -----------*/



.category_item{
overflow: hidden;
padding-top: 80px;
margin-top: -20px;
}

.category_item ul{
display: flex;
flex-wrap: wrap;
/* margin-bottom: 40px; */
}

.category_item ul li{
box-sizing: border-box;
flex: 0 1 calc(100% / 4.2);/* 4.2から変更 */
padding: 15px;
margin-bottom: 20px;
margin-right: 10px;
display: flex;
flex-direction: column;
justify-content: space-between;
display: -webkit-flex;
-webkit-flex-direction: column;
-webkit-justify-content: space-between;
}

.post-content .category_item ul li {
box-sizing: border-box;
flex: 0 1 calc(100% / 3.2);
padding: 15px;
margin-bottom: 20px;
margin-right: 10px;
display: flex;
flex-direction: column;
justify-content: space-between;
display: -webkit-flex;
-webkit-flex-direction: column;
-webkit-justify-content: space-between;
}

.category_item h3.category_item_h3{
margin: 0px 0px 10px 0px;
}

.category_item h3{
font-size: 24px;
text-align: center;
font-weight: bold;
}

.category_item h4{
font-size: 14px;
line-height: 1.75;
text-align: center;
font-weight: normal;
width: 80%;
margin: 0 auto 40px auto;	
}

.category_item li h4{
font-size: 14px;
margin-bottom: 10px;
}

.category_item .title img{
width:100%;
height: 200px;
object-fit: cover;
/*border:1px solid #D0D0D0;*/
padding:1px;
}

.category_item .title h3{
font-size: 13px;
line-height: 2.6;
color: #292929;
font-weight: bold;
line-height: 200%;
}

.category_item .title p{
/*font-size: 14px;*/
line-height: 1.6;
height: 70px;
}

.item-detail{
color: #ff6670;
text-align: center;
padding: 4px 0px;
width: 100%;
border: 1px solid #ff6670;
margin: 10px auto 0 auto;
display: block;
font-size: 14px;
border-radius: 10px;
}

.item-detail2{
color: #668ad8;
text-align: center;
padding: 4px 0px;
width: 100%;
border: 1px solid #668ad8;
margin: 10px auto 0 auto;
display: block;
font-size: 14px;
border-radius: 10px;
}

/*-------- インフォメーション2020年9月1日 -----------*/

.category_item2{
overflow: hidden;
margin-top: -20px
}

.category_item2 ul{
display: flex;
flex-wrap: wrap;
/*margin-left: -10px;*/
/* height:  165px; */
/* margin-bottom: 40px; */
}

.category_item2 ul li{
box-sizing: border-box;
flex: 0 1 calc(100% / 4);
padding: 8px;
height: 200px;
/*  margin-bottom: 20px; */
}

.category_item2 li a{
width: 100%;
}

.category_item2 .title a img{
width:100%;
height: 60%;
object-fit: fill;
border:1px solid #D0D0D0;
padding:1px;
}


@media screen and (max-width: 768px) {

.category_item h3{
font-size: 18px;
}

.category_item h4{
padding: 0 0px;/* 元0 20px */
}

.category_item ul{
margin-left: 0px;
}

.category_item .title img{
height: 140px;
}

.category_item .title h3{
}

.category_item ul li{
box-sizing: border-box;
flex: 0 1 calc(100% / 2.3);
padding: 10px;
margin: 8px;
display: flex;
justify-content: space-between;
}

.post-content .category_item ul li{
box-sizing: border-box;
flex: 0 1 calc(100% / 2.3);
padding: 10px;
margin: 8px;
display: flex;
justify-content: space-between;
}	



.wHarf{
border-radius: 10px;
background: #ffffff;
box-shadow: 3px 3px 3px #dbdbdb, -5px -5px 10px #ffffff;

}

.wHarf.sl::before {
width: 30px;
height: 30px;
}

.sl2::after{
width: 30px;
height: 30px;
margin-top: 110px;
}

.category_item2 ul li{
box-sizing: border-box;
flex: 0 1 calc(100% / 2);
padding: 8px;
height: 60%;
margin-bottom: -16px;
}

.category_item2 ul{
display: flex;
flex-wrap: wrap;
margin-left: 0px;
/* height: 61px; */
margin-bottom: 93px;
}

}

/* トップページのカテゴリtop_category(終わり) */


/* フッター商品カテゴリー */
nav.side-navi2 {
width: auto;
margin: 0 auto;
text-align: left;
display: block;
padding: 0px 2%;	
}

ul.f-list {
display: flex;
flex-direction: column;
flex-wrap: wrap;
height: 4000px;
}

.f-list-category {
margin-top: 30px;
margin-right: 25px;
width: 15%;
}

.f-list-category-title {
font-size: 14px;
padding: 5px 0;
/* border-bottom: 1px solid #000000; */
margin-bottom: 5px;
text-align: left;
margin-top: 30px;
color: #333;
font-weight: bold;
}


.f-item-link {
color: #333;
}


/* totop */

/*--------------------------------
scroll animation fadein
--------------------------------*/
.js-totop-fadein {
-webkit-transition: opacity 1s;
transition: opacity 1s;
visibility: hidden;
opacity: 0;
}

.js-totop-fadein.is-fadein {
visibility: visible;
opacity: 1;
}

/*--------------------------------
arrow
--------------------------------*/
.arrow {
position: fixed;
width: 50px;
height: 50px;
right: 50px;
bottom: 50px;
color: #8f8f8f;
cursor: pointer;
background-color: #8f8f8f;
border-radius: 25px;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}

.arrow:hover {
opacity: .8;
bottom: 52px;
-webkit-box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.5);
box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.5);
}


.arrow:before {
content: "";
width: 12px;
height: 12px;
border-top: solid 3px #fff;
border-right: solid 3px #fff;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
position: absolute;
left: 17.5px;
margin-top: 3px;
}

.arrow:before {
top: 15px;
}

/* トップページラッパー追加 */
.wHarf{
border-radius: 10px;
background: #ffffff;
box-shadow: 3px 3px 3px #dbdbdb, -5px -5px 10px #ffffff;

}
.item-wrapper{
border: none;
cursor: pointer;
color: #000;
}
.item-wrapper:hover{
text-decoration: none;
}

.item-detail{
color: #ff6670;
text-align: center;
padding: 4px 0px;
width: 100%;
border: 1px solid #ff6670;
margin: 10px auto 0 auto;
display: block;
font-size: 14px;
border-radius: 10px;
}

.item-detail2{
color: #00bdb2;
text-align: center;
padding: 4px 0px;
width: 100%;
border: 1px solid #00bdb2;
margin: 10px auto 0 auto;
display: block;
font-size: 14px;
border-radius: 10px;
}


/* Swiperスタイル変更 */

.swiperContainer {
margin-bottom: 20px;
}

.swiperImage{
object-fit: cover;
width: 100%;
}
.swiper-button-next:after, .swiper-button-prev:after {
color: #0000006b !important;
font-size: 2em !important;
}


/* ヘッダーカテゴリ追加 */
.categoryNav{ margin-left: 5px;}
/* .categoryNav ul{overflow: unset !important;}
.categoryNav li{width:250px;}
.categoryNav li a{font-size: 1em !important; height: 0 !important; line-height: 1px !important; margin: 3px 0 3px 3px !important;}
.categoryNav ul li ul li {width: 390px;} */


/* New icon */
.new-icon:after {
content: "";
background: url(https://www.yotsuba-insatsu.com/wp/wp-content/uploads/2020/09/Icon2Button.png) no-repeat;
background-size: contain;
display: inline-block;
width: 40px;
height: 18px;
vertical-align: middle;
margin: 0 0 3px 10px;
}

/* 2カラム指定 */
.twoColumn {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}

/* swiper用カラムスタイル オリジナル缶参照 */
.swiper-2column {
width: 47.7%;
height: auto;
margin: 1%;
}

/* カラム指定 */
.column-wrapper{
display: flex;
display: -webkit-flex;
flex-wrap: wrap;
-webkit-flex-wrap: wrap;
margin-bottom: 30px;
}

.col2 {
position: relative;
width: 47.7%;
height: auto;
margin: 1%;
overflow: hidden;
border: 1px solid #eee;
}

.col3 {
position: relative;
width: 31%;
height: auto;
margin: 1%;
overflow: hidden;
border: 1px solid #eee;
}

.col2:before,
.col3:before {
content: "";
display: block;
padding-top: 100%;
}
.column-inner {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.column-inner img{
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: auto;
height: 100%;
}


/* ナブバーラップ */
.tmRelative{
position: relative;
}

.tmWrap::after {
content: "";
display: inline-block;
width: 1px;
height: 16px;
background-color: #f2709c;
position: absolute;
top: 35%;
right: 0px;
}


.tmWrap:nth-child(6) {
padding-left: 17px;
padding-right: 17px;
}

.tmWrap:nth-child(7)::after {
top: 36%;
right: -7%;
}

.tmWrap:nth-child(8)::after {
content: none;
}

.tmWrap:last-child {
margin-left: 7px;
padding: 0 20px 0 15px;
}

.cartList {
height: 0;
line-height: 0;
}
.cartTitle {
margin-left: 5px;
}






/* モーダルウィンドウ */

.modal {
position: fixed;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 100vw;
height: 100vh;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
border: none;
opacity: 0;
z-index: -1;
display: none;
}

.modal-cover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
}

.modal-inner {
width: auto;
max-width: 800px;
max-height: 80vh;
margin: auto;
z-index: 1;
}


/* 商品一覧モーダル*/

.modal-inner2 {
width: 80%;
/*  height: 450px;*/
max-width: 1280px;
max-height: 80vh;
margin: auto;
z-index: 1;
background: #fff;
overflow-y: scroll;
border-radius: 4px;
-webkit-box-shadow: 0px 0px 7px #3335;
box-shadow: 0px 0px 7px #3335;

}


.modal-categroy-title {
text-align: center;
margin-top: 50px;
font-weight: 600;
font-size: 2rem;
}

.modal-list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0 20px 20px;

}

.modal-list-category {
margin: 10px;
}




.modal-list-category-title{
text-decoration: none;
color: #ffffff;
font-size: .8rem;
color: black;
letter-spacing: .02em;
border: 1px solid #999;
padding: 1.5em 1em;
border-radius: 4px;
line-height: 4;
-webkit-transition: .3s all ease;
-o-transition: .3s all ease;
transition: .3s all ease;
}


.modal-list-category-title:hover{
text-decoration: none;
color: #fff;
background: #F2709B;
-webkit-box-shadow: 0px 0px 7px #3335;
box-shadow: 0px 0px 7px #3335;
}


.btn-close:after {
cursor: pointer;
display: inline-block;
font-size: 2.5rem;
content: "×";
position: relative;
top: -65px;
right: -94.5%;
color: #000;
}
/* 商品一覧モーダルここまで */






.modal-inner img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}

.modal-open {
cursor: pointer;
}
.modal-open:hover{
opacity: .8;
}

.modal.is-open {
-webkit-animation: modal_open .5s ease forwards;
animation: modal_open .5s ease forwards;
display: flex;
}

.modal.is-open .modal-inner {
-webkit-animation: modal_inner_open .5s ease forwards;
animation: modal_inner_open .5s ease forwards;
}

.modal.is-close {
-webkit-animation: modal_close .5s ease forwards;
animation: modal_close .5s ease forwards;
}

.modal.is-close .modal-inner {
-webkit-animation: modal_inner_close .5s ease forwards;
animation: modal_inner_close .5s ease forwards;
}



.modal-img-default {
width: 800px !important;
height: 800px;
}

@-webkit-keyframes modal_open {
0% {
opacity: 0;
}
100% {
opacity: 1;
z-index: 10000;
}
}

@keyframes modal_open {
0% {
opacity: 0;
}
100% {
opacity: 1;
z-index: 10000;
}
}

@-webkit-keyframes modal_inner_open {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}

@keyframes modal_inner_open {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}

@-webkit-keyframes modal_close {
0% {
z-index: 10000;
opacity: 1;
}
100% {
opacity: 0;
}
}

@keyframes modal_close {
0% {
z-index: 10000;
opacity: 1;
}
100% {
opacity: 0;
}
}

@-webkit-keyframes modal_inner_close {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
opacity: 0;
}
}

@keyframes modal_inner_close {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
opacity: 0;
}
}


.banner-name {
text-align: center;
font-size: 1.2rem;
position: absolute;
color: #fff;
width: 270px;
line-height: 40px;
height: 40px;
bottom: 3%;
left: 3%;
background-color: rgba(0,0,0,.6);
}


.opacity-hover:hover{
opacity: .8;
}

/* 税込価格 */

small {
font-size: 10px;
}

/* ページ内リンク（すぐ購入ボタン） */

.delivery_date_bt {
display: block;
position: relative;
margin: 0px auto 40px auto;
width: 80%;
padding: 0.8em;
text-align: center;
text-decoration: none;
border-radius: 100vh;
color: #00bdb2;
font-size: 24px;
border: 2px solid #00bdb2;
}

.delivery_date_bt:hover,.oemform_bt:hover {
border: 2px solid #03d7ca;
cursor: pointer;
text-decoration: none;
}

.oemform_bt {
display: block;
position: relative;
margin: 0px auto 100px auto;
width: 80%;
padding: 0.8em;
text-align: center;
text-decoration: none;
border-radius: 100vh;
color: #00bdb2;
font-size: 24px;
border: 2px solid #00bdb2;
}

.pochitto_btn_blue {
display: block;
position: relative;
/*margin: 140px auto 160px auto;*/
margin: 60px auto 40px auto;
width: 80%;
padding: 0.8em;
text-align: center;
text-decoration: none;
background: #00bdb2;
border-radius: 100vh;
color: #fff;
font-size: 24px;
}

.pochitto_btn_blue:hover {
background: #03d7ca;
cursor: pointer;
text-decoration: none;
}


/* ヨツバ　トップページバナー */
#ytopbana{
background-color: #fff;
margin-bottom:40px;
}

#ytopbana img{
display:block;
margin:0 auto;
width: 100%;
}


/* ページスクロール（固定） */

.i-refine--pagetop {
position: fixed;
bottom: 20px;
right: 20px;
width: 60px;
height: 60px;
z-index: 10;
}	

.i-refine--pagetop a {
display: block;
position: relative;
width: 100%;
height: 100%;
background:#1F1F1F;
border-radius: 100%;
text-indent: -9999px;
white-space: nowrap;
overflow: hidden;
transition: opacity 0.3s; /* アニメーションを追加 */
}

.i-refine--pagetop a:hover {
opacity: 0.6; /* ホバー時に薄くする */
}

.i-refine--pagetop a::before {
left: 9px;
transform: rotate(-45deg);
}

.i-refine--pagetop a::before, .i-refine--pagetop a::after {
content: '';
position: absolute;
top: 29px;
width: 26px;
height: 1px;
background: #fff;
}

.i-refine--pagetop a {
text-indent: -9999px;
white-space: nowrap;
}

.i-refine--pagetop a::after {
left: 27px;
transform: rotate(45deg);
}

@media (max-width: 768px) {
.i-refine--pagetop {
width: 48px;
height: 48px;
}

.i-refine--pagetop a::before, .i-refine--pagetop a::after {
top: 20px;
width: 26px;
}

.i-refine--pagetop a::before {
left: 2px;
transform: rotate(-45deg);
}

.i-refine--pagetop a::after {
left: 20px;
transform: rotate(45deg);
}	
}

/* ランキング */

.wHarf.ra1::before {
content: "";
display: inline-block;
position: absolute;
width: 40px;
height: 40px;
margin: 5px;
border-radius: 5px;
background: url("https://www.yotsuba-insatsu.com/wp/wp-content/uploads/2024/11/ra1-1.png") no-repeat;
background-size: auto;
background-size: contain;
z-index: 0;
}

.wHarf.ra2::before {
content: "";
display: inline-block;
position: absolute;
width: 40px;
height: 40px;
margin: 5px;
border-radius: 5px;
background: url("https://www.yotsuba-insatsu.com/wp/wp-content/uploads/2024/11/ra2-1.png") no-repeat;
background-size: auto;
background-size: contain;
z-index: 0;
}

.wHarf.ra3::before {
content: "";
display: inline-block;
position: absolute;
width: 40px;
height: 40px;
margin: 5px;
border-radius: 5px;
background: url("https://www.yotsuba-insatsu.com/wp/wp-content/uploads/2024/11/ra3-1.png") no-repeat;
background-size: auto;
background-size: contain;
z-index: 0;
}

.wHarf.ra4::before {
content: "";
display: inline-block;
position: absolute;
width: 40px;
height: 40px;
margin: 5px;
border-radius: 5px;
background: url("https://www.yotsuba-insatsu.com/wp/wp-content/uploads/2024/11/ra4-1.png") no-repeat;
background-size: auto;
background-size: contain;
z-index: 0;
}

@media screen and (max-width: 768px) {
.wHarf.ra1::before,.wHarf.ra2::before,.wHarf.ra3::before,.wHarf.ra4::before {
width: 30px;
height: 30px;
}
}


/*ランキングとピックアップ表示*/
.category_item_h3_2 {
display: table;
position: relative;
height: 50px;
line-height: 50px;
text-align: center;
padding: 0 50px;
font-size: 18px;
background:#FF7A7C;
color: #FFF;
margin: 20px auto;
}

.category_item_h3_3 {
display: table;
position: relative;
height: 50px;
line-height: 50px;
text-align: center;
padding: 0 50px;
font-size: 18px;
background: #78d0f5;
color: #FFF;
margin: 20px auto;
}

.category_item_h3_2::before, .category_item_h3_2::after, .category_item_h3_3::before, .category_item_h3_3::after {
position: absolute;
content: '';
width: 0px;
height: 0px;
z-index: 1;
}

.category_item_h3_2::before, .category_item_h3_3::before{
top: 0;
left: 0;
border-width: 25px 0px 25px 15px;
border-color: transparent transparent transparent #fff;
border-style: solid;
}

.category_item_h3_2::after,.category_item_h3_3::after {
top: 0;
right: 0;
border-width: 25px 15px 25px 0px;
border-color: transparent #fff transparent transparent;
border-style: solid;
}


/*アクリルページカート内スタイル*/

.product-container {
display: flex;
flex-wrap: wrap;
gap: 20px;
justify-content: flex-start; /* 左揃えにする */
padding: 20px;
border: 1px solid #bbb;	
}

.product-item {
text-align: center;
background-color: white; /* 商品ブロックの背景色 */
border-radius: 10px; /* 角を丸く */
overflow: hidden; /* 画像の角を切り取らない */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 少し影をつける */
width: 150px; /* 初期幅 */
margin: 0; /* 左揃えにするので余白をゼロに */
}

.product-item img {
width: 100%;
height: 150px; /* 高さを固定 */	
object-fit: cover; /* アスペクト比を保ちながら画像を縮小・切り抜き */
display: block; /* 画像の余白を排除 */
}

.product-name {
background-color: #333; /* 背景色を暗く */
color: white;
padding: 10px;
font-size: 12px;
border-top: 2px solid #f4f4f4; /* 画像と商品名の間に線を追加 */
}

.OptSel {
font-size: 120%;
padding: 4px;
margin: 20px auto;
}	

#order_info .opttitle {
padding: 10px;
font-size: 140%;
}	

/* PC表示（5個並べる） */
@media (min-width: 768px) {
.product-item {
width: calc(20% - 20px); /* 5個並べるための幅調整 */
}
}

/* スマホ表示（2個並べる） */
@media (max-width: 767px) {
.product-container {
padding: 20px 0px;	
}
.product-item {
width: calc(50% - 10px); /* 2個並べるための幅調整 */
}
}

/*カテゴリ表示	*/

.banner-container {
display: grid;
/*grid-template-columns: repeat(9, 1fr); *//* 各列が均等に並ぶ */
grid-template-columns: repeat(9, calc(100% / 9)); 	
gap: 20px; /* バナー間の隙間 */
max-width: 1200px; /* 全体の幅を1200pxに制限 */
margin: 40px auto; /* コンテナを中央に配置 */
}

.banner-container-title{
text-align: center;
}		

.banner-container-title h1{
margin-top: 80px;
font-size: 28px;
font-weight: bold;
}	

.banner-container-title h2{
font-size: 18px;
line-height: 180%;
padding: 10px;
}

.banner-container h3{
font-size: 12px;
}	

.banner-item {
text-align: center;
}

.banner-item img {
width: 94%; /* 画像サイズを140pxに固定 */
height: 80%; /* 画像を正方形に固定 */
padding: 2px; /* 内側に2pxのパディング */
border: 1px solid #ddd; /* 枠線を1pxに設定 */
border-radius: 5px; /* 角を少し丸める */
object-fit: cover; /* 画像を切り取って表示 */
}

/* レスポンシブ対応: 画面幅が768px以下になったら4列にする */
@media (max-width: 768px) {
.banner-container {
/*grid-template-columns: repeat(3, 1fr);*/ /* 4列表示に変更 */
grid-template-columns: repeat(3, calc(100% / 3)); 	
gap: 10px;
padding: 10px;
margin: 10px auto;	
}

.banner-container-title h1 {
margin-top: 40px;
font-size: 20px;	
}	

.banner-container-title h2 {
font-size: 14px;
}		

.banner-item {
width: 110px; /* レスポンシブ時にバナー幅を調整 94%*/
margin-bottom: 20px;
}	

.banner-item img {
width: 94%; /* レスポンシブ時も画像サイズを140pxに固定 */
height: 80%;
}
}

/*特設ページ	*/

.special-banner-container {
display: grid;
/*grid-template-columns: repeat(4, 1fr);*/
grid-template-columns: repeat(4, calc(100% / 4));	
gap: 16px;
margin: 20px auto;
max-width: 1200px;
}

.special-banner-item img {
width: 100%;
height: auto;
border-radius: 8px;
/*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);*/
}

@media (max-width: 768px) {
.special-banner-container {
/*grid-template-columns: repeat(2, 1fr);*/
grid-template-columns: repeat(2, calc(100% / 2));	
padding: 0 10px;
}
}

/*スライダー	*/
.carousel2 {
position: relative;
overflow: hidden;
max-width: 100%;
margin: auto;
}

.carousel-track-container2 {
overflow: hidden;
width: 99.6%;
padding: 10px;
}

.carousel-track2 {
display: flex;
gap: 10px;
transition: transform 0.5s ease;
}

.carousel-slide2 {
flex: 0 0 calc(33.333% - 10px); /* Display 3 images with spacing */
display: flex;
justify-content: center;
align-items: center;
}

/* Ensure links inside carousel do not inherit unintended styles */
.carousel-slide2 a {
display: block;
width: 100%;
height: 100%;
text-decoration: none; /* Remove underline if present */
}

.carousel-slide2 img {
width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.carousel-button2 {
position: absolute;
top: 50%;
transform: translateY(-50%);
background-color: rgba(0, 0, 0, 0.5);
color: white;
border: none;
padding: 10px;
cursor: pointer;
font-size: 18px;
z-index: 10;
}

.carousel-button2.prev {
left: 10px;
}

.carousel-button2.next {
right: 10px;
}

.carousel-dots2 {
display: flex;
justify-content: center;
margin-top: 10px;
gap: 5px;
}

.carousel-dot2 {
cursor: pointer;
width: 10px;
height: 10px;
background-color: gray;
border-radius: 50%;
transition: background-color 0.3s;
}

.carousel-dot2.active {
background-color: black;
}

@media (max-width: 768px) {
.carousel-slide2 {
flex: 0 0 calc(50% - 10px);
}
}

@media (max-width: 480px) {
.carousel-slide2 {
flex: 0 0 96%;
}
}


/*スライダー（不要）	*/	
.carousel {
width: 100%;
position: relative;
overflow: hidden;
}

.carousel-slides {
display: flex;
transition: transform 0.5s ease-in-out;
}

.carousel-slide {
flex: 0 0 100%;
}

.carousel-slide img {
width: 100%;
height: auto;
object-fit: cover;
}

.carousel-dots {
display: flex;
justify-content: center;
margin-top: 10px;
}

.carousel-dot {
width: 10px;
height: 10px;
border-radius: 50%;
background-color: #ccc;
margin: 0 5px;
cursor: pointer;
}

.carousel-dot.active {
background-color: #000;
}

.carousel-prev,
.carousel-next {
position: absolute;
top: 50%;
transform: translateY(-50%);
padding: 10px;
font-size: 24px;
background-color: rgba(0, 0, 0, 0.5);
color: #fff;
border: none;
outline: none;
cursor: pointer;
}

.carousel-prev {
left: 10px;
}

.carousel-next {
right: 10px;
}

.carousel-prev:hover,
.carousel-next:hover {
background-color: rgba(0, 0, 0, 0.8);
}

/*商品ページ上部の最小価格表示*/

#min-price-display-style {
text-align: center;
}
	
#min-price-display-style span.num {
color: #fff;
background:
#CCCCCC;
font-size: 14px;
padding: 2px 20px;
border-radius:15px;
}	
	
#min-price-display-style span {
font-size: 12px;
}		
	
	

#min-price-display {
font-size: xxx-large;
font-family: 'メイリオ',Meiryo,'Lucida Grande','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','MS ゴシック',Verdana,Helvetica,Arial,Sans-serif !important ;
font-weight: bold;
}