@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700&display=swap');
body{
 margin: 0px;
 padding: 0px;
 width: 100%;
 font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 font-size: 15px;
 line-height: 150%;
 text-align: center;
 font-weight: 300;
 color: #333;
 letter-spacing: 0;
 /* font-feature-settings: "palt"; */
 -webkit-text-size-adjust: 100%;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
}
a {
	color:#333;
	text-decoration: none;
 transition: .3s;
}
a:hover{
	text-decoration: none;
}
div#wrap {
	width:100%;
}

/* PC */
.spOnly {
		display: none;
}
#header-nav{
 margin: 0 auto;
	width:960px;
}
#main{
 width: 100%;
 height: 450px;
 background-image: url(../images/bg.jpg);
 background-position: center center;
 background-size: cover;
 background-repeat: no-repeat;
 text-align: center;
 position: relative;
}
#main .main{
 margin: 0 auto;
 width: 960px;
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
}
#main .main img{
 width: 100%;
 height: auto;
}
#main h2{
 margin: 0 auto;
 width: 787px;
 position: absolute;
 top: 48px;
 left: 0;
 right: 0;
 z-index: 1;
}
#main h2 img{
 width: 100%;
 height: auto;
}

#online{
 padding: 0 0 65px;
 width: 100%;
}
#online h3{
 padding: 20px 0;
 width: 100%;
 font-size: 32px;
 line-height: 150%;
 text-align: center;
 font-weight: bold;
 color: #fff;
 background-color: #ff9900;
 position: relative;
}
#online h3 .doctor{
 margin: 0 auto 5px;
 padding: 8px 0;
 width: 308px;
 font-size: 28px;
 line-height: 100%;
 text-align: center;
 font-weight: bold;
 color: #ff9900;
 border-radius: 30px;
 background-color: #fff;
}
#online h3 img{
 margin: auto;
 width: 67px;
 height: auto;
 position: absolute;
 bottom: -32px;
 left: 0;
 right: 0;
}
#online p{
 margin: 0 auto;
 padding: 45px 0 30px;
 width: 100%;
 font-size: 14px;
}
.btBox{
 margin: 0 auto;
 padding: 35px 0 30px;
 width: 960px;
 background-color: #f2f2f2;
}
.btBox .bt{
 margin: 0 auto;
 width: 384px;
 box-shadow: 6px 6px #d0d0d0;
}
.btBox .bt a{
 padding: 22px 0 26px;
 width: 100%;
 font-size: 26px;
 line-height: 100%;
 text-align: center;
 font-weight: bold;
 color: #fff;
 background-color: #eb7400;
 border: 1px solid #eb7400;
 display: block;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 background-image: url(../images/arrow.png);
 background-position: right 30px center;
 background-size: 15px auto;
 background-repeat: no-repeat;
}
.btBox .bt a:hover{
 color: #eb7400;
 background-color: #fff;
 background-image: url(../images/arrow2.png);
 background-position: right 20px center;
}
.btBox p{
 margin: 0 auto;
 padding: 22px 0 0 !important;
 width: 100%;
 font-size: 14px;
}

