@charset "utf-8";

/*========================================================================================================================


  ◇◆◇ 宮川コンタクト ◇◆◇
  
  
========================================================================================================================*/

/*----------------------------------------------------------------------------------------------------

  見出し画像
  
----------------------------------------------------------------------------------------------------*/

.pgHeadline { background-color:#d7edf8; }
.pgHeadline h2 { background-image:url(../image/pgHeadline.jpg); }


/*----------------------------------------------------------------------------------------------------

  案内
  
----------------------------------------------------------------------------------------------------*/

.guide-txt {
  text-align:center;
  padding-bottom:50px;
}

@media screen and (max-width:767px) {
  .guide-txt {
    text-align:left;
    padding-bottom:1.25em;
  }
  
  .guide-txt .sp-none {
    display:none;
  }
}

@media screen and (max-width:500px) {
  .guide-txt {
    padding-bottom:1em;
  }
}


/*-----------------------------------------------------------------------------------
  写真
-----------------------------------------------------------------------------------*/

.guide-photo {
  display:block;
  width:400px;
  float:left;
  vertical-align:top;
}

.guide-photo img {
  border-radius:4px;
}

@media screen and (max-width:767px) {
  .guide-photo {
    width:100%;
    float:none;
    display:block;
    text-align:center;
    margin-bottom:1em;
  }
}

@media screen and (max-width:500px) {
  .guide-photo {
    margin-bottom:0.75em;
  }
}


/*-----------------------------------------------------------------------------------
  TEL・営業時間
-----------------------------------------------------------------------------------*/

.guide-hrs {
  width:650px;
  float:right;
}

.guide-hrs .telLinkBtn {
  font-family:"Rounded Mplus 1c-b","Meiryo","メイリオ","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","ＭＳ Ｐゴシック",sans-serif;
  font-weight:500;
  font-size:200.0%;
  color:#2980c2;
}

.guide-hrs .telLinkBtn .taptocall--ic {
  font-size:75.0%;
}

@media screen and (max-width:767px) {
  .guide-hrs {
    width:100%;
    float:none;
  }
  
  .guide-hrs .telLinkBtn {
    font-size:100%;
    text-align:center;
  }
}

.hrsTbl thead th {
  background-color:#61b7e5;
  border-left-color:#89c9ec;
}

.hrsInfo dd ul {
  list-style:none;
}

.hrsInfo dd li {
  display:inline-block;
}

.hrsInfo dd li.uketsuke {
  margin-left:1em;
}

@media screen and (max-width:767px) {
  .hrsTbl {
    margin-top:1.5em;
  }
  
  .hrs,
  .hrsInfo dd li {
    display:inherit;
  }

  .hrsInfo dd li.uketsuke {
    margin-left:0;
  }
}

@media screen and (max-width:500px) {
  .hrsTbl {
    margin-top:1.25em;
  }
}


/* 診療 ----------------------------------------*/

.hrs-mk1 { background-image:url(../../image/icon/hrs-mk1-rblue.svg); }
.no-svg .hrs-mk1 { background-image:url(../../image/icon/hrs-mk1-rblue.png); }

/* 診療時間変更 ----------------------------------------*/

.hrs-mk2 {　background-image:url(../../image/icon/hrs-mk2-rblue.svg);　}
.no-svg .hrs-mk2 { background-image:url(../../image/icon/hrs-mk2-rblue.png); }


/*-----------------------------------------------------------------------------------
  お支払い
-----------------------------------------------------------------------------------*/

.payment--headline {
  font-size:125%;
}

.payment {
  border-top:1px solid rgba(97,183,229,0.6);
}

.payment dt,
.payment dd {
  border-bottom:1px solid rgba(97,183,229,0.6);
  box-sizing:border-box;
}

.payment dt {
  background-color:#e7f4fb;
}

.payment dd {
  padding:1em;
}

.payment ul {
  list-style:none;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}

.payment li {
  box-sizing:border-box;
}

.payment li img {
  width:auto;
  max-width:inherit;
  vertical-align:bottom;
}

@media screen and (min-width:768px) {
  .payment-warp {
    margin-top:50px;
  }
  
  .payment {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
  }
  
  .payment:first-of-type {
    margin-top:1.5em;
  }
  
  .payment:first-of-type dt,
  .payment:first-of-type dd {
    border-bottom:0;
  }

  .payment dt {
    padding:1em;
    width:12em;
    text-align:center;
  }
  
  .payment dt span {
    width:100%;
    height:100%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
  }

  .payment dd {
    width:-webkit-calc(100% - 12em);
    width:calc(100% - 12em);
  }

  .payment li {
    padding:0.5em;
  }
  
  .payment li img {
    height:40px;
  }
}

@media screen and (max-width:767px) {
  .payment-warp {
    margin-top:2em;
  }
  
  .payment {
    border-left:1px solid rgba(97,183,229,0.6);
    border-right:1px solid rgba(97,183,229,0.6);
    margin-top:1em;
  }
  
  .payment dt {
    padding:0.5em 0.75em;
    font-size:110%;
  }

  .payment li {
    padding:0.5em 0.25em;
  }
  
  .payment li img {
    height:-webkit-calc(50 / 767 * 100vw);
    height:calc(50 / 767 * 100vw);
    max-height:40px;
  }
}


/*----------------------------------------------------------------------------------------------------

  初めてのかた・処方箋の発行について
  
----------------------------------------------------------------------------------------------------*/

.forPt {
  background-color:#eff7e9;
  margin-top:0;
  padding-top:50px;
  padding-bottom:50px;
}

.forPt-case {
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}

.forPt-case_block {
  width:535px;
  float:left;
  background-color:#fff;
  border-radius:4px;
  box-sizing:border-box;
  padding:30px;
}

.forPt-case01 {
  margin-right:30px;
}

.forPt-case--headline {
  text-align:center;
  color:#7cbd51;
  font-size:156.2%;
  font-weight:500;
  line-height:1.4;
  padding-bottom:0.5em;
}

.forPt-case--headline:before {
  content:"";
  width:100%;
  height:90px;
  display:block;
  margin-top:0.25em;
  margin-bottom:0.5em;
  background-repeat:no-repeat;
  background-position:center top;
  background-size:contain;
}

.forPt-case01 .forPt-case--headline:before { background-image:url(../image/forPt-ic01.png); }
.forPt-case02 .forPt-case--headline:before { background-image:url(../image/forPt-ic02.png); }

.forPt-case_block .unLine {
  font-size:125.0%;
  margin-right:0.25em;
}

.forPt-case_block .txtLink {
  margin-top:0.5em;
}

@media screen and (max-width:767px) {
  .forPt {
    padding-top:2em;
    padding-bottom:2em;
  }
  
  .forPt-case_block {
    padding:1.25em;
    float:none;
    width:100%;
  }
  
  .forPt-case01 {
    margin-right:0;
    margin-bottom:1.5em;
  }
  
  .forPt-case--headline {
    padding-bottom:0.35em;
  }
  
  .forPt-case_block .sp-none {
    display:none;
  }
}

@media screen and (max-width:500px) {
  .forPt {
    padding-top:1.5em;
    padding-bottom:1.5em;
  }
  
  .forPt-case_block {
    padding:1em;
  }
  
  .forPt-case01 {
    margin-bottom:1.25em;
  }
  
  .forPt-case--headline:before {
    height:0;
    padding-top:18%;
  }
}


/*----------------------------------------------------------------------------------------------------

  メーカー
  
----------------------------------------------------------------------------------------------------*/

.maker-headline br,
.maker dt br {
  display:none;
}

.maker {
  text-align:center;
  margin-top:40px;
}

.maker dt {
  background-color:#61b7e5;
  color:#fff;
  font-weight:500;
  border-radius:4px;
  line-height:1.4;
  padding:0.75em 1em;
  font-size:125.0%;
  box-sizing:border-box;
  text-align:center;
}

.maker ul {
  letter-spacing:-0.5em;
  list-style:none;
  display:inline-block;
  margin-left:-10px;
  margin-right:-10px;
}

.maker li {
  display:inline-block;
  letter-spacing:normal;
  width:20%;
  padding:0 10px;
  margin-top:20px;
  box-sizing:border-box;
}

.maker li a,
.maker li div {
  display:block;
  background-color:#fff;
  border:1px solid rgba(97,183,229,0.60);
  box-sizing:border-box;
  border-radius:4px;
  overflow:hidden;
}

.maker li a span {
  display:block;
  border:1px solid #fff;
  box-sizing:border-box;
  border-radius:3px;
  overflow:hidden;
}

.maker li img {
  vertical-align:top;
  border-radius:4px;
}

@media screen and (min-width:768px) {
  .maker li a {
    transition:background-color 0.2s ease;
  }
  
  .maker li a:hover {
    background-color:rgba(97,183,229,0.1);
  }
  
  .maker li a,
  .maker li a span {
    transition:border-color 0.2s ease, background-color 0.2s ease;
  }
  
  .maker li a:hover,
  .maker li a:hover span {
    border-color:rgba(97,183,229,1);
  }
  
  .maker li img {
    transition:opacity 0.2s ease;
  }
  
  .maker li a:hover img {
    opacity:0.5;
  }
}

@media screen and (max-width:767px) {
  .maker-headline br {
    display:inherit;
  }
  
  .maker {
    margin-top:1.75em;
  }
  
  .maker dt {
    font-size:118.8%;
  }
  
  .maker ul {
    margin-left:-0.25em;
    margin-right:-0.25em;
    margin-top:0.75em;
  }
  
  .maker li {
    padding:0 0.25em;
    margin-top:0.25em;
  }
}

@media screen and (max-width:640px) {
  .maker dt br {
    display:inherit;
  }
  
  .maker li {
    width:33.333333%;
  }
}

@media screen and (max-width:500px) {
  .maker {
    margin-top:1.5em;
  }
  
  .maker dt {
    font-size:100%;
  }
}