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

*{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
html{
	/*font-size: calc(100vw / 24);*/
	font-size: 4.2vw;
	font-family: 'メイリオ',Meiryo,'Helvetica',Arial,sans-serif;
	color:#333;
	line-height:180%;
	-ms-text-size-adjust:100%;
	-webkit-text-size-adjust:100%;
}
body{
	margin:0;
}
img {
	border: none;
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}
a{
	text-decoration:none;
	border-bottom:0;
	background-color:transparent;
}
a:hover{
	opacity:0.7;
}

@font-face {
  font-family: "Century Gothic";
  src: url("../font/GOTHIC.TTF") format("truetype");
}

.clearfix::after{
	content:".";
	display:block;
	height:0;
	font-size:0;
	clear:both;
	visibility:hidden
}


/* ヘッダー */
#top-head,.inner{
	width:100%;
	padding:0;
	position:static;
}
#top-head{
	top:0;
	position:fixed;
	margin-top:0;
	line-height:1;
	z-index:999;
	background:#fff;
	box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2);
}
#top-head.fixed{
	padding-top:0;
	background:transparent;
}
#mobile-head{
	width:100%;
	height:56px;
	z-index:999;
	position:relative;
	background:rgba(255,255,255,0.9);
}
#top-head.fixed .logo,#top-head .logo{
	position:absolute;
	width:40%;
	padding: 3% 0 0 2%;
}
#global-nav{position:absolute;top:-500px;background:rgba(0,124,62,0.9);width:100%;text-align:center;padding:5px 0;-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;transition:.5s ease-in-out}
#global-nav ul{list-style:none;position:static;margin:0 auto;padding-left:0;font-size:18px}
#global-nav ul li{float:none;position:static}
#top-head #global-nav ul li a,#top-head.fixed #global-nav ul li a{width:100%;display:block;color:#fff;padding:12px 0}
#nav-toggle:before{content:"MENU";color:#0e8f62;font-size:10px}
#nav-toggle{position:absolute;right:12px;top:7px;width:30px;height:36px;cursor:pointer;z-index:101}
#nav-toggle div{position:relative}
#nav-toggle span{display:block;position:absolute;height:2px;width:100%;background:#0e8f62;left:0;-webkit-transition:.35s ease-in-out;-moz-transition:.35s ease-in-out;transition:.35s ease-in-out}
#nav-toggle span:nth-child(1){top:5px}
#nav-toggle span:nth-child(2){top:12px}
#nav-toggle span:nth-child(3){top:18px}
.open #nav-toggle span:nth-child(1){top:11px;-webkit-transform:rotate(315deg);-moz-transform:rotate(315deg);transform:rotate(315deg)}
.open #nav-toggle span:nth-child(2){top:12px;width:0;left:50%}
.open #nav-toggle span:nth-child(3){top:11px;-webkit-transform:rotate(-315deg);-moz-transform:rotate(-315deg);transform:rotate(-315deg)}
.open #global-nav{-moz-transform:translateY(556px);-webkit-transform:translateY(556px);transform:translateY(556px)}


/* 共通 */
.container{
	max-width: 88%;
	margin:0 auto;
}
.bg_white{
	background: #fff;
}
.bg_green{
	background: #00a251;
}
.pad {
	padding: 8% 5%;
}
.pad_l {
	padding: 10% 0 12%;
}
.white {
	color: #fff;
}
.orange {
	color: #ff9000;
}
.green {
	color: #007c3e;
}
.uline_W {
	border-bottom: 1px solid #fff;
}
.uline_B {
	border-bottom: 1px solid #333;
}
.uline_G {
	border-bottom: 1px solid #007c3e;
}
h2 {
	font-size: 160%;
}
h3 {
	font-size: 120%;
}
h1,h2,h3,h4 {
	font-weight: 800;
	line-height: 180%;
	font-family: 'Noto Sans JP', sans-serif;
}
.pc {
	display: none;
}
.sp {
	display: block;
}
.tab {
	display: none;
}
@media screen and (min-width: 768px){
html{
	font-size: 18px;
}
.container{
	width: 1000px;
	max-width: 1000px;
	margin:0 auto;
}
#top-head{
	top:-100px;
	position:absolute;
	width:100%;
	margin:100px auto 0;
}
#top-head a,#top-head{color:#333;text-decoration:none}
#top-head.fixed{margin-top:0;top:0;position:fixed;background:rgba(255,255,255,.9);transition:top 0.65s ease-in;-webkit-transition:top 0.65s ease-in;-moz-transition:top 0.65s ease-in}
#top-head.fixed .logo{color:#333}
#top-head #global-nav ul li a,#top-head.fixed #global-nav ul li a{color:#333;display:inline}
.inner{padding:20px 15px 10px 15px}
.inner:after{content:"";clear:both;display:block}
#mobile-head {
	width:15%;
	height:3vw;
	background:rgba(255,255,255,0);
}
#top-head.fixed .logo,#top-head .logo{
	position:absolute;
	width:100%;
	padding: 0;
}
#nav-toggle{
	display:none;
}
#global-nav{
	background:rgba(255,255,255,0);
	width:100%;
	text-align:right;
	position:static;
}
#global-nav ul{
	position:absolute;
	right:15px;
	top:26px;
	font-size:14px;
	margin:0;
	padding:0;
}
#global-nav ul li{display:inline;margin:1px 0;float:left;line-height:20px}
#global-nav ul li a{padding:0 0 0 5px}
#global-nav ul li:before{content:"|";color:#ccc;padding:0 5px;float:left}
#global-nav ul li:first-child:before{display:none}
#global-nav ul li:nth-child(n+9):before{display:block}
a[href*="tel:"]{pointer-events:none;cursor:default;text-decoration:none}
	
.pad {
	padding: 5% 5%;
}
.pad_l {
	padding: 70px 0 90px;
}
.mt8 {
	margin-top: 5% !important;
}
h2 {
	font-size: 200%;
}
p:has(+h2) {
	font-size: 150% !important;
}
.pc {
	display: block;
}
.sp {
	display: none;
}
.tab {
	display: none;
}
}
@media screen and (min-width: 768px) and (max-width: 1070px){
	.tab {
		display: block;
	}
	#global-nav ul{
		right:15px;
		top:16px;
	}
	#global-nav ul li:nth-child(n+7):before{display:none}
	#global-nav ul li:nth-child(n+9):before{display:block !important}
	.container{
		width: 90%;
		max-width: 90%;
		margin:0 auto;
	}
	#mobile-head {
		width:20%;
		height:4vw;
	}
}



/* FV */
.fv {
	background: url("../img/01_fv_img_sp.jpg") no-repeat center top;
	background-size: 100% auto;
	margin-top: 56px;
	padding-bottom: 26%;
}
.fv h1, .fv h2{
	font-weight: 900;
}
.fv h2{
	font-size: 180%;
	margin-top: 2%;
}
.fv h3 {
	background: #ff9000;
	color: #fff;
	font-weight: 600;
	width: 90%;
	margin: 2% auto 8%;
	font-size: 140%;
}
.fv p {
	width: 35%;
}
.fv ul {
	margin: 5% 0;
}
.fv ul li {
	background: url("../img/01_fv_check.png") no-repeat left center;
	background-size: auto 1rem;
	padding-left: 1.2rem;
	font-weight: 700;
}
@media screen and (min-width: 768px){
.fv {
	background: url("../img/01_fv_bg_pc.jpg") no-repeat center top;
	background-size: cover;
	margin-top: 70px;
	padding-bottom: 0;
}
	.fv .container {
		background: url("../img/01_fv_img_pc.png") no-repeat 90% 4.5vw;
		background-size: 55% auto;
		position: relative;
	}
	.fv .container .pc_box{
		width: 55%;
		margin-top: 3%;
	}
	.fv h1{
		font-size: 130%;
		line-height: 200%;
	}
.fv h2{
	font-size: 250%;
	margin-top: 4%;
}
.fv h3 {
	width: 90%;
	margin: 4% auto 6%;
	font-size: 140%;
}
.fv p {
	width: 15%;
	position: absolute;
	top: 5vw;
	left: 52%;
}
.fv ul {
	margin: 5% auto;
	width: 70%;
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 120px;
}
.fv ul li {
	background: url("../img/01_fv_check.png") no-repeat left center;
	background-size: auto 1rem;
	padding-left: 1.5rem;
	font-size: 120%;
	line-height: 180%;
	width: 50%;
}
}
@media screen and (min-width: 768px) and (max-width: 1070px){
	.fv .container {
		background: url("../img/01_fv_img_pc.png") no-repeat 90% 5vw;
		background-size: auto 100%;
		position: relative;
	}
	.fv h2{
		font-size: 200%;
		margin-top: 4%;
	}
	.fv ul {
		margin: 5% auto;
		width: 80%;
		padding-bottom: 15%;
	}
	.fv ul li {
		font-size: 100%;
	}
}


/* 固定ボタン */
.buttun a,.buttun02 a{
	opacity:0.9;
	z-index:888;
	color:#fff;
	writing-mode:initial;
	position:fixed;
	width:100%;
	text-align:center;
	right:0;
	padding: 2%;
}
.buttun a{
	background:#ff9000;
	bottom: 11vw;
}
.buttun02 a{
	background:#00a251;
	bottom:0;
}
.buttun a:hover,.buttun02 a:hover{
	opacity:1;
}
@media screen and (min-width: 768px){
.buttun a,.buttun02 a{
	display:block;
	writing-mode:vertical-rl;
	width:auto;
	top:50%;
	height: 460px;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
.buttun a{
	padding: 30px 10px;
	right: 52px;
}
.buttun02 a{
	padding: 30px 10px;
}
}



/* いつでもどこでも */
#every h2 + p {
	margin: 8% 0;
}
.pattern {
	width: 90%;
	margin: 8% auto 0;
}
.pattern h3 {
	border-bottom: 3px solid #00a251;
	
}
.obi {
	background: #00a251;
	padding: 1% 10% 2%;
}
.icon {
	width: 80%;
	margin: 5% auto;
}
.flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#every .flex p {
	width: 47%;
	margin-top: 5%;
}
@media screen and (min-width: 768px){
#every h2 + p {
	margin: 5% 0 0;
}
	#every .every_box {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		width: 800px;
		margin: 0 auto;
	}
.pattern {
	width: 45%;
	margin: 5% auto 0;
}
.obi {
	background: #00a251;
	padding: 1% 10% 2%;
}
.icon {
	width: 800px;
	margin: 0 auto;
}
#every .flex p {
	width: 22%;
	margin-top: 7%;
}
}
@media screen and (min-width: 768px) and (max-width: 1070px){
	#every .every_box {
		width: 90%;
	}
	.icon {
		width: 90%;
	}
}




/* オパールエッセンスGOについて */
#about {
	background: url("../img/03_bg.jpg") no-repeat center top, #eaebed;
	background-size: 200% auto;
}
#about .go {
	position: relative;
	padding: 10% 5% 13%;
	margin-top: 7%;
}
#about .go p {
	font-size: 80%;
	line-height: 160%;
}
#about .go p.text1 {
	top: 6vw;
}
#about .go p.text2 {
	top: 6vw;
	right: 5%;
}
#about .ultra {
	margin: 10% 0;
	padding: 7%;
}
@media screen and (min-width: 768px){
#about h2 + p.font120 {
	font-size: 150% !important;
	line-height: 200%;
}
#about .go {
	position: relative;
	padding: 5% 5% 7%;
	margin-top: 5%;
}
#about .go p.mt25 {
	width: 50%;
	margin: 5% auto 0 !important;
}
#about .go p.text1 {
	top: 4.5vw;
	left: 22%;
}
#about .go p.text2 {
	top: 3vw;
	right: 20%;
}
#about .go p.text3 {
	left: 26%;
}
#about .go + p {
	margin: 5% 0 !important;
}
#about .ultra {
	margin: 5% 0;
	padding: 5% 25%;
}
}
@media screen and (min-width: 768px) and (max-width: 1070px){
#about .go p.text1 {
	left: 15%;
}
#about .go p.text2 {
	top: 3vw;
	right: 10%;
}
}




/* 使用方法 */
#howto .flex {
	width: 100%;
	display: block;
}
#howto .flex p {
	width: 100%;
	margin-top: 0;
}
#howto .howto_box {
	margin-top: 10%;
}
#howto .howto_img {
	position: relative;
}
#howto .howto_img p.number {
	position: absolute;
	top: -0.5rem;
	left: -0.5rem;
	width: 15%;
	text-align: center;
	color: #fff;
	background: #ff9000;
	padding: 1% 0;
	font-family: "Century Gothic";
}
#howto p.howto_text {
	margin-top: 5%;
	position: relative;
	padding-bottom: 12%;
}
#howto p.howto_text:after {
    content: "↓";
    position: absolute;
	left: 0;
    right: 0;
	margin: auto;
    bottom: 0;
	font-size: 200%;
}
#howto p.howto_text.text_last {
	padding-bottom: 0%;
}
#howto p.howto_text.text_last:after {
	display: none;
}
.youtube {
	width: 100%;
  	aspect-ratio: 16 / 9;
	margin: 10% auto 0;
}
.youtube iframe {
	width: 100%;
	height: 100%;
}
@media screen and (min-width: 768px){
#howto .flex {
	display: flex;
	flex-wrap: wrap;
	margin-top: 5%;
}
#howto .howto_box {
	margin-top: 0;
	width: 30%;
	position: relative;
}
#howto .howto_img p.number {
	width: 20%;
}
#howto p.howto_text {
	margin-top: 5%;
	position: relative;
	padding-bottom: 0;
	font-size: 85%;
	line-height: 180%;
}
#howto p.howto_text:after {
    display: none;
}
#howto .howto_box:after {
    content: "→";
    position: absolute;
	top: 25%;
	right: -1.5rem;
	font-size: 100%;
	color: #fff;
}
#howto .flex:nth-of-type(2) {
	justify-content: center;
}
#howto .howto_box.no4 {
	margin-right: 5%;
}
#howto .howto_box.noarrow:after {
    display: none;
}
.youtube {
	width: 70%;
  	aspect-ratio: 16 / 9;
	margin: 7% auto 0;
}
}
@media screen and (min-width: 768px) and (max-width: 1070px){
#howto .howto_img p.number {
	width: 25%;
}
#howto p.howto_text {
	font-size: 1.4vw;
}
}




/* 当院について */
#clinic p.logo {
	width: 50%;
	margin: 0 auto 8%;
}
.blue {
    color: #00a1e8;
}
#clinic .relative {
	margin-top: 10%;
}
#clinic p.text {
	margin-top: 8%;
}
@media screen and (min-width: 768px){
#clinic p.logo {
	width: 25%;
	margin: 0 auto 5%;
}
#clinic .relative {
	margin-top: 5%;
}
#clinic p.text {
	margin-top: 0;
	position: absolute;
}
#clinic p.txt1 {
	width: 40%;
	right: 0;
	top: 5vw;
}
#clinic p.photo1 {
	width: 66%;
}
#clinic p.photo2 {
	text-align: right;
}
#clinic p.photo2 img {
	width: 66%;
}
#clinic p.photo3 {
	position: absolute;
	width: 30%;
	right: 0;
	bottom: 0;
	text-align: right;
}
#clinic p.txt2 {
	width: 28%;
	left: 0;
	top: 5vw;
}
#clinic p.txt2 + p {
	text-align: right;
}
}



/* 価格 */
#price {
	background: #f2f7f4;
}
#price table {
	margin: 5% 0;
}
#price table th {
	background: #00a251;
	text-align: center;
	color: #fff;
	font-weight: 800;
	width: 30%;
	border-bottom: 15px solid #f2f7f4;
	padding: 2% 2% 1%;
}
#price table td {
	padding: 2% 0 0 5%;
}
#price .flex + p {
	text-align: center;
}
@media screen and (min-width: 768px){
#price .flex {
	align-items: flex-start;
}
#price .flex p.img {
	width: 40%;
}
#price table {
	width: 55%;
	margin: 0;
}
}
	
	


/* 3つのメリット */
.merit_box{
	display:block;
	margin-top: 8%;
}
.merit_text{
	padding: 5% 0;
}
.count {
	
}
.merit_text table tr td{
	display:table-cell;
}
.merit_text table tr th {
	padding-right: 0;
	width: 6rem;
	font-style: italic;
	line-height:100%;
	color:#2d8f5e;
	font-size:400%;
	opacity:0.4;
	font-family: "Century Gothic";
}
@media screen and (min-width: 768px){
.merit_box{
	margin-top: 5%;
	padding: 6% 0;
	height: 450px;
}
.merit_box:nth-of-type(1){
	background: url("../img/07_img1.jpg") no-repeat left top;
	background-size: 60% auto;
}
.merit_box:nth-of-type(2){
	background: url("../img/07_img2.jpg") no-repeat right top;
	background-size: 60% auto;
}
.merit_box:nth-of-type(3){
	background: url("../img/07_img3.jpg") no-repeat left top;
	background-size: 60% auto;
}
.merit_text{
	padding: 3%;
	background: rgba(242,247,244,0.9);
	width: 50%;
	margin-left: 50%;
}
.merit_text.no2{
	margin-left: 0;
}
.merit_text table tr th {
	padding-right: 0;
	width: 8vw;
}
}
@media screen and (min-width: 768px) and (max-width: 1070px){
	.merit_box{
		height: 38vw;
	}
	.merit_text table + p {
		font-size: 1.8vw;
		line-height: 180%;
	}
}




/* オンライン処方の流れ */
#step {
	background: #00a251;
 }
.step_box{
	background: #fff;
	width: 100%;
	margin-top: 8%;
}
.step_box h3{
	color: #00a251;
}
.step_text{
	float: left;
	padding: 5% 5% 8%;
	width: 100%;
	background: #fff;
}
.step_text p.info {
	margin-top: 3%;
}
#step .button_style1{
	width:100%;
}
.width20_percent .step_img{
	float: left;
	position: relative;
	height: 240px;
	width: 100%;
}
.width20_percent:nth-of-type(1) .step_img{
	background: url("../img/08_flow1.jpg") no-repeat center top;
	background-size: cover;
}
.width20_percent:nth-of-type(2) .step_img{
	background: url("../img/08_flow2.jpg") no-repeat center top;
	background-size:cover;
}
.width20_percent:nth-of-type(3) .step_img{
	background: url("../img/08_flow3.jpg") no-repeat center top;
	background-size:cover;
}
.width20_percent:nth-of-type(4) .step_img{
	background: url("../img/08_flow4.jpg") no-repeat center top;
	background-size:cover;
}
.width20_percent:nth-of-type(5) .step_img{
	background: url("../img/08_flow5.jpg") no-repeat center top;
	background-size:cover;
}
.width20_percent p.number {
	position: absolute;
	top: -0.5rem;
	left: -0.5rem;
	width: 15%;
	text-align: center;
	color: #fff;
	background: #ff9000;
	padding: 1% 0;
	font-family: "Century Gothic";
}
@media screen and (min-width: 768px){
.width20_percent {
	background: #fff;
	padding: 5%;
	margin-top: 5%;
}
.width20_percent .step_box{
	margin-top: 0;
}
.width20_percent p.number {
	width: 20%;
}
.width20_percent .step_img{
	height: 240px;
	width: 40%;
}
.width20_percent .step_text{
	padding: 0% 0 0 5%;
	width: 60%;
}
.width20_percent .mailarea {
	width: 100% !important;
	margin: 5% auto 0;
}
}




/* まずはアカウント登録に進みましょう */
.banner:nth-child(1){
	float: left;
	width: 100%;
	padding: 10% 5%;
	background: url("../img/09_img1.jpg") no-repeat center top;
	background-size: cover;
}
.banner a{
	position: relative;
}
.banner:nth-child(1) h2{
	font-weight: 500;
	color:#fff;
}
.banner:nth-child(1) p{
	color:#fff;
	margin: 5% 0 0;
}
.banner:nth-child(2), .banner:nth-child(3){
	display: flex;
	float: left;
	height: 180px;
	width: 50%;
}
.banner:nth-child(2) a{
	display: flex;
	background: url("../img/09_arrow.png") no-repeat 95% 95%, url("../img/09_img2.jpg") no-repeat center top;
	background-size: 10% auto, cover;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	color: #fff;
}
.banner:nth-child(2) h2,.banner:nth-child(3) h2{
	text-align: center;
	font-weight: 500;
	font-size: 100%;
	line-height: 150%;
}
.banner:nth-child(3) a{
	display: flex;
	background: url("../img/09_arrow.png") no-repeat 95% 95%, url("../img/09_img3.jpg") no-repeat left top;
	background-size: 10% auto, cover;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	color:#fff;
}
@media screen and (min-width: 768px){
.banner:nth-child(1){
	width: 50%;
	padding: 5%;
	height: 460px;
}
.banner:nth-child(2), .banner:nth-child(3){
	height: 230px;
}
.banner:nth-child(2) a{
	background: url("../img/09_arrow.png") no-repeat 95% 95%, url("../img/09_img2.jpg") no-repeat center top;
	background-size: 5% auto, cover;
}
.banner:nth-child(3) a{
	background: url("../img/09_arrow.png") no-repeat 95% 95%, url("../img/09_img3.jpg") no-repeat left top;
	background-size: 5% auto, cover;
}
}



/* 院長紹介 */
#doctor p.photo {
	width: 60%;
	margin: 8% auto;
}
#doctor p.logo img {
	width: 50%;
	margin: 5% 0;
}
@media screen and (min-width: 768px){
	#doctor .pc_box {
		display: flex;
		margin-top: 5%;
	}
	#doctor p.photo {
		width: 40%;
		margin: 0 5% 0 0;
	}
	#doctor p.logo img {
		width: 40%;
		margin: 8% 0 5%;
	}
}



/* よくある質問 */
#faq {
	background: #f2f7f4;
}
#faq h3{
	font-size: 100%;
	position: relative;
	padding-left: 2.2rem;
	margin-bottom: 2%;
}
#faq h3:before{
	content:"Q.";
	font-size:160%;
	font-family:Helvetica,Arial,"sans-serif";
	color:#007c3e;
	position:absolute;
	left:0;
	top:50%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
#faq p {
	margin-bottom: 5%;
	font-size: 90%;
	position: relative;
	padding-left: 2.2rem;
}
#faq p:before{
	content:"A.";
	font-size:160%;
	font-weight: 900;
	font-family:Helvetica,Arial,"sans-serif";
	color:#ff9000;
	position:absolute;
	left:0;
	top:50%;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
@media screen and (min-width: 768px){
#faq .container {
	width: 900px;
	background: url("../img/01_fv_img_pc.png") no-repeat right 2vw;
	background-size: 55% auto;
	padding-bottom: 3%;
}
	#faq .container .main {
		width: 60%;
	}
}



/* 送料お支払い */
.gray_tbl {
	font-size: 80%;
	border-collapse:collapse;
	padding: 5%;
	width:100%;
	border-left:1px solid #ccc;
	border-top:1px solid #ccc;
}
.gray_tbl th,.gray_tbl td {
	display:block;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	padding: 2% 3%;
	margin:0;
	color:#555;
	line-height: 180%;
}
.gray_tbl th{
	background:#f5f5f5;
}
.gray_tbl thead th{
	text-align:center;
	font-size:110%;
	background:#e5e5e5;
	font-weight: 800;
}
@media screen and (min-width: 768px){
.gray_tbl {
	font-size: 100%;
}
.gray_tbl th,.gray_tbl td {
	padding: 1% 3%;
}
}



/* アカウント登録 */
.mailarea {
	width: 100%;
	margin: 0 auto;
}
#mail h3 + p {
	font-size: 90%;
}
.mailarea p.ttl {
	color:#333;
	font-size:90%;
	text-align: left;
}
input {
	font-size:1rem;
	color:#333;
	padding:0.375rem 1rem;
	width:100%;
}
.button_style1{
	background:#ff9000;
	color:#fff;
	border:none;
	width:70%;
	font-weight: 800;
	font-size: 120%;
	line-height: 250%;
}
.button_style1:hover{
	background:#ffbf6b;
	cursor: pointer;
}
@media screen and (min-width: 768px){
.mailarea {
	width: 70%;
	margin: 0 auto;
}
}



/* 医院アクセス */
#access .flex {
	display: block;
	width: 100%;
	margin-top: 10%;
}
#access .flex p.chiiki {
	background: #00a251;
	text-align: center;
	font-weight: 800;
	color: #fff;
	line-height: 220%;
}
#access .flex p.name {
	background: url("../img/12_icon.png") no-repeat left center;
	background-size: auto 90%;
	padding-left: 2rem;
	font-weight: 800;
	font-size: 110%;
	margin: 5% 0 3%;
}
#access .flex p.train {
	border: 1px solid #333;
	border-radius: 3px;
	line-height: 220%;
	margin: 3% 0 7%;
}
#access .map {
	width: 100%;
  	aspect-ratio: 16 / 9;
}
#access .map iframe {
	width: 100%;
	height: 100%;
}
@media screen and (min-width: 768px){
#access .flex {
	display: flex;
	width: 100%;
	margin-top: 5%;
}
	#access .flex .text {
		width: 45%;
	}
#access .map {
	width: 50%;
  	aspect-ratio: 16 / 9;
}
}




/* フッター */
.footer{
	text-align:center;
	padding: 0 0 8%;
}
.footer .logo {
	width: 50%;
	margin: 0 auto;
}
.footer a{
	color:#00a1e8 !important;
}
.copyright{
	background:#00a251;
	text-align:center;
	color:#fff;
	padding:1% 0;
	font-size: 70%;
	margin-bottom: 22vw;
}
@media screen and (min-width: 768px){
.footer{
	padding: 0 0 3%;
}
.footer .logo {
	width: 20%;
	margin: 0 auto;
}
.copyright{
	margin-bottom: 0;
}
}