@charset "utf-8";

@media only screen and (min-width: 1200px) {

div.expt {
  width:46%;
  float:left;
  margin-right:1em;
}

}

@media only screen and (min-width: 1150px) {

.card {
  width:23%;
  float:left;
  margin-right:1.5%;
  margin-bottom: 1.5%;
}

}

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

.feature-list {
width:100%;
}
.scroll{
overflow: auto;　　　　/*tableをスクロールさせる*/
white-space: nowrap;　　/*tableのセル内にある文字の折り返しを禁止*/
}
.scroll::-webkit-scrollbar{　　/*tableにスクロールバーを追加*/
 height: 5px;
}
.scroll::-webkit-scrollbar-track{　　/*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb {　　/*tableにスクロールバーを追加*/
 background: #BCBCBC;
} 


/*プリント機能を消す*/
  div.c-print {
  display:none;

}

video {
  max-width: 100%;
}

.not800 {
  display:none;
}

/*メルマガトップページ*/
div.mail-product {
  width: 99%;
  padding-right: 1%;
  float: none;
}

div.mail-table {
  width: 99%;
  padding-right: 1%;
  float:none;
  clear: both;
  max-width: 320px;
}

table.ftable {
  width: 100%;
}

table.ftable tr {
  border-bottom: 1px solid #ccc;
}

table.ftable tr:last-child {
  border-bottom: none;
}

table.ftable a {
  display: block;
  height: 44px;
  line-height: 44px;
  border-bottom: none;
}

/*2カラム→1カラム*/

div#wrapp h1,div {
    margin-left:0;
  }

div#wrapp {
    margin-top: 11em;
  }

div#left {
    position:static;
    width: 99%;
    padding-right: 1%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
  }

/*H1が2段になる場合があるので*/
div#wrapp h1{
    height: auto;
  }



/*サイドメニューをタップサイズに*/
  ul#l-menu li{
  line-height:3.4;
  }

/*グローバルメニューをレスポンシブに*/
  div#global {
    background-image: none;
  }
  div#global ul {
    background-color: #fff;
  }
  div#global ul li {
    width: 33.33333%;
    line-height: 2;
    border-left:1px solid #004fa3;
    border-bottom: #004fa3;
    margin-bottom: 1px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
  }

/*パンくずリスト 幅はみ出す場合は・・・・に*/
    dl#topic-path {
  text-overflow:ellipsis;
   white-space:nowrap;
   overflow:hidden;
   width: 96%;
  }

/*キーカード記載 幅変更*/
    .flex_ul li {
      width: 48% !important;
    }
    .flex_title {
      width: 100%;
    }
/*elevate js のためmain-img サイズ調整*/
  div.main-img {
    /* スワイプ幅確保 */
    position: relative;
    float: none;
    padding: 5px;
    max-width: 60%;
    text-align: center;
    display: block;
    margin:0 auto 10px auto !important;
    border: 1px solid #ccc;
  }
  div.main-img img {
    margin-left: auto;
    margin-right: auto;
  }
  .zoomContainer {
    left: -2px !important;
    margin-left: 22% !important;
    text-align: center
  }
  .zoom-text:after {
    content: "画像をタップ・スワイプで拡大";
  }

}

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

.card {
  width: 47%;
  margin-right: 2%;
}

.card-t {
  width: 47%;
  margin-right: 2%;
}

.card-title {
  width: 100%;
}

.card-title-t {
  width: 100%;
}

/*メルマガトップページ*/
.m-search {
  padding: 5px;
}
.m-search p {
  float: none;
  margin: 0;
  line-height: 2;
}

/*地図*/
.product iframe {
  width:100%;
  }

/*お問い合わせフォーム*/

form#mailform {
}

table.mailform,table.infield {
  width: 90%;
}

div.buttons{
  clear: both;
}

table.mailform tr {
  display: block;
  margin-bottom: 20px;
}

table.mailform tr th {
  display: block;
  text-align: left;
  padding: 2px 0 2px 5px;
  border: none;
}

table.mailform tr td{
  display: block;
  white-space: normal;
  padding: 0 0 0 5px;
  border: none;
}

table th p.need,table th p.nth {
      display: inline-block;
      float: none;
    }
table th p.need {
  padding: 1px;
  margin-right: 0;
    }

table.mailform input[type="text"] {
  width: 90% !important;
}

table.mailform input.yoyaku {
  width: 30px !important;
}

table.mailform textarea {
  width: 90% !important;
}

table.mailform select.mfp {
  width: 90% !important;
  max-width: 300px !important;
}

/*物理実験ページのテーブル*/

.expt-item-list {
  width: 100%;
}


/*SNS系、の最小幅を無しに*/
#sns {
  min-width:0;
}

/*トップページの設定*/

.attent-p li {
  width: 100%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  padding-bottom: 5px;
  margin: 0;
  border-right:none;
  border-bottom: 1px solid #e5e5e5;
}

