@charset "utf-8";
@media screen and (min-width: 898px) {

html{
	height: 100%;
}

body{
    font-size:13px;
    letter-spacing: 0.01em;
    line-height:200%;
    color: #333;
    font-family: 'Noto Sans JP',"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体","Meiryo",'HiraKakuPro-W3','ＭＳ Ｐゴシック',sans-serif;
    text-rendering: optimizeLegibility;
	background-color: #fff;
	height: 100%;
	margin: 0;
}

h1{
	font-size: 1.6em;
}

h2{
	font-size: 1.5em;
	line-height: 170%;
}

h3{
	font-size: 1.2em;
	font-weight: 400;
	line-height: 190%;
}
.br::before {
	content: "\A" ;
	white-space: pre ;
}


.br-sp::before {
	display: none;
}


/*----- フェードイン -----*/
.inviewfadeIn {
        opacity: 0;
        transition: 1s;
    }
    
.fadeIn {
        opacity: 1.0;
    }


.clear-fix{
	clear:both;
}



* ------------------------- drawer */
/* ドロワーメニュー */


.wrapper-sp {
  height: 100%;
  overflow-x: hidden;
  position: relative;
}

main {
  height: 100%;
  min-height: 100vh;
  padding: 0 0px;
  transition: all .5s;
  display: flex;
  flex-direction: column;
  justify-content: top;
}

main h1 {
  text-align: left;
}
main p {
  text-align: left;
}
.menu-trigger {
  display: none;
}
 
nav {
  display: none;
}




/* ------------------------- contents */
/* ヘッダーフッターを除くコンテンツ部分 */

#contents{
	margin: 0px 0 0;
}


#contents:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
#contents { display: inline-block; }
* html #contents { height: 1%; }
#contents { display: block; }


a img:hover {
	text-decoration: none;
	opacity: 0.85;
	-webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      -ms-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
#contents{
	width: 100% !important;
	overflow-x: hidden;
}
}

/* ------------------------- header */
/* ヘッダー */

.wrapper{
	padding: 30px 0 0px;
    width: 100%;
	z-index: 99999;
	background-color: #fff;
}
.wrapper:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.wrapper { display: inline-block; }
* html .wrapper { height: 1%; }
.wrapper { display: block; }


#header{
	display: block;
	width:1100px;
	height: 100px;
	margin: 0px auto 20px;
	padding:0;

}

@media screen and (min-width: 768px) and (max-width: 1024px) {
.wrapper{
	display: block;
	width: calc(100% - 40px);
	margin: 0px 20px;
}

#header{
	display: block;
	width: calc(100% - 40px);
	margin: 0px 20px;
}
}

#ci-g{
	float:left;
	margin: 0;
}

#c-copy-ci{
	display: block;
	font-size: 18px;
	font-weight: 500;
	position: relative;
	letter-spacing: 0.1em;
	top: 2px;
	margin: 0;
}

#ci{
	position: relative;
	top: -35px;
	display: block;
	margin: 0;
}

#ci img{
	width: 312px;
	height auto;
}



#ci img a:hover{
	opacity: 0.6;
}

#c-wrapper{
	float:right;
	margin-top: 32px;
}
#c-copy{
	float:left;
    line-height:150%;
	font-size: 19px;
	font-weight: 700;
	margin: 8px 0 0 0;
}

#h-reserve{
	float:left;
	padding: 2px 14px;
	background-color: #000;
	border-radius: 4px;
	font-size: 12px;
	color: #fff;
	margin: 8px 0 0 60px;
}
#h-tel{
	float:right;
	color: #036eb8;
	font-size: 46px;
	font-weight: bold;
	margin: 5px 0 0 10px;
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
#ci img{
	width: 250px;
	height auto;
}

#c-copy{
	float:left;
    line-height:150%;
	font-size: 13px;
	font-weight: 700;
	margin: 0px 0 0 0;
}
#h-reserve{
	margin: -3px 0 0 60px;
}
#h-tel{
	float:right;
	color: #036eb8;
	font-size: 46px;
	font-weight: bold;
	margin: -8px 0 0 10px;
}

}


/* ------------------------- #g-nav */


#g-nav-back{
	display: block;
	width: 100%;
	height: 20px;
	margin: 0px auto 30px;
	clear: both;
    z-index: 999;
}
#g-nav-back:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
#g-nav-back { display: inline-block; }
* html #g-nav-back { height: 1%; }
#g-nav-back { display: block; }



#g-nav-wrap{
	display: block;
	width: 1100px;
	margin: 0px auto;
    z-index: 999;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
	justify-content: center; /* 横方向中央揃え */
	overflow: hidden;
}

@media screen and (min-width: 768px) and (max-width: 1024px) {


#g-nav-wrap{
	width: 100%;
	margin: 0px 20px;
}
}


button{
	backgronud: none;
}

.g-nav{
	width:180px;
	float:left;
	font-size: 1.4em;
	font-weight: 500;
	text-align:center;
	line-height:20px;
	margin-left:0px;
	list-style: none;
	background-color:#fff;
	border-left:solid 2px #333;
	border-right:solid 0px #ccc;

}

@media screen and (min-width: 768px) and (max-width: 1024px) {
.g-nav{
	width:134px;
}
}


.g-nav:last-child{
	border-right:solid 2px #333;
}

.g-nav a{
	display:block;
	outline:none;
	height:20px;
	color: #333;


	vertical-align: middle; 
}



.g-nav a:hover{
	text-decoration: underline;
	text-decoration-color: red;
	text-underline-offset: 10px;
	text-decoration-thickness: 2px;
}


.act{
	text-decoration: underline;
	text-decoration-color: #999;
	text-underline-offset: 10px;
	text-decoration-thickness: 2px;

}

/* ------------------------- nav-sp*/
.nav-sp{
	display: none;
}





/*----- フェードイン -----*/
.inviewfadeIn {
        opacity: 0;
        transition: 0.7s;
    }
    
.fadeIn {
        opacity: 1.0;
    }


.item1{
  opacity: 0;    
}

.item:nth-child(1) {
  -webkit-animation: example 2s ease 1s 1 forwards;
  animation: example 2s ease 1s 1 forwards;
}
.item:nth-child(2) {
  -webkit-animation: example 2s ease 3.4s 1 forwards;
  animation: example 2s ease 3.4s 1 forwards;
}
.item:nth-child(3) {
  -webkit-animation: example 1s ease 3.2s 1 forwards;
  animation: example 1s ease 3.2s 1 forwards;
}
.item:nth-child(4) {
  -webkit-animation: example 1s ease 5.7s 1 forwards;
  animation: example 1s ease 5.7s 1 forwards;
}

@-webkit-keyframes example {
  100% {
    opacity: 1;
  }
}
@keyframes example {
  100% {
    opacity: 0.9;
  }
}



