@charset "utf-8";

/* ■■■メインイメージ■■■*/

#header-bg {
width: 1170px;
background-image : url(../images/h_img01.png);
background-position: right 0;
background-repeat: no-repeat;
background-size: 612px 230px;
height: 230px !important;
margin: 0 auto;
text-align: left;
background-color: #F5F5F3;
}

#header-bg-base {
width: 100%;
background-color: #F5F5F3;

}

#header-bg p.ty01 {
padding: 50px 0 0 130px;
}

#header-bg .ty01 img {
width: 324px;
height: auto;
}

#titleArea1 {
padding: 50px 0;
margin-top: 40px;
}

#titleArea1 img {
width: 273px;
height: auto;
}

#titleArea1 .ty01 {
position: absolute;
bottom: 0;
left: 18%;
}

#titleArea1 .ty01 img {
width: 170px;
height: auto;
padding: 0;
}

#titleArea1 .ty02 {
position: absolute;
top: 25%;
right: 25%;
}

#titleArea1 .ty02 img {
width: 80px;
height: auto;
padding-left: 0;
}




/* max-width: 1268px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1268px){

#header-bg {
width: 100%;
}

}
/* max-width: 1268px @end */

/* min-width: 769px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (min-width: 769px){



}
/* min-width: 769px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){

#header-bg {
background-size: 395px 150px;
height: 150px !important;
background-position: right -90px top 0;
}


#header-bg-base p.ty01 {
padding: 40px 0 0 10px;
}

#header-bg .ty01 img {
width: 150px;
height: auto;
}

/* IE11とEdge用*/
_:-ms-fullscreen, :root #header-bg-base .ty01 img {
width: 150px;
height: auto;
}

@supports (-ms-ime-align:auto) {
#header-bg-base .ty01 img {
width: 150px;
height: auto;
}
}
/* ※IE11とEdge用 end*/

#titleArea1 {
margin-top: 0;
}

#titleArea1 .ty01 {
left: -20px;
}

#titleArea1 .ty01 img {
width: 90px;
}

#titleArea1 .ty02 {
top: 25%;
right: 2%;
}

#titleArea1 .ty02 img {
width: 50px;
}


}
/* max-width: 768px @end */


/* ■■■口腔筋機能療法とは■■■*/
.cont01 {
background-image : url(../images/mft/bg01.png);
background-position: 0 0;
background-repeat: no-repeat;
background-color:  #E8FAFE;
letter-spacing: 0.2em;
position: relative;
}

.cont01_bg {
padding: 40px;
}

.ttl01 img {
width: 461px;
height: auto;
}

.cont01 h4 {
font-weight: bold;
font-size: 18px;
}

.cont01 .ty01 {
padding-left: 274px;
}



/* max-width: 1268px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1268px){



}
/* max-width: 1268px @end */


/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){
.cont01 {
background-size: 400px 325px;
text-align: left;
background-position: center 0;
}


.cont01_bg {
background-color: rgba(255,255,255,0.6);
padding: 0 20px 20px 20px;
}

.ttl01 {
padding-top: 30px;
text-align: center;
}

.ttl01 img {
width: 330px;
height: auto;
}

.cont01 .ty01 {
padding-left: 0;
}

.cont01 h4 {
text-align: center;
}



}
/* max-width: 768px @end */


/* ■■■MFTの流れ■■■*/

.cont02 {
margin: 0 30px;
letter-spacing: 0.2em;
text-align: center;
}

.cont02_1 {
border: 2px solid #CCC;
background-color: #CCC;
}

.steptitle_bg {
float:left;
width: 160px;
}

.steptitle_bg img {
width: 160px;
height: auto;
}

.steptitle {
float:left;
color: #fff;
text-align: left;
font-size: 16px;
font-weight: bold;
padding-top: 23px;
}

.contL01 {
float: left;
width: 300px;
text-align: center;
}

.contR01 {
float: right;
width: 750px;
text-align: left;
}

