@charset "utf-8";

/*=================================================================================================================================*/
/**  個別指定 for PC	*/
/*=================================================================================================================================*/

@media screen and (min-width: 768px) {
  /* fook */
  .only_pc_none {
    display: none !important;
  }

    body{
      margin-top: 109px;
    }


  /*---------------------------------------------
 ** ヘッダー
---------------------------------------------*/
  /* ロゴ */
  .item.header_L {
    width: 100%;
    max-width: 230.5px;
    margin: 0 5% 0 3%;
    padding: 24px 0;
  }
  .item.header_R {
    width: calc((92% - 230.5px));
    padding-right: 0;
  }

  /* tel */
  .tel {
    max-width: 300px;
    width: 100%;
    margin: 0 !important;
    background: #f9be00;
    color: #ffffff !important;
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.15);
  }

  .tel ul {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
  }
  .tel li {
    height: 100%;
  }
  .tel a {
    text-decoration: none !important;
    color: #ffffff !important;
    width: 100%;
    height: 100%;
    display: block;
  }
  .tel-nbr {
    font-size: 3.2rem;
    line-height: 1.2;
    margin: 0;
    padding: 2.2rem 0 1.8rem 0;
    text-align: center;
  }
  .header-kyushin {
    font-size: 1.2rem;
    text-align: left;
    background: #f29600;
    display: block;
    padding: 0.7rem 1rem 0.5rem;
    letter-spacing: 0.5px;
  }
  .is-kyushin-border {
    border: 1px solid #fff;
    padding: 0px 4px;
    -moz-border-radius: 8px;
    margin-right: 1;
    -webkit-border-radius: 8px;
    margin-right: 1rem;
  }

  .icon_tel {
    position: relative;
  }
  .icon_tel::before {
    width: 19px;
    height: 30px;
    background: url(../img/common/icon_sp.png) no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    margin-right: 0.5rem;
    position: relative;
    top: 2px;
    left: -3px;
  }

  /*---------------------------------------------
 **  ナビゲーション
---------------------------------------------*/
  .nav {
    z-index: 999;
    /* position: relative; */
    margin: 0 auto;
    padding: 15px 0 0 0;
    max-width: 1200px;
    width: calc((100% - 300px));
  }
  .menu {
    margin: 0 auto;
    display: flex;
    text-align: center;
    flex-wrap: nowrap;
    justify-content: flex-end;
    
  }
  .menu > li {
    padding: 0px 0px 17px;
    box-sizing: border-box; /*通常の記述*/
    -webkit-box-sizing: border-box; /*Google ChromeやSafariの機能を利用*/
    -moz-box-sizing: border-box; /*Firefoxの機能を利用*/
  }
  .menu > li:last-of-type {
    margin-right: 0;
  }
  .menu li > a {
    width: 100%;
    height: 100%;
    padding: 18px 16.9px;
    position: relative;
    font-size: 1.6rem;
    text-decoration: none;
    display: inline-block;
    font-weight: 600;
    box-sizing: border-box; /*通常の記述*/
    -webkit-box-sizing: border-box; /*Google ChromeやSafariの機能を利用*/
    -moz-box-sizing: border-box; /*Firefoxの機能を利用*/
    color: #000000;
    margin-right: 50px;
  }
  .menu li > a:hover {
    color: #007ac6;
  }


  /* ナビ下の小文字 */
  .menu li a:after {
    display: block;
    font-size: 1rem;
    color: #007ac6;
    font-weight: normal;
    letter-spacing: 5px;
  }
  /* ドロップメニューは小文字を消す */
  .sub-menu li a:after {
    display: none !important;
  }
  .menu li:nth-of-type(1) a:after {
    content: "CLINIC";
  }
  .menu li:nth-of-type(2) a:after {
    content: "GUIDE";
  }
  .menu li:nth-of-type(3) a:after {
    content: "DOCTOR";
  }
  .menu li:nth-of-type(4) a:after {
    content: "NEWS";
  }
  .menu li:nth-of-type(5) a:after {
    content: "ACCESS";
  }
  .menu li:nth-of-type(6) a:after {
    content: "COOPERATION";
  }

  /* menu ホバー時の ● */
  .menu > li:hover > a:before {
    content:"●";
    color: #EEE;
    position:absolute;
    top: 69px;
    left:0;
    right:0;
    margin: 0 auto;
    display: block;
    font-size: 29px;
  }
  .menu > li:nth-of-type(1):hover > a:before ,
  .menu > li:nth-of-type(3):hover > a:before ,
  .menu > li:nth-of-type(4):hover > a:before ,
  .menu > li:nth-of-type(5):hover > a:before ,
  .menu > li:nth-of-type(6):hover > a:before {
    display: none;
  }

  /* ナビアイコン */
  .menu > li:nth-of-type(1) > a{
    background: url(/img/common/icon-nav-01.png) 0 18px no-repeat;
    background-size: 33px;
  }
  .menu > li:nth-of-type(2) > a {
    background: url(/img/common/icon-nav-02.png) 0 18px no-repeat;
    background-size: 33px;
  }
  .menu > li:nth-of-type(3) > a {
    background: url(/img/common/icon-nav-03.png) 0 18px no-repeat;
    background-size: 33px;
  }
  .menu > li:nth-of-type(4) > a {
    background: url(/img/common/icon-nav-04.png) 0 18px no-repeat;
    background-size: 33px;
  }
  .menu > li:nth-of-type(5) > a {
    background: url(/img/common/icon-nav-05.png) 0 18px no-repeat;
    background-size: 33px;
  }
  .menu > li:nth-of-type(6) > a {
    background: url(/img/common/icon-nav-05.png) 0 18px no-repeat;
    background-size: 33px;
  }

  /* 
  .menu > li > a:before {
    content: "";
    width: 33px;
    height: 33px;
    top: 19px;
    position: absolute;
    left: -2px;
  }
  
  .menu > li:nth-of-type(1) > a:before {
    background: url(/img/common/icon-nav-01.png) 0 0 no-repeat;
    background-size: contain;
  }
  .menu > li:nth-of-type(2) > a:before  {
    background: url(/img/common/icon-nav-02.png) 0 0 no-repeat;
    background-size: contain;
  }
  .menu > li:nth-of-type(3) > a:before  {
    background: url(/img/common/icon-nav-03.png) 0 0 no-repeat;
    background-size: contain;
  }
  .menu > li:nth-of-type(4) > a:before  {
    background: url(/img/common/icon-nav-04.png) 0 0 no-repeat;
    background-size: contain;
  }
  .menu > li:nth-of-type(5) > a:before  {
    background: url(/img/common/icon-nav-05.png) 0 0 no-repeat;
    background-size: contain;
  } */

  /*---------------------------------------------
 **  ドロップダウンメニュー
---------------------------------------------*/
  .dropmenu:before,
  .dropmenu:after {
    content: "";
    display: table;
  }
  .dropmenu:after {
    clear: both;
  }

  /* 下層メニュー */
  .sub-menu {
    list-style: none;
    position: absolute;
    z-index: 9999;
    top: 108px;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding: 0;
    width: 100%;
    max-width: 930px;
    background: #eeeeee;
    display: flex;
    justify-content: start;

    /*ドロップシャドウ
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3);
    */
  }
  /* サブメニューの背景だけ */
    .fade-in li:hover .sub-menu:after {
    width: 1920px;
    height: 76px;
    position: absolute;
    top: 0px;
    left: 0px;
    background: #eee;
    content: "";
    z-index: -99;
    margin-left: calc(-50vw + 46%);
    margin-right: calc(-50vw + 46%);
    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(left,  #eeeeee 0%, #eeeeee 60%, #acdcee 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #eeeeee 0%,#eeeeee 60%,#acdcee 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #eeeeee 0%,#eeeeee 60%,#acdcee 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#acdcee',GradientType=1 ); /* IE6-9 */
  }
  .sub-menu li {
    margin: 0 0;
    display: block;
  }
  .sub-menu li a {
    color: #333333;
    font-size: 1.5rem;
    line-height:1.4;
    padding: 14px 16.9px;
  }
  .sub-menu li a:hover {
    color: #0079c5;
    background: #eaedf4;
  }

  /* subnav 番号 */
  .sub-menu li a:before {
    display: block;
    margin: 0 0.5rem 0 0;
    color: #0079c5;
    font-size:1.6rem;
  }
  .sub-menu li:nth-of-type(1) a:before {
    content: "01.";
  }
  .sub-menu li:nth-of-type(2) a:before {
    content: "02.";
  }
  .sub-menu li:nth-of-type(3) a:before {
    content: "03.";
  }
  .sub-menu li:nth-of-type(4) a:before {
    content: "04.";
  }
  .sub-menu li:nth-of-type(5) a:before {
    content: "05.";
  }
  .sub-menu li:nth-of-type(6) a:before {
    content: "06.";
  }
  .sub-menu li:nth-of-type(7) a:before {
    content: "07.";
  }


  /* ドロップメニュー 仕組み */
  .fade-in li .sub-menu {
    visibility: hidden;
    opacity: 0;
    /* transition: 0s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s; */
  }
  .fade-in li:hover .sub-menu {
    visibility: visible;
    opacity: 1;
    text-align: center;
  }
  .fade-in li .sub-menu li a {
    visibility: hidden;
    opacity: 0;
  }
  .fade-in li:hover .sub-menu li a {
    visibility: visible;
    opacity: 1;
  }

  /* フッターナビ */


  /*---------------------------------------------
 **  メイン
---------------------------------------------*/
  .main_img {
    height: 352px;
  }
  #top .main_img {
    height: 600px;
    z-index: 0;
  }

  /*=================================================================================================================================*/
  /**  フッター	*/
  /*=================================================================================================================================*/
  .footer_inner {
    max-width: 1200px;
    _zoom: 1;
    overflow: hidden;
  }

  .map {
    height: 500px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    _zoom: 1;
    overflow: hidden;
  }



} /*■■ ここまで ■■*/



  /*=================================================================================================================================*/
  /**  1024 ～ 1570px まで	*/
  /*=================================================================================================================================*/
    @media screen and (max-width: 1570px) and (min-width: 768px) {
      .header_L,
      .header_R {
        width: 100% !important;
        margin: 5px auto 0!important;
      }
      html {
        font-size: 55%;
      }
      body{
        margin-top: 160px;
      }
      .item.header_L {
        max-width: 210.5px;
        padding: 14px 0 0;
      }
      .nav{
        width: 100%;
        padding: 0;
      }
      .menu {
        justify-content: center;
      }
      .menu li > a {
        padding: 18px 16.9px 0;
      }
      .menu > li:hover > a:before {
        top: 49px;
      }
      .sub-menu {
        top: 72px;
      }
      header .tel {
        max-width: 270px;
        width: 100%;
        position: absolute;
        top: 0;
        right: 0;
      }
      .tel-nbr {
        font-size: 2.5rem;
        padding: 1.2rem 0 0.8rem 0;
      }
      .icon_tel::before {
        width: 19px;
        height: 23px;
      }
      .news_L {
        flex-basis: 51px;
        min-height: 56px;
      }
    }
      @media screen and (max-width: 1600px) and (min-width: 768px) {
       .item.header_L {
        width: 100%;
        max-width: 200.5px;
        margin: 0 0% 0 2%;
        padding: 28px 0 7px;
      }
      .item.header_R {
        width: calc((97% - 250.5px));
        padding-right: 0;
      }
    }
    @media screen and (max-width: 1570px) and (min-width: 1024px) {
      html {
        font-size: 50%;
      }
    }



/* IE11対策 */
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, .col-2 > .item  {}
  *::-ms-backdrop, .col-3 > .item  {}
  *::-ms-backdrop, .col-4 > .item  {}

  *::-ms-backdrop, .ttl-blog-2 {
  min-height: unset !important;
  background: unset !important;
  text-align: left;
  margin: 0;
  padding: 0.5rem 0 1.5rem;
  }

  *::-ms-backdrop, .flx-base-10{ flex-basis:10%;  max-width: 10%;}

  *::-ms-backdrop, .tel-ptn-01.tel{ background: #FFF;}

   *::-ms-backdrop, .flx-base-1 {
    max-width: 10%;
  }
    *::-ms-backdrop, .flx-base-10 {
      max-width: 10%;
    }
    *::-ms-backdrop, .flx-base-12 {
      max-width: 12%;
    }
  *::-ms-backdrop, .flx-base-2 {
    max-width: 20%;
  }
    *::-ms-backdrop, .flx-base-25 {
      max-width: 25%;
    }
  *::-ms-backdrop, .flx-base-3 {
    max-width: 30%;
  }
    *::-ms-backdrop, .flx-base-38 {
      max-width: 38%;
    }
  *::-ms-backdrop, .flx-base-4 {
    max-width: 40%;
  }
    *::-ms-backdrop, .flx-base-45 {
      max-width: 45%;
    }
    *::-ms-backdrop, .flx-base-47 {
      max-width: 47%;
    }
  *::-ms-backdrop, .flx-base-5 {
    max-width: 50%;
  }
  
    *::-ms-backdrop, .flx-base-53 {
      max-width: 53%;
    }
    *::-ms-backdrop, .flx-base-55 {
      max-width: 55%;
    }
  *::-ms-backdrop, .flx-base-6 {
    max-width: 60%;
  }
    *::-ms-backdrop, .flx-base-65 {
      max-width: 65%;
    }
    *::-ms-backdrop, .flx-base-68 {
      max-width: 68%;
    }
  *::-ms-backdrop, .flx-base-7 {
    max-width: 70%;
  }
    *::-ms-backdrop, .flx-base-73 {
      max-width: 73%;
    }
    *::-ms-backdrop, .flx-base-75 {
      max-width: 75%;
    }
  *::-ms-backdrop, .flx-base-8 {
    max-width: 80%;
  }
    *::-ms-backdrop, .flx-base-83 {
      max-width: 83%;
    }
    *::-ms-backdrop, .flx-base-85 {
      max-width: 85%;
    }
    *::-ms-backdrop, .flx-base-88 {
      max-width: 88%;
    }
  *::-ms-backdrop, .flx-base-9 {
    max-width: 90%;
  }
}