/* ------------------------- slider*/
/* スライダー */

.bxslider-sp-wrapper{
	display: none;
}

.bxslider-sp{
	display: none;
}

.bxslider{
	margin-top: 0px;
}


.bx-wrapper {
	position: relative;
	margin: 0 auto;
	padding: 0;
	*zoom: 1;
	text-align: center;
	height: auto;
	overflow: hidden;
}



.bx-wrapper img {
	width: 1200px;
	height: auto;
	display: inline-block;
}

@media screen and (min-width: 900px) and (max-width: 1024px) {
.bx-wrapper img {
	width:100%;
}
}

.slider-bgcolor1{
	background-color: #fcf2e3;
}

.slider-bgcolor2{
	background-color: #cfecd4;
}

.slider-bgcolor3{
	background-color: #d7f0f8;
}

.slider-bgcolor4{
	background-color: #fcded4;
}

.slider-bgcolor5{
	background-color: #cacfe1;
}

.slider-bgcolor6{
	background-color: #cee3ab;
}
.slider-bgcolor7{
	background-color: #ffe880;
}



/* ------------------------- wrapper-1100*/
.wrapper-1000{
	display: block;
	width: 1000px;
	margin: 0 auto 0px;
	padding: 0;
	clear: both;
}

.wrapper-1000a{
	display: block;
	position: relative;
	top: -30px;
	width: 1000px;
	margin: 0 auto 0px;
	padding: 0;
	clear: both;

}

_::-webkit-full-page-media, _:future, :root .wrapper-1000a {
    top: -0px;
}

.wrapper-1100{
	display: block;
	width: 1100px;
	margin: 0 auto 0px;
	padding: 0;
	clear: both;
}

.wrapper-900{
	display: block;
	width: 900px;
	margin: 0 auto 0px;
	padding: 0;
	clear: both;
}


.wrapper-800{
	display: block;
	width: 800px;
	margin: 0 auto 0px;
	padding: 0;
	clear: both;
	overflow: hidden;
}

.wrapper-1000:after,.wrapper-1100:after,.wrapper-900:after,.wrapper-800:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.wrapper-1000,.wrapper-1100,.wrapper-900,.wrapper-800 { display: inline-block; }
* html .wrapper-1000,* html .wrapper-1100,* html .wrapper-900,* html .wrapper-800{ height: 1%; }
.wrapper-1000,.wrapper-1100,.wrapper-900,.wrapper-800 { display: block; }

@media screen and (min-width: 900px) and (max-width: 1024px) {
.wrapper-1100{
	display: block;
	width: calc(100% - 40px);
	margin: 0 auto 0px;
	padding: 0;
	clear: both;
}
.wrapper-1000{
	display: block;
	width: calc(100% - 40px);
	margin: 0 auto 0px;
	padding: 0 0 0 20px;
	clear: both;
}

.mt20 h1,
.mt20 h2{
	margin-left: 20px;
}

.wrapper-1000a{
	display: block;
	position: relative;
	top: -30px;
	width: calc(100% - 40px);
	margin: 0 auto 0px;
	padding: 0;
	clear: both;

}



}

/* ------------------------- reserve*/
#reserve{
	display: inline-block;
	width: 100%;
	height: 240px;
	margin: 0 auto -70px;
	position: relative;
	top: -100px;
	border-bottom: 1px solid #000;
	/*background-image: url(../img/r-staff.png);*/
	background-position: right 10px bottom 10%;
	background-repeat: no-repeat;
	background-size: 30% auto;
}

.c-reserve{
	display: block;
	margin: 120px 0 -120px 0;
	float: left;
	font-size: 18px;
	line-height: 250%;
}

.tel{
	margin: 10px 0 0;
	font-size:70px;
	color: #036eb8;
	font-weight: 700;
}

.telcomment{
	margin: 168px 0 0 30px;
	float: left;
	font-size: 15px;
}

.open-l{
	float: left;
	width: calc(50% - 10px);
	font-size: 1.2em;
}

.open-r{
	float: right;
	width: calc(50% - 10px);
}

.open-r img{
	display: block;
	width: 100%;
	margin-bottom: 30px;
}

.open-tit{
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 20px;
}
.time-info{
	display: inline-block;
	width: 100%;
	margin: 0px 0 40px;
	font-size: 20px;
	font-weight: 500;
	color: #e60012;
	line-height: 140%;
	text-align: center;
}


/* ------------------------- dl#information */
/* お知らせ */


.h2_title_top{
	width: 100%;
	background-color: #f8f2e3;
}


.infoarea{
	display: inline-block;
	width: 100%;
	font-size: 14px;
}

div#information {
	display: block;
	margin: 0 auto 40px;
	list-style: none;
	border: 2px #e0dcd3 solid;
	padding: 30px 30px 0 30px;
	max-height: 300px;
	max-width: calc(1096px - 60px);
	overflow: auto;
	background-color: #fff;
}

.info{
	display: inline-block;
	clear: both;
	margin-bottom: 20px;
}


div#information li a{
	font-size: 1.2em;
	display: inline-block;
	padding-top: 8px;
	color: #036eb8 !important;
}

div#information li a:hover{
	opacity: 0.7;
}

div#information li a:before{
	content: '';
	display: inline-block;
	position: relative;
	top: 2px;
	background-image: url(../img/linkmark.gif);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0px;
	width: 12px;
	height: 15px;
	margin-right: 2px;
}

.information-tit{
	margin: 10px auto 0px;
	padding: 20px 20px;
	font-size: 20px;
	border-top: 2px #e0dcd3 solid;
	border-left: 2px #e0dcd3 solid;
	border-right: 2px #e0dcd3 solid;
}

.infoarea li:nth-child(1){
	display: block;
	float: left;
	width: 250px;
	max-height: 150px;
	min-height: 130px;
	background-image: url("../img/nanairo-orthopedic_clinic_logo.png");
	background-size: 150px auto;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #f8f2e3;
}

.infoarea li:nth-child(1) img{
	width: 250px;
	height: auto;
	background-color: #fff;
}


.infoarea li:nth-child(2){
	width: 620px;
	display: block;
	float: right;
	margin-left: 30px;
}

.infoarea li:nth-child(2) p{
	margin-top: -5px;
}

.infoarea h3{
	font-size: 18px;
	padding-bottom: 10px;
	border-bottom: dotted 1px #ccc;
}

.infoarea li img{
	width: 200px;
	height: auto;
}

/* ------------------------- はじめましてホーム*/

#hajimemashite{
	display: flex;
	width: 100%;
	margin-top: 10px;
	background-color: #f8f2e3;
	text-align: center;
	padding: 80px 0 0;
}

#hajimemashite img{
	width: 70%;
}

#hajimemashite p{
	text-align: center;
	font-size: 16px;
	margin-bottom: 0;
}




