@media screen and (min-width: 1921px) {
  .mobititle,
  #mobimenu,
  #tablist,
  #mobilist,
  #m_searchtable,
  #mobithumb,
  .pdetails,
  #prod_title,
  #exp_filt {
    display: none;
  }
  section {
    /*padding-top: 245px;*/
    padding-left: 60px;
    width: calc(100vw + 85px);
  }
  .grid-item,
  .grid-sizer {
    width: calc(16.666vw - 145px);
  }
  .grid-gutter {
    width: 145px;
  }
  .grid-item {
    padding-bottom: calc(16.666vw - 145px);
    margin-bottom: 145px;
  }
  .grid-sizer.w2 {
    width: calc(50vw - 145px);
  }
  .grid-item.w2 {
    width: calc(50vw - 145px);
    padding-bottom: calc(50vw - 145px);
  }
  .grid-sizer.w3 {
    width: calc(33.333vw - 145px);
  }
  .grid-item.w3 {
    width: calc(33.333vw - 145px);
    padding-bottom: calc(33.333vw - 145px);
  }
  .grid-sizer.w4 {
    width: calc(25vw - 145px);
  }
  .grid-item.w4 {
    width: calc(25vw - 145px);
    padding-bottom: calc(25vw - 145px);
  }
  .grid-sizer.w5 {
    width: calc(20vw - 145px);
  }
  .grid-item.w5 {
    width: calc(20vw - 145px);
    padding-bottom: calc(20vw - 145px);
  }
  .grid-sizer.w6 {
    width: calc(16.666vw - 145px);
  }
  .grid-item.w6 {
    width: calc(16.666vw - 145px);
    padding-bottom: calc(16.666vw - 145px);
  }
  .grid-sizer.w7 {
    width: calc(14.28vw - 145px);
  }
  .grid-item.w7 {
    width: calc(14.28vw - 145px);
    padding-bottom: calc(14.28vw - 145px);
  }
  .grid-sizer.w8 {
    width: calc(12.5vw - 145px);
  }
  .grid-item.w8 {
    width: calc(12.5vw - 145px);
    padding-bottom: calc(12.5vw - 145px);
  }
  .grid-sizer.w9 {
    width: calc(11.111vw - 145px);
  }
  .grid-item.w9 {
    width: calc(11.111vw - 145px);
    padding-bottom: calc(11.111vw - 145px);
  }
  .grid-sizer.w10 {
    width: calc(10vw - 145px);
  }
  .grid-item.w10 {
    width: calc(10vw - 145px);
    padding-bottom: calc(10vw - 145px);
  }
  h1,
  #minianimlogo {
    left: 20px;
  }
  nav ul {
    left: calc(16vw + 75px);
  }
  nav li {
    /*font-size: 19px*/
  }
  #view {
    left: calc(49.5vw + 73px);
    /*font-size: 19px;*/
  }
  #search {
    left: calc(66vw + 75px);
    /*font-size: 19px*/
  }
  /*#filter {               height: 245px; top: 30px; z-index: 9; padding: 0; transition: padding-top 100ms 0ms ease-in-out }
        #filter.fixed {         top: -133px; }
    #filter ul {            left: ~"calc(49.5vw + 73px)"; margin: 22px 0 0 51px }
        #filter li {        font-size: 19px; line-height: 19px; height: 19px; padding-left: 5px; }*/
  #filter ul {
    left: calc(49.5vw + 73px);
    margin: 22px 0 0 38px;
  }
  #nextprod {
    left: calc(66.8% + 75px);
    /*font-size: 19px; line-height: 22px;*/
  }
  #close {
    right: 60px;
  }
  #closegreen {
    right: -30px;
  }
  #slider {
    left: calc(82.5vw + 75px);
    width: calc(16.666vw - 145px);
  }
  section {
    padding-top: 323px;
  }
  #logo img {
    height: 200px;
  }
  #splashinfo {
    top: 300px;
    /*font-size: 35px; line-height: 35px*/
  }
  #splashinfo a > span {
    /*font-size: 30px;*/
  }
  #list {
    width: calc(100vw - 120px);
    margin: 120px 0 0 60px;
  }
  #list .thumbcol {
    width: 16.6vw;
  }
  #list th {
    /*font-size: 19px; line-height: 35px; height: 35px;*/
  }
  #list td {
    /*font-size: 19px; line-height: 35px; height: 35px;*/
  }
  #searchtable {
    /*font-size: 19px; letter-spacing: -0.035em;*/
    line-height: 24px;
    height: 24px;
    margin-top: -5px;
  }
  .tablethumb {
    /*height: 246px;*/
    width: calc(16.6vw - 75px);
    height: calc(16.6vw - 75px);
  }
  #counter {
    top: 224px;
    right: calc(33.333vw + 40px);
    /*font-size: 19px;*/
  }
  aside {
    right: 60px;
    left: calc(66.8vw + 75px);
    top: 254px;
    line-height: 35px;
    /*font-size: 19px;*/
  }
  aside li {
    height: 35px;
  }
  aside h2,
  h3 {
    /*font-size: 19px; line-height: 35px;*/
  }
  #description {
    max-height: 35px;
  }
  #notifyclick {
    height: 35px;
  }
  #notifyinput.open {
    height: 35px;
  }
  #notifyinput input[type=text] {
    /*font-size: 19px; line-height: 35px; height: 35px;*/
  }
  #notifyinput input[type=submit] {
    /*font-size: 19px; line-height: 35px; height: 35px;*/
  }
  #notifythank.open {
    height: 35px;
  }
  #slide_product {
    left: 60px;
    top: 254px;
    bottom: 60px;
    right: calc(33.333% + 40px);
    min-height: 800px;
  }
  #news {
    top: 170px;
    left: calc(16.6vw + 60px);
    width: calc(50% - 75px);
    padding-bottom: 170px;
  }
  #news li {
    max-height: 35px;
  }
  #news .cont {
    margin-top: -772px;
  }
  #news h2 {
    margin-left: 16.66vw;
    font-size: 15px;
    line-height: 35px;
  }
  #news h2 span {
    font-size: 21px;
    vertical-align: -2px;
    margin-left: 1px;
  }
  #news .dt {
    font-size: 15px;
    line-height: 35px;
  }
  #news .img {
    height: 760px;
    margin-bottom: 12px;
  }
  #news .txt {
    margin-left: 16.66vw;
    font-size: 15px;
    line-height: 16.5px;
    margin-top: 30px;
  }
  #news li.open {
    max-height: 1000px;
    padding-top: 24px;
    padding-bottom: 35px;
  }
  #news li.open h2 {
    line-height: 16.5px;
  }
  #news li.open .dt {
    line-height: 16.5px;
  }
  #news li.open .txt {
    margin-top: 0px;
  }
  #news li.open .cont {
    margin-top: 0px;
  }
  #info {
    top: 170px;
    left: calc(16.6vw + 60px);
    width: calc(50% - 75px);
    padding-bottom: 170px;
  }
  #info li {
    max-height: 35px;
  }
  #info h2 {
    font-size: 15px;
    line-height: 35px;
  }
  #info h2 span {
    font-size: 21px;
    vertical-align: -2px;
    margin-left: 1px;
  }
  #info .txt {
    font-size: 15px;
    line-height: 16.5px;
    color: #A8B5B7;
    margin-top: 30px;
    min-height: 360px;
  }
  #info .infoimg {
    height: 360px;
    width: calc(16.6vw - 75px);
    top: 35px;
    margin-top: 12px;
  }
  #info li.open {
    max-height: 1000px;
    padding-top: 35px;
    padding-bottom: 35px;
  }
  #info li.open h2 {
    line-height: 16.5px;
  }
}
@media screen and (max-width: 1920px) and (min-width: 1201px) {
  .mobititle,
  #mobimenu,
  #tablist,
  #mobilist,
  #m_searchtable,
  #mobithumb,
  .pdetails,
  #prod_title,
  #exp_filt {
    display: none;
  }
  #logo {
    top: 35px;
    left: 35px;
  }
  #logo img {
    height: 110px;
  }
  #splashinfo {
    top: 200px;
    left: 35px;
    /*font-size: 19px; line-height: 19px*/
  }
  #splashinfo a > span {
    font-size: 16px;
  }
  .tablethumb {
    /*height: 196px;*/
    height: calc(16.666vw - 30px);
  }
}
@media screen and (max-width: 1200px) and (min-width: 1025px) {
  .mobititle,
  #mobimenu,
  #tablist,
  #mobilist,
  #m_searchtable,
  #mobithumb,
  .pdetails,
  #prod_title,
  #exp_filt {
    display: none;
  }
  #splash {
    background-size: cover;
    background-position: center;
  }
  #logo {
    top: 35px;
    left: 35px;
  }
  #logo img {
    height: 110px;
  }
  #splashinfo {
    top: 200px;
    left: 35px;
    font-size: 19px;
    line-height: 19px;
  }
  #splashinfo a > span {
    font-size: 16px;
  }
}
@media screen and (max-width: 1024px) and (min-width: 769px) {
  .mobititle,
  #mobimenu,
  #tablist,
  #mobilist,
  #m_searchtable,
  #mobithumb,
  .pdetails,
  #prod_title,
  #slider,
  #exp_filt {
    display: none;
  }
  nav ul {
    left: calc(25% + 35px);
  }
  #search {
    left: calc(75% + 37px);
  }
  .grid-item,
  .grid-sizer {
    width: calc(25% - 75px) !important;
  }
  .grid-item {
    padding-bottom: calc(25% - 75px) !important;
  }
  .dida {
    opacity: 1;
  }
  #logo img {
    height: 150px;
  }
  #splashinfo {
    top: 240px;
    font-size: 27px;
    line-height: 27px;
  }
  #splashinfo a > span {
    font-size: 22px;
  }
  #splash {
    background-size: 220%;
    background-position: -200px top;
  }
  #info {
    width: calc(50%);
    left: calc(25% + 35px);
  }
  #info .infoimg {
    width: calc(22vw - 75px);
  }
  #news {
    width: calc(50%);
    left: calc(25% + 35px);
  }
  #news .cont {
    margin-top: -363px;
  }
  #news .img {
    height: 349px;
  }
  #list .thumbcol {
    width: 0;
  }
  #list .namecol {
    width: 25vw;
  }
  .tablethumb {
    /*height: 175px;*/
    height: 262px;
    width: 262px;
    left: 25vw;
  }
}
@media screen and (max-width: 768px) and (min-width: 481px) {
  nav ul,
  #list,
  #searchtable,
  #closegreen,
  #mobilist,
  #counter,
  #slide_product,
  #search,
  #slider,
  #filter ul,
  #view,
  #nextprod,
  .infoimg {
    display: none;
  }
  #m_searchtable,
  .pdetails,
  #prod_title,
  #mobithumb {
    display: block;
  }
  #tablist {
    display: table;
  }
  h1 {
    font-size: 18px;
    line-height: 18px;
  }
  .grid-item,
  .grid-sizer {
    width: calc(33vw - 65px) !important;
  }
  .grid-gutter {
    width: 65px;
  }
  .grid-item {
    padding-bottom: calc(33vw - 65px) !important;
    margin-bottom: 65px !important;
  }
  .dida {
    opacity: 1;
    font-size: 15px;
    line-height: 16px;
  }
  #logo img {
    height: 150px;
  }
  #splashinfo {
    top: 240px;
    font-size: 27px;
    line-height: 27px;
  }
  #splashinfo a > span {
    font-size: 22px;
  }
  #splash {
    background-size: 220%;
    background-position: -200px top;
  }
  #hamburger,
  #mobimenu {
    display: block;
  }
  .mobititle {
    display: block;
    font-size: 30px;
    color: #346465;
    margin-left: -1px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 90%;
  }
  #info {
    top: 100px;
    left: 35px;
    width: calc(100vw - 70px);
  }
  #info li {
    max-height: 33px;
  }
  #info h2 {
    margin-left: 0;
    font-size: 18px;
    line-height: 33px;
  }
  #info h2 span {
    font-size: 21px;
    vertical-align: -2px;
    margin-left: 1px;
  }
  #info .txt {
    margin-left: 0;
    font-size: 18px;
    line-height: 20px;
    margin-top: 30px;
  }
  #info li.open {
    max-height: 300px;
    padding-top: 24px;
    padding-bottom: 35px;
  }
  #info li.open h2 {
    line-height: 20px;
  }
  #info li.open .txt {
    margin-top: 0px;
  }
  #news {
    top: 100px;
    left: 35px;
    width: calc(100vw - 70px);
  }
  #news li {
    max-height: 33px;
  }
  #news .cont {
    margin-top: -476px;
  }
  #news h2 {
    margin-left: 16.6%;
    font-size: 18px;
    line-height: 33px;
  }
  #news h2 span {
    font-size: 21px;
    vertical-align: -2px;
    margin-left: 1px;
  }
  #news .dt {
    font-size: 18px;
    line-height: 33px;
  }
  #news .img {
    height: 464px;
    width: 100%;
    background-color: #dadada;
    margin-bottom: 12px;
    position: relative;
  }
  #news .txt {
    margin-left: 0;
    font-size: 18px;
    line-height: 20px;
    margin-top: 30px;
  }
  #news p {
    margin: 0;
  }
  #news li.open {
    max-height: 800px;
    padding-top: 24px;
    padding-bottom: 35px;
  }
  #news li.open h2 {
    line-height: 20px;
  }
  #news li.open .dt {
    line-height: 20px;
  }
  #news li.open .txt {
    margin-top: 12px;
  }
  #news li.open .cont {
    margin-top: 0px;
  }
  aside {
    right: auto;
    left: 35px;
    top: 672px;
    width: calc(100vw - 70px);
    font-size: 18px;
    line-height: 20px;
    padding-bottom: 120px;
  }
  aside li {
    height: 33px;
    line-height: 33px;
  }
  aside h2,
  h3 {
    font-size: 18px;
    line-height: 33px;
  }
  #description p {
    line-height: 20px;
  }
}
@media screen and (max-width: 480px) {
  nav ul,
  #list,
  #searchtable,
  #closegreen,
  #tablist,
  #m_searchtable,
  #counter,
  #slide_product,
  #search,
  #slider,
  #filter ul,
  #view,
  #nextprod,
  .infoimg {
    display: none;
  }
  .pdetails,
  #prod_title,
  #mobithumb,
  #hamburger,
  #mobimenu {
    display: block;
  }
  #mobilist {
    display: table;
  }
  h1 {
    font-size: 18px;
    line-height: 18px;
    left: -15px;
  }
  #hamburger {
    right: 20px;
  }
  section {
    padding-left: 20px;
  }
  #gridcont {
    width: calc(100vw - 20px);
  }
  .grid-item,
  .grid-sizer {
    width: calc(50% - 20px) !important;
  }
  .grid-gutter {
    width: 20px;
  }
  .grid-item {
    padding-bottom: calc(50% - 20px) !important;
    margin-bottom: 60px !important;
  }
  .dida {
    opacity: 1;
    font-size: 14px;
    line-height: 15px;
  }
  #splash {
    background-size: cover;
    background-position: center;
  }
  #logo img {
    height: 80px;
  }
  #splashinfo {
    top: 160px;
    font-size: 18px;
    line-height: 20px;
  }
  #splashinfo a > span {
    font-size: 22px;
  }
  .mobititle {
    display: block;
    font-size: 30px;
    color: #346465;
    margin-left: -1px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 90%;
  }
  #mobifilter {
    padding-left: 20px;
  }
  #mobiview {
    width: calc(100vw - 40px);
  }
  #exp_filt ul {
    left: 15px;
  }
  #closemenu {
    top: 41px;
    right: 20px;
    cursor: pointer;
  }
  #mobimenu ul {
    left: 20px;
    top: 35px;
  }
  #info {
    top: 100px;
    left: 20px;
    width: calc(100vw - 40px);
  }
  #info li {
    max-height: 33px;
  }
  #info h2 {
    margin-left: 0;
    font-size: 18px;
    line-height: 33px;
  }
  #info h2 span {
    font-size: 21px;
    vertical-align: -2px;
    margin-left: 1px;
  }
  #info .txt {
    margin-left: 0;
    font-size: 18px;
    line-height: 20px;
    margin-top: 30px;
  }
  #info li.open {
    max-height: 300px;
    padding-top: 24px;
    padding-bottom: 35px;
  }
  #info li.open h2 {
    line-height: 20px;
  }
  #info li.open .txt {
    margin-top: 0px;
  }
  #news {
    top: 100px;
    left: 20px;
    width: calc(100vw - 40px);
  }
  #news li {
    max-height: 33px;
  }
  #news .cont {
    margin-top: -284px;
  }
  #news h2 {
    margin-left: 0;
    font-size: 18px;
    line-height: 33px;
  }
  #news h2 span {
    font-size: 21px;
    vertical-align: -2px;
    margin-left: 1px;
  }
  #news .dt {
    display: none;
  }
  #news .img {
    height: 272px;
    width: 100%;
    background-color: #dadada;
    margin-bottom: 12px;
    position: relative;
  }
  #news .txt {
    margin-left: 0;
    font-size: 18px;
    line-height: 20px;
    margin-top: 30px;
  }
  #news p {
    margin: 0;
  }
  #news li.open {
    max-height: 800px;
    padding-top: 24px;
    padding-bottom: 35px;
  }
  #news li.open h2 {
    line-height: 20px;
  }
  #news li.open .dt {
    line-height: 20px;
  }
  #news li.open .txt {
    margin-top: 0px;
  }
  #news li.open .cont {
    margin-top: 0px;
  }
  aside {
    right: auto;
    left: 20px;
    top: 472px;
    width: 63%;
    font-size: 18px;
    line-height: 20px;
    padding-bottom: 120px;
    width: calc(100vw - 40px);
  }
  aside li {
    height: 33px;
    line-height: 33px;
  }
  aside h2,
  h3 {
    font-size: 18px;
    line-height: 33px;
  }
  #mobithumb,
  .pdetails {
    height: 267px;
    width: calc(100vw - 40px);
  }
  #mobithumb {
    margin: 24px 0 0 20px;
  }
  #prod_title {
    margin-left: 20px;
    width: calc(100vw - 40px);
  }
  #description p {
    line-height: 20px;
  }
  #animlogo {
    transform: scale(0.8, 0.8);
    top: 20px;
    left: 10px;
  }
  #textlogo {
    transform: scale(0.8, 0.8);
    top: 112px;
    left: 9px;
  }
}