#consult{
 padding: 65px 0 70px;
 width: 100%;
 background-color: #fff5e5;
}
#consult .fuki{
 margin: 0 auto;
 padding: 0 0 50px;
 width: 100%;
 font-size: 30px;
 text-align: center;
 font-weight: bold;
 background-image: url(../images/fuki.png);
 background-position: center bottom;
 background-size: 480px auto;
 background-repeat: no-repeat;
}
#consult .fuki2{
 margin: 0 auto;
 padding: 25px 0 50px;
 width: 740px;
}
#consult .fuki2 li{
 padding: 10px 0 10px 60px;
 width: 100%;
 font-size: 22px;
 text-align: left;
 font-weight: bold;
 background-image: url(../images/ck.jpg);
 background-position: left center;
 background-size: 38px auto;
 background-repeat: no-repeat;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
}
#consult .special{
 margin: 0 auto;
 padding: 0 0 30px;
 width: 960px;
 background-color: #fff;
}
#consult .special .specialT{
 padding: 18px 0 20px;
 width: 100%;
 font-size: 30px;
 line-height: 100%;
 text-align: center;
 font-weight: bold;
 color: #fff;
 background-color: #ff9900;
}
#consult .special .specialT span{
 font-size: 36px;
 color: #ffff00;
}
#consult .special .spe{
 margin: 0 auto;
 padding: 35px 0 0;
 width: 800px;
}
#consult .special .spe li{
 padding: 15px 0 15px 60px;
 width: 100%;
 font-size: 23px;
 line-height: 150%;
 text-align: left;
 font-weight: bold;
 background-image: url(../images/ck2.png);
 background-position: left top;
 background-size: 38px auto;
 background-repeat: no-repeat;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
}
#consult .special .spe li span{
 font-size: 14px;
}
#consult .special .cap{
 margin: 0 auto;
 padding: 10px 0 20px;
 width: 680px;
 font-size: 14px;
 text-align: left;
}
#consult .special .btBox{
 background-color: #fff;
}

#produce{
 padding: 70px 0 80px;
 width: 100%;
}
#produce .inner{
 margin: 0 auto;
 width: 960px;
 text-align: left;
}
#produce .inner h4{
 margin: 0 auto 40px;
 padding: 0 0 10px;
 font-size: 32px;
 text-align: left;
 font-weight: bold;
 display: inline-block;
 position: relative;
}
#produce .inner h4::after {
	position: absolute;
	bottom: -10px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background-color: #ff9900;
}
#produce .slider{
 margin: 0;
 padding: 0;
	width: 100%;
	height:207px;
}
#produce .slider li{
 width: 140px;
	height: 206px;
}
#produce .slider li.vw{
 width: 207px;
}
#produce .slider li img {
 width: 100%;
 height: auto;
}

#prof{
 padding: 70px 0 80px;
 width: 100%;
 background-color: #f6f6f6;
}
#prof .inner{
 margin: 0 auto;
 width: 960px;
 text-align: left;
}
#prof .inner h4{
 margin: 0 0 40px;
 padding: 0 0 10px;
 font-size: 32px;
 text-align: left;
 font-weight: bold;
 display: inline-block;
 position: relative;
}
#prof .inner h4::after {
	position: absolute;
	bottom: -10px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background-color: #ff9900;
}
#prof .inner .txt{
 margin: 0;
 padding: 0 0 0 150px;
 width: 100%;
 font-size: 16px;
 line-height: 20px;
 text-align: left;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 background-image: url(../images/pref.jpg);
 background-position: left top;
 background-size: 122px auto;
 background-repeat: no-repeat;
}
#prof .inner .txt strong{
 font-size: 20px;
 font-weight: 300;
}

#mov{
 padding: 70px 0 80px;
 width: 100%;
}
#mov .inner{
 margin: 0 auto;
 width: 960px;
 text-align: left;
}
#mov .inner h4{
 margin: 0 auto 40px;
 padding: 0 0 10px;
 font-size: 32px;
 text-align: left;
 font-weight: bold;
 display: inline-block;
 position: relative;
}
#mov .inner h4::after {
	position: absolute;
	bottom: -10px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background-color: #ff9900;
}
#mov iframe{
 margin: 10px auto 20px;
 width: 618px;
 display: block;
}
#mov .btBox{
 margin: 50px auto 0;
}