/* ------------------------- 特長ホーム*/

.feature-home:nth-child(1){
	margin: 40px 0 0;
}

.feature-home{
	display: inline-block;
	width: calc(100% - 80px);
	margin: 20px 0 0;
	padding: 40px;
	background-color: #ebebeb;
	border-radius: 14px;
	font-size: 16px;
	vertical-align: middle;
}

/* ------------------------- 特長カラー*/
.feature-home:nth-child(1){background-color: #f8f2e3;}
.feature-home:nth-child(2){background-color: #e7f3e4;}
.feature-home:nth-child(3){background-color: #e5f0f8;}
.feature-home:nth-child(4){background-color: #fcded4;}
.feature-home:nth-child(5){background-color: #d8cde3;}
.feature-home:nth-child(6){background-color: #e2e7a2;}
.feature-home:nth-child(7){background-color: #f6df86;}


.feature-home a:hover{
	opacity: 0.6;
}


.feature-home:nth-child(1) a:before,
.feature-home:nth-child(2) a:before,
.feature-home:nth-child(3) a:before,
.feature-home:nth-child(4) a:before,
.feature-home:nth-child(5) a:before,
.feature-home:nth-child(6) a:before,
.feature-home:nth-child(7) a:before{
	content: '';
	display: inline-block;
	position: relative;
	top: 8px;
	background-image: url(../img/no1-arrow.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0px;
	width: 80px;
	height: 40px;
	margin-right: 2px;
}

.feature-home:nth-child(2) a:before{background-image: url(../img/no2-arrow.png);}
.feature-home:nth-child(3) a:before{background-image: url(../img/no3-arrow.png);}
.feature-home:nth-child(4) a:before{background-image: url(../img/no4-arrow.png);}
.feature-home:nth-child(5) a:before{background-image: url(../img/no5-arrow.png);}
.feature-home:nth-child(6) a:before{background-image: url(../img/no6-arrow.png);}
.feature-home:nth-child(7) a:before{background-image: url(../img/no7-arrow.png);}


.margin-40{
	margin-top: -40px;
}

.left80{
	margin-left: 82px;
}

.left40{
	margin-left: 40px;
}

.big-tit{
	font-size: 32px;
}

.big-tit2{
	font-size: 26px;
}


.feature-home li:nth-child(1){
	float: left;
	width: 38%;
	vertical-align: middle;
}

.feature-home li:nth-child(2){
	float: right;
	width: 58%;
	vertical-align: middle;
}


/* ------------------------- 見出しが２行のための調整*/
.feature-home:nth-child(2) li:nth-child(1){
	position: relative; top: -10px; 
}

.feature-home:nth-child(2) a:before{
	top: 30px;
}

.feature-home:nth-child(3) a:before,
.feature-home:nth-child(4) a:before,
.feature-home:nth-child(5) a:before,
.feature-home:nth-child(6) a:before,
.feature-home:nth-child(7) a:before{
	top: 20px;
}
.feature-home:nth-child(2),
.feature-home:nth-child(3),
.feature-home:nth-child(4),
.feature-home:nth-child(5),
.feature-home:nth-child(6),
.feature-home:nth-child(7){
	padding: 30px 40px;
}

.feature-home:nth-child(2) li:nth-child(2),
.feature-home:nth-child(3) li:nth-child(2),
.feature-home:nth-child(4) li:nth-child(2),
.feature-home:nth-child(5) li:nth-child(2),
.feature-home:nth-child(6) li:nth-child(2),
.feature-home:nth-child(7) li:nth-child(2){
	margin-top: 15px;
}

/* ------------------------- treatment-home*/

#treatment{
	display: block;
	width: 100%;
	height: 430px;
	margin-top: 0px;
	background-color: #e2eddf;
	text-align: center;
	padding: 0px 0 0;
	background: linear-gradient(180deg, #fff 0%, #fff 40%, #e2eddf 40%, #e2eddf 100%);

}
#treatment .wrapper-900{
	display: block;
	width: 900px;
	height: 400px;
	text-align: center;
	padding: 250px 0 0;
	background-image: url(../img/treatment.png);
	background-position: right -20px bottom 220px;
	background-repeat: no-repeat;
	background-size: 45% auto;
	text-align: left;
}

#treatment h2{
	font-size: 24px;
}
#treatment h3{
	font-size: 16px;
	width: 55%;
}


/* ------------------------- button*/

.link-button a{
	display: block;
	width:calc(100% - 66px);
	margin: 40px 0;
	padding: 30px;
	font-size: 21px;
	border: 4px solid #036eb8;
	border-radius: 10px;
	background-image: url(../img/arrow1.png);
	background-position: top 30px left 30px;
	background-repeat: no-repeat;
	background-size: 20px auto;
	text-align: center;
}

.link-button a:hover{
	display: block;
	font-size: 21px;
	background-color: #036eb8;
	color: #fff;
	background-image: url(../img/arrow1w.png);
	background-position: top 30px left 30px;
	background-repeat: no-repeat;
	background-size: 20px auto;
	opacity: 1;
}

.column2-l{
	display: block;
	float:left;
	width:calc(50% - 15px);
}
.column2-r{
	display: block;
	float:right;
	width:calc(50% - 15px);
}

.column2-l img{
	width: 100%;
}

/* ------------------------- line*/

#line{
	display: none;
	padding: 80px 200px;
	background-color: #f1f7f0;
	border-radius: 20px;
	border: 4px solid #06c755;
}

#line h1{
	display: block;
	margin: 0 auto 30px;
	padding: 10px;
	background-color: #06c755;
	color: #fff;
	font-size: 18px;
	text-align: center;
	letter-spacing: 2px;
}

#line h2{
	font-size: 24px;
	text-align: center;
	letter-spacing: 2px;
	margin: 20px auto 20px;
}

#line-button{
	margin-top: 0px;
}


#line-button a{
	font-size: 20px;
	letter-spacing: 2px;
	color: #06c755;
	position: relative;
	top: -10px;
	margin: 0 auto;
}


#line-button a:before{
	content: '';
	display: inline-block;
	position: relative;
	top: 30px;
	background-image: url(../img/LINE_Brand_icon.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 30px 0px;
	width: 140px;
	height: 80px;
	margin-right: 2px;
}


/* ------------------------- line-wp*/

#line-wp{
	display: block;
	padding: 0px 80px 40px;
	background-color: #f1f7f0;
	border-radius: 20px;
	border: 4px solid #06c755;
}


#line-wp-tit{
	display: block;
	margin-left: 240px;
	position: relative;
	top: -40px;
	width: 500px;
}

#line-wp-tit:before{
	content: '';
	display: inline-block;
	position: relative;
	top: 115px;
	left: -150px;
	background-image: url(../img/LINE_Brand_icon.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0px 0px;
	width: 180px;
	height: 100px;
	margin-right: 2px;
}