.cont02_2 {
font-weight: bold;
background-color: #CCC;
padding-bottom: 15px;
font-size: 18px;
text-align: center;
margin-top: 60px;
color:#FFF;
padding: 10px 0;
}

.cont02_3 {
border:2px solid #CCC;
padding: 15px;
}

/* max-width: 1268px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1268px){

.contL01 {
float: left;
max-width: 300px;
z-index: 12;
}

.contR01 {
float: right;
width: 100%;
margin-left: -325px;
padding-left: 325px;
}

}
/* max-width: 1268px @end */

/* min-width: 769px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (min-width: 769px){



}
/* min-width: 769px @end */

/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){

.cont02 {
margin: 0;
}

.contL01 {
width: 100%;
max-width: 100%;
float: none;
padding: 0 5px;
}

.contL01 img {
width: 80%;
height: auto;
}

.contR01 {
float: none;
width: 100%;
margin-left: 0;
padding-left: 0;
margin-top: 20px;
}

.steptitle_bg {
width: 100px;
}

.steptitle_bg img {
width: 100px;
}

.steptitle {
float: right;
width: 100%;
font-size: 14px;
padding-top: 12px;
margin-left: -110px;
padding-left: 110px;
}

.cont02_2 {
margin-top: 20px;
}

}
/* max-width: 768px @end */



/* ■■■舌癖とは■■■*/

.cont03 {
margin: 0 30px;
letter-spacing: 0.2em;
}

.cont03_1 {
border:2px solid #CCC;
padding: 15px;
position: relative;
margin-top: 130px;
}

.cont03_1 .ty01 {
position: absolute;
top: -115px;
left: 2%;
}

.cont03_1 .ty01 img {
width: 261px;
height: auto;
}

.cont03_1 .ty02 {
position: absolute;
top: -142px;
right: 2%;
}

.cont03_1 .ty02 img {
width: 140px;
height: auto;
}

.contL02 {
float: left;
width: 300px;
text-align: center;
}

.contR02 {
float: right;
width: 750px;
text-align: left;
}


.contL02_1 {
float: left;
width: 48%;
padding: 30px;
background-color:  #F5F5F3;
min-height: 490px;
text-align: center;
}

.contR02_1 {
float: right;
width: 48%;
padding: 30px;
background-color:  #F5F5F3;
min-height: 490px;
text-align: center;
}

.contL02_1 img,
.contR02_1 img {
width: 80%;
height: auto;
}

.contL02_1 h4,
.contR02_1 h4 {
font-size: 16px;
font-weight: bold;
}

/* max-width: 1268px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 1268px){

.contL02 {
float: left;
max-width: 300px;
z-index: 12;
}

.contR02 {
float: right;
width: 100%;
margin-left: -325px;
padding-left: 325px;
}


}
/* max-width: 1268px @end */



/* max-width: 768px
* * * * * * * * * * * * * * * * * * * * */
@media only screen and (max-width: 768px){


.cont03 {
margin: 0;
}

.contL02 {
width: 100%;
max-width: 100%;
float: none;
padding: 0 5px;
}

.contL02 img {
width: 80%;
height: auto;
}

.contR02 {
float: none;
width: 100%;
margin-left: 0;
padding-left: 0;
margin-top: 20px;
}


.contL02_1 {
float: none;
width: 100%;
min-height: 100%;
padding: 20px;
}


.contR02_1 {
float: none;
width: 100%;
min-height: 100%;
padding: 20px;
margin-top: 30px;
}

.cont03_1 {
margin-top: 100px;
}

.cont03_1 .ty01 {
position: absolute;
top: -75px;
left: 2%;
}

.cont03_1 .ty01 img {
width: 181px;
height: auto;
}

.cont03_1 .ty02 {
position: absolute;
top: -102px;
right: 2%;
}

.cont03_1 .ty02 img {
width: 100px;
height: auto;
}

}
/* max-width: 768px @end */