@media screen and (max-width:840px){
img{
max-width: 100%!important;
height: auto;
width /***/:auto;
}

#ham-menu {
    background-color: #fff; /*メニュー背景色*/
    box-sizing: border-box;
    height: 100%;
    padding: 10px 10px; /*メニュー内左右上下余白*/
    position: fixed;
    right: -240px; /*メニュー横幅 width と合わせる*/
    top: 0;
    transition: transform 0.3s linear 0s; /*0.3s はアニメーションにかかる時間*/
    width: 240px; /*メニュー横幅*/
    z-index: 1000;
    overflow:scroll;
}
#menu-background {
    background-color: #333!important; /*黒背景*/
    display: block;
    height: 100%;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    transition: all 0.3s linear 0s; /*0.3s はアニメーションにかかる時間*/
    width: 100%;
    z-index: -1;
}
#menu-cb:checked ~ #ham-menu,
#menu-cb:checked ~ #menu-icon {
    transform: translate(-240px); /*メニュー本体横幅 width と合わせる*/
}

#menu-cb:checked ~ #menu-background {
    opacity: 0.5!important;
    z-index: 999!important;
}
#menu-icon {
    display: block!important;
    background-color: #fff; /*アイコン部分背景色*/
    border-radius: 0 0 0 10px; /*左下角丸*/
    color: #333; /*アイコン（フォント）色*/
    cursor: pointer;
    display: none ;
    font-size: 50px; /*アイコン（フォント）サイズ*/
    height: 50px; /*アイコン縦高さ*/
    line-height: 50px; /*縦位置中央化*/
    position: fixed;
    right: 0;
    text-align: center;
    top: 0;
    width: 50px; /*アイコン横幅*/
    transition: all 0.3s linear 0s; /*0.3s はアニメーションにかかる時間*/
    z-index: 1000;
}

#all { width: 100%!important; font-size: 120%!important; }
#header-li { width: 100%!important; display: none!important; }
#header-li2{ display: block!important; }
#header-li3{ display: block!important; }
#header-bottom{ display: none!important; }
#header-top .logo{ width: 100%!important; }

#header-li3 .hl-7 { display: block!important;}
#header-li3 .hl-8 { display: block!important;}

.sitetxt{ display: none!important; }
.dlbox{ display: none!important; }
.searchbox{ display: none!important; }
.searchbox2{ display: none!important; }
.searchbox3{ display: block!important; }
.searchbox4{ display: block!important; }
.siteimg{ display: none!important; }
#headmenu{ display: none!important; }
.navigation{ font-size: 80%!important; padding: 5px!important; }
#contents{ width: 98%!important; padding: 0px!important; }
#post{ width: 100%!important; padding: 0px!important; float: none!important; }
.post-text{ padding: 0px!important; }
.post-text img{ margin: 0px!important; max-width: 100%!important; }
.text-box{ padding: 5px!important; margin: 0px!important; }
.text-box .theContentWrap-ccc div{ width: 94%!important; float: none!important; margin: 5px!important; padding: 5px!important; font-size: 100%!important;}
.text-box div{ width: 96%!important; float: none!important; margin: 5px!important; padding: 5px!important; display: block!important;}
.text-box ul{ display:block!important; }
.post-box{ padding: 5px!important; margin: 0px!important; }
.left-box{ float: none!important; width: 98%!important; }
.right-box{ float: none!important; padding: 5px!important; width: 97%!important; }
.sns-button{ width: 96%!important; }
.com{ width: 98%!important; }
#footer{ width: 100%!important; }
.sitemap-l{ width: 100%!important; display: none!important; float: none!important; }
.sitemap-r{ width: 100%!important; display: none!important; float: none!important; }
.post-title{ margin: 0px!important; }
#side{ width: 220px!important; padding: 0px!important; }
input[type="image"]{ max-width: 100%!important; }
.review-href{ width: 80%!important;}
#guide{ padding: 5px!important;}
.g-box{ float: none!important; width: 96%!important; margin: 10px!important; }
#cat-list{ width: 98%!important; padding: 0px!important; margin: 5px!important; float: none!important; }
#cat-list li{ float: none!important; width: 96%!important; margin: 5px!important; }
#cat-list a{ width: 100%!important; }
.list a{ width: 94%!important; height: auto; float: none!important; }
.list .list-img{ width: 28%!important; height: auto; float: left; margin-right: 10px; }
.list .list-img img{ max-width: 100%; }
.list .list-title{ width: 65%!important; height: 60px; overflow: hidden; overflow-wrap: break-word ; line-break: strict; }
.list .list-price{ width: 65%!important; height: 40px; float: left; text-align: right; }
.list2 a{ width: 94%!important; height: auto; float: none!important; }
.list2 .list-img{ width: 28%!important; height: auto; float: left; margin-right: 10px; }
.list2 .list-img img{ max-width: 100%; }
.list2 .list-title{ width: 65%!important; height: 60px; overflow: hidden; overflow-wrap: break-word ; line-break: strict; }
.list2 .list-price{ width: 65%!important; height: 40px; float: left; text-align: right; }
h4{ font-size: 90%!important; }
.pickup1 img{ margin: 5px 0px!important; }
.pickup1{ display: block!important; }
.pickup2 div{ width: 48%!important; }
#post .t1{ display: block!important; width: 90%!important; }
#post .t2{ display: block!important; width: 90%!important; }
#post table{ width: 99%!important; margin: 0px!important; }
#post textarea{ width: 96%!important; }
#post input[type="text"]{ width: 60%!important; }
#side select{ width: 100%!important; }
#pdf ul li{ width: 95%!important;}
.koteipage-form{ font-size: 120%!important;}
.seminer-form{ font-size: 120%!important;}
object { width: 90%!important; }
#post .iframe-wrap { width: 100%!important; padding-bottom: 56.25%!important;}
#product-in{
width: 90%!important;
}
#product-in .txt-box{
width: 90%!important;
}
#product-in .txt-box2{
width: 90%!important;
}
#product-in .img-box2{
width: 90%!important;
}
#product-in form{ width: 90%!important;}


/*会員ページ*/
.mypage-profile{ width: 100%!important; }
.mypage-profile th{ display: block; }
.mypage-profile td{ display: block; }
.mypage-main{ width: 100%!important;}
.mypage-sitemap{ display: none!important;}
.mypage-tokka li{ width: 150px!important; }
#cssmenu{ width: 100%!important;}
.mypage-banner{ text-align: center!important;}
.mypage-banner a{ float: none!important;}
.cart-main{ width: 100%!important;}
#cart #breadcrumbs{ width: 100%!important; line-height: 185%!important;}
#cart #breadcrumbs li{ margin: 10px!important;}
.cart-main th{ display: block; width: 97%!important; }
.cart-main td{ display: block; width: 97%!important; }
.cart-main tr{ border-bottom: 5px solid #333;}
.cart-main img{ width: 50%!important; }
.cart-button-left{ width: 100%!important;}
.cart-button-right{ width: 100%!important;}
#cart h3, #account h3{ width: 97%!important;}
.cart-message{ width: 90%!important;}
.cart-user{ width: 100%!important;}
.cart-user .send-list{ width: 100%!important; margin: 0!important;}
.send-list th{ display: block; width: 97%!important; }
.send-list td{ display: block; width: 97%!important; }
.send-list tr{ border-bottom: 5px solid #333;}
.send-list input[type="text"] { width: 80%!important;}
.send-list textarea{ width: 80%!important;}
.send-list .t1{ text-align: left!important;}
.input-list{ width: 100%!important;}
#mypage-ssl{ width: 100%!important;}
#mypage-ssl-left{ float: none!important; width: 50%!important;}
#mypage-ssl-right{ float: none!important;}
.cart-payment table, .cart-coupon table{ width: 100%!important;}
.cart-confirm table{ width: 90%!important;}
.cart-confirm th{ display: block; width: 97%!important;}
.cart-confirm td{ display: block; width: 97%!important;}
#order_note{ width: 80%!important;}
.cart-login { width: 100%!important;}
.cart-login table { width: 100%!important;}
.cart-user h5 { width: 100%!important;}

.my-okdepot-logout{ width: 100%!important;}
.account-button a{ width: 60%!important; display: block; margin: 5px!important;}
#account #breadcrumbs{ width: 100%!important; }
#account #breadcrumbs li{ margin: 10px!important;}
.account-user table{ width: 100%!important; }
.account-user span{ font-size: 80%; }
.account-err{ width: 90%!important; }

.my-okdepot-login-left{ width: 100%!important;}
.my-okdepot-login-left form{ width: 100%!important;}
.my-okdepot-login-right{ width: 100%!important; margin: 0!important;}

#cat-list3{ float: none!important; width: 100%!important; }
#cat-list3 .list3{ display: inline!important; width: 100%!important; }
#cat-list3 .list3 ul{ margin: 0!important; width: 100%!important; }

}

#menu-icon { display: none; }
#menu-cb { display: none; /*チェックボックス本体は消しておく*/ }

#header-li3{ display: none; }
#header-li3 li {
list-style : none;
font-size: 90%;
float: left;
margin: 3px;
}
#header-li3 .hl-1 { display: block; width: 30px; height: 30px; background-image: url(https://cdn.ok-depot.jp/img/about_1/h-icon-1.gif);}
#header-li3 .hl-5 { display: block; width: 30px; height: 30px; background-image: url(https://cdn.ok-depot.jp/img/about_1/h-icon-5.gif);}
#header-li3 .hl-6 { display: block; width: 30px; height: 30px; background-image: url(https://cdn.ok-depot.jp/img/about_1/h-icon-6.gif);}
#header-li3 .hl-7 { display: none; width: 30px; height: 30px; background-image: url(https://cdn.ok-depot.jp/img/about_1/h-icon-7.gif);}
#header-li3 .hl-8 { display: none; width: 30px; height: 30px; background-image: url(https://cdn.ok-depot.jp/img/about_1/h-icon-8.gif);}

.searchbox3{ display: none; margin-bottom: 10px; }
.searchbox4{ display: none; margin-bottom: 10px; }