#line-wp h1{
	display: block;
	margin: 0 0 0px 0px;
	padding: 10px 0 10px 0px;
	color: #333;
	font-size: 18px;
	text-align: left;
	font-weight: 700;
	letter-spacing: 2px;
	border-bottom: 5px solid #06c755;
}

#line-wp h2{
	font-size: 24px;
	letter-spacing: 2px;
	margin: 20px auto 20px;
	width: 500px;
}


#line-wp h3{
	font-size: 16px;
	letter-spacing: 2px;
	margin: -30px 0 40px 90px;
	width: 680px;
}

.line-step{
	display: block;
	width: 980px;
}
.line-step:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.line-step { display: inline-block; }
* html .line-step{ height: 1%; }
.line-step{ display: block; }


.line-column{
	display: block;
	float: left;
	width: 280px !important;
	text-align: center !important;
	margin: 0 auto;
}

.line-column:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.line-column { display: inline-block; }
* html .line-column{ height: 1%; }
.line-column{ display: block; }



.line-column:before{
	content: '';
	display: block;
	position: relative;
	top: -5px;
	left: 100px;
	background-image: url(../img/line-step1.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0px 0px;
	width: 80px;
	height: 80px;
}

.line-column:nth-child(2):before{background-image: url(../img/line-step2.png);}
.line-column:nth-child(3):before{background-image: url(../img/line-step3.png);}

.line-column:nth-child(1) img{
	padding: 10px;
	background-color: #fff;
	width: 185px;
}

.line-column:nth-child(2) img,
.line-column:nth-child(3) img{
	width: calc(100% - 20px);
}



.line-column h2{
	width: 100% !important;
	display: block;
	font-size: 18px !important;
	text-align: center !important;
	font-weight: 700;
	margin: 10px 0 !important;
}

.line-column h3{
	width: 100% !important;
	display: block !important;
	font-size: 12px !important;
	text-align: center !important;
	margin: 0 0 20px !important;
	padding: 0 !important;
}



/* ------------------------- price*/

.tit-bar{
	margin: 80px 0 40px;
	width: calc(100% - 80px);
	padding: 20px 40px;
	background-color: #036eb8;
	color: #fff;
	font-size: 24px;
	border-radius: 10px;
}


#price h1{
	margin-top: 40px;
	padding: 15px 20px;
	border: 3px solid #036eb8;
	border-radius: 10px;
}


h2 #price{
	font-size: 16px !important;
	width: 70%;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	margin: 0 auto;
}


#price table{
	font-size: 18px;
	width: 90%;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;	
	margin: 0 auto;
}

#price td,
#price th{
	padding: 5px 20px;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

#price th{
	background: #e5f0f8;
}


#price td:nth-child(2n-1){
	width: 70%;
}

#price td:nth-child(2n){
	text-align: center;
}








/* ------------------------- access*/

.map-b{
	display: flex;
	padding: 30px 30px 30px 60px;
	background-color: #ebebeb;
}

.map-b .column2-l{
	width: 44%;
	margin-right: 40px;
}

.map-b .column2-l img{
	width: 100%;
}

.map-b .column2-r img{
	width: 100%;
	margin-top: 30px;
}

.map-b:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.map-b { display: inline-block; }
* html .map-b{ height: 1%; }
.map-b{ display: block; }

.g-map{
	margin-top: 20px;

}


/* ------------------------- 初めての方へ*/

/* ------------------------- 挨拶文*/

#hajime p{
	width: 750px;
	margin: 40px auto;
	text-align: left;
	line-height: 200%;
}

#sign{
	display: block;
	width: 750px;
	margin: 40px auto 100px;
	text-align: right;
	font-size: 16px;
}

/* ------------------------- スタッフ紹介*/

#staff-tit,
#feature-tit{
	display: block;
	width: 260px;
	margin: 50px auto 10px;
}

#staff-tit img,
#feature-tit img{
	width: 100%;
}



.staff{
	display: block;
	float: left;
	width: calc(50% - 20px);
	margin: 0 25px 0 0;
}

.staff:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.staff { display: inline-block; }
* html .staff{ height: 1%; }
.staff{ display: block; }



.staff:last-child{
	margin: 0;
}



.staff img{
	display: block;
	margin: 0 auto;
	width: 70%;
}

.staff .s-name{
	margin: 30px 0 10px;
	font-size: 1.4em;
	font-weight: 500;
}


.staff .intro{
	font-size: 1.1em;
}

/* -------------------------　mov*/
.mov{
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

.mov video{
	width: 60%;
	margin: 0 auto;
	text-align: center;
}

/* -------------------------　特長ページ　特長*/

.feature{
	display: inline-block;
	width: calc(100% - 40px);
	margin: 20px auto 40px;
	padding: 20px;
	background-color: #ebebeb;
	border-radius: 14px;
	font-size: 16px;
	vertical-align: middle;
}

/* ------------------------- 特長カラー*/
.feature:nth-child(2){background-color: #f8f2e3;}
.feature:nth-child(3){background-color: #e7f3e4;}
.feature:nth-child(4){background-color: #e5f0f8;}
.feature:nth-child(5){background-color: #fcded4;}
.feature:nth-child(6){background-color: #d8cde3;}
.feature:nth-child(7){background-color: #e2e7a2;}
.feature:nth-child(8){background-color: #f6df86;}

.feature-home a:hover{
	opacity: 0.6;
}



/* ------------------------- 特長カード*/

.feature-head{
	width: 100%;
}

.feature-head-l{
	float:left;
	width: 44%;
}
.feature-head-r{
	float:right;
	width: 56%;
}

.feature-head img{
	display: block;
	height: 180px;
	margin: 0 auto;
}
.feature:nth-child(8) .feature-head img{
	position: relative;
	top: -20px;
	height: 200px;
	margin-bottom: -20px;
}

.feature-head-7{
	display: block;
	margin: 48px 0 10px 0px;
	font-size: 1.1em;

}
.feature-head-tit{
	display: block;
	margin: 0 0 0 0px;
	font-size: 1.3em;
	font-feature-settings: "palt" 1;
}

.feature-head-tit .big-tit{
	font-size: 2em;
}

.feature:nth-child(2) .feature-head-tit:before,
.feature:nth-child(3) .feature-head-tit:before,
.feature:nth-child(4) .feature-head-tit:before,
.feature:nth-child(5) .feature-head-tit:before,
.feature:nth-child(6) .feature-head-tit:before,
.feature:nth-child(7) .feature-head-tit:before,
.feature:nth-child(8) .feature-head-tit:before{
	content: '';
	display: inline-block;
	position: relative;
	top: 5px;
	background-image: url(../img/no1.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0px;
	width: 45px;
	height: 40px;
	margin-right: 2px;
}

.feature:nth-child(3) .feature-head-tit:before{background-image: url(../img/no2.png);}
.feature:nth-child(4) .feature-head-tit:before{background-image: url(../img/no3.png);}
.feature:nth-child(5) .feature-head-tit:before{background-image: url(../img/no4.png);}
.feature:nth-child(6) .feature-head-tit:before{background-image: url(../img/no5.png);}
.feature:nth-child(7) .feature-head-tit:before{background-image: url(../img/no6.png);}
.feature:nth-child(8) .feature-head-tit:before{background-image: url(../img/no7.png);}

/* ------------------------- 特長カード　詳細*/
.feature-cont{
	display: block;
	clear: both;
	margin-top: 50px;
	background: #fff;
	padding: 40px 130px;
}

.feature-cont img{
	width: 100%;
}


.feature-cont .column2-l{
	display: block;
	float: left;
	width: 45%;
	height: 220px;
}
.feature-cont .column2-r{
	display: block;
	float: left;
	width: 55%;
	height: 230px;
	margin: 0;
}

.column2-l:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.column2-l { display: inline-block; }
* html .column2-l{ height: 1%; }
.column2-l{ display: block; }

.column2-l img{
	width: 85%;
}

.intro{
	display: block;
	margin-bottom: 30px;
}


.img80 img{
	display: block;
	width: 80%;
	margin: 40px auto 0;
}

.img100 img{
	display: block;
	width: 100%;
	margin: 40px auto 0;
}

.inner-link a{
	color: #036eb8;
}


.wrapper-machine {
	background-color: #fff;

}
* html .wrapper-machine {text-align:left;} 
.wrapper-machine:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.wrapper-machine { display: inline-block; }
* html .wrapper-machine { height: 1%; }
.wrapper-machine { display: block; }

/* ------------------------- 特長6*/
.map-c{
	display: inline-block;
}

.map-c .column2-l{
	display: block;
	float: left;
	width: 40%;
	height: auto;
	margin-right: 40px;
}
.map-c .column2-r{
	display: block;
	float: left;
	width: calc(60% - 40px);
}

.map-c .column2-l img,
.map-c .column2-r img{
	width: 100%;
}


.map-c:after{ content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.map-c{ display: inline-block; }
* html .map-c{ height: 1%; }
.map-c{ display: block; }



/* ------------------------- 施術　treatmentページ*/
/* ------------------------- treatmentヘッダー*/


#treatment-topimg{
	background-color: #e2eddf;
}

.headache{background-color: #dfeaf8;}
.neck-pain{background-color: #fbe8cd;}
.stiff-shoulder{background-color: #f0e0d8;}
.arm-hand-pain{background-color: #dae6d6;}
.back-pain{background-color: #c5d8e8;}
.knee-foot-pain{background-color: #f4eecf;}
.insomnia{background-color: #b8ced7;}
.dizzy{background-color: #d2d7ed;}
.traffic-accident{background-color: #dadbda;}
.qa{background-color: #edefe9;}


#treatment-topimg .wrapper-1000{
	display: block;
	width: 1000px;
	height: 250px;
	text-align: center;
	padding: 80px 0 0;
	background-image: url(../img/treatment.png);
	background-position: right -20px bottom 0px;
	background-repeat: no-repeat;
	background-size: 40% auto;
	text-align: left;
}

#treatment-topimg01 .wrapper-1000{
	display: block;
	width: 1000px;
	height: 250px;
	text-align: center;
	padding: 80px 0 0;
	background-image: url(../img/topimg.png);
	background-position: right 10px bottom 0px;
	background-repeat: no-repeat;
	background-size: 32% auto;
	text-align: left;
}

#treatment-topimg01.headache .wrapper-1000{background-image: url(../img/topimg01.png);}
#treatment-topimg01.neck-pain .wrapper-1000{background-image: url(../img/topimg02.png);}
#treatment-topimg01.stiff-shoulder .wrapper-1000{background-image: url(../img/topimg03.png);}
#treatment-topimg01.arm-hand-pain .wrapper-1000{background-image: url(../img/topimg04.png);}
#treatment-topimg01.back-pain .wrapper-1000{background-image: url(../img/topimg05.png);}
#treatment-topimg01.knee-foot-pain .wrapper-1000{background-image: url(../img/topimg06.png);}
#treatment-topimg01.insomnia .wrapper-1000{background-image: url(../img/topimg07.png);background-size: 40% auto;}
#treatment-topimg01.dizzy .wrapper-1000{background-image: url(../img/topimg08.png);}
#treatment-topimg01.traffic-accident .wrapper-1000{background-image: url(../img/topimg09.png);}
#treatment-topimg01.qa .wrapper-1000{background-image: url(../img/topimg-qa.png);}



#treatment-topimg h1,
#treatment-topimg01 h1{
	width: 67%;
	margin-top: 30px;
	font-size: 2.2em;
	border-bottom: 1px dotted #333;
	padding-bottom: 15px;
}
#treatment-topimg h2,
#treatment-topimg01 h2{
	font-size: 1.4em;
	width: 65%;
}


/* ------------------------- treatment-cont2*/

.treatment-cont2{
	display: block;
	margin-bottom: 40px;
}

.treatment-cont2:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.treatment-cont2 { display: inline-block; }
* html .treatment-cont2{ height: 1%; }
.treatment-cont2{ display: block; }

.treatment-cont h1{
	margin-top: 40px;
	padding: 15px 20px;
	border: 3px solid #036eb8;
	border-radius: 10px;
}


.treatment-cont2 li a{
	float: left;
	width: calc(50% - 28px);
	font-size: 1.4em;
	border: 2px solid #036eb8;
	border-radius: 10px;
	line-height: 520%;
	height: 100px;
	margin: 14px 0;
	background-image: url(../img/nayami01.png);
	background-position: left 0px bottom 0px;
	background-repeat: no-repeat;
	background-size: 25% auto;
}

.treatment-cont2 li a:hover{
	color: #fff;
	background-color: #036eb8;
	opacity: 1;
	border: 2px solid #036eb8;
}




.treatment-cont2 li:nth-child(2) a{background-image: url(../img/nayami02.png);}
.treatment-cont2 li:nth-child(3) a{background-image: url(../img/nayami03.png);}
.treatment-cont2 li:nth-child(4) a{background-image: url(../img/nayami04.png);}
.treatment-cont2 li:nth-child(5) a{background-image: url(../img/nayami05.png);}
.treatment-cont2 li:nth-child(6) a{background-image: url(../img/nayami06.png);}
.treatment-cont2 li:nth-child(7) a{background-image: url(../img/nayami07.png);}
.treatment-cont2 li:nth-child(8) a{background-image: url(../img/nayami09.png);}
.treatment-cont2 li:nth-child(9) a{background-image: url(../img/nayami08.png);}


.treatment-cont2 li a:nth-child(2n-1){
	margin-right: 20px;
}
.treatment-cont2 li a:nth-child(2n){
	margin-left: 20px;
}

.treatment-cont2 li a:before{
	content: '';
	display: inline-block;
	position: relative;
	top: 22px;
	left: 110px;
	background-image: url(../img/arrow1.png);
	background-repeat: no-repeat;
	background-size: 13px;
	background-position: 0 0px;
	width: 130px;
	height: 40px;
	margin-right: 2px;
}

.treatment-cont2 li a:hover:before{
	content: '';
	display: inline-block;
	position: relative;
	top: 22px;
	left: 110px;
	background-image: url(../img/arrow1w.png);
	background-repeat: no-repeat;
	background-size: 13px;
	background-position: 0 0px;
	width: 130px;
	height: 40px;
	margin-right: 2px;
}


.treatment-cont2 h1{
	margin-top: 40px;
	padding: 15px 20px;
	color:#fff;
	border: 3px solid #036eb8;
	border-radius: 10px;
	background-color: #036eb8;
	clear: both;
}

.treatment-cont2 h2{
	display: block;
	border-bottom: 1px solid #ccc;
	margin: 40px 40px 20px;
	padding-bottom: 10px;
	font-weight: 500;
}

.treatment-cont2 h3{
	display: block;
	font-size: 1.3em;
	margin: 20px 40px 40px;
}

/* ------------------------- 体の部位から探す*/

.jintai-sp{
	display: none;
}

.jintai-pc{
	width: 265px;
	float: left;
	margin: 0 60px 0 100px;
	text-align: right;
}

.jintai-pc img{
	width: 100%;
	height: auto;
}

.jintai-r{
	float: left;
	width: 45%;
	margin: 40px 30px 0 0;
}

.jintai-r h3{
	margin: 50px 0 0;
}


/* ------------------------- 施術の流れ*/

.flow-wrapper{
	display: block;
	width: 900px;
	min-height: 150px;
	margin: 0 auto 0px;
	padding: 0;
	clear: both;
}


.flow-wrapper:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.flow-wrapper{ display: inline-block; }
* html .flow-wrapper{ height: 1%; }
.flow-wrapper{ display: block; }





.flow{
	float: left;
	margin-right: 10px;
	padding: 10px auto;
	width: calc(50% - 30px);
	font-size: 1.7em;
	border: 5px solid #999;
	border-radius: 10px;
	line-height: 400%;
	height: 80px;
	text-align: center;
}


.flow:after{
	content: '';
	display: block;
	position: relative;
	bottom: 7px;
	left: 44%;
	background-image: url(../img/arrow-down-g.png);
	background-repeat: no-repeat;
	background-size: 50% 50%;
	background-position: 0 0px;
	width: 120px;
	height: 130px;
}

.flow-wrapper:last-child .flow:after{
	content: '';
	display: none;
}

.flow-r{
	float: left;
	margin-left: 20px;
	font-size: 1.2em;
	width: calc(50% - 22px);
}

/* ------------------------- 施術詳細各ページ*/


.treatment-box{
	display: block;
	background-color: #fbfaf2;
	padding:20px;
	border-bottom: 1px solid #ccc;
}

.condition{
	min-height: 100px;
	font-size: 1.4em;
	font-weight: 500;
	line-height: 180%;
	margin-top: 10px;
	border-bottom: 1px solid #ccc;
	padding: 10px 20px 10px 160px;
	background-image: url(../img/icon-condition.png);
	background-repeat: no-repeat;
	background-size: 90px;
	background-position: 40px 10px;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
}



.condition:hover{
	color: #036eb8;
	cursor: pointer;
}

.cause{
	min-height: 80px;
	font-size: 1.2em;
	line-height: 180%;
	border-bottom: 1px solid #ccc;
	padding: 5px 0 20px 140px;
	background-image: url(../img/icon-cause.png);
	background-repeat: no-repeat;
	background-size: 90px;
	background-position: 20px 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
}

.cause2{
	min-height: 80px;
	font-size: 1.2em;
	line-height: 180%;
	border-bottom: 1px solid #ccc;
	padding: 5px 0 20px 140px;
	background-image: url(../img/icon-cause.png);
	background-repeat: no-repeat;
	background-size: 90px;
	background-position: 20px 0px;
	display:block;
}

.treatment-nanairo{
	min-height: 80px;
	font-size: 1.2em;
	line-height: 180%;
	margin-top: 10px;
	padding: 15px 0 20px 140px;
	background-image: url(../img/icon-treatment.png);
	background-repeat: no-repeat;
	background-size: 90px;
	background-position: 20px 10px;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	flex-wrap:wrap;
}

.treatment-nanairo a{
	color: #036eb8;
}


.treatment-nanairo a:before{
	content: '';
	display: inline-block;
	position: relative;
	top: 2px;
	background-image: url(../img/linkmark.gif);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0px;
	width: 12px;
	height: 15px;
	margin-right: 2px;
}


.treatment-nanairo img{
	width: 90%;
	height: auto;
}

.open-contents ul{
	position: relative;
	top: 30px;
}
.open-contents li{
	list-style: disc;
	position: relative;
	top: -50px;
	left: 300px;
}


ul.traffic{
	position: static;
}

ul.traffic li{
	position: static;
	list-style: disc;
	margin-left: 24px;
	font-size: 0.9em;
}

ul.traffic li:first-child{
	margin-top: 10px;
}

.treatment-nanairo li{
	display: inline-block;
	float: left;
}


.treatment-nanairo li a{
	display: inline-block;
	font-size: 1.4em;
	border: 2px solid #036eb8;
	border-radius: 10px;
	background-size: 25% auto;
	height: 60px;
	width: 200px;
	line-height: 20px;
	background-image: url(../img/nayami01.png);
	background-position: left 0px bottom 0px;
	background-repeat: no-repeat;
	background-size: 35% auto;
}


.treatment-nanairo li:nth-child(2) a{background-image: url(../img/nayami01.png);}
.treatment-nanairo li:nth-child(3) a{background-image: url(../img/nayami02.png);}
.treatment-nanairo li:nth-child(4) a{background-image: url(../img/nayami03.png);}
.treatment-nanairo li:nth-child(5) a{background-image: url(../img/nayami04.png);}
.treatment-nanairo li:nth-child(6) a{background-image: url(../img/nayami05.png);}
.treatment-nanairo li:nth-child(7) a{background-image: url(../img/nayami06.png);}
.treatment-nanairo li:nth-child(8) a{background-image: url(../img/nayami07.png);}



.bold-line{
	font-weight: 500;
	color: #0071bb;
}


/* ------------------------- 各施術ページの相談枠*/
.contact-area{
	padding: 0 40px;
}

.contact-area img{
	width: 100%;
}

.contact-area-sp{
	display: none;
}




/* ------------------------- よくある質問*/


.question{
	min-height: 55px;
	font-size: 1.4em;
	font-weight: 500;
	line-height: 180%;
	margin-top: 10px;
	border-bottom: 1px solid #ccc;
	padding: 10px 20px 30px 140px;
	background-image: url(../img/icon-question.png);
	background-repeat: no-repeat;
	background-size: 70px;
	background-position: 40px 5px;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
}

.question:nth-child(1){
	margin-top: 40px;
}

.question:hover{
	color: #036eb8;
	cursor: pointer;
}

.answer{
	min-height: 55px;
	font-size: 1.2em;
	line-height: 180%;
	padding: 5px 0 10px 120px;
	background-image: url(../img/icon-answer.png);
	background-repeat: no-repeat;
	background-size: 70px;
	background-position: 20px 0px;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
}




/* ------------------------- news*/

#news-topimg{
	background-color: #f8f2e3;
}

#news-topimg .wrapper-900{
	display: block;
	width: 900px;
	height: 80px;
	text-align: center;
	padding: 70px 0 10px;
	text-align: left;
}

.news{
	width: 900px;
	margin: 30px auto;
	font-size: 1.2em;
	line-height: 190%;
}


.news h1{
	font-size: 1.5em;
	font-weight: 700;
	border-bottom: 2px solid #036eb8;
	padding-bottom: 10px;
	color: #333;
}

.news h2{
	font-size: 1.2em;
	font-weight: 700;
	margin: 40px 0 10px;
	padding: 0;
	border-bottom: 1px dotted #036eb8;
	padding-bottom: 10px;
	color: #036eb8;
}

.news h2:before{
	content: '●';
	display: inline-block;
	position: relative;
	margin-right: 2px;
}

.news img{
	display: block;
	width: 100%;
	height: auto;
	padding-bottom: 20px;
}


/* ------------------------- contents*/

.m-contents{
	width: 100%;
}

.open-news,
.open-news2:hover{
	opacity: 1.0;
}






.box1{
	position :absolute;
	top: 50%;
	left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	width: 960px;
	height: 420px;
	padding: 40px;
	background-color: rgba(255, 255, 255, 0.9);
	box-shadow: 0px 3px 10px rgba(0,0,0,.3)
	-webkit-filter: drop-shadow(0px 3px 10px rgba(0,0,0,.3));
	filter: drop-shadow(0px 0px 10px rgba(0,0,0,.3));
	overflow-y: auto;
}

.box2{
	position :absolute;
	top: 50%;
	left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	width: 500px;
	height: 320px;
	padding: 40px;
	background-color: rgba(255, 255, 255, 0.9);
	box-shadow: 0px 3px 10px rgba(0,0,0,.3)
	-webkit-filter: drop-shadow(0px 3px 10px rgba(0,0,0,.3));
	filter: drop-shadow(0px 0px 10px rgba(0,0,0,.3));
	overflow-y: auto;
}

.box3{
	position :absolute;
	top: 50%;
	left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	width: 800px;
	height: 370px;
	padding: 40px;
	background-color: rgba(255, 255, 255, 0.9);
	box-shadow: 0px 3px 10px rgba(0,0,0,.3)
	-webkit-filter: drop-shadow(0px 3px 10px rgba(0,0,0,.3));
	filter: drop-shadow(0px 0px 10px rgba(0,0,0,.3));
	overflow-y: auto;
}


.box-buy{
	width: 820px;
	padding: 80px 140px 80px;
	margin: 40px auto;
	background-color:#fff;
}

* html .box-buy{text-align:left;} 
.box-buy:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.box-buy { display: inline-block; }
* html .box-buy { height: 1%; }
.box-buy { display: block; }


.close{
	display:block;
	position: absolute;
	top:40px;
	right:20px;
}

.close img{
	width:50%;
}





/* ---------------------------お問合せ先- contact*/


#contact-wrapper{
	display: block;
	width: 100%;
	margin-top: 80px;
	border-top: 1px solid #999;
}


#contact{
	position: relative;
	display: block;
	width: 1020px;
	padding: 100px 0 30px;
	margin: 0 auto 0px;
}


#contact h1{
	width: 490px;
	font-size: 21px;
	font-weight: bold;
	border-bottom: 3px solid #488a5d;
	padding-bottom: 10px;
	margin-left: 40px;
}

#contact h2{
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 30px;
	margin-left: 40px;
}

#contact-for{
	position: absolute;
	top: 72px;
	left: 570px;
	width: 400px;
	height: 350px;
}

#contact-form{
	font-size: 32px;
	margin-bottom: 25px;
	border-bottom: 1px dotted #999;
	padding-bottom: 5px;
}

#contact-tel{
	font-size: 30px;
	letter-spacing: 0.1em;
}

#contact-form a{
	color: #006e50;
}


#contact-form a:hover{
	opacity: 0.6;
}



#contact-form a::before{
	content: '';
	display: inline-block;
	background-image: url(../img/link-contact.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 1px;
	width: 20px;
	height: 27px;
}



/* ------------------------- footer */
/* フッター */

#footer{
	width: 100%;
	margin: 60px auto 100px;	
	padding-top: 25px 0;
	background-color: #fff;
	border-top: 1px solid #ccc;
}

.footer-l{
	float:left;
	width: calc(50% - 20px);
}

.footer-r{
	float:right;
	width: calc(50% - 20px);
	font-size: 14px;
	text-align: center;
	margin: 30px 0 0 20px;
}

.footer-r img{
	margin-top: 10px;
	width: 100%;
	padding-top: 0px;
}


#f-ci-g{
	float:left;
	margin: 10px 0 0;
}

#f-c-copy-ci{
	display: block;
	font-size: 14px;
	font-weight: 500;
	position: relative;
	letter-spacing: 0.1em;
	top: 20px;
	margin: 0;
}

#f-ci{
	position: relative;
	top: -10px;
	display: block;
	margin: 0;
}

