
html {
    -webkit-overflow-scrolling: touch;
}

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
article dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}


body {
    font-size: 16px;
    line-height: 1.5rem;
    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", '"游明朝", YuMincho', sans-serif;
    color: #666666;
    background: #fff;
    margin: 0;
    padding: 0;
}

.f1 {
    font-family: "fgutsukushiweb","ヒラギノ明朝 ProN W3",Hiragino Mincho ProN,"游明朝" ,YuMincho,"メイリオ",Meiryo,"ＭＳ Ｐ明朝","ＭＳ 明朝",MS PMincho,serif !important;
}

.inner,
.footer_inner{max-width: 1080px;margin: 0 auto;}


/**************************************************************

* ヘッダー　*

***************************************************************/


.header-container {
    width:1024px;
    height: 90px;
    padding: 20px 0;
    color: #fff;
    text-align:left;
    margin:0 auto;

    box-sizing:border-box;
}

.header-container a {
    color:#00f;
}


.menu-button {
    margin: 0.5rem;

}

h1.site-title {
    height:61px;
    /*width:399px;*/
    text-indent:-999999em;
    margin:0;
    padding:0;
    overflow:hidden; 
}

h1.site-title a{
    display:block;
    height:61px;
    /*width:399px;*/
    background:url(../images/logo.png) no-repeat;
    margin-left: 30px;
	background-size: contain;
}


@media screen and (max-width: 991px) {

    h1.site-title {
        height:61px;
        width:100%;
        text-indent:-999999em;
        margin:0 auto;
        padding:0;
        overflow:hidden; 
    }
    h1.site-title a{
        display:block;
        height:61px;
        width:100%;
        background:url(../images/logo.png) no-repeat;
        background-size:80px ;
        margin-top: .5rem;
        margin-left: 70px;
    }
}

footer {
    width:100%;
    background: #c9c9ca;
}

.sitemap {
    text-align: center;
}

.sitemap li {
    display: inline-block;
    padding: 0 15px;
    background: url(../images/border.png) no-repeat;
    background-position: right;
    font-size: 14px;
}

.sitemap li:last-child {
    border: none;
}

.sitemap li a:hover {
    text-decoration: underline;
}

#copyright {
    width:100%;
    padding: 20px 60px;
    color: #fefefe;
    background: #040000;
    font-size: 12px;
    text-align: center;
}

/**************************************************************

* 共通　*

***************************************************************/

