/* contents */

#contents {
width: 94%; padding: 10px;
margin: 0 auto;
line-height:200%;
}
#contents .newsBox{
margin: 5px auto; padding:5px ;
font-size: 90%;
line-height:180%;
border: 1px solid #CCC;
}
#contents .newsBox p{ padding: 10px; margin-bottom: 5px; }
#contents .newsBox dl{ padding: 10px; margin-bottom: 5px; }
#contents .newsBox ul,ol{ margin-left: 40px; }
#contents .form{ text-align: center; }
#contents .low { height: 200px; overflow-y: scroll ; }
#contents .low ul { list-style: none!important; }

#contents .pickup1{ margin: 10px auto; }
#contents .pickup1 img{ margin: 5px; }
#contents .pickup2{ margin: 10px auto; }
#contents .pickup2 div{ width: 50%; float: left; }
#contents .pickup2 img{ margin: 5px; }
#contents .pickup3{ margin: 10px auto; }
#contents .pickup3 img{ margin: 5px; }

/* post & main */

#post{
width: 70%;
padding: 10px; margin-top: 5px; float: left;
}

#post .main{ width: 100%; }

#post .post-title{
margin:5px; padding: 5px;
font-size:120%; font-weight: bold;
border-bottom: 1px solid #999;
}
#post .post-title span{ border-left: 5px solid brown; padding-left:10px; }
#post .post-id{ padding:5px; font-size:85%; }
#post .post-box{ margin:10px auto; padding: 10px; border: 1px solid #CCC; }
#post .post-box a {
color:blue;
border-bottom: 1px dotted #eee;
text-decoration:none;
-moz-transition: 0.3s linear;
-webkit-transition: 0.3s linear;
transition: 0.3s linear;
padding-bottom: 2px;
}
#post .post-box a:hover {
border-bottom: 1px dotted #666;
-moz-transition: 0.3s linear;
-webkit-transition: 0.3s linear;
transition: 0.3s linear;
}

#post form{ text-align: center; }
#post form span{ font-size: 85%; line-height: 150%; font-weight: bold; }
#post form input[type="submit"]{
width:80%;
padding: 10px;
background-color: brown;
color: #FFF;
border: 1px solid #eee;
text-decoration:none;
-moz-transition: 0.3s linear;
-webkit-transition: 0.3s linear;
transition: 0.3s linear;
box-shadow: 2px 2px 2px #bdbdbd;
-moz-box-shadow: 2px 2px 2px #bdbdbd;
-webkit-box-shadow: 2px 2px 2px #bdbdbd;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
}
#post form input:hover{
box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
-moz-transition: 0.3s linear;
-webkit-transition: 0.3s linear;
transition: 0.3s linear;
}
#post .sharedaddy{
width: 90%; padding: 10px; margin:10px auto;
}
#post .sd-title{
float:left;
}
#post .sd-content{
float:right;
}

#post .left-box{ width: 360px; float:left; font-size:90%; line-height:160%; }
#post .main-img{ width: 300px; height: 300px; margin:5px auto; }
#post .main-img img{ max-width: 300px; max-height: 300px; margin: 0 auto; }
#post .com{ margin: 5px auto; padding:10px; width: 320px; border-bottom: 2px dotted #CCC; }
#post .com-title{ margin-left: -10px; margin-bottom: 5px; padding-left: 10px; border-left: 3px solid brown; font-weight: bold; }

#post .right-box{ width: 340px; float:right; padding: 20px; background-color: #eee; }
#post .right-box li{ list-style: none; padding: 3px; line-height: 160%; display: block; }
#post .right-box .price{ font-weight: bold; margin-bottom: 10px; width:100%; }
#post .right-box .copy{ border-bottom: 1px solid #666; margin-bottom: 10px; }
#post .right-box .p-left{ width: 30%; float: left; margin-bottom: 5px; text-align: right; font-size: 100%; }
#post .right-box .p-right{ width: 50%;float: left; margin-bottom: 5px; font-size: 110%; text-align: right; }
#post .right-box .p-right span{ font-size: 100%; color: red; }
#post .right-box .red{ font-size: 90%; line-height: 150%; font-weight: bold; }
#post .right-box .red span{ color: red; font-size: 95%; }
#post .right-box .juchu{ border: 1px solid #CCC; padding: 5px; margin-bottom: 10px; background-color: #FFF; }
#post .right-box .juchu li:first-child{ width: 60px; margin: 0 auto; padding-top: 10px; }
#post .right-box .juchu li:last-child{ width: 250px; font-size: 80%; margin: 0; }
#post .right-box .come{ border: 1px solid #CCC; padding: 5px; margin-bottom: 10px; }

#post .right-box .discontinued{ width: 320px; border: 3px solid red; padding: 5px; margin-bottom: 10px; }
#post .right-box .texttype3{
background-image:url("https://www.ok-depot.jp/img/doubleline.gif");
background-repeat:repeat-x;
background-position: center;
color:#660000;
font-size:1.0em !important;
}
#post .right-box .post-op{ border: 1px solid #666; padding: 5px; margin-bottom: 10px; background-color: #FFF; }
#post .right-box .post-op select{
max-width: 295px; padding: 2px; margin-left: 15px; margin-bottom:10px;
background-color: #eee;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
#post .right-box .post-op-title{ margin-bottom: 5px; color: #FFF; background-color: #666; padding: 3px; font-size: 90%; font-weight: bold; }
#post .right-box .op-title{ padding-left: 5px; font-weight: bold; }
#post .right-box .comme-link{ padding-left: 5px; font-size: 85%; margin-bottom: 10px; }
.cartjs_product_table table{ width: 100%!important; border: 1px solid #CCC; background-color: #FFF; }
.cartjs_product_table table td,th{ padding: 5px; }

#post .post-text{ margin:10px auto; padding: 5px; border: 1px solid #CCC; }
#post .post-text2{ margin:10px auto; padding: 10px; border: 1px solid red; }
#post .post-text .text-box{ margin:5px auto; padding: 5px 20px 5px 20px; }
#post .post-text .text-box a{ color: blue; }
#post .post-text .text-box img{ max-width:100%; height: auto; }
#post .text-box ul{ margin-left: 10px; }
#post .post-text h2{ font-size:90%; }

#post .tokucho-box{ border: 1px solid #eee; }
#post .tokucho{ width: 335px; margin: 5px; padding: 5px; border: 1px solid #eee; float: left; }
#post .tokucho ul{ list-style: none!important; }
#post .tokucho li{ list-style: none!important; padding: 5px; }
#post .tokucho img{ max-width: 315px; max-height: 236px; text-align: center; }
#post .tokucho span{ font-weight: bold; background-color: #eee; display: block; padding: 5px; margin: -5px; }
#post .tokucho p{ font-size: 90%; line-height: 160%; padding: 5px; }

/* list */

.list a{
width: 90%; display: block;
padding: 10px; margin: 10px;
border: 1px solid #CCC;
}
.list a:hover{
border: 1px solid brown; color: black;
}
.list ul li{ list-style-type: none; }
.list .list-title{
float: right;
width: 70%;
line-height: 140%; display: block;
font-size:130%;
font-weight: bold;
overflow: hidden;
padding: 5px;
}
.list .list-img{
float: left;
width:25%; height: 25%;
max-width: 150px; max-height: 150px;
line-height: 140%; display: block;
font-size:100%; color: brown;
overflow: hidden;
padding: 5px;
border: 1px solid #eee;
}
.list .list-img img{
max-width: auto; max-height: 150px;
margin: 0 auto;
display: block;
}
.list .list-day{
float: right;
width: 70%;
line-height: 140%; display: block;
font-size:100%; color: brown;
overflow: hidden;
padding: 5px;
}
.list .list-excerpt{
float: right;
width: 70%;
line-height: 140%; display: block;
font-size:90%;
overflow: hidden;
padding: 5px;
}

.pagination{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.pagination span{
  font-weight: bold;
  font-size: 120%;
  padding: 5px 10px;
  margin: 5px;
  text-decoration:none;
  border: 1px solid #ddd;
  color: #333;
}
a.page-numbers,
.pagination .current{
  font-weight: bold;
  font-size: 120%;
  padding: 5px 10px;
  margin: 5px;
  text-decoration:none;
  border: 1px solid #ddd;
  color: #333;
}
.pagination a:hover{
box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
background-color: #eee;
}
.pagination .current{
background-color: #eee;
}