#f-ci img{
	width: 250px;
	height auto;
}



#f-ci img a:hover{
	opacity: 0.6;
}

#f-c-wrapper{
	clear: both;
	margin-top: 32px;
}

#f-c-copy{
	float:left;
    line-height:150%;
	font-size: 16px;
	font-weight: 700;
	margin: 60px 0 0 0;
}

#f-address{
	font-size: 16px;
	margin-bottom:25px;
}


#f-reserve{
	float:left;
	padding: 2px 14px;
	background-color: #000;
	border-radius: 4px;
	font-size: 12px;
	color: #fff;
	margin: 8px 0 0 0px;
}
#f-tel{
	float:left;
	color: #036eb8;
	font-size: 53px;
	font-weight: bold;
	margin: 5px 0 0 10px;
}

#sns{
	clear:both;
}
.sns a{
	width: calc(165px - 36px);
	float: left;
	display: inline-block;
	margin-top: 30px;
	padding: 8px 10px;
	border: 2px solid #ccc;
	border-radius: 5px;
}

.sns a:nth-child(1){
	margin-right: 10px;
}

.sns a:last-child{
	margin-left: 2px;
}


.sns img{
	height:30px;
	margin-right: 10px;
}

.sns-i{
	display: inline-block;
	float: left;
	margin-top: 5px;
}
.sns-f{
	line-height: 140%;
	display: inline-block;
}






