/* Scss Document */
/* ##################### exclusive use mobile ######################### */
@media (max-width: 767px) {
  body#login {
    animation: bg-color 20s infinite;
    -webkit-animation: bg-color 20s infinite; }

  input [name="fd"] {
    width: 100px !important; }

  #contentWrap,
  #loginForm,
  #fixedHeader {
    width: 100% !important; }

  #contentWrap {
    margin-top: 40px !important; }

  #contentBox {
    padding: 0; }
    #contentBox .dbChart66 {
      width: 100% !important; }
    #contentBox .dbChart33 {
      width: 100% !important; }
    #contentBox .componentWrap .iconWrap {
      width: 100% !important;
      text-align: center;
      padding: 5px; }
      #contentBox .componentWrap .iconWrap p {
        font-size: 20px; }
    #contentBox .componentWrap .numWrap {
      width: 100% !important;
      clear: both; }
      #contentBox .componentWrap .numWrap .number {
        display: block;
        font-size: small !important; }
      #contentBox .componentWrap .numWrap .jp {
        padding: 5px;
        text-align: right;
        background-image: url(../images/jp.png);
        background-repeat: no-repeat;
        background-position: left center;
        line-height: 25px; }
      #contentBox .componentWrap .numWrap .en {
        padding: 5px;
        text-align: right;
        background-image: url(../images/en.png);
        background-repeat: no-repeat;
        background-position: left center;
        line-height: 25px; }

  #navWrap {
    width: 15%; }

  h1, h2 {
    font-size: small !important; }

  footer .copy,
  .bt {
    font-size: x-small !important; }

  .bt {
    margin-bottom: 5px; }

  .fleft {
    clear: both; }

  .fright {
    clear: both; }

  .iconArea, .numArea {
    clear: both;
    padding: 10px !important; }

  .mobiWide {
    width: 87%; }

  dl.detail .inBoxFl {
    clear: both;
    margin-right: 0px; }
  dl.detail .innerD {
    width: 100% !important; }
  dl.detail dd input[type=text],
  dl.detail dd input[type=email],
  dl.detail dd input[type=tel],
  dl.detail dd input[type=number],
  dl.detail dd input[type=url],
  dl.detail dd input[type=file],
  dl.detail dd textarea {
    width: 100% !important;
    margin-bottom: 5px; }
  dl.detail .inBoxLeft dt.title,
  dl.detail .inBoxLeft,
  dl.detail .inBoxRight {
    width: 100% !important; }

  table {
    /* 
     &.list{
       display: block;
       position: relative;
       thead {
         display: block;
         float: left;
       }
       .boldNum{
         margin-bottom:0px;
         font-size: x-small;
         font-weight: normal;
       }
       tbody {
         display: block;
         width: auto;
         position: relative;
         overflow-x: auto;
         white-space: nowrap;
         -webkit-overflow-scrolling: touch;
         tr{
           margin-right: -5px;
         }
       }
       tr {
         display: inline-block;
       }
       th{
         display: block;
         font-size:x-small;
         border-bottom: 1px solid #ECECEC;
         line-height: 1.5em;
         padding-top: 5px;
         padding-bottom: 2px;
         &.checkHeight{
           line-height:29px;
         }
       }
       td{
         display: block;
         font-size:x-small;
         &.dmw{
           padding-left:20px;
           padding-right:20px;
         }
         &.listDateWidth{
           width: 100%;
         }
         &.productsSubject{
           width: 100%;
         }
       }
     }
     */ }
    table .countNum {
      font-size: x-small; }
    table.unBlock tbody, table.unBlock tr, table.unBlock th, table.unBlock td {
      display: inherit !important; }
    table.unBlock tr {
      margin-right: 0px !important; }
    table.listOne th {
      font-size: x-small; }
    table.listOne .numBox {
      font-size: x-small !important; }
    table.mobifixed th {
      height: 55px;
      width: 100px !important; }
    table.mobifixed td {
      height: 55px; }

  .mobi {
    display: none; }

  .mobiView {
    display: block !important; }

  .mobiMenuClose {
    cursor: pointer;
    margin-right: 10px; }

  .percentDisc {
    font-size: x-small !important; }

  .numDetailBox, .chertHomeBox {
    clear: both;
    width: 100% !important; }

  /* ##################### menu ######################### */
  /* menu common */
  .menu-trigger,
  .menu-trigger span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box; }

  .menu-trigger {
    position: relative;
    width: 50px;
    height: 44px; }

  .menu-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #000; }

  .menu-trigger span:nth-of-type(1) {
    top: 0; }

  .menu-trigger span:nth-of-type(2) {
    top: 20px; }

  .menu-trigger span:nth-of-type(3) {
    bottom: 0; }

  /* menu common end */
  .menu-trigger.active {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); }

  .menu-trigger.active span:nth-of-type(1) {
    -webkit-transform: translateY(13px) rotate(-45deg);
    transform: translateY(13px) rotate(-45deg); }

  .menu-trigger.active span:nth-of-type(2) {
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg); }

  .menu-trigger.active span:nth-of-type(3) {
    opacity: 0; }

  /* ##################### menu end ######################### */
  .sortBox {
    display: inline-block;
    margin-top: 0px; }

  #logForm {
    width: 90%; }

  #logListView {
    width: 90%; }

  .ctSubject {
    padding: 2px !important;
    line-height: 10px !important;
    font-size: xx-small; }

  .ctCell {
    font-size: x-small;
    padding: 2px;
    line-height: 30px; }

  .ctCellList {
    font-size: x-small;
    padding: 2px;
    line-height: 20px; }

  .ctName {
    width: 40%; }

  .listHead {
    padding-left: 0px !important; }

  .ctNum {
    text-align: center;
    width: 20%; }

  .halfBox {
    clear: both;
    width: 100%; }

  .pcRmargin {
    margin-right: 0; }

  .doubleBox, .tripleBox, .quadrupleBox {
    width: 99% !important;
    margin-bottom: 5px !important; }

  .tripleBox .bw, .quadrupleBox .bw {
    border-right: 1px solid #eaeaea !important; }

  .mb.clearfix {
    margin-bottom: 0px !important; }

  #mainNav, #mainNav h3 {
    font-size: x-small !important; }

  .ctNum {
    width: 25% !important; }

  /* ##################	breadcrumb	################## */
  .panParent a, .panChild {
    display: none; }

  .mailBodyBox {
    display: none;
    position: fixed;
    background-color: white;
    z-index: 99;
    padding: 10px;
    border: 1px solid #333333;
    line-height: 1.5em;
    width: 80% !important;
    font-size: xx-small;
    overflow: auto;
    height: 50%; }

  .percentBox {
    font-size: medium !important; }

  .mainResult {
    width: 100% !important;
    clear: both; }

  #mainResultChart {
    text-align: center;
    height: 50px !important;
    width: 100% !important;
    clear: both;
    background-color: white;
    border-left: 1px solid #eaeaea;
    border-top: 1px solid #eaeaea;
    border-right: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea; }

  .subChartBox {
    text-align: center;
    width: 100% !important;
    clear: both; }

  div.check-group label {
    font-size: x-small; } }