#faq{
 padding: 70px 0 80px;
 width: 100%;
 background-color: #fdfaf6;
}
#faq .inner{
 margin: 0 auto;
 width: 960px;
 text-align: left;
}
#faq .inner h4{
 margin: 0 auto 40px;
 padding: 0 0 10px;
 font-size: 32px;
 text-align: left;
 font-weight: bold;
 display: inline-block;
 position: relative;
}
#faq .inner h4::after {
	position: absolute;
	bottom: -10px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background-color: #ff9900;
}
#faq .inner dl{
 padding: 0;
	width: 100%;
}
#faq .inner dt{
 padding: 0 0 15px 45px;
 font-size: 18px;
 text-align: left;
 font-weight: bold;
 position: relative;
}
#faq .inner dt div{
 font-size: 28px;
 color: #264dbd;
 position: absolute;
 top: -5px;
 left: 0;
}
#faq .inner dd{
 padding: 0 0 15px 45px;
 font-size: 18px;
 text-align: left;
 font-weight: 300;
 position: relative;
}
#faq .inner dd div{
 font-size: 28px;
 color: #eb7400;
 font-weight: bold;
 position: absolute;
 top: -2px;
 left: 0;
}

#foot{
 padding: 45px 0 30px;
 width: 100%;
}
#foot .comp{
 padding: 95px 0 0;
 width: 100%;
 font-size: 16px;
 text-align: center;
}
#foot .comp a{
 color: #000073;
 text-decoration: underline;
}
#foot .comp a:hover{
 text-decoration: none;
}




/*** IEのみ ***/
@media all and (-ms-high-contrast: none) {

#online h3 img{
	margin: 0 auto;
 width: 67px;
 height: auto;
 position: absolute;
 bottom: 1;
 left: 0;
 right: 0;
}


}




@media screen and (max-width: 780px){
/* SP */
.pcOnly {
		display: none;
}
.spOnly {
		display: block;
}
body{
 font-weight: 400;
}
#header-nav{
 margin: 0 auto;
 width: 90%;
 text-align: left;
}
#header-nav h1{
 float: none;
 width: 60%;
 height: 12vw;
 text-indent: -9999px;
 background-repeat: no-repeat;
 background-position: left center;
 background-image: url(../../common/images/logo.jpg);
 background-size: contain;
}
#header-nav h1 a{
	width:100%;
	height:100%;
	display:block;
	
}
#main{
 margin: 0;
 padding: 0;
 width: 100%;
 height: auto;
 background-image: url(../images/bg.jpg);
 background-position: center center;
 background-size: cover;
 background-repeat: no-repeat;
 text-align: center;
 position: relative;
}
#main .main{
 margin: 0;
 padding: 0;
 width: 100%;
 position: static;
 top: auto;
 left: 0;
 right: 0;
}
#main .main img{
 width: 100%;
 height: auto;
}
#main h2{
 margin: 0 auto;
 width: 82%;
 position: absolute;
 top: 5vw;
 left: 0;
 right: 0;
 z-index: 1;
}
#main h2 img{
 width: 100%;
 height: auto;
}

#online{
 padding: 0 0 10vw;
 width: 100%;
}
#online h3{
 padding: 3.4vw 0;
 width: 100%;
 font-size: 6vw;
 line-height: 150%;
 text-align: center;
 font-weight: bold;
 color: #fff;
 background-color: #ff9900;
 position: relative;
}
#online h3 .doctor{
 margin: 0 auto 1vw;
 padding: 2vw 0;
 width: 55%;
 font-size: 5vw;
 line-height: 100%;
 text-align: center;
 font-weight: bold;
 color: #ff9900;
 border-radius: 30px;
 background-color: #fff;
}
#online h3 img{
 margin: auto;
 width: 67px;
 height: auto;
 position: absolute;
 bottom: -32px;
 left: 0;
 right: 0;
}
#online p{
 margin: 0 auto;
 padding: 38px 0 4vw;
 width: 90%;
 font-size: 3vw;
 line-height: 150%;
}
.btBox{
 margin: 0 auto;
 padding: 5vw 0 5vw;
 width: 100%;
 background-color: #f2f2f2;
}
.btBox .bt{
 margin: 0 auto;
 width: 75%;
 box-shadow: 6px 6px #d0d0d0;
}
.btBox .bt a{
 padding: 5vw 0 5.2vw;
 width: 100%;
 font-size: 5vw;
 line-height: 100%;
 text-align: center;
 font-weight: bold;
 color: #fff;
 background-color: #eb7400;
 border: 1px solid #eb7400;
 display: block;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 background-image: url(../images/arrow.png);
 background-position: right 9% center;
 background-size: 4.6% auto;
 background-repeat: no-repeat;
}
.btBox .bt a:hover{
 color: #eb7400;
 background-color: #fff;
 background-image: url(../images/arrow2.png);
 background-position: right 6% center;
}
.btBox p{
 margin: 0 auto;
 padding: 4vw 0 0 !important;
 width: 100%;
 font-size: 3vw;
 line-height: 150%;
 text-align: left;
}