#pagetop{
	position: fixed;
	bottom: -60px;
	right: 30px;
}

#pagetop img{
	width: 40px;
}


small{
	float: left;
	margin: 20px 0;
}


#f-nav{
	height: 60px;
	display: block;
	width: 1100px;
	margin:30px auto;
	
}

.cont404{
	margin: 40px 0 20px;
	font-size: 1.4em;
	line-height: 1.8em;
	text-align: center;
}



@media screen and (min-width: 900px) and (max-width: 1024px) {
#f-nav{
	width: calc(100% - 40px);
}

#f-c-copy{
	float:left;
    line-height:150%;
	font-size: 16px;
	font-weight: 700;
	margin: 0px 0 0 0;
}
#f-reserve{
	float:left;
	padding: 2px 14px;
	background-color: #000;
	border-radius: 4px;
	font-size: 12px;
	color: #fff;
	margin: 0px 0 10px 0px;
}
.sns a{
	width: calc(228px - 36px);
	float: left;
	display: inline-block;
	margin-top: 30px;
	padding: 10px;
	border: 2px solid #ccc;
	border-radius: 5px;
}
small{
	clear: both;
	float: left;
	margin: 20px 0 0;
}
#pagetop{
	position: fixed;
	bottom: -60px;
	right: 20px;
}
}



