@charset "utf-8";
/* CSS Document */

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

メイン

------------------------*/
.main {
  position: relative;
}
.main h1{
    margin-bottom: 0;
    position: absolute;
    top: 0;
}
.main .wrap {
  width: 100%;
  max-width: 100%;
}

.main .slider_PC li{ 
position: relative;
height: 400px;}
.main .slider_PC li img{position: absolute;
  top: 0;
  left: 50%;
	transform: translateX(-50%);
  width: auto;
  height: auto;
  min-width: 100%;
  min-height: 100%;
  max-width: inherit;}

.top_content01 {
  position: relative;
  margin-top:-16px
}


.top_content01 h3 {
  padding-top: 30px;
  text-align: center;
  height: 125px;
}

.top_content01 p {
  font-size: 16px;
}

#top_content01 {
  background-image: url(../img/top_content01.png);
  background-repeat: no-repeat;
  width: 200px;
  height: 125px;
  margin: auto;
  left: 0;
  right: 0;
  top: 0;
  position: absolute;
}
.top_content01 .col-6,
.top_content01 .col-3,
.top_content01 .col-9{
  margin-top: 10px;
  padding: 10px;
}

.top_content01 img {
  margin: 0 auto;
  display: block;
}
.top_content01box .row .row .col-6:last-of-type,
.top_content01box .row .row .col-9{
    position: relative;
}
.top_content01box .row .row .col-6:last-of-type .btn-centered {
    position: absolute;
    width: 100%;
    bottom: 0;
}
.top_content01box .row .row .col-9 .btn-centered {
    position: absolute;
		width: 282px;
    bottom: 0;
}

.top_content01box .button {
  padding: 15px;
  width: 100%;
  max-width: 300px;
}

.top_content02 {
  background-image: url(../img/top_content02_back.jpg);
  background-size: cover;
  background-position: center;
  position: relative;
  padding-top: 40px;
  padding-bottom: 40px;
  margin-top: 40px;
}

.top_content02_title {
  padding: 10px;
}

.top_content02 h3 {
  text-align: center;
  position: absolute;
  top: 70px;
  left: 0;
  right: 0;
  margin-left: 50px;
}

.top_content02_titleBack {
  display: block;
  margin: auto;
}

@media only screen and (max-width: 1023px) {
  .top_content01box .row .row .col-6:last-of-type .btn-centered,
  .top_content01box .row .row .col-9 .btn-centered {
    position: static;
  }
  .top_content01box .button,
  .top_content01box .row .row .col-9 .btn-centered {
    margin: 0 auto;
  }
}

@media(max-width:680px) {
  .top_content02_title {}

  .top_content02_title h3 {
    font-size: 3.5vw;
    margin-left: 7vw;
  }
}

.top_content02 .wrap {
  margin-top: 20px;
}

.content2_box {
  float: left;
  width: calc(100% / 3);
}

@media(max-width:1023px) {
  .content2_box {
    width: calc(100% / 2);
  }
}

@media(max-width:767px) {
  .content2_box {
    width: calc(100% / 1);
  }
}

.content2_box p {
    font-weight: bold;
    font-size: 17px;
    padding-bottom: 16px;
    position: relative;
    padding-left: 40px;
    margin-bottom: 0;
}

.content2_box p::before  {
    content: url(../img/top_content02_check.png);
    margin: 0 10px 0 0;
    top: 2px;
    position: absolute;
    left: 0;
}

@media (max-width:1023px) {
  .top_content01 h4 {
    text-align: center;
  }
}

@media only screen and (max-width: 1100px) {
  .main {
    height: auto;
  }

  .main .data-img {
    left: 0;
    top: 0;
    position: inherit;
    width: calc(100% / 2);
    float: left
  }

  .main .data-img2 {
    right: 0;
    top: 0;
    position: inherit;
    width: calc(100% / 2);
  }
}



@media only screen and (max-width: 767px) {
  .main {
    background-image: url(../img/main-back_sp.jpg);
    background-size: cover;
    text-align: center;
  }

  .main .data-img2 {
    display: none;
    float: none;
  }
  .main .data-img {
    width: 100%;
    float: none;
  }
}

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

こんな症状でお悩みではありませんか？

------------------------*/
.trouble {
  padding: 40px 0;
  background-image: url(../img/pattern.png);
  background-repeat: repeat;
  background-position: center top;
}

.trouble .icon {
  margin-bottom: 20px;
}

.trouble h1 {
  text-align: center;
  color: #3f7dcc;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 15px;
}

.trouble h2 {
  text-align: center;
  color: #00a6fb;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}

.trouble p {
  text-align: center;
  margin-bottom: 30px;
}

.trouble li:before {
  content: url(../img/icon02.png);
  width: 10px;
  height: 10px;
  margin-right: 10px;
}

@media (max-width: 1023px) {
  .trouble .img {
    text-align: center;
  }
}

@media (max-width: 767px) {
  .trouble p {
    text-align: left;
  }
}

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

診療内容

------------------------*/
.first-visit .title{
    text-align: center;
    color: #3f7dcc;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 30px;
}
.first-visit p {
    text-align: center;
    margin-bottom: 30px;
}
.treatment {
  padding: 40px 0;
  background-image: url(../img/treatment-back.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-color: #fff;
  background-size: cover;
}

.treatment .icon {
  margin-bottom: 20px;
}

.treatment .title {
  text-align: center;
  color: #3f7dcc;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 30px;
}

@media (max-width: 1023px) {
  .treatment .blocks-5 {
    text-align: center;
  }
}

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

お知らせ

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

.info {
  padding: 40px 0;
}

.news .title {
  width: 1em;
  margin: 0 auto 30px;
  text-align: center;
  color: #3f7dcc;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2em;
}

.news .icon {
  text-align: center;
}

.news ul {
  margin: 0;
}

.news ul li {
  width: 100%;
  float: left;
  margin-bottom: 25px;
  padding: 0;
  list-style-type: none;
}

.news ul li:last-child {
  margin-bottom: 0;
}

.news .date {
  width: 20%;
  float: left;
  color: #051923;
  font-size: 14px;
  font-weight: 400;
}

.news .article-title {
  width: 80%;
  float: left;
  padding-left: 10px;
}

.news .article-title,
.news .article-title a {
  color: #00a6fb;
  font-size: 14px;
  font-weight: 400;
}

@media only screen and (min-width: 1025px) {
  .news .article-title a:hover {
    text-decoration: none;
  }
}

@media (max-width: 767px) {
  .news .title {
    width: auto;
  }

  .news .icon {
    display: none;
  }

  .news .date {
    width: 100%;
  }

  .news .article-title {
    width: 100%;
    padding-left: 0;
  }
}