@charset "UTF-8";

/* Dir: /solutions/healthcare
 ****************************/

/*
 * 背景
 */
body {
  background: none;
}

#container {
  padding-top: 139px;
  background: #fff no-repeat top;
}

@media screen and (max-width: 767px) {
  #container {
    padding-top: 60px;
  }
}


/*
 * メインビジュアル
 */
div.solution-visual {
  width: 100%;
  min-width: 960px;
  height: 406px !important;
  overflow: hidden;
  margin: 0 auto -81px;
}

div.solution-visual img {
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -1000px;
  width: 2000px;
}

@media screen and (max-width: 767px) {
  div.solution-visual {
    min-width: 0;
    height: 0 !important;
    padding-top: 42.2%;  /* 406/960 */
    margin-bottom: -8.4%;  /* (406-325)/960 */
  }

  div.solution-visual img {    
    left: 0;
    min-width: 208%;  /* 2000/960 */
    margin-left: -54%;  /* (208-100)/2 */
  }
}


/*
 * タブ
 */
#content .tab,
#content .tab ul {
  width: 940px;
}

#content .tab {
  margin: 0 auto;
  padding: 0;
}

#content .tab ul li.tab_3,
#content .tab ul li.tab_3 a {
  width: 306px;
}

#content .tab ul li.tab_3 {
  margin-right: 11px;
}

#content .tab ul li {
  border: none;
  margin-bottom: 19px;
}

#content .tab ul li.active {
  padding: 0;
  background: none;
}

#content .tab ul li.active a span.arrow {
  top: auto;
  left: 50%;
  bottom: -10px;
  margin-left: -10px;
  width: 0;
  height: 0;
  background-image: none;
  border-top: 10px solid;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
}

#content .tab ul li.last {
  margin-right: 0;
}

#content .tab ul li a {
  background: #fff;
  -webkit-box-shadow: 0 0 5px rgba(81, 81, 81, 0.3);
  box-shadow: 0 0 5px rgba(81, 81, 81, 0.3);
}

#content .tab ul li:nth-child(n).active a,
#content .tab ul li:nth-child(n).active a:hover {
  color: #fff;
}

#content .tab ul li:nth-child(n) a:hover {
  color: #aaa;
  background: #fff;
}

#content .tab ul li:nth-child(1) a {
  color: #006083;
}

#content .tab ul li:nth-child(1).active a,
#content .tab ul li:nth-child(1).active a:hover {
  background: #006083 !important;
}

#content .tab ul li:nth-child(1).active a span.arrow {
  border-top-color: #006083;
}

#content .tab ul li:nth-child(2) a {
  color: #008065;
}

#content .tab ul li:nth-child(2).active a,
#content .tab ul li:nth-child(2).active a:hover {
  background: #008065 !important;
}

#content .tab ul li:nth-child(2).active a span.arrow {
  border-top-color: #008065;
}

#content .tab ul li:nth-child(3) a {
  color: #41898e;
}

#content .tab ul li:nth-child(3).active a,
#content .tab ul li:nth-child(3).active a:hover {
  background: #41898e !important;
}

#content .tab ul li:nth-child(3).active a span.arrow {
  border-top-color: #41898e;
}

#content .tab ul li a span {
  font-weight: normal;
  font-family: "FuturaLTPro-Book";
}


/*
 * コンテンツ
 */
.column_wrap,
.column,
.column .column_inner {
  padding: 0;
  background: none;
}

.column .column_inner {
  margin: 0 auto;
  border: 1px solid #e5e6e7;
  -webkit-box-shadow: 0 0 3px rgba(126, 132, 137, 0.3);
  box-shadow: 0 0 3px rgba(126, 132, 137, 0.3);
  background-color: #fff;
}

.hc_index,
.hc_page {
  font-family: "Open Sans", sans-serif;
  font-weight: normal;
}

.hc_index {
  position: relative;
  box-sizing: border-box;
  height: 1451px;
  padding: 140px 120px 450px;
  color: #fff;
  background: #0a4c71 url(https://www.eizoglobal.com/solutions/healthcare/index_main_bg.jpg) no-repeat top;
  background-size: 936px 1451px;
}

.hc_index p {
  font-size: 18px;
  line-height: 1.7;
}

.hc_index_nav {
  position: absolute;
  bottom: 88px;
  width: 696px;
}

.hc_challenge {
  background: #333 no-repeat top;
  background-size: cover;
  padding: 45px 0;
}

