@charset "UTF-8";

/* CSS Document */

@media print, screen and (min-width: 521px) {
  .com-top {
    background-image: url(url);
    width: min(100vw, 1280px);
    height: min(23.4375vw, 300px);
  }
  .com-top .title {
    width: min(30.625vw, 392px);
    height: min(23.4375vw, 300px);
    float: left;
  }
  .com-top .title .company-en {
    color: #ce2314;
    font-size: min(3.542187vw, 45.34px);
    font-weight: 600;
    text-align: left;
    margin-top: min(7.1875vw, 92px);
    margin-left: min(4.6875vw, 60px);
  }
  .com-top .title .company-jp {
    color: #000000;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: min(1.458594vw, 18.67px);
    margin-left: min(4.6875vw, 60px);
    margin-top: max(-0.78125vw, -10px);
  }
  .com-top .com-image-box {
    width: min(69.375vw, 888px);
    height: min(23.4375vw, 300px);
    float: left;
  }
  .com-title-box {
    width: min(100vw, 1280px);
    height: min(11.71875vw, 150px);
  }
  .com-title-box .title-line {
    width: min(14.0625vw, 180px);
    height: min(6.25vw, 80px);
    border-bottom: 3px solid #000000;
    float: left;
  }
  .com-title-box .title {
    color: #ce2314;
    font-size: min(1.875vw, 24px);
    font-weight: 600;
    float: left;
    margin-top: min(4.6875vw, 60px);
    margin-left: min(1.171875vw, 15px);
  }

  .topImage {
    width: min(69.375vw, 888px);
  }
  .topImage img {
    width: 100%;
  }

  .history-title-box {
    width: min(100vw, 1280px);
    height: min(11.71875vw, 150px);
  }
  .history-title-box .title-line {
    width: min(14.0625vw, 180px);
    height: min(6.25vw, 80px);
    border-bottom: 3px solid #ffffff;
    float: left;
  }
  .history-title-box .title {
    color: #ffffff;
    font-size: min(1.875vw, 24px);
    font-weight: 600;
    float: left;
    margin-top: min(4.6875vw, 60px);
    margin-left: min(1.171875vw, 15px);
  }
  .com-menu {
    width: min(100vw, 1280px);
    height: min(15.625vw, 200px);
    background-color: #000000;
  }
  .com-menu .dummy {
    width: min(10.9375vw, 140px);
    height: min(15.625vw, 200px);
    float: left;
  }
  .com-menu .menu-item {
    width: min(15.625vw, 200px);
    height: min(15.625vw, 200px);
    float: left;
    text-align: center;
  }
  .com-menu .menu-item .item-name {
    color: #ffffff;
    text-align: center;
    height: min(7.8125vw, 100px);
    width: min(8.75vw, 112px);
    margin-left: min(3.125vw, 40px);
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: min(1.25vw, 16px);
    font-weight: 600;
    padding-top: min(3.90625vw, 50px);
  }
  .com-menu .menu-item .arrow {
    width: min(15.625vw, 200px);
    margin-left: min(0vw, 0px);
    text-align: center;
  }

  .com-greeting {
    width: min(100vw, 1280px);
    background-color: #f4f3f2;
    border-bottom: thin solid #ce2314;
    height: min(89.84375vw, 1150px);
    position: relative;
  }
  .com-greeting .pict-msg-layout {
    position: relative;
  }
  .com-greeting .president-pic {
    width: min(95.3125vw, 1220px);
    height: min(36.40625vw, 466px);
    position: relative;
    z-index: 10;
    margin: 0 auto;
  }
  .com-greeting .president-msg {
    width: min(95.3125vw, 1220px);
    top: min(24.21875vw, 310px);
    left: min(2.34375vw, 30px);
    position: absolute;
    padding-left: min(4.6875vw, 60px);
    padding-right: min(4.6875vw, 60px);
    height: min(46.875vw, 600px);
    background-color: #ffffff;
    padding-top: min(16.40625vw, 210px);
    color: #000000;
    font: normal normal bold 19px/32px Yu Gothic;
    font-size: min(1.667188vw, 21.34px);
    font-weight: 600;
  }
  .pict-msg-layout .president-msg .president-name {
    text-align: right;
  }
  .president-msg .president-name .name {
    font-size: min(2.604688vw, 33.34px);
  }
  .com-profile {
    width: min(100vw, 1280px);
    background-color: #f4f3f2;
    border-bottom: thin solid #ce2314;
    height: min(132.8125vw, 1700px);
    position: relative;
  }
  .com-profile .profile {
    background-color: #ffffff;
    width: min(90.625vw, 1160px);
    height: min(110.9375vw, 1420px);
    padding-top: min(7.8125vw, 100px);
    margin-left: min(4.6875vw, 60px);
  }
  .com-profile .profile .profile-table {
    width: min(62.5vw, 800px);
    margin-left: min(11.71875vw, 150px);
  }
  .profile-table tbody tr .title {
    border-bottom: thin solid #ce2314;
    width: min(23.4375vw, 300px);
    color: #ce2314;
    font-size: min(1.25vw, 16px);
    font-weight: 600;
  }
  .profile-table tbody tr .description {
    border-bottom: thin solid #ce2314;
    color: #000000;
    font-size: min(1.25vw, 16px);
    font-weight: 600;
  }
  .com-newlogo {
    width: min(100vw, 1280px);
    background-color: #f4f3f2;
    border-bottom: thin solid #ce2314;
    height: min(89.84375vw, 1150px);
    position: relative;
  }
  .com-newlogo .new-logo {
    background-color: #ffffff;
    width: min(90.625vw, 1160px);
    height: min(66.40625vw, 850px);
    padding-top: min(7.8125vw, 100px);
    margin-left: min(4.6875vw, 60px);
  }
  .com-newlogo .new-logo .upper-box {
    height: min(31.25vw, 400px);
  }
  .new-logo .upper-box .flag-image-box {
    float: left;
    margin-left: min(6.25vw, 80px);
  }
  .new-logo .upper-box .description {
    float: left;
    margin-left: min(4.6875vw, 60px);
  }
  .upper-box .description .about-newlogo {
    color: #ce2314;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: min(1.667188vw, 21.34px);
  }
  .upper-box .description .about-message {
    color: #000000;
    font-size: min(1.458594vw, 18.67px);
    font-weight: 600;
    margin-left: min(2.34375vw, 30px);
  }
  .com-newlogo .new-logo .lower-box {
    border-top: thin solid #f4f3f2;
    width: min(78.125vw, 1000px);
    margin-left: min(6.25vw, 80px);
    height: min(25.78125vw, 330px);
  }
  .new-logo .lower-box .logo-image-box {
    float: left;
    width: min(32.8125vw, 420px);
    height: min(19.53125vw, 250px);
    margin-top: min(6.25vw, 80px);
    border-right: thin solid #f4f3f2;
  }

  .new-logo .lower-box .logo-image-box .companyLogo {
    width: min(29.609375vw, 379px);
  }

  .new-logo .lower-box .name-image-box {
    float: left;
    margin-top: min(7.8125vw, 100px);
    padding-left: min(3.125vw, 40px);
  }
  .com-history {
    width: min(100vw, 1280px);
    background-color: #f4f3f2;
    border-bottom: thin solid #ce2314;
    height: min(87.96875vw, 1126px);
    position: relative;
    background-image: url(../../images/HP_smc_200_img/200-09.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
  }
  .com-history .history-box {
    width: min(62.5vw, 800px);
    margin-left: min(18.75vw, 240px);
    overflow-y: auto;
    height: min(70.3125vw, 900px);
  }
  #list_history {
    border-bottom: thin solid #ffffff;
    padding: 0 min(4.6875vw, 60px);
  }

  #list_history li {
    list-style: none;
  }

  .hislist .history_title {
    color: #ffffff;
    font-size: min(1.5625vw, 20px);
    padding: 17px 0;
    font-weight: 500;
    padding-bottom: min(1.5625vw, 20px);
    padding-left: min(3.125vw, 40px);
  }

  #list_history .history_list {
    color: #ffffff;
    padding-left: min(7.03125vw, 90px);
  }

  .hislist,
  .hislist.selected3 {
    line-height: min(1.015625vw, 13px);
    background-image: url(../../images/HP_smc_200_img/200-06_a.png);
    background-position: min(0vw, 0px) min(1.71875vw, 22px);
    background-repeat: no-repeat;
  }
  .hislist.selected3 {
    background-image: url(../../images/HP_smc_200_img/200-06_c.png);
    background-repeat: no-repeat;
  }

  .hislist dl .history_list {
    margin: 10px 0;
    padding: 0;
    clear: both;
  }
  .hislist dl .history_list dt {
    float: left;
    width: min(9.375vw, 120px);
    margin: 0;
    padding: 0 0 min(0.625vw, 8px) min(1.171875vw, 15px);
    font-size: min(1.25vw, 16px);
    font-weight: 500;
  }
  .hislist dl .history_list dd {
    width: min(34.375vw, 440px);
    margin: 0 0 0 min(9.375vw, 120px);
    padding: 0 0 8px 0;
    font-size: min(1.25vw, 16px);
    font-weight: 500;
  }
  .com-access {
    width: min(100vw, 1280px);
    background-color: #f4f3f2;
    border-bottom: thin solid #ce2314;
    height: min(78.125vw, 1000px);
    position: relative;
  }
  #sm-map {
    width: min(100vw, 1280px);
    height: min(42.96875vw, 550px);
  }
  .com-access .address-box {
    width: min(70.3125vw, 900px);
    height: min(15.625vw, 200px);
    margin-left: min(18.75vw, 240px);
    margin-top: min(6.25vw, 80px);
  }
  .com-access .address-box .address-content {
    float: left;
    color: #000000;
    font-size: min(1.458594vw, 18.67px);
    width: min(70.3125vw, 900px);
    height: min(4.6875vw, 60px);
  }
  .com-access .address-box .address-content .addr-title {
    color: #ce2314;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: min(1.458594vw, 18.67px);
    float: left;
    width: min(7.8125vw, 100px);
  }
  .address-box .address-content .addr-description {
    float: left;
  }
  .address-box .address-content .addr-redline {
    color: #ce2314;
    font-size: min(1.458594vw, 18.67px);
  }
}

@media only screen and (min-width: 0px) and (max-width: 520px) {
  .com-top {
    width: 100%;
    float: left;
    padding-bottom: 1%;
  }
  .com-top .title {
    width: 100%;
    float: left;
    padding-bottom: 5%;
    background-color: white;
  }
  .com-top .title .company-en {
    color: #ce2314;
    font-size: 6vw;
    font-weight: 600;
    text-align: left;
    margin-top: 5%;
    margin-left: 7%;
  }
  .com-top .title .company-jp {
    color: #000000;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: 3vw;
    margin-left: 7%;
  }
  .com-top .com-image-box {
    width: 100%;
    float: left;
  }

  .com-top .com-image-box .com-image {
    width: 100%;
    height: 100%;
  }
  .com-title-box {
    width: 100%;
    padding-top: 5%;
    padding-bottom: 5%;
    float: left;
    background-color: #f4f3f2;
  }
  .com-title-box .title-line {
    width: 15%;
    padding-top: 5%;
    border-bottom: 2px solid #000000;
    float: left;
  }
  .com-title-box .title {
    width: 80%;
    color: #ce2314;
    font-size: 3.5vw;
    font-weight: 600;
    float: left;
    margin-top: 2.5%;
    margin-left: 2%;
  }

  .com-menu {
    width: 100%;
    background-color: #000000;
    padding-left: 15%;
    padding-right: 15%;
    padding-top: 15%;
    padding-bottom: 10%;
    float: inherit;
    margin-top: 5%;
  }

  .com-menu .menu-item {
    width: 100%;
    padding-top: 7%;
    padding-bottom: 5%;
    display: flex;
    align-items: center;
    border-bottom: thin solid #f4f3f2;
  }

  .com-menu .menu-item .item-name {
    width: 95%;
    color: #ffffff;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: 3vw;
    font-weight: 600;
    float: left;
  }
  .com-menu .menu-item .arrow {
    width: 5%;
    text-align: right;
    float: right;
  }

  /******** GREETING ************/

  .com-greeting {
    width: 100%;
    background-color: #f4f3f2;
    /*		border-bottom: thin solid #CE2314;*/
    position: relative;
  }
  .com-greeting .pict-msg-layout {
    position: relative;
  }
  .com-greeting .president-pic {
    width: 100%;
    position: relative;
  }

  .com-greeting .president-pic .president-image {
    width: 100%;
    height: 100%;
  }

  .com-greeting .president-msg {
    width: 100%;
    padding-left: 7%;
    padding-right: 7%;
    background-color: #ffffff;
    padding-top: 5%;
    color: #000000;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: 3vw;
  }

  .pict-msg-layout .president-msg .president-name {
    text-align: right;
  }

  .president-msg .president-name .title {
    margin-top: 4%;
    font-size: 3vw;
  }

  .president-msg .president-name .name {
    font-size: 4vw;
  }

  /********** PROFILE *******/

  .com-profile {
    width: 100%;
    background-color: #ffffff;
    /*		border-bottom: thin solid #CE2314;*/
    position: relative;
    padding-top: 5%;
    padding-bottom: 5%;
  }
  .com-profile .profile {
    background-color: #ffffff;
    width: 90%;

    margin-left: 7%;
    margin-top: 100px;
  }
  .com-profile .profile .profile-table {
    width: 90%;
  }
  .profile-table tbody tr .title {
    border-bottom: thin solid #ce2314;
    width: 22%;
    color: #ce2314;
    font-size: 3vw;
    font-weight: 600;
  }
  .profile-table tbody tr .description {
    border-bottom: thin solid #ce2314;
    color: #000000;
    font-size: 3vw;
    font-weight: 600;
  }

  /******* NEW LOGO *********/

  .com-newlogo {
    width: 100%;
    background-color: #f4f3f2;
    position: relative;
    padding-bottom: 10%;
    float: none;
  }
  .com-newlogo .new-logo {
    background-color: #ffffff;
    width: 90%;
    padding-bottom: 20%;
    float: left;
    margin-top: 0.5%;
    margin-left: 4%;
    margin-right: 4%;
  }

  .com-newlogo .new-logo .upper-box {
    width: 100%;
    margin-top: 5%;
    float: flex;
    align-items: flex-start;
  }

  .new-logo .upper-box .flag-image-box {
    width: 50%;
    margin-left: 25%;
    margin-right: 25%;
    float: left;
  }

  .new-logo .upper-box .flag-image-box .flag-image {
    width: 100%;
    height: 100%;
  }

  .new-logo .upper-box .description {
    float: left;
    padding-top: 8%;
    padding-left: 4%;
    padding-right: 4%;
    width: 100%;
  }

  .about-newlogo {
    font-size: 3.5vw;
    color: #ce2314;
    font-weight: 600;
    padding-left: 4%;
    padding-right: 4%;
  }
  .upper-box .description .about-message {
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    color: #000000;
    font-size: 2.9vw;
    font-weight: 600;
    width: 100%;
    float: left;
  }
  .com-newlogo .new-logo .lower-box {
    width: 100%;
    float: flex;
    align-items: flex-start;
  }
  .new-logo .lower-box .logo-image-box {
    float: left;
    width: 100%;
    padding-left: 10%;
    padding-right: 10%;
  }

  .new-logo .lower-box .logo-image-box .logo-image {
    width: 90%;
    padding-left: 10%;
    padding-right: 10%;
  }

  .new-logo .lower-box .name-image-box {
    float: left;
    width: 80%;
    margin-top: 10%;
    padding-left: 7%;
  }

  .new-logo .lower-box .name-image-box .name-image {
    width: 100%;
    height: 100%;
  }

  /******* HISTORY ******/

  .com-history {
    width: 100%;
    background-color: #f4f3f2;
    border-bottom: thin solid #ce2314;
    position: relative;
    background-image: url(../../images/HP_smc_200_img/200-10.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    float: none;
  }
  .com-history .history-box {
    width: 80%;
    margin-left: 7%;
    overflow-y: auto;
  }

  .history-title-box {
    width: 100%;
    height: 15%;
  }
  .history-title-box .title-line {
    width: 15%;
    padding-top: 5%;
    border-bottom: 2px solid #ffffff;
    float: left;
  }
  .history-title-box .title {
    width: 80%;
    color: #ffffff;
    font-size: 3.5vw;
    font-weight: 600;
    float: left;
    margin-top: 2.5%;
    margin-left: 2%;
  }

  #list_history {
    border-bottom: thin solid #ffffff;
  }

  .hislist .history_title {
    color: #ffffff;
    font-size: 4vw;
  }
  #list_history .history_list {
    color: #ffffff;
  }

  .hislist,
  .hislist.selected3 {
    margin: 5px 0 0;
    line-height: 13px;
    background-image: url(../../images/HP_smc_200_img/210-02.png);
    background-image: url(../../images/HP_smc_200_img/200-06_a.png);
    background-repeat: no-repeat;
  }
  .hislist.selected3 {
    background-image: url(../../images/HP_smc_200_img/210-03.png);
    background-image: url(../../images/HP_smc_200_img/200-06_c.png);
    background-repeat: no-repeat;
  }

  .hislist dl .history_list {
    margin: 2% 0;
    padding: 0;
    clear: both;
  }
  .hislist dl .history_list dt {
    float: left;
    width: 10%;
    margin: 0;
    padding: 0 0 1% 2%;
    font-size: 2.4vw;
    font-weight: 500;
  }
  .hislist dl .history_list dd {
    width: 90%;
    margin: 0 0 0 20%;
    padding: 0 0 1% 0;
    font-size: 2.4vw;
    font-weight: 500;
  }

  /***** ACCESS ****/

  .com-access {
    width: 100%;
    background-color: #f4f3f2;
    border-bottom: thin solid #ce2314;
    position: relative;
  }

  #sm-map {
    width: 560px;
    height: 270px;
  }
  .com-access .address-box {
    width: 90%;
    margin-left: 7%;
    margin-top: 10%;
  }
  .com-access .address-box .address-content {
    float: left;
    color: #000000;
    font-size: 2.6vw;
    width: 90%;
    height: 10%;
  }
  .com-access .address-box .address-content .addr-title {
    color: #ce2314;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: 2.6vw;
    float: left;
    width: 20%;
  }
  .address-box .address-content .addr-description {
    float: left;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo,
      sans-serif;
    font-size: 2.2vw;
  }
  .address-box .address-content .addr-redline {
    color: #ce2314;
    font-size: 3vw;
  }
}