#footer-nav li{
	font-size: 12px;
	float: left;
}

#footer-nav ul li a{
	color: #666;
}
}




@media screen and (min-width: 768px) and (max-width: 899px) {
.bxslider-sp{
	height: 500px !important;
}
.bx-wrapper img {
	display: block;
	width: auto;
	height: 90% !important;
}

#reserve{
	display: inline-block;
	width: 100%;
	height: 160px;
	margin: 0 auto -50px;
	position: relative;
	top: -20px;
	border-bottom: 1px solid #000;
	/*background-image: url(../img/r-staff.png);*/
	background-position: right 10px bottom 10%;
	background-repeat: no-repeat;
	background-size: 25% auto;
}

.infoarea li:nth-child(1){
	display: block;
	float: left;
	width: 200px;
	max-height: 150px;
	min-height: 130px;
	background-image: url("../img/nanairo-orthopedic_clinic_logo.png");
	background-size: 150px auto;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #f8f2e3;
}

.infoarea li:nth-child(2){
	width: 68%;
}




#treatment .wrapper-900{
	background-size: 30% auto;
	background-position: right 20px bottom 100px;
	text-align: left;
}



.mt20{
	height: 200px !important;
}

.open-r{
	float: none;
	width: 80%;
	margin: 0 auto;
}

#hajimemashite .wrapper-1100 p{
	text-align: center;
	margin: 20px auto;
}

#hajimemashite .wrapper-1100 p img{
	display: block;
	width: 80%;
	margin: 0 auto -20px;
}
.map-b .column2-l,
.map-b .column2-r{
	display: block;
	margin: 0px auto;
}

.map-b .column2-l img{
	display: block;
	width: 70%;
	margin: 0 auto;
}

.map-b .column2-r img{
	display: block;
	width: 70%;
	margin: 30px auto 0;
}

#hajime p{
	width: 80%;
	margin: 40px auto;
	text-align: left;
	line-height: 180%;
}
#sign{
	display: block;
	width: 80%;
	margin: 20px auto 20px;
	text-align: right;
}

#staff-tit,
#feature-tit{
	display: block;
	width: 100%;
	margin: 20px auto 10px;
}


#staff-tit img,
#feature-tit img{
	display: block;
	width: 30%;
	margin: 0px auto;
}
.staff .s-name{
	display: block;
	float:right;
	width: 65%;
	margin: 40px 0 5px;
	font-size: 1em;
	font-weight: 500;
}
.feature-head img{
	display: block;
	position: relative;
	bottom: -79px;
	height: 200px;
	margin: 0 auto;
}
.feature-head-tit{
	display: block;
	margin: 0 0 0 10px;
	font-size: 1.1em;
	font-feature-settings: "palt" 1;
	position: relative;
	bottom: 200px;
}
.feature-head-7{
	display: block;
	margin: 10px 10px 0px;
	font-size: 1.1em;
	font-weight: 500;
	position: relative;
	bottom: 200px;
}

.map-c img{
	display: block;
	width: 70%;
	margin: 0 auto;
}

.img80 img{
	display: block;
	width: 80%;
	margin: 40px auto 0;
}

.mt20 h1{padding-top: 30px; !important}
#treatment-topimg .wrapper-1000{background-image: url(../img/treatment.png); background-size: 40% auto;}
#treatment-topimg01.headache .wrapper-1000{background-image: url(../img/topimg01.png); background-size: 30% auto;}
#treatment-topimg01.neck-pain .wrapper-1000{background-image: url(../img/topimg02.png); background-size: 30% auto;}
#treatment-topimg01.stiff-shoulder .wrapper-1000{background-image: url(../img/topimg03.png); background-size: 35% auto;}
#treatment-topimg01.arm-hand-pain .wrapper-1000{background-image: url(../img/topimg04.png); background-size: 35% auto;}
#treatment-topimg01.back-pain .wrapper-1000{background-image: url(../img/topimg05.png); background-size: 34% auto; background-position: right 10px bottom 0px;}
#treatment-topimg01.knee-foot-pain .wrapper-1000{background-image: url(../img/topimg06.png); background-size: 34% auto; height: 150px;}
#treatment-topimg01.insomnia .wrapper-1000{background-image: url(../img/topimg07.png);background-size: 40% auto;}
#treatment-topimg01.dizzy .wrapper-1000{background-image: url(../img/topimg08.png); background-size: 35% auto;}
#treatment-topimg01.traffic-accident .wrapper-1000{background-image: url(../img/topimg09.png); background-position: right 30px bottom 20px; background-size: 35% auto;}
#treatment-topimg01.qa .wrapper-1000{background-image: url(../img/topimg-qa.png); background-size: 30% auto;}


.footer-r{
	float:none;
	width: 100%;
	font-size: 12px;
	font-weight: 500;
	text-align: left;
	margin: 20px auto 0px;
}

.footer-r img{
	display: block;
	margin-top: 10px;
	width: 80%;
	border-top: 0px solid #ccc;
	padding-top: 0px;
	margin: 0px auto 0px;
}


}