strong{font-weight: bold;}
.bg-white{background:#ffffff;}
.bg-success{background:#68b93c!important;}
.text-success{color:#68b93c!important;}
.bg-info{background:#70d1c3!important;}
.text-info{color:#70d1c3!important;}
.bg-primary{background:#519af5!important;}
.bg-yellow{background:#fcf4e5;}
.bg-orenge{background:#f6a670;}
.bg-brown{background: #885031;}
.bg-gray{background: #999;}
.bg-rgray{background:#CAC7C7;}
.bg-lightblue{background:#39a2d4;}
.text-primary{color:#519af5!important;}
.text-dark{color: #666!important;}
.text-warning {color: rgba(245,123,17,1.00)!important;}
.text-brown{color: #885031;}
.text-gray{color:#b3b3b3;}


.text-center{text-align: center}

.text-left{text-align: left}

.text-right{text-align: right}

.border01 {
    border-bottom: 1px solid #ededed;
}

.no-wrap {
    display: inline-block;
}

/* ------------------------------------------------------------------------------
Global Styles
-------------------------------------------------------------------------------*/

p {
    font-size: 16px;
    line-height: 1.75rem;

}


h1 {
    font-size: 43px;
    color: #2d3033;
}
h2 {
    font-size: 24px;
    line-height:37px;
    color: #2d3033;
    font-weight:100;
}
h3 {
    font-size: 20px;
    line-height: 35px;
    color: #555;
    font-weight: bold;
}
h4 {
    font-size: 17px;
    color: #555;
    font-weight: 400;
}
h5 {
    font-size: 14px;
    color: #555;
    text-transform: uppercase;
    font-weight: 700;
}


.wf-roundedmplus1c { font-family: "Rounded Mplus 1c";
    font-weight: normal;
}


.btn:hover, .btn:focus {
    /*background-color: #e52e2e;*/
    color: #fff;
}

.btn-warning:hover{
    background:#F79D58;
    border: 1px solid #F79D58;
}


.bg-black{background:#000;}


.border-bottom {
    border-bottom: 1px solid #333 !important;
}

.d-border-bottom {
    border-bottom: 1px dotted #333 !important;
}

.border-bottom-f {
    border-bottom: 1px solid #6d6c6c !important;
}


.border-bottom-dark {
    border-bottom: 1px solid #333 !important;
}

.rounded{ border-radius: .5rem!important;}

.left-border{border-left:5px solid #519af5;
}


a {
    color: #127598;
}



a:hover, a:focus {
    text-decoration: none;
    -moz-transition: background-color, color, 0.3s;
    -o-transition: background-color, color, 0.3s;
    -webkit-transition: background-color, color, 0.3s;
    transition: background-color, color, 0.3s;
}

#page-footer-info a {
    color: #fff;
}



ul, ol {
    margin: 0;
    padding: 0;
}
ul li {
    list-style: none;
}

ul li ol li,ol li{
    list-style:decimal;
    line-height: 1.5rem;
}

#contact-form ul li {
    list-style: disc;
}

.section {
    padding: 100px 0;
}
.no-padding {
    padding: 0;
}
.no-gutter [class*=col-] {
    padding-right: 0;
    padding-left: 0;
}
.section-title {
    margin-top: 0;
    letter-spacing:2px;
}
.section-title span {
    font-weight: 400;
}
.section-intro {
    margin:5% 10% 12% 10%;
    color: #636363;
    font-size:14px;
    line-height:21px;
    font-weight: 300;
    letter-spacing:1px;
}
.icon {
    font-size:33px;
    color:#000;
}
.img-responsive {
    margin:auto;
}

.lead {
    font-size: 1.25rem;
    font-weight: 300;
    line-height: 1.8rem;
}

.small, small {
    font-size: 80%;
    font-weight: 100;
}

.title{
    font-family: 'Playfair Display', serif;
    letter-spacing: 0.01em;
}
h2.title{
    letter-spacing: 0.1em;
}


.h01 {
    margin: 10px 0 10px;
    padding: 7px 0 7px 14px;
    background: #f9f9f9;
}


.card-header{border-bottom:none;}

.border {border: 1px solid #888 !important;}



h2.content-title {
    margin-top: -81px;
    padding-top: 81px;
}


.container{background: none;}
/*#content .col-md-3,.col-md-9{padding: 0;}*/

/*.menu-button {
text-indent: 2.5em;
font-size: 1.1em;
color: transparent;
}*/
/*
.menu-button {
margin: 0.5rem;}
*/


/* ------------------------------------------------------------------------------
フォームページ
-------------------------------------------------------------------------------*/



form#mailformpro label.mfp_not_checked {
    padding: 2px;
    border: none;
}



/********************************************************************
*********************************************************************


2enpage


*********************************************************************
*********************************************************************/

.main_content {
    margin: 80px auto 0;
}
.main_posi {
    position: relative;
    width: 100vw;
    height: 570px;
    z-index: 0;
    background: url(../images/main_banner_01.jpg) 0 70px/ 650px no-repeat fixed;
    /*----------トップ画像の設定-----------*/
}
.nagare00 {
    width:100%;
}

@media screen and (min-width: 991px) {
    .main_content {
        margin: 0 auto;
    }

    .main_posi {
        position: relative;
        height: 155px;
        background: url(../images/main_banner_01.jpg) center center / cover no-repeat fixed;
        /*----------トップ画像の設定-----------*/
    }
    .gNav_posi {
        position: absolute;
        top: 100px;
        width: 100%;
        min-width: 1080px;
        margin: 0 auto;
        z-index: 9999;
    }

    .gNav {
        position: relative;
        overflow: hidden;
    }

    .gNav ul {
        position: relative;
        left: 50%;
        float: left;
    }

    .gNav ul li {
        position: relative;
        left: -50%;
        float: left;
        margin: 0 2px;
        width: 145px;
        height: 55px;
        background-color: rgba(255, 255, 255, 0.7);
    }

    .gNav ul li p {
        margin-top: 15px;
        text-align: center;
        font-size: 1rem;
        font-family:"游明朝", YuMincho;
        font-weight: bold;
        color: #40210c;
    }

    .gNav ul li a:hover {
        opacity: 0.8;
        filter: alpha(opacity=80);
        -ms-filter: "alpha(opacity=80)";
        -khtml-opacity: 0.8;
        -moz-opacity: 0.8;
        transition: background-color 10s linear;
    }
    .nagare00 {
        width:80%;
        margin-left:80px;
    }
}

@media screen and (min-width: 1285px) {

    .gNav ul li {
      /*  width: 177px;*/
	 width: 211px;
        height: 55px;
        background-color: rgba(255, 255, 255, 0.7);
    }
    .gNav ul li p {
        font-size: 1.2rem;
    }

}
/********************************************************************
*********************************************************************


ssi


*********************************************************************
*********************************************************************/


.aticle-header {
    padding: 30px 0;
    border-top: 1px solid #dfdfdf;
    border-bottom: 1px solid #dfdfdf;
}

.aticle-header h2 {
    font-size: 30px;
}

.main-image {
    padding: 20px 0;
    background-position: 20% -40px;
    background-size: 400px;
}

#s-header {
    height: 87px;
}

.sec-left {
    float: left;
    width: 270px;
}

.area {
    border: 1px solid #ededed;
    box-shadow: 0 1px 1px rgba(187, 187, 187, 0.75);
}

.ce {
    margin: 0 0 5px;
    padding: 10px 0;
    text-align: center;
    background: #f9f9f9;
}

.area ul li {
    display: block;
    float: left;
    width: 117px;
    margin: 10px 5px 10px 10px;
    border: 1px solid #ededed;
}

.area ul li:nth-child(even) {
    margin: 10px 10px 10px 5px;
}

.area ul li:last-child {
    margin: 10px 10px 20px 5px;
}

.area ul li a {
    display: block;
    font-size: 14px;
    line-height: 2.5;
    text-align: center;
    background: #fdfdfd;
}

.s-left-banner img {
    display: block;
    margin: 10px 0 5px;
    width: 270px;
}

.medicalpractice {
    margin: 30px 0;
    border: 1px solid #ededed;
    box-shadow: 0 1px 1px rgba(187, 187, 187, 0.75);
}

.medicalpractice li {
    margin: 10px 10px;
    border: 1px solid #ededed;
}

.medicalpractice li a {
    display: block;
    line-height: 3;
    text-align: center;
    background: #fdfdfd;
}

/*
.navbar {
position: relative;
z-index: 2;
margin-bottom: 20px;
overflow: visible;
color: #555555;
}

.navbar-inner {
min-height: 40px;
padding-right: 20px;
padding-left: 20px;
background-color: #fafafa;
background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
background-repeat: repeat-x;
border: 1px solid #d4d4d4;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
-webkit-box-shadow: 0 1px 4px rgb(0 0 0 / 7%);
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
box-shadow: 0 1px 4px rgb(0 0 0 / 7%);
}

.navbar .brand {
display: block;
float: left;
padding: 10px 20px 10px;
margin-left: -20px;
font-size: 20px;
font-weight: 200;
color: #555555;
text-shadow: 0 1px 0 #ffffff;
}

.blockquote {
padding: 0 0 0 15px;
margin: 0 0 20px;
border-left: 5px solid #eeeeee;
}

.blockquote a {
margin-bottom: 0;
font-size: 16px;
font-weight: 300;
line-height: 25px;
color: #0088cc;
text-decoration: none;
}
*/


/********************************************************************
*********************************************************************


医院紹介


*********************************************************************
*********************************************************************/
.clinic {
    margin: 0 0 30px;
    border-bottom: 1px solid #ededed;
}

.clinic:first-child {}

.clinic img {
    float: left;
    margin: 0 10px 10px 0;
}

.clinic table {
    width: 570px;
}

.clinic table tr th {
    width: 65px;
    text-align: left;
    font-weight: normal;
}

.clinic table tr td:before {
    margin: 0 5px;
    content: "：";
}

.clinic table tr td.none_colon:before {
    content: "　";
}

.clinic_details {
    float: right;
    width: 150px;
    margin: 10px 0 20px;
    background: #fdfdfd;
    box-shadow: 0px 1px 1px rgba(187, 187, 187, 0.75);
}

.clinic_details a {
    display: block;
    line-height: 3;
    text-align: center;
}

.clinic_name {
    margin: 10px 0 10px;
    padding: 10px 0 10px 10px;
    background: #f9f9f9;
}

#modal-content {
    width: 50%;
    margin: 0;
    padding: 10px 20px;
    border: 2px solid #aaa;
    background: #fff;
    position: fixed;
    display: none;
    z-index: 9999;
}

.button-link:hover {
    cursor: pointer;
}

#modal-overlay {
    z-index: 9998;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0, 0, 0, 0.75);
}

/********************************************************************
*********************************************************************


審美診療とは


*********************************************************************
*********************************************************************/

/********************************************************************
*********************************************************************


インプラントとは


*********************************************************************
*********************************************************************/

/********************************************************************
*********************************************************************


Q&A


*********************************************************************
*********************************************************************/
.qa_dl dl dt {
    position: relative;
    margin: 15px 0 0;
    padding: 10px 0 10px 30px;
    color: #76ab5d;
    font-weight: bold;
    cursor: pointer;
    background: #ebf1e7;
}


.qa_dl dd {
    margin: 0 0 15px;
    padding: 5px;
    font-size: 14px;
    line-height: 2;
    color: #5f483e;
    background: #f6ddee;
    display: none;
}

.qa_dl img {
    position: absolute;
    top: -10px;
    left: -10px;
}



/********************************************************************
*********************************************************************


お問い合わせ


*********************************************************************
*********************************************************************/
button, input, select, textarea {
    border: 0
}
input[type=email], input[type=tel], input[type=text] {
    width: 50%;
    line-height: 2em;
    margin-top: 10px;
    padding: 4px;
    background: #f2f2f2
}
textarea {
    width: 100%;
    height: 200px;
    padding: 4px
}
/*
.form-group {
    margin-top: 30px;
    text-align: left
}
*/
input[type="email"]:focus, input[type="tel"]:focus, input[type="text"]:focus, textarea:focus {
    background: #a9d1cb
}
/*
#contactform ul li {
    display: inline-block;
    line-height: 2em;
    margin-right: 15px
}
*/
input[type=checkbox] {
    margin-right: 5px
}
label.control-label {
    text-align: left;
    display: inline-block;
    margin-top: 30px;
    min-width: 180px
}
#contactform .attention {
    margin-top: 40px;
    line-height: 160%
}
.attention a {
    text-decoration: underline
}
#contactform input:required, #contactform textarea:required {
    background:#f2f2f2 url(../images/red_asterisk.png)no-repeat 98% center;
    background-size:8px;
    margin-top: 10px;
}
#contactform input:required:valid, #contactform textarea:required:valid {
    background:#f2f2f2 url(../images/valid.png)no-repeat 98% center;
    box-shadow:0 0 5px #a9d1cb;
    border-color:#28921f
}
#contactform input:focus:invalid, #contactform textarea:focus:invalid {
    background:##f2f2f2 url(../images/invalid.png)no-repeat 98% center;
    box-shadow:0 0 5px #d45252;
    border-color:#b03535
}

@media screen and (max-width:768px) {
/*
    .form-group {
        width: 90%;
        margin-left: 5%
    }
*/
    input[type=email], input[type=tel], nput[type=text] {
        width: 100%
    }
    label.control-label {
        margin-top: 0;
        font-size: .9em
    }
    .attention {
        font-size: .9em
    }
    input[type=email], input[type=tel], input[type=text] {
        width: 100%
    }
/*    #contactform .wrap {
        padding-top: 140px
    }*/
}

/*@media screen and (max-width:767px) {
    #contactform .wrap {
        width: 90%
    }
}

@media screen and (max-width:736px) {
    #contactform .wrap {
        width: 80%
    }
}

@media screen and (max-width:414px) {
    #contactform .wrap {
        padding-top: 75pt
    }
    .form-group {
        width: 98%;
        margin-left: 0
    }
}*/
.contact-caution {
    width: 90%;
    color: #272b4c;
    background-color: #fff;
    padding: 5%;
    margin: 50px 0;
    text-align: left;
    line-height: 180%;
    font-size: .8em;
    border: #d7e5f1 2px solid
}
.contact-caution dt {
    text-align: center;
    font-size: 1pc;
    font-weight: 700;
    margin: 0 0 20px;
    letter-spacing: 2px
}
#contactform .hissu {
    text-align: right;
    font-size: 9pt;
    margin-right: -14px;
    margin-top: 10px
}

@media screen and (max-width:414px) {
    .contact-caution dt {
        margin: 10px 0 20px
    }
}
#contactform .button
    color: #666;
    margin: 40px auto 0
}
#contactform .button--wayra:hover {
    border-color: #95bab3
}
#contactform .button--wayra.button--inverted:hover {
    color: #fff;
    border-color: #95bab3
}
#contactform .button--wayra.button--inverted:hover:before {
    background-color: #95bab3
}
#contactform .button--wayra:after {
    line-height: 52px
}
#contactform .button--wayra {
    width: 250px
}
#contactform .button {
    padding: 1.4em 6em
}
.FAQ{
    width:85%;
    margin: 80px auto;
}

  .FAQ h3{
    margin-bottom: 60px;
  }
  
    .qa-1 {
      max-width: 600px;
      margin-bottom: 7px;
      border: 1px solid #d6dde3;
      border-radius: 5px;
  }
  
  .qa-1 summary {
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: relative;
      padding: 1em 2em 1em 3em;
      color: #333333;
      font-weight: 600;
      cursor: pointer;
  }
  
  .qa-1 summary::before,
  .qa-1 p::before {
      position: absolute;
      left: 1em;
      font-weight: 600;
      font-size: 1.3em;
  }
  
  .qa-1 summary::before {
      color: #75bbff;
      content: "Q";
  }
  
  .qa-1 summary::after {
      transform: translateY(-25%) rotate(45deg);
      width: 7px;
      height: 7px;
      margin-left: 10px;
      border-bottom: 3px solid #333333b3;
      border-right: 3px solid #333333b3;
      content: '';
      transition: transform .5s;
  }
  
  .qa-1[open] summary::after {
      transform: rotate(225deg);
  }
  
  .qa-1 p {
      position: relative;
      transform: translateY(-10px);
      opacity: 0;
      margin: 0;
      padding: .3em 3em 1.5em;
      color: #333;
      transition: transform .5s, opacity .5s;
  }
  
  .qa-1[open] p {
      transform: none;
      opacity: 1;
  }
  
  .qa-1 p::before {
      color: #ff8d8d;
      line-height: 1.2;
      content: "A";
  }

	@media screen and (max-width: 640px) {
    .br-sp { display:none; }
}