#consult{
 padding: 10vw 0 12vw;
 width: 100%;
 background-color: #fff5e5;
}
#consult .fuki{
 margin: 0 auto;
 padding: 0 0 9vw;
 width: 85%;
 font-size: 5vw;
 text-align: center;
 font-weight: bold;
 background-image: url(../images/fuki.png);
 background-position: center bottom;
 background-size: 100% auto;
 background-repeat: no-repeat;
}
#consult .fuki2{
 margin: 0 auto;
 padding: 3vw 0 6vw;
 width: 90%;
}
#consult .fuki2 li{
 padding: 0 0 4vw 14%;
 width: 100%;
 font-size: 4vw;
 line-height: 150%;
 text-align: left;
 font-weight: bold;
 background-image: url(../images/ck.jpg);
 background-position: left top 0.6vw;
 background-size: 10% auto;
 background-repeat: no-repeat;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
}
#consult .special{
 margin: 0 auto;
 padding: 0 0 4vw;
 width: 100%;
 background-color: #fff;
}
#consult .special .specialT{
 padding: 2vw 0 3vw;
 width: 100%;
 font-size: 6vw;
 line-height: 150%;
 text-align: center;
 font-weight: bold;
 color: #fff;
 background-color: #ff9900;
}
#consult .special .specialT span{
 font-size: 7vw;
 color: #ffff00;
}
#consult .special .spe{
 margin: 0 auto;
 padding: 5vw 0 0;
 width: 90%;
}
#consult .special .spe li{
 padding: 2vw 0 4vw 14%;
 width: 100%;
 font-size: 4vw;
 line-height: 150%;
 text-align: left;
 font-weight: bold;
 background-image: url(../images/ck2.png);
 background-position: left top;
 background-size: 10% auto;
 background-repeat: no-repeat;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
}
#consult .special .spe li span{
 font-size: 3vw;
}
#consult .special .cap{
 margin: 0 auto;
 padding: 2vw 0 3vw;
 width: 90%;
 font-size: 3.2vw;
 line-height: 150%;
 text-align: left;
}
#consult .special .btBox{
 background-color: #fff;
}
#consult .special .btBox p{
 width: 90%;
}

#produce{
 padding: 10vw 0 10vw;
 width: 100%;
}
#produce .inner{
 margin: 0 auto;
 width: 90%;
 text-align: left;
}
#produce .inner h4{
 margin: 0 auto 8vw;
 padding: 0 0 2vw;
 font-size: 5vw;
 text-align: left;
 font-weight: bold;
 display: inline-block;
 position: relative;
}
#produce .inner h4::after {
	position: absolute;
	bottom: -2vw;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background-color: #ff9900;
}
#produce .slider{
 margin: 0;
 padding: 0;
 width: 100%;
}
#produce .slider li{
 float: left;
 width: 140px;
 height: 206px;
}
#produce .slider li.vw{
 width: 207px;
}
#produce .slider li img {
 width: 100%;
 height: auto;
}