.hc_page_diag .hc_challenge {
  background-image: url(https://www.eizoglobal.com/solutions/healthcare/diagnostics_challenge_bg.jpg);
}

.hc_page_or .hc_challenge {
  background-image: url(https://www.eizoglobal.com/solutions/healthcare/or_challenge_bg.jpg);
}

.hc_challenge .hc_title1,
.hc_challenge .hc_title2 {
  font-family: "FuturaLTPro-Book";
  color: #fff;
}

#main .hc_challenge .hc_title1 {
  margin-right: 60px;
  margin-left: 60px;
  padding-bottom: 10px;
  border-bottom: 1px solid #fff;
  font-size: 40px;
}

.hc_challenge .hc_title2 {
  font-size: 24px;
  line-height: 1.3;
}

.hc_challenge p {
  font-size: 16px;
  line-height: 1.9;
  color: #fff;
}

.hc_solutions .box + .box {
  border-top: 2px solid #eeeeee;
  margin-bottom: 60px;
}

.hc_solutions .hc_title3 {
  font-family: "FuturaLTPro-Book";
  font-size: 28px;
  color: #008065;
}

.hc_solutions p {
  font-size: 16px;
  color: #666666;
  line-height: 1.8;
}

.medical_compat_checklist {
  background-color: #d6ede8;
}

#main .hc_compat_list h2 {
  margin: 0 -76px 20px -80px;
  padding: 10px 0;
  background-color: #dfe2e7;
  text-align: center;
  font-family: "FuturaLTPro-Book";
  font-weight: normal;
}

#main .hc_compat_list h3 {
  text-align: center;
  font-family: "FuturaLTPro-Book";
  font-weight: normal;
}

.hc_news_title {
  font-family: "FuturaLTPro-Book";
  font-weight: normal;
}

#main .medical_compat_checklist ul li {
  background-image: url(https://www.eizoglobal.com/solutions/healthcare/compat_marker.png);
  background-size: 23px 20px;
}

@media screen and (max-width:960px) {
  .solutions div.solution-visual {
    min-width: 0;
  }
  .solutions div.solution-visual img {
    max-width: initial;
  }
  #main .hc_index .block_solutions {
    max-width: 100%;
  }
  #id_message {
    padding: 40px 40px 0;
  }
  .solutions #main .hc_page .box {
    margin: 0 ;
    padding: 0 20px;
  }
  .solutions #main .hc_solutions .box.horizontal {
    padding-top:30px;
  }
  /* global */
  .hc_index_nav {
    max-width: calc(100% - 120px);
    display: flex;
    justify-content: center;
    left: 60px;
  }
  footer {
    overflow: hidden;
  }
  .solutions div.horizontal.hc_compat_list {
    display: block;
  }
  .solutions #main .box.horizontal.clearfix {
    display: flex;
  }

}
@media screen and (max-width: 767px) and (orientation: portrait), screen and (max-width: 767px) and (orientation: landscape) {
  .solutions #container {
    background-position: 50% 60px,50% 139px,top left;
    background-size: 208% auto, auto, auto;
  }
  .solutions div.solution-visual img {
    max-width: 100%;
  }
  #main .hc_index .block_solutions {
    height: auto;
    max-width: 480px;
    margin: 0 auto;
  }
  #main .hc_index .block_solutions > div {
    position: static;
    top: auto;
    left:auto;
    right:auto;
  }
  #main .block_solutions .block01 {
    margin-left: -10px;
  }
  #main .hc_index .block_solutions .block03 {
    margin-left: -70px;
  }
  #main .hc_index .block_solutions .block04 {
    margin-right: -70px;
  }
  #main .hc_index .block_solutions .block01_on1,
  #main .hc_index .block_solutions .block01_on2,
  #main .hc_index .block_solutions .block02_on3,
  #main .hc_index .block_solutions .block02_on4,
  #main .hc_index .block_solutions .block03_on5,
  #main .hc_index .block_solutions .block04_on6,
  #main .hc_index .block_solutions .block04_on7 {
    display:none;
  }
  #main .hc_index .block_solutions .area_wrap {
    display: none;
  }
  #main .hc_index .block_solutions > div[class^="btn"] {
    position: absolute;
    left: calc(50% - 80px);
  }
  #main .hc_index .block_solutions .btn01 {
    top: 1%;
    margin-left: 70px;
  }
  #main .hc_index .block_solutions .btn02 {
    top: 16%;
    margin-left: 50px;
  }
  #main .hc_index .block_solutions .btn03 {
    top: 22%;
  }
  #main .hc_index .block_solutions .btn04 {
    top: 40%;
    margin-left: 50px;
  }
  #main .hc_index .block_solutions .btn05 {
    top:auto;
    bottom: 30%;
    margin-left: -60px;
  }
  #main .hc_index .block_solutions .btn06 {
    top:auto;
    bottom: 22%;
    margin-left: 40px;
  }
  #main .hc_index .block_solutions .btn07 {
    top: auto;
    bottom: 30px;
    margin-left: 10px;
  }
  #main .hc_index .block_solutions [id^="sol"] {
    position: fixed;
    top: 40% !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    max-width: 90%;
  }
  .solutions #main .hc_page .box {
    margin: 0;
    padding: 0 15px;
  }
  .solutions div.horizontal div.graph {
    max-width: 240px;
  }
  .solutions #main .hc_solutions .box.horizontal .graph.mr50 {
    margin-right: 0;
  }  
  #main .contact_area {
    max-width: 100%;
  }
  /* global */
  .hc_index {
    width: 100%;
    padding: 140px 60px 450px;
  }
  .solutions #main .hc_index .mt40 img {
    max-width: calc(100% - 120px);
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width:480px) {
  .solutions .column .column_inner {
    border: none;
  }
  .solutions #content .tab ul li:nth-child(1) a {
    color: #006083;
  }
  
  .solutions #content .tab ul li:nth-child(2) a {
    color: #008065;
  }
  
  .solutions #content .tab ul li:nth-child(3) a {
    color: #41898e;
  }
  .solutions #content .tab ul li.active a {
    color: #fff;
  }
  .hc_index {
    position: relative;
    height: auto;
    box-sizing: border-box;
    padding: 50px 20px 10px;
    color: #fff;
    background: #0a4c71 url(https://www.eizoglobal.com/solutions/healthcare/index_main_bg.jpg) no-repeat right top;
    background-size: 500px;
    margin-bottom: 20px;
    font-size: 110%;
    line-height: 1.5;
    margin-bottom: 0 !important;
  }
  .hc_index_nav {
    position: static;
    margin-top: 40px;
    margin-bottom:40px;
    max-width: 100%;
  }
  #main .hc_index .pageLink {
    display: flex;
    justify-content: space-around;
  }
  #main .hc_index .pageLink li {
    margin: 0;
  }
  #main .hc_index .pageLink p,
  #main .hc_index .pageLink a {
    font-size: 18px;
  }
  #main .hc_index > p:first-child {
    margin-top: 0;
    margin-right: 100px;
  }
  #main .hc_index > p:nth-child(3) {
    height: 243px;
    margin-right: 100px;
    margin-bottom: 74px;
  }
  #main .hc_index .h2_solutions {
    font-size: 16.89px;
    margin-bottom: 20px;
  }
  #main .hc_index p {
    font-size: 14.08px;
    line-height: 1.5;
  }
  #main .hc_index .block_solutions {
    max-width: 100%;
  }
  #main .hc_index .block_solutions > div[class^="btn"] a {
    width: 160px;
  }
  #main .hc_index .block_solutions #sol01  {
    top: 20% !important;
  }
  #main .hc_index .block_solutions #sol01 .modal_inner {
    padding-top: 60px;
  }
  #id_message {
    padding: 40px 0 0;
  }
  .solutions div.horizontal div.text.w410.ml65 {
    margin-left: 0;
    padding: 0 15px;
    box-sizing: border-box;
  }
  #main .hc_challenge .hc_title1 {
    font-size: 24px;
    font-weight: 700;
  }
  .hc_challenge .hc_title2 {
    font-size: 20px;
    font-weight: 700;
  }
  #main .hc_challenge p {
    font-size: 14px;
  }
  #main .hc_solutions {
    max-width: 100%;
  }
  #main .hc_solutions .box {
    margin: 0;
    padding: 0 15px;
  }
  #main .hc_title3 {
    font-size: 20px;
    margin-bottom: 10px;
  }
  .solutions div.horizontal div.graph.mr50 {
    margin-right: auto;
  }
  .solutions div.horizontal div.graph {
    width: 200px;
    margin: 0 auto 15px !important;
  }
  .solutions #main .hc_page .box {
    margin-left: 0;
  }
  .hc_challenge .horizontal .text {
    margin: 0 0 10px !important;
    padding: 20px;
    width: 100% !important;
    box-sizing: border-box;
  }
  .solutions #main .box.horizontal.clearfix {
    flex-direction: column;
  }
  #main .hc_title3 {
    font-weight: 700;
    margin-top: 0 !important;
  }
  .medical_compat_checklist {
    padding: 15px;
  }
  .hc_page_diag {
    background: url(https://www.eizoglobal.com/solutions/healthcare/diagnostics_bg.png) no-repeat;
    background-position: center 600px;
    background-size: 1000px;
    padding: 0;
  }
  .hc_page_or {
    background: url(https://www.eizoglobal.com/solutions/healthcare/diagnostics_bg.png) no-repeat;
    background-position: center 660px;
    background-size: 1000px;
    padding: 0;
  }


}