.attent-p li.f-right {
  border-bottom: 0;
}

.w {
  min-width: 0;
}

.w-left,.w-right {
  width: 100%;
  clear: both;
  float: none;
}

  div#comp-logo span,div#comp-logo p {
    display: none;
  }

/*カテゴリー、一覧ページ*/

  div.cat-select {
    width: 32.1%;
    margin: 0 1% 1% 0;
  }

/*カテゴリー、製品一覧ページ*/
    div.p-sel {
    width: 48.5%;
    margin: 0 1% 1% 0;
  }

    div.main-img img {
    max-width: 100%;
    height: auto;
  }

  div.product,div.reco-rank {
  position: static;
  min-width: 0;
  }
  


  .germany, .smart-anatomy {
    clear: both;
    width: 95%;
    position: relative;
  }

  .germany img, .smart-anatomy img {
    display: inline-block;
    margin:0;
  }
  .germany span {
    display: block;
    position: absolute;
    top: 25px;
    left: 90px;
    text-decoration: underline;
  }
}

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


  .smart-anatomy span {
    display: block;
    position: absolute;
    top: 25px;
    left: 200px;
    text-decoration: underline;
  }

.item-list li {
  width: 65px;
}

/*最近チェックした製品*/
.item-list li img {
  height: 70px;
}

/*お問い合わせフォーム*/
form#mailformpro dl dt {
  float: none;
  width: 100%;
  clear: both;
  font-size: 12px;
  padding: 5px 0 0 0;
  text-align: left;
  border-top: none;
  margin: 0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}
form#mailformpro dl dd {
  border-top:none;
  margin: 0 0 10px 0;
  padding: 5px;
  font-size: 12px;
  line-height: 1.5em;
}

form#mailformpro input[type="text"],
form#mailformpro textarea,
form#mailformpro input[type="tel"],
form#mailformpro input[type="email"] {
  width: 98% !important;
}


form#mailformpro dl dd ol li label {
  line-height: 3.4;
}

.must {
  display: inline-block;
  background-color: #C00;
  padding: 2px;
  font-size: 10px;
  color: #FFF;
  float: left;
  margin: 0px 5px;
  border-radius: 4px;
  box-shadow: 0px 0px 5px #CCC;
}

form#mailformpro textarea {
  max-width: 95%;
}

div.to-more {
  float: none;
  clear: both;
  width: 100%;

}

div.to-more div {
  float: none;
  width: 240px;
  margin-left:auto!important;
  margin-right:auto!important;
}

/*メルマガ表*/
ul.mul {
  max-width:100%;
}

.mul li p {
  margin: 0;
}

div.mb {
  word-wrap:break-word;
}

/*320px以上の製品画像の幅を調整*/

div.thumbnail {
  max-width: 100%;
  box-sizing: border-box;
    -moz-box-sizing: border-box;
}

div.thumbnail img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
}


/*製品一覧ページ*/

div.fs-cl ul.nul {
  margin-left: 5px;
}

div.fs-cl ul.nul li {
  display: inline-block;
}

div.fs-cl ul.nul li a {
  display: inline-block;
  /*display: block;*/
  padding: 10px;
  margin-bottom: 15px;
  border: 1px solid #ccc;
}


div.map-3b img {
  width: 100%;
  max-width: 500px;
  height: auto;
}

/*カテゴリー、一覧ページ*/

  div.cat-select {
    width: 48.5%;
    margin: 0 1% 1% 0;
  }

  /*カテゴリー、製品一覧ページ*/
    div.p-sel {
    width: 99%;
    margin: 0 1% 3% 0;
    /*padding-right: 15px;*/
  }


div#slide-box div img {
  max-width: 90%;
  height: auto;
}

ul.cat-symbol {
  margin-bottom: 0;
}
.cat-symbol li {
  width: 48.5%;
  margin-bottom: 5px;
}

.cat-symbol li:nth-child(2) {
  float: right;
  margin-bottom: 5px;
}

.cat-symbol li:last-child {
  float: right;
  margin-bottom: 5px;
}

.cat-symbol li.c-s {padding-left:0;}

  div#wrapp h1 {
    background: #004FA3;
    border: none;
  }

  div#wrapp {
    margin-top: 13em;
  }

div.p-info {
    width: 90%;
    padding:0 5%;
    margin-bottom: 0.5em;
  }

  .cart {
    display: block;
    width: 50% !important;
    min-width: 200px !important;
    margin:0 auto 1em auto;
  }

.radio-btn {
  margin-bottom: 8px;
  padding: 10px;
}

.guide-text {
  width: 45%;
  min-width: 180px;
  padding:5px 0 5px 21px;
  margin: 0 auto 0.5em;
}


  div.more-info {
  border: none;
  }
  p.deli a {
    clear: both;
    width: 50%;
    min-width: 200px;
    padding:0;
    margin: 0 auto 5px auto;
    text-align: center;
  border:1px solid #e5e5e5 !important;
  text-decoration:underline;
  background-color: gray;
}



p.inquiry{
    width: 50%;
    min-width: 200px;
    padding:0;
    margin: 0 auto 5px auto;
    text-align: left;
}

div.more-info p span {
  text-align: center;
  border: none;
}

  div.p-info dl {
    float: left;
    width: 57%;
    clear: none;
    margin-bottom: 1em;
  }

  div.p-info dl.spec {
    float: right;
    width: 43%;
    margin-top: 0;
  }

  p.made {
    clear: both;
    margin-bottom: 1em;
  }

  div#comp-logo {
    float: none;
    width: 100%;
    /*text-align: center;*/
  }

  div#comp-logo div {
    float: none;
    /*text-align: center;*/
  }

  div#comp-logo a{
    /*margin: 0 auto;*/
    /*float: right;*/
    width: 80px;
  }

  #h-right {
    float:left;
    /*width: 50%;*/
  }

.s-search {
  position: absolute;
  right: 15px;
  top: 10px;
}

input#search {
  width: 13em;
}

  div#l-cart {
  display:inline;
  float:right;
  width:4.19em;
  height:2.75em;
  margin-right: 0;
}

div#l-cart a {
  padding:23px 0 0 0;
  width:5.15em;
  display:block;
  background:transparent url(../img/l_cart.gif) no-repeat left top;
  font-size:0.81em;
  letter-spacing:0;color:#0000a3;
}

#h-right span a {padding: 15px 5px 0 10px;}

#site-map {
  display: inline-block;
  padding: 15px 5px 0 5px;
  margin-top: 5px;
  border: 1px solid #ccc;
  background:transparent url(../img/site_map.gif) no-repeat center 2px;
}
#quest {
  display: inline-block;
  padding: 15px 5px 0 5px;
  margin-top: 5px;
  border: 1px solid #ccc;
  background:transparent url(../img/quest.gif) no-repeat center 2px;
}

div#footer {
   background:transparent url(../img/footer.gif) repeat-x left top;
  text-align:left;
 }

 div#footer ul li a {
  display: inline-block;
  border: 1px solid #ccc;
  padding: 5px;
  margin-bottom: 15px;
 }

div#footer img {
  max-width: 100%;
  height: auto;
}

div.univ {clear: both; margin-bottom:1em;}

p.to-top {width: auto;}
p.to-top  a {
  padding:5px 5px 5px 18px;
  display:inline-block;
  border: 1px solid #ccc;
  background:transparent url(../img/to-top.gif) no-repeat left center;
  }
p.to-top a:hover {
  border:1px solid #ccc;
  }

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


div#header {
  position: static;
}

div#header {
  position: static;
}

div#h-top {
  position: absolute;
  top: 5px;
  left: 0;
  width: 100%;
  box-sizing: border-box;
}

dl#topic-path {
  box-sizing: border-box;
  position: absolute;
  top: 105px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding-top: 5px;
  padding-bottom: 5px;
  margin: 0 0.53em 0 0.53em;

}

div#wrapp {
    margin-top: 145px;
}

div#global {
  margin-top: 0;
}

/*.sns {
  display: none;
}
*/



/*ケンアヴィジョンのページ*/

.kav-img img {
  float: left;
  max-width: 100%;
  height: auto;
}

.kav-img p {

}

#fsrecommenddiv2,div.reco-rank,div.not480 {
  display:none;
}

.sale-c {
  float: none;
  position: static;
  width: 50%;
  min-width: 16em;
}

/*}

@media only screen and (max-width: 500px) {*/

.card-title {
  min-height: 0;
  position: relative;
  width: 100%;
}

.card-title a {
  padding: 3px;
}

.card-title strong {
  margin-bottom: 3px;
  font-size: 14px;
  font-weight: normal;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.card-title span {
  font-size: 12px;
  line-height: 1.3;
  height: 30px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.card-title-t {
  min-height: 0;
  position: relative;
  width: 100%;
}

.card-title-t a {
  padding: 3px;
}

.card-title-t strong {
  margin-bottom: 3px;
  font-size: 14px;
  font-weight: normal;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.card-title-t span {
  font-size: 11px;
  line-height: 1.3;
  height: 28px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

}



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

div#wrapp {
  min-width: 311px;
}

div#footer {
  min-width: 302px;
}

div#header {
  min-width:320px;
}

div#footer img {
  max-width:100%;
}

/*カテゴリー、一覧ページ*/



  div.cat-select {
    width: 99%;
    margin: 0 1% 1% 0;

  }

.news li span {
  width: 6.5em;
}


ul.cat-symbol li {
  width: 98%;
  /*margin-bottom: 5px;*/
}

ul.cat-symbol li.c-s {
  float: none;
  clear: both;

}

p.to-forms {
  display: none;
}
}