@charset "UTF-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}


/* ベーシックリセット
   ========================================================================== */

/**
 */
body {
	
	/*background-color: #fff;*/
}


ul,
ol {
  padding-left: 0em;
  list-style: none; }

table {
	width: 100%;
	border-collapse: collapse;		/*追加*/
}

th {
  text-align: left; }

a {
  text-decoration: none;
  color: #333; }
  a:focus {
    outline: none; }

img {
  vertical-align: bottom;
}

/*
ul
 {
  margin-top: 0;
  margin-bottom: 0;
  max-height: 99999px; }
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: inherit;
  font-weight: 400;
  line-height: 1.4;
  color: inherit; }


h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
li,
dl,
dt,
dd,
blockquote,
p,
address,
hr,
table,
fieldset,
figure,
pre {
  margin-top: 0;
  margin-bottom: 0;
  max-height: 99999px; }


/* Basic
   ========================================================================== */
/**
 */
*,
*:before,
*:after {
  box-sizing: inherit; }

 html {
	font-size: 62.5%;
	box-sizing: border-box; 
}


body {
	font-family:  "メイリオ", Meiryo, Arial, Helvetica, "MS UI Gothic", "ＭＳ Ｐゴシック", "ヒラギノ角ゴ ProN";
	/*font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Sawarabi Mincho", "HG明朝E", Meiryo, serif;*/
	font-weight: 400;
	font-size: 1.6rem;
	/*letter-spacing: 0.1em;*/
	color:#333;
	background-color:white;
}



/* ------------------------------------------------------------------------------------------------------------------------------
ナビゲーションメニュー
--------------------------------------------------------------------------------------------------------------------------- */
nav {
	/*position: relative;*/
}
/*PC専用*/
@media screen and (min-width: 769px) {
	.header {
		/*display:flex;*/
		/*width:100%;*/
		/*border:1px solid white;*/
		/*margin-bottom:3em;*/
		padding-top:4em;
		background: url("../images/header_bg.png") top center  repeat-x;
		background-size:auto 16%;
		background-color:black;
	}
	
	.header-contents {
		display:flex;
		justify-content: space-between;
		align-items: flex-end;
		width:95%;
		margin:0 auto 1em;
		/*border:1px solid red;*/
	}
	.site-logo{
		width:46%;
	}
	
	.site-address {
		width:20%;
	}


	.header-contents img{
		width:100%;
	}

	.gnavi {
		/*position: relative;*/
		width:100%;
		/*padding:0;*/
		margin-bottom:4em;
		
		background-color: #D71618;
	}
	 .navi {
		display: flex;
		flex-flow: row nowrap;
		/*align-items: center;*/
		/*padding:0.1em 0;*/
		/*padding-left: 6.818%;*/
	}

	.navi .logo {
		margin-right:2.4em;
	}

	.navi_item  {
		flex-basis:14.28%;
		/*margin-right: 48px;*/
		/*margin-right: 1em;*/
		/*position: relative;*/
		font-size: 1.6rem;
		text-align:center;
		/*border:1px solid red;*/
	}

	.navi_item1  {
		background-color: #EB6000;
	}
	.navi_item2  {
		background-color: #FFF100;
	}
	.navi_item3  {
		background-color: #75A215;
	}
	.navi_item4  {
		background-color: #0086AE;
	}
	.navi_item5  {
		background-color: #920783;
	}
	

/*
	.navi_item:nth-child(2)  {
		background-color: #C8BC9C;
	}
	.navi_item:nth-child(n+3):nth-last-child(n+2)  {
		background-color: #96844A;
		border-left:2px solid white;
	}
*/
	.navi_item:nth-child(n+3):nth-last-child(n+2)  {
		border-left:2px solid white;
	}



	.navi_item a {
		color: #fff;
		display: inline-block;
		padding:1em 0;
		/*padding:0.1em 0.3em;
		border-left: 5px solid #000;*/
		/*position: relative;*/
	} 
	.navi_item2  a{
		color: black;
	}
	/*PC非表示メニュー*/
	.navi_item_t  {
		display:none;
	}

	.navi_item a:hover {
		text-decoration:underline;
		/*border-left: 5px solid #864944;*/
	}


	.site-title {
		display:none;
	}

	.nav-button2 {
		 display: none;
	}


}
@media screen and (max-width: 768px) {
	.header {
		width:100%;
		/*padding:2em 0;*/
		background-color: black;
		border-bottom:1px solid #003C00;
		/*margin-bottom:2em;*/		/*スライドショーと隙間が空いてしまう*/
		margin-bottom:0.5em;
	}
	.header-contents {
		display:flex;
		justify-content: space-between;
		align-items: flex-end;
		width:95%;
		margin:0 auto 1em;
		/*border:1px solid red;*/
	}

	.site-logo{
		width:60%;
		padding-top:0.5em;
		padding-left:
		height:50px;
	}

	.site-address {
		display:none;
		width:30%;
	}
	.header-contents img{
		width:100%;
	}


	.site-logo a{
		display:block;
		height:50px;
	}
	.gnavi {
		background-color: #353535;
	}
	.navi {
		display: none;
		width:100%;
		z-index:99;
		height:100vh;
		background-color: #353535;
	}
	
	.navi .logo{
		display:none;
	}
	
	.navi_item a {
		color: #fff;
	} 


	.navi.open {
		display: block;
		 position: absolute;
	}

	.navi.close {
		display: none;
	}

	.navi li {
		margin: 2em;
		border-bottom:1px solid white;
	}
	.navi li a {
		/*color: #fff;*/
		font-size: 18px;
	  }

	/*余分なラインを消す*/
	.navi_item:first-child ,.navi_item:last-child {
		display:none;
	}

	/*
	.top-mainimage{
		margin-bottom:1em;
	}

	.top-mainimage img {
		width:100%;
	}
	*/
}

/* ------------------------------------------------------------------------------------------------------------------------------
タブレット以下、ナビゲーション固定用
--------------------------------------------------------------------------------------------------------------------------- */
 @media screen and (max-width: 768px) {
	.nav-button {
		display: block;
		cursor: pointer;
	}
	.nav-button .open{
		display: fixed;
	}
	.nav-button .close{
		display: block;
	}
	/*メニューボタン*/
	.nav-button,
	.nav-button span {
		display: inline-block;
		transition: all 0.4s;
		box-sizing: border-box;
	}

	.nav-button {
		display:flex;
		/*z-index: 20;*/
		z-index: 999;
		/*position: relative;
		width: 40px;
		height: 36px;*/
		position: absolute;
		top: 18px;
		right: 8px;
		width: 30px;
		height: 20px;
	}

	.nav-button span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 4px;
		/*background-color: #fff;*/
		background: #fff;
		border-radius: 4px;
	}
	.nav-button span:nth-of-type(1) {top: 0;}
	.nav-button span:nth-of-type(2) {top: 10px;}
	.nav-button span:nth-of-type(3) {top: 20px}

	.nav-button.active span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-45deg);
		transform: translateY(10px) rotate(-45deg);
	}
	.nav-button.active span:nth-of-type(2) {
		opacity: 0;
	}
	.nav-button.active span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(45deg);
		transform: translateY(-10px) rotate(45deg);
	}
}

@media screen and (max-width: 768px) {
	.nav-button2 {
		position: absolute;
		top: 18px;
		right: 8px;
		width: 200px;
		height: 20px;
		cursor: pointer;
	}
	.nav-button2 .text-open,.nav-button2 .text-close{
		position: absolute;
		right: 40px;
		display: inline-block;
		color:white;
		/*border:1px solid white;*/
	}
	.nav-button2 .text-close{
		display:none;
	}

	.nav-button2 .text-open.open,.nav-button2 .text-close.open{
		display: inline-block;
		 position: absolute;
	}

	.nav-button2 .text-open.close,.nav-button2 .text-close.close{
		display: none;
	}
	.nav-icon  {
		display: inline-block;
	}
	.nav-icon span {
		position: absolute;
		right: 0;
		width: 30px;
		height: 4px;
		transition: all 0.4s;
		background: #fff;
		border-radius: 4px;
		/*border:1px solid white;*/
	}
	.nav-icon span:nth-of-type(1) {top: 0;}
	.nav-icon span:nth-of-type(2) {top: 10px;}
	.nav-icon span:nth-of-type(3) {top: 20px}

	.nav-icon.active span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-45deg);
		transform: translateY(10px) rotate(-45deg);
	}
	.nav-icon.active span:nth-of-type(2) {
		opacity: 0;
	}
	.nav-icon.active span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(45deg);
		transform: translateY(-10px) rotate(45deg);
	}

}


/* -----------------------------------------------------------------------------


-------------------------------------------------------------------------- */
main {
	/*display:flex;*/
	width:78%;
	margin:0 auto;
	z-index: 1;
	/*font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Sawarabi Mincho", "HG明朝E", Meiryo, serif;*/
}

main p , main ul{
	/*font-size:90%;*/
}

@media screen and (max-width: 768px) {
	main {
		width:90%;
	}
}




/*classにするか要検討*/
section {
	/*margin-bottom:2em;*/
	/*border-bottom:1px solid red;*/
}
section > h2 ,  section   h3 , .largebtn{
	
	padding:0.8em 0;
	text-align:center;
	font-size:1.6em;
	font-weight:600;
	color:white;
	background-color: #FFF100;
}

section > h2 {margin-bottom:3em;}
section   h3{margin-bottom:1em;}

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

@media screen and (max-width: 768px) {
	section > h2 ,  section   h3 , .largebtn {
		padding:0.5em 0;
		margin-bottom:1em;
		font-size:1.4em;
	}
}




/*他のh2要素と調整すること*/
/*
h1 ,h2{
	padding:0.2em 0 0.2em 6%;
	font-size:1.3em;
	color:#fff;
	border-top:1px solid #bdbeba;
	border-bottom:1px solid #618461;
}

h1 {
	margin-top:2em;
	margin-bottom:2em;
}

h2 ,h3{
	background-color: #003C00;
}
*/

@media screen and (max-width: 768px) {
	.pc_br {
		display:none;
	}
}



/* -----------------------------------------------------------------------------
NEWS
  -------------------------------------------------------------------------- */
.news {
	margin-bottom:3em;
}
.news h2{
	position:relative;
	width:60%;
	margin-bottom:1em;
	padding:0.5em;
	color:white;
	font-weight:600;
	background-color:#17902D;
}

.news h2:after{
	content: "";
	position:absolute;
	top:0;
	right:0;
	width:0;
	height:0;
	border-style: solid;
	border-color:transparent #fff #fff  transparent;
	border-width: 40px;
}

.news .item{
	display:flex;
	justify-content: space-between;
	padding:2em;
	border:1px solid #666;
	
}

.news .item .image{
	width:50%;
}
.news .item .image img{
	width:100%;
}

.news .item .comment{
	width:45%;
}
.news .item .date{
	text-align:right;
	margin-bottom:0.5em;
}
.news .item .title{
	color:#666;
	font-size:1.4em;
	font-weight:600;
	margin-bottom:1em;
}
.news .item .text{
	font-size:1.1em;
	line-height:1.3em;
	margin-bottom:1em;
}

@media screen and (max-width: 768px) {
	.news h2{
		width:100%;
		margin-bottom:1.5em;
	}
	.news .item {
		display:block;
	}
	.news .item .image{margin-bottom:0.5em;}
	.news .item .image{width:100%;}
	.news .item .comment{width:100%;}
}


/* -----------------------------------------------------------------------------
営業カレンダー（トップ）
  -------------------------------------------------------------------------- */
.business-calendar {
}

.business-calendar h2 {
	position:relative;
	width:60%;
	margin-bottom:2em;
	padding:0.5em;
	color:white;
	font-weight:600;
	background-color: #2F60AC;
}
.business-calendar h2:after{
	content: "";
	position:absolute;
	top:0;
	right:0;
	width:0;
	height:0;
	border-style: solid;
	border-color:transparent #fff #fff  transparent;
	border-width: 40px;
}

.calendar-content {
	display:flex;
	justify-content: space-between;
	/*align-items: flex-end;*/
	margin:0 auto 1em;
	padding-bottom:2em;
}

.calendar {
	width:48%;
}

.calendar .ym {
	padding:0.5em;
	margin-bottom:0.5em;
	color:white;
	font-weight:600;
	background-color: #968349;
	border-left:15px solid #5A4600;
}

.calendar table {
	/*width: 100%;*/
	border-collapse: separate;	/*collapseがデフォルト値*/
	border: 0;
}
.calendar th {
	text-align:center;
	color:white;
	background-color: #A4A3A4;
}

.calendar td {
	width:14.3%;
	/*vertical-align:top;*/
	text-align: center;
	border: 1px solid #666666;
}

.calendar th.sun {
	background-color:#F78B7C;
}
.calendar th.sat {
	background-color:#66ADCB;
}
.calendar td span{
	font-size:0.8em;
}

.calendar td.dayoff {
	color: #666;
	background-color:#ddd;
}

.calendar-comment{
	padding-bottom:1em;
	margin-bottom:1em;
	font-size:0.9em;
	/*border-bottom:1px solid #333;*/
}

.calendar .tel{
	font-size:1.1em;
	text-align:center;
}

@media screen and (max-width: 768px) {
	.business-calendar h2 {
		width:100%
	}
	.calendar-content {
		display:block;
		margin-bottom:2em;
	}
	.calendar {
		width:90%;
		margin:0 auto 2em;
	}
}
/* -----------------------------------------------------------------------------

 -------------------------------------------------------------------------- */
.aboutus {
	/*font-size:120%;*/
	text-align:center;
	margin-bottom:4em;
}
.aboutus .item{
	margin-bottom:2em;
}
.aboutus h2{
	margin-bottom:0.5em;
	font-size:1.8em;
	font-weight:800;
	/*margin-bottom:2em;*/
}

.aboutus p {
	/*font-size:1.2rem;*/
	line-height:1.6em;
}

.aboutus .aboutus1 {color:#E50012;}
.aboutus .aboutus2 {color:#0068B7;}

.aboutus .image {
	width:60%;
	margin:0 auto 2em;
}

.aboutus .image img{
	width:100%;
}

/* -----------------------------------------------------------------------------
プロモーションビデオ
-------------------------------------------------------------------------- */
.youtube {
	/*display:none;*/
	padding-bottom:2em;
	margin-bottom:2em;
}
.youtubechanel {
	width:60%;
	margin:0 auto;
}

@media screen and (max-width: 768px) {
	.youtubechanel {
		width:80%;
	}
}


.channelname {
	margin-bottom:2em;
}
.thumbnail img{
	width:100%;
	height:auto;
}
.youtube_video {
	position: relative;
	/*width: 45%;*/
	padding-top: 56.25%;
	/*margin-bottom:5em;*/
	margin:0 auto;
}
.youtube_video iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

/* -----------------------------------------------------------------------------
トップ（アクセス）
-------------------------------------------------------------------------- */
.access {
	margin-bottom:3em;
}
.access h2{
	padding-bottom:0.3em;
}
.access-contents {
	display:flex;
	justify-content: space-between;
	padding:0 1em;
	margin-bottom:1em;
	border-left:10px solid black;
}

.access-contents .access-map {
	width:50%;
}

.access-contents .access-contact {
	width:45%;
}
.access-contents .logo{
	width:70%;
	margin-bottom:1em;
}
.access-contents .logo img{
	width:100%;
}

.access .address{
	line-height:1.6em;
	margin-bottom:1em;
}
.access .tel{
	margin-bottom:1em;
}

.access-contact .links{
	display:flex;
	/*justify-content: space-between;*/
	align-items:center;
	margin-bottom:0.5em;
}

.access-contact .links .icon{
	width:10%;
	padding-right:0.5em;
}
.access-contact .links .icon img{
	width:100%;
}
.access-contact .links .link{
	width:90%;
}


.GoogleMap{
	/*display:none;*/
	position: relative;
	width: 100%;
	height: 0;
	padding-top: 56.25%;/*比率をお好みで*/
	margin-bottom:15px;
	/*border:1px solid blue;*/
}
.GoogleMap iframe{
	/*display:none;*/
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 768px) {
	.access {
		margin-bottom:2em;
	}
	.access-contents {
		display:block;
		margin-bottom:2em;
		border:none;
	}
	.access-contents .access-map , .access-contents .access-contact {
		width:95%;
		margin:0 auto 1.5em;
	}
}


/* -----------------------------------------------------------------------------
フッター
-------------------------------------------------------------------------- */
.footer {
	width:100%;
	/*text-align:center;*/
	/*font-size:80%;
	*/
	color:white;
	background-color: black;
}

.footer-contents {
	display:flex;
	justify-content: space-between;
	width:78%;
	margin:0 auto;
	padding-top:3em;
}


.footer-logo {
	width:60%;
	/**/
	padding-bottom:2em;
}
.footer img{
	width:100%;
}

.footer .site-address {
	width:30%;
	/**/
}




.footer .copyright{
	padding:2em 0;
	text-align:center;
	font-weight:600;
}




@media screen and (max-width: 768px) {
	.footer{
	}

	.footer-contents {
		padding-top:1em;
	}
	.footer-logo {
		margin-bottom:0.5em;
	}
	.footer-address {
		margin-left:0;
	}
	.footer-logo {
		width:80%;
		margin:0 auto;
	}
	.footer .copyright{
		padding:0;
		padding-bottom:1em;
	}
}

/* -----------------------------------------------------------------------------
未使用要素
.fullimage-box  {
	position: relative;
}

.fullimage-box img{
	max-width:100%;
}

  -------------------------------------------------------------------------- */


/*通常ページのベースカラー*/
.bgbasecolor {
	background-color: #E4E0C6;
}

.item-revers {
	flex-direction:row-reverse;
}


/* -----------------------------------------------------------------------------
基本メニュー
  -------------------------------------------------------------------------- */
.menu h2{
	color:black;
	background-color: #FFF100;
}
.menu h3{
	background-color: #E52323;
}


.menu .item{
	display:flex;
	justify-content: space-between;
	margin-bottom:3em;
}

.menu .item .text{
	width:45%;
	font-size:1.6em;
	line-height:1.8em;
}

.menu .item .image{
	width:50%;
}

.menu .item img{
	width:100%;
}

.menu .item .text span{
	padding-right:0.5em;
	font-weight:800;
	color: #E52323;
}

.spa {

}

.spa h2{
	background-color: #1771AC;
	margin-bottom:1em;
}
.spa h2 span{
	display:block;
	font-size:0.9em;
	font-weight:400;
}

.spa .item{
	display:flex;
	justify-content: space-between;
	margin-bottom:1em;
}
.spa .item .image{
	width:48%;
}

.spa img{
	width:100%;
}

.spa .comment{
	display:flex;
	/*justify-content: space-between;*/
	margin-bottom:4em;
}

.spa .comment .catcth {
	margin-right:2em;
}

.spa .comment .catcth p{
	padding:0.5em;
	font-size:1.5em;
	font-weight:600;
	color:#E52323;
	border:1px solid #E52323;
}

.spa .comment .description p{
	margin-bottom:0.5em;
	font-size:1.3em;
}
.spa .comment .description h4{
	font-size:1.6em;
	font-weight:600;
	color:#DD1F7C;
}

.caution {
	margin-bottom:3em;
}
.caution h2 {
	color:#F6E645;
	background-color: #2D1E18;
	margin-bottom:1em;
}
.caution h2 span{
	color:white;
	font-size:0.8em;
	font-weight:400;
}

.caution .text{
	font-size:1.2em;
	line-height:1.6em;
}

.caution .text li{
	margin-bottom:0.8em;
}

.linkbtn {
	margin-bottom:4em;
}
.linkbtn .opmenu{
	background-color: #75A215;
}

.linkbtn .opmenu a{
	color:white;
}

@media screen and (max-width: 768px) {
	.menu .item{
		display:block;
	}
	.menu .item .text,.menu .item .image{
		width:100%;
	}
	.menu .item .text{
		font-size:1.4em;
		line-height:1.6em;
	}
	.spa h2{
		text-align:left;
		
	}
	.spa h2 span{
		font-size:0.7em;
	}
	.spa .comment{
		display:block;
	}
	
	.spa .comment .catcth {
		margin:0 0 1em 0;
	}
	.spa .comment .description h4{
		font-size:1.4em;
	}

}




/* -----------------------------------------------------------------------------
オプションメニュー
  -------------------------------------------------------------------------- */
.opmenu h2 , .warmbath h2{
	background-color: #75A215;
}

.opmenu h3{
	text-align:left;
	padding-left:2em;
	background-color: #77AF79;
}

.opmenu .item{
	display:flex;
	justify-content: space-between;
	margin-bottom:3em;
}

.opmenu .item .text{
	width:45%;
	font-size:1.4em;
	line-height:1.6em;
}

.opmenu .item .image{
	width:50%;
}

.opmenu .item img{
	width:100%;
}

.warmbath .item{
	display:flex;
	justify-content: space-between;
	margin-bottom:3em;
}

.warmbath .item .text{
	width:55%;
	font-size:1.4em;
	line-height:1.6em;
}

.warmbath .item .images{
	width:40%;
}

.warmbath .item  .image{
	margin-bottom:1em;
}

.warmbath .item img{
	width:100%;
}

.warmbath .remark {
	padding-top:1.5em;
	font-size:0.8em;
	line-height:1.2em;
}


.structure h3 {
	color: #75A215;
	background-color: white;
}


.structure .items{
	display:flex;
	justify-content: space-between;
	margin-bottom:3em;
}

.structure .item{
	display:block;
	width:30%;
}
.structure .item .text{
	width:100%;
	font-size:1.2em;
	line-height:1.4em;
}


.recommend {
	margin-bottom:4em;
}
.recommend h2 {
	color:white;
	background-color: #941654;
	margin-bottom:1em;
}

.recommend .item{
	display:flex;
	justify-content: space-between;
	margin-bottom:3em;
}
.recommend .item .text{
	width:48%;
	font-size:1.4em;
	font-weight:600;
	line-height:1.6em;
}

.linkbtn .menu{
	background-color: #FFF100;
}

.linkbtn .menu a{
	color:black;
}

@media screen and (max-width: 768px) {
	.opmenu .item , .warmbath .item{
		display:block;
	}
	.opmenu .item .text,.opmenu .item .image , 
	.warmbath .item .text{
		width:100%;
	}
	.warmbath .item .images {
		width:100%;
		display:flex;
		justify-content: space-between;
	}
	.warmbath .item  .image{
		width:48%;
	}

	.opmenu .item .text ,.warmbath .item .text{
		font-size:1.2em;
		line-height:1.4em;
		margin-bottom:1em
	}

	.structure .items{
		display:block;
	}
	.structure .item{
		width:100%;
	}
	.structure .item,.structure .item img ,.recommend .item .text{
		width:100%;
	}
	
	.structure .item .image,.structure .item .text{
		width:80%;
		margin:0 auto;
	}
	.structure .item .image{
		margin-bottom:0.5em;
	}
	
	.recommend .item{
		display:block;
	}

}

/* -----------------------------------------------------------------------------
仔犬販売
  -------------------------------------------------------------------------- */
.puppy {
	margin-bottom:3em;
}

.puppy h2{
	background-color: #0086AE;
}

.puppy h3{
	color:black;
	background-color: white;
}

.puppy .item{
	display:flex;
	justify-content: space-between;
	margin-bottom:3em;
}

.puppy .item .image{
	width:48%;
}

.puppy .item img{
	width:100%;
}

.puppy .comment{
	margin-bottom:1em;
	text-align:center;
	font-size:1.4em;
	line-height:1.6em;
}

.puppy .caption{
	padding-top:0.5em;
	text-align:right;
	font-size:1.2em;
}

.hospital {
	margin-bottom:5em;
}

.hospital h3 {
	padding-bottom:1.2em;
	color:black;
	background-color: white;
	border-bottom:1px solid black;
}

.hospital span{
	margin-right:0.5em;
	padding:0.3em;
	color:white;
	background-color: #F24722;
}

.hospital .comment {
	margin-bottom:2em;
	font-size:1.4em;
	line-height:1.6em;
	text-align:center;
}

.hospital .item{
	display:flex;
	justify-content: space-between;
	margin-bottom:3em;
}

.hospital .item .image {
}

.hospital .item .image picture{
	/*display:block;*/
}

.hospital .item img{
	width:auto;
	height:auto;
	/*object-fit: cover;*/
}
.hospital .item .exterior {
	/*flex-basis:60%;*/
	width:60%;
}

.hospital .item .doctor {
	/*flex-basis:35%;*/
	width:35%;
}



@media screen and (max-width: 768px) {
	.puppy h3{
		font-size:1.2em;
		line-height:1.4em;
	}
	.puppy .comment , .hospital .comment , .puppy .caption{
		font-size:1.1em;
		line-height:1.2em;
	}
}

.linkbtn .home{
	background-color: #EB6000;
}
.linkbtn .home a{
	color:white;
}




/* -----------------------------------------------------------------------------
プライスリスト
  -------------------------------------------------------------------------- */
.pricelist {
	margin-bottom:4em;
}

.pricelist .list{
	margin-bottom:2.5em;
}

.pricelist h2{
	color:white;
	background-color: #920783;
	margin-bottom:1em;
}
.pricelist .salon-menu{
	font-size:2em;
	font-weight:800;
	text-align:center;
}

.list-title {
	position: relative;
}

.pricelist h3{
	position: relative;
	top:10%;
	left:4%;
	z-index: 1;
	margin-bottom:-0.2em;
	color:black;
	background-color: transparent;
	text-align:left;
	/*border:1px solid red;*/
}


.pricelist .circle {
	display: inline-block;
	width: 5em;
	height: 5em;
	border-radius: 50%;
	background-color: #FAEE00;
	position: absolute;
	left: 0;
	top: 0;
	/*transform: translate(50%, -50%);*/
	z-index: 0;
  }
.pricelist .circle2 {
	background-color: #C3DC85;
}

/*-------------------------------------------------------------------
table 
-------------------------------------------------------------------*/
.border-tbl{
	position: relative;
	/*margin-bottom:10px;*/
	/*border-collapse: collapse;*/
	font-size:1.4em;
	font-weight:600;
	border: 2px solid #333;
	background-color: #fff;
	z-index: 2;
}
.border-tbl tbody th,  .border-tbl tbody td {
	padding: 0.5em;
}

.border-tbl tbody th {
	text-align: left;
	background-color:#EDF3FE ;
	border: 2px solid #333;
}
.border-tbl tbody td {
	border: 2px solid #333;
}

/*table色指定*/

.border-tbl tbody tr:nth-child(1) th:nth-child(1){
	color:white;
	background-color:#036EB8;
}

.border-tbl tbody tr:nth-child(1) th:nth-child(2),
.border-tbl tbody tr:nth-child(1) th:nth-child(3) {
	width:25%;
	text-align:center;
	color:white;
	background-color:#E50011;
}

.border-tbl #shampoo {
	color:#FFF100;
}

/*2〜3列目*/
.border-tbl tbody tr td:nth-of-type(2),
.border-tbl tbody tr td:nth-of-type(3) {
	background-color:#FFFBC7;
}

/**/
.discount {
	margin-bottom:4em;
}

.discount .item{
	display:flex;
	justify-content: space-between;
	/*align-items: flex-start;*/
	margin-bottom:1em;
	padding:0.5em 1em;
	font-size:1.6em;
	font-weight:600;
	color:white;
	background-color:#00923A;
	
}

.discount .item .rate {
	color:#FAEE00;
}



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







/* -----------------------------------------------------------------------------
お知らせ
  -------------------------------------------------------------------------- */
/*contentはお知らせしか使っていない*/
.content {
	/*position: relative;*/
	/*width:95%;*/
	/*margin-right:3%;*/
	/*margin:0 auto;*/
	/*border:1px solid red;*/
	/*z-index:3;*/
}

.content  img{
	max-width:100%;		/*ここが全てに適用される*/
}

.infomation {
	display:flex;
	justify-content: space-between;
	/*border:1px solid red;*/
}



.infomation .content {
	width:70%;
	/*border:1px solid red;*/
}

.infomation .sidebar {
	width:22%;
}

.infection_control {
	margin-bottom:3em;
	border-bottom:1px solid #888;
}
.infection_control  .image {
	margin-bottom:1em;
}
.infection_control  .text {
	margin-bottom:1em;
}
.infection_control h2{
	margin-bottom:0.5em;
	font-size:1.3em;
}
.infection_control h2:before{
	content: '';
	display:inline-block;
	width:1.5em; 
	min-height:1.5em;
	margin-right:0.5em;	/*h2との間に隙間を作る*/
	background-image: url("../images/covid19_icon2.png");
	background-size:contain;
	vertical-align: middle;
}

/*

*/
/* ----------------------------------------------------
最新記事
 ------------------------------------------------- */
.infomation .info {

}
.infomation .info .info-header{
	display:flex;
	justify-content: space-between;
	align-items: end;
	margin-bottom:0.5em;
}
.info-header h2{
	font-size:1.3em;
}
.info-header h2:before{
	content: '';
	display:inline-block;
	width:1.5em; 
	min-height:1.5em;
	margin-right:0.5em;	/*h2との間に隙間を作る*/
	background-image: url("../images/info_icon.png");
	background-size:contain;
	vertical-align: middle;
}

.infomation .info .info-header .date{
	font-size:0.9em;
}


.info-data {
	padding:2em;
	margin-bottom:3em;
	background-color: white;
	border:1px solid #aaa;
}

.info-data .info-img {
	margin-bottom:1em;
}
.info-data .info-text .title{
	margin-bottom:1em;
}

.info-list{
	margin-top:5em;
}
.info-list .date{
	margin-bottom:0.5em;
	font-size:0.9em;
	text-align:right;
}

.info-list img{
	width:100%;
}

.info-list .item{
	padding:1em;
	margin-bottom:5em;
	background-color: white;
	border:1px solid #aaa;
}
.info-list .info-img{
	margin-bottom:1em;
}
.info-list .title{
	font-size:0.9em;
}



@media screen and (max-width: 768px) {
	.infomation {
		flex-wrap: wrap;
	}
	.infomation .content ,.infomation .sidebar {
		width:90%;
		margin:0 auto;
		/*border:1px solid red;*/
	}
	.infomation .info .info-header{
		display:block;
	}
	.infomation .info .info-header .date{
		text-align:right;
	}
	.info_element {
		flex-direction: column;
		/*border:1px solid red;*/
		margin:1em auto;
	}
	.info-img {
		width:100%;
		margin:0 auto;
	}
	.info_element p{
		/*margin-right:3em;*/
		flex-basis:80%;
		margin-bottom:2em;
		/*width:50%;*/
		/*border:1px solid red;*/
	}
}


/* -----------------------------------------------------------------------------

  -------------------------------------------------------------------------- */


/* -----------------------------------------------------------------------------
以下、流用
  -------------------------------------------------------------------------- */


/* -----------------------------------------------------------------------------
個別ページ（共通）
  -------------------------------------------------------------------------- */
.article {
	/*font-size:1.8rem;*/
	line-height:1.6em;
	margin-bottom:2em;
}


.article .element{
	width:80%;
	margin:2em auto;
	font-size:1.8rem;
}
.article .element .text{
	margin-bottom:2em;
}

/*flex*/
.article  .fl-element {
	display:flex;
	justify-content: space-between;
	margin-bottom:1.5em;
}


.article  .fl-element .image{
	flex-basis:48%;
	/*border:1px solid white;*/
}

.article  .fl-element .fl-text {
	flex-basis:48%;
}

.article  .fl-element img{
	width:100%;
}

.article  .fl-element video{
	width:100%;
}

.full-image img{
	width:100%;
}

.article .caption{
	padding:0.5em 0;
	font-size:1.5rem;
	text-align:center;
}

.article  .fl-element .w25pct {
	/*width:25%;*/
	flex-basis:25%;
}
.article  .fl-element .w40pct {
	flex-basis:40%;
}
.article  .fl-element .w70pct {
	/*width:25%;*/
	flex-basis:70%;
}

@media screen and (max-width: 768px) {
	.article  .fl-element {
		flex-direction: column;
		margin-bottom:1.5em;
	}
	.article  .fl-element .image{
		margin-bottom:2em;
	}
}


/* ----------------------------------------------
電話番号リンク　iOS対応
  ------------------------------------------- */
.tel-link-none a {
	color:#fff;
	text-decoration:none;
}

/*改行抑制*/
@media screen and (min-width: 769px) {
	.pc-br {
		display:none;
	}
}
@media screen and (max-width: 768px) {
	.sp-br {
		display:none;
}