#prof{
 padding: 10vw 0 10vw;
 width: 100%;
 background-color: #f6f6f6;
 background-image: url(../images/pref.jpg);
 background-position: right 8% top 4vw;
 background-size: 22vw auto;
 background-repeat: no-repeat;
}
#prof .inner{
 margin: 0 auto;
 width: 90%;
 text-align: left;
}
#prof .inner h4{
 margin: 0 auto 8vw;
 padding: 0 0 2vw;
 font-size: 5vw;
 text-align: left;
 font-weight: bold;
 display: inline-block;
 position: relative;
}
#prof .inner h4::after {
	position: absolute;
	bottom: -2vw;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background-color: #ff9900;
}
#prof .inner .txt{
 margin: 0 auto;
 padding: 0;
 width: 100%;
 font-size: 3.4vw;
 line-height: 150%;
 text-align: left;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 background-image: none;
}
#prof .inner .txt strong{
 font-size: 4vw;
 font-weight: 400;
}

#mov{
 padding: 10vw 0 10vw;
 width: 100%;
}
#mov .inner{
 margin: 0 auto;
 width: 90%;
 text-align: left;
}
#mov .inner h4{
 margin: 0 auto 6vw;
 padding: 0 0 2vw;
 font-size: 5vw;
 text-align: left;
 font-weight: bold;
 display: inline-block;
 position: relative;
}
#mov .inner h4::after {
	position: absolute;
	bottom: -2vw;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background-color: #ff9900;
}
#mov .youtube{
 margin: 2vw auto 4vw;
 width: 90%;
height: 0;
position: relative;
padding-bottom: 50.5%;
overflow: hidden;
}
#mov .youtube iframe{
 margin: 0;
width: 100%;
height: 100%;
 display: block;
position: absolute;
top: 0;
left: 0;
}
#mov .btBox{
 margin: 50px auto 0;
}
#mov .btBox p{
 width: 90%;
}

#faq{
 padding: 10vw 0 7vw;
 width: 100%;
 background-color: #fdfaf6;
}
#faq .inner{
 margin: 0 auto;
 width: 90%;
 text-align: left;
}
#faq .inner h4{
 margin: 0 auto 8vw;
 padding: 0 0 2vw;
 font-size: 5vw;
 text-align: left;
 font-weight: bold;
 display: inline-block;
 position: relative;
}
#faq .inner h4::after {
	position: absolute;
	bottom: -2vw;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background-color: #ff9900;
}
#faq .inner dl{
 padding: 0 0 3vw;
	width: 100%;
}
#faq .inner dt{
 padding: 0 0 3vw 8%;
 font-size: 3.6vw;
 text-align: left;
 font-weight: bold;
 position: relative;
}
#faq .inner dt div{
 font-size: 6vw;
 color: #264dbd;
 position: absolute;
 top: -5px;
 left: 0;
}
#faq .inner dd{
 padding: 0 0 3vw 8%;
 font-size: 3.4vw;
 text-align: left;
 font-weight: 400;
 position: relative;
}
#faq .inner dd div{
 font-size: 6vw;
 color: #eb7400;
 font-weight: bold;
 position: absolute;
 top: -1px;
 left: 0;
}

#foot{
 padding: 10vw 0 5vw;
 width: 100%;
}
#foot .btBox p{
 width: 90%;
}
#foot .comp{
 padding: 10vw 0 0;
 width: 100%;
 font-size: 3.4vw;
 text-align: center;
}
#foot .comp a{
 color: #000073;
 text-decoration: underline;
}
#foot .comp a:hover{
 text-decoration: none;
}
/* ページトップ */
#page-top {
	position: fixed;
	bottom: 3vw;
	right: 3vw;
	width: 18vw;
	height: 18vw;
}
#page-top img{
 width: 100%;
 height: 100%;
}
#page-top a:hover img{
 opacity: 0.8;
 filter: alpha(opacity=80);
}



}




/* other
---------------------------------------------------------*/
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix { display: inline-table; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */