@charset "utf-8";
/* ----------------------------------------------------------------------
 基本設定
---------------------------------------------------------------------- */
@media only screen and (max-width: 960px){
html {
	overflow-x : hidden;
	 -webkit-overflow-scrolling: touch;
 	scroll-padding-top: 50px;
}
body {
	position: relative;
	left: 0;
	overflow-x : hidden;
	-webkit-overflow-scrolling: touch;
}
.article {
	width: 95%;
	margin: 0 auto;
}
/*　イメージ　*/
img {
	max-width: 100%;
}
img.full {
	width: 100%;
	text-align: center;
}
}
@media only screen and (min-width: 961px) {
* {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 1.4em;
}
html {
	scroll-padding-top: 90px;
}
body {
}
.inner_head {
	position: relative;
}	
section.slider {
	padding: 0 0;
}	
}
/* ----------------------------------------------------------------------
 ヘッダー
---------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
 }
@media only screen and (max-width: 960px){
header {

}
h1.logo {
	text-align: center;
	margin: 0 auto;
	padding-top:0.5em;
}
h1 img {
	width: 230px;
}
}

/*　ナビゲーション　*/
@media only screen and (max-width: 960px) {
nav{
	display: none;
	position: absolute;
	width: 100%;
	top: 0;
	right: 0;
	z-index: 99;
	background-color: #C2E8F5!important;
	}
	header nav ul{
		display: block;
		margin: 0 auto;
		width: 100%;
	}
	header nav ul li{
	text-align: center;
	display: block;
	padding-top: 1em;
	padding-bottom: 1em;
	margin: 0 1%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #fff;
	}
	header nav ul li img {
			display: block;
			width: 40%;
			margin: 0 auto;
		}
	header nav ul li:last-child{
		border: none;
	}
	header nav ul li a{
	display: block;
	color: #333!important;
	}
	/*開閉ボタン*/
	#nav_toggle{
	display: block;
	width: 50px;
	height: 50px;
	position: absolute;
	top: 8px;
	right: 0px;
	z-index: 100;
	}
	#nav_toggle div {
		position: relative;
	}
	#nav_toggle span{
		display: block;
		height: 3px;
		background: #fff;
		position:relative;
		width: 32px;
		left: 4px;
		-webkit-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		transition: 0.5s ease-in-out;	
	}
	#nav_toggle span:nth-child(1){
		top:8px;
	}
	#nav_toggle span:nth-child(2){
		top:16px;
	}
	#nav_toggle span:nth-child(3){
		top:24px;
	}
	/*開閉ボタンopen時*/
	.open #nav_toggle span:nth-child(1) {
			top: 16px;
		   -webkit-transform: rotate(135deg);
			-moz-transform: rotate(135deg);
			transform: rotate(135deg);
		}
		.open #nav_toggle span:nth-child(2) {
			width: 0;
			left: 50%;
		}
		.open #nav_toggle span:nth-child(3) {
			top: 10px;
			-webkit-transform: rotate(-135deg);
			-moz-transform: rotate(-135deg);
			transform: rotate(-135deg);
		}
}
@media only screen and (min-width: 961px) {
#navi {
	position: relative;
	width: 100%;
	background-color: #C2E8F5;
	text-align: center;
	color: #fff;
	padding: 10px 0px;
	margin-bottom: 12vh;
}
#navi:after{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  bottom: -14.9vh;
  left: 50%;
  -webkit-transform : translate(-50%,-50%);
  transform : translate(-50%,-50%);
  border-style: solid;
  border-color: #C2E8F5 transparent transparent transparent;
  border-width: 10vh 49vw 0 49vw;
  z-index: 1;
}
nav {
	color: #FFF;
	width: 80%;
	margin: 0 auto 0;
}
nav ul {
	width: 100%;
	margin: 0px auto 0px;
	position: relative;
	z-index: 999;
	height: 20px;
	padding-top: 20px;
	}
nav ul li.home {
	position: absolute;
	left: 50%;
	-webkit-transform : translate(-50%,-50%);
	transform : translate(-50%,-50%);
	width: 25%;
	top: 50px;
}
nav ul li {
	list-style: none;
	width: 12.5%;
	float: left;
	text-align: center;
}
nav ul li a {
	font-size: 16px;
	text-decoration: none;
	box-sizing: border-box;
}
nav ul li a:hover {
	color: #FFFFFF;
}
.menu_r {
	margin-right: 25%;
}
#nav_toggle{
	display: none;
}
}
/* ----------------------------------------------------------------------
　フッター　
---------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
.inner_f li img {
	width: 80%;
	}
}
@media only screen and (max-width: 960px) {
.pagetop {
    display: none;
    position: fixed;
    bottom: 60px;
    right: 0px;
	filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}
.pagetop a:hover {
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}

/*フッターナビゲージョン*/
footer {
	clear: both;
	text-align: center;
}
.inner_f {
	width: 96%;
	margin: 0px auto;
	padding: 1em 0px;
}
.inner_f li {
	margin-bottom: 30px;
	}
.inner_f li p {
	font-weight: bold;
	margin-bottom: 10px;
	}
	.inner_f li img {
	width: 60%;
	}
	.copy {
	width: 100%;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	font-size: 85%;
	position: fixed;
	bottom: 0;
	background-color: #82CFEA;
	}
	.sp_ftel {
	float: right;
	width: 40%;
	border-left: 1px solid #1B81A3;
	text-align: center;
	}
/*　地図　*/
#gmap {
position: relative;
padding-bottom: 300px;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
#gmap iframe,
#gmap object,
#gmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}
@media only screen and (min-width: 961px) {
.pagetop {
    display: none;
    position: fixed;
    bottom: 200px;
    right: 0;
	z-index: 999;
	}
    
.pagetop a:hover {
	filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}
	footer {
}
	.inner_f {
	width: 96%;
	max-width: 1200px;
	margin: 0px auto;
	padding: 1em 0px;
}
	.inner_f ul{
	position: relative;
	display: flex;
	}
    .inner_f li {
	width: 33.333%;
	padding: 0px 5px;
	}
   .inner_f li img {
	width: 100%;
	}
	.inner_f li p {
	font-weight: bold;
	margin-bottom: 10px;
	}
	.inner_f li div {
	margin-right: 20px;
	display: inline-block;
	vertical-align: top;
	line-height: 2em;
	}
	.inner_f li a {
	color: #333333;
}
	.inner_f li a:hover {
	color: #1B81A3;
	text-decoration: underline;
}
	.copy {
	width: 96%;
	max-width: 1200px;
	margin: 0px auto;
	}
	

	/*　地図　*/
#gmap {
position: relative;
padding-bottom: 450px;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
#gmap iframe,
#gmap object,
#gmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}


/* ----------------------------------------------------------------------
 コンテンツ
---------------------------------------------------------------------- */
/* inner */
@media only screen and (max-width: 960px){
.inner {
	margin-bottom: 1.5em;
	}
.inner_s {
	margin-bottom: 1.5em;
	text-align: center;
}
.inner_m {
	width: 95%;
	margin-right: auto;
	margin-left: auto;
	padding: 3em 0;
	}
	.inner_s p {
	text-align: left;
}
.spin {
	width: 95%;
	margin-left: auto;
	margin-right: auto;
	padding: 1em 1em 5em;
	}
.inner_inn {
	width: 95%;
	margin-right: auto;
	margin-left: auto;
}
}
@media only screen and (min-width: 961px) {
.inner_head {
	position: relative;
}
.inner {
	width: 90%;
	max-width: 1100px;
	margin: 0px auto;
	overflow: hidden;
	vertical-align: top;
	padding: 3em 0;
	background-position: 0% 0%;
}
.inner_m {
	width: 90%;
	max-width: 800px;
	margin: 0px auto;
	overflow: hidden;
	vertical-align: top;	
	padding: 3em 0;
}
.inner_s {
	width: 90%;
	max-width: 600px;
	margin: 0px auto;
	overflow: hidden;
	vertical-align: top;	
	padding: 3em 0;
}
}
/*トップページ*/
@media only screen and (max-width: 960px) {
h1.toph1 {
	text-align: left;
	margin: 0;
	position: absolute;
	left: 5px;
	top: 5px;
	width: 35%;
}
.s_text {
	display: none;
}

.life {
	padding: 2% 5% 8%;
	margin: 30px 0px;
}

.life div p {
	line-height: 1.5em;
	font-size: 0.875rem;
}
.life div p.life1 {
	font-size: 1.0rem;
}
.life div p.life2 {
	font-size: 1.25rem;
}
.service {
    overflow: hidden;
	}
	.service li {
	width: 80%;
	margin: 0px auto 5px;
	text-align: center;
	font-weight: bold;
	font-size: 1.125rem;
	padding: 10px;
	position: relative;
	background-color: #C2E8F5;
	background-position: center bottom 7%;
	background-size: 25%;
	background-repeat: no-repeat;
	height: 150px;
	}
	.service li a {
    position: absolute;
    width: 100%;
    height: 100%;
	top: 0;
    left: 0;
	color: #1B81A3;
	display: block;
	}
	.service li a:hover{
	background-color: rgba(240, 240, 240, 0.5);
	}
	.service li span {
	display: block;
	font-size: 1.0rem;
	font-weight: normal;
	color: #333333;
	margin-bottom: 0.5em;
	margin-top: 0.5em;
}
	.s_situke {
	background-image: url(../image/service1.png);
}
	.s_hotel {
	background-image: url(../image/service2.png);
}
	.s_hoiku {
	background-image: url(../image/service3.png);
}
}
@media only screen and (min-width: 961px) {
h1.toph1 {
	font-weight: normal;
	text-align: left;
	margin: 0;
	position: absolute;
	left: 40px;
	top: 20px;
}
.s_text {
	position: absolute;
	right: 15%;
	bottom: 10%;
}
.life {
	padding: 5% 10% 10%;
	margin-bottom: 50px;
}
.life div p {
	line-height: 1.5em;
	font-size: 1.125rem;
}
.life div p.life1 {
	font-size: 1.25rem;
}
.life div p.life2 {
	font-size: 2.0rem;
}
.service {
	display: flex;
	justify-content: center;
}
.service li {
	width: 30%;
	margin-right: 5%;
	text-align: center;
	height: 310px;
	font-weight: bold;
	font-size: 1.6rem;
	padding: 10px;
	position: relative;
	background-color: #C2E8F5;
	background-position: center bottom 15%;
	background-size: 60%;
	background-repeat: no-repeat;
	}
	.service li a {
    position: absolute;
    width: 100%;
    height: 100%;
	top: 0;
    left: 0;
	color: #1B81A3;
	display: block;
	}
	.service li a:hover{
	background-color: rgba(240, 240, 240, 0.5);
	}
	.service li:last-child {
	margin-right: 0px;
}
	.service li span {
	display: block;
	font-family: "Arial Black", Gadget, sans-serif;
	font-size: 1.0rem;
	font-weight: normal;
	color: #333333;
	margin-bottom: 1em;
	margin-top: 1em;
}
	.s_situke {
	background-image: url(../image/service1.png);
}
	.s_hotel {
	background-image: url(../image/service2.png);
}
	.s_hoiku {
	background-image: url(../image/service3.png);
}
}
/* ----------------------------------------------------------------------
　instagramー　
---------------------------------------------------------------------- */

@media only screen and (max-width: 960px) {
.insta-item {
  width: 150px;
  height: 150px;
  margin: 0.5em;
  overflow: hidden;
}
}
 .insta-card {
  display: block;
  position: relative;
}
 .insta-card img {
  max-width: 100%;
  height: auto;
  display: block;
}
/* ----------------------------------------------------------------------
　facebook 
---------------------------------------------------------------------- */
/* column */
@media only screen and (max-width: 960px) {
.column {
    display:-webkit-box;/*--- Androidブラウザ用 ---*/
    display:-ms-flexbox;/*--- IE10 ---*/
    display:-webkit-flex;/*--- safari（PC）用 ---*/
    display:flex; 
    -ms-flex-wrap:wrap;/*--- IE10用 ---*/
    -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
    flex-wrap:wrap;
}
}
@media only screen and (min-width: 961px) {
.column {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
}
/* column03 */
@media only screen and (max-width: 960px) {
.column03 {
	margin: 15px auto;
	width: 100%;
	text-align: center;
  }
.column03 p {
	text-align: left;
	max-width: 480px;
	margin-left: auto;
	margin-right: auto;
	}
}
@media only screen and (min-width: 961px) {
.column03 {
	margin: 30px 2.5%;
	width: 45%;
  }
.column03 p {
	text-align: left;
	margin: 0em 1em 3em;
	}
}

/* スマホ用 */
@media screen and (max-width: 767px) {
.inner_fb {
	margin-bottom: 1.5em;
	text-align: center;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
	
	.fb-container {
	width: 90%;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
	height: 510px;
	margin-bottom: 30px;
	}
}
 
/* PC用 */
@media screen and (min-width: 768px) {
.inner_fb {
	width: 90%;
	max-width: 600px;
	margin: 0px auto;
	overflow: hidden;
	vertical-align: top;	
	padding: 3em 0;
}
	.fb-container {
		width: 500px;
	margin-left: auto;
	margin-right: auto;
	}
}

@media only screen and (max-width: 960px) {
/*　 テキストサイズ 　*/

header h1 {
	font-size: 0.75rem;
}
header h1 .logo,
header h1 .logo a,
footer .logo {
	font-size: 2rem;
}
footer .tel {
	font-size: 1.75rem;
}
h2 {
	font-size: 1.5rem;
	text-align: center;
	margin-bottom: 1.0em;
}
h3 {
	font-size: 1.25rem;
	text-align: center;
	font-weight: bold;
}
.intro h3 {
	margin-bottom: 0;
}
}

@media only screen and (min-width: 961px) {
/*　テキストサイズ　*/
h2.title {
	margin-bottom: 2em;
	font-size: 1.3rem;
}
h2.bb {
	font-size: 6rem;
	/*margin-bottom: 2em;*/
	margin-left: 0.2em;
	/*text-align: right;*/
	line-height: 0.8em;
}
h2.business {
	width: 5em;
	text-align: right;
	margin-bottom: 2em;
}
h2.company {
	width: 6em;
	text-align: right;
}
h2.business span,
h2.company span {
	font-size: 1.4rem;
	font-weight: bold;
	color: #000;
	display: block;
}
.bg_bgry h2,
.bg_bgry2 h2 {
	font-size: 1.5rem;
	border-bottom: 1px solid #FFF;
}
h3 {font-size: 2rem;}
.intro h3 {
	text-align: center;
	margin-bottom: 0!important;
}
.bg_bgry h3,
.bg_bgry2 h3 {
	border-bottom: 1px dashed #FFF;
}
.bg_w h3 {
	border-bottom: 1px dashed #8F9AA3;
}

}


/************************************
** コンテンツ共通
************************************/
@media only screen and (max-width: 960px) {
.top_toi {
	padding: 3.5em 0;
}
.btn2 {
	font-size: 2rem;
}
.bis_box {
	width: 100%;
	position: relative;
	height: 340px;
}
.koe {
	background-size: contain;
}
.bis_btn {
    position: absolute;
    left: 50%;
    bottom: 1em;
    transform: translateX(-50%)
}
}
@media only screen and (max-width: 600px) {
.bis_box {
	height: 370px;
}
}
@media only screen and (min-width: 961px) {
.top_toi {
	padding: 8em 0;
}
.btn2 {
	width: 60%;
	font-size: 2.5rem;
}
.bis_box {
    float: left;
    width: 50%;
    height: 450px;
    position: relative;
}
.dog_box {
    float: left;
    width: 50%;
    position: relative;
}
.koe {
	background-size: contain;
}
.bis_btn {
    position: absolute;
    left: 50%;
    bottom: 3em;
    transform: translateX(-50%)
}
.baron_box {
    float: left;
    width: 50%;
}

.mp {
	font-size: 1.3rem;
	line-height: 1.75em;
}
}

@media only screen and (max-width: 960px) {
.car {
	right: 10px;
	top: 100px;
	}
}
@media only screen and (max-width: 550px) {
.car {
	right: -15%;
	top: 150px;
	}
.car img {
	width: 50%;
}
}
@media only screen and (min-width: 961px) {
.car {
	right: -15%;
	top: 30%;
	}
.car img {
	width: 70%;
}
}

/* ----------------------------------------------------------------------
 カラムレイアウト
---------------------------------------------------------------------- */
@media only screen and (max-width: 960px) {
.flex_item {
	padding: 1em;
	margin: 1em;
	background:  rgba( 255, 255, 255, 0.6 );
	border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.flexbox .flex_item:first-child {
	width: 95%;
	margin-right: auto;
	margin-left: auto;
}
}

@media only screen and (min-width: 961px) {
.flexbox {
	display: flex;
}
.flexbox_r {
	display: flex;
	flex-direction: row-reverse;
}
.flex_item {
	padding: 1.5em;
	margin: 1.5em;
	background:  rgba( 255, 255, 255, 0.6 );
	border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;

}
.flex_item p {
	text-align: left;
}
.sy_flexbox {
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between; 
}

.system {
	width: 30%;
	padding: 0.5em;
	border: 1px solid #CCC;
	margin-bottom: 1.5em;
}
img.waku {
	border: 5px solid rgba( 255, 255, 255, 0.6 );
}
.inq {
	width: 100%;
	font-size: 1.2rem;
}
.inq_item {
	width: 48%;
	padding: 1em;
	border: 1px solid #CCC;
	margin-bottom: 1.5em;
	line-height: 2em;
}
}

/* ----------------------------------------------------------------------
 下層　コンテンツ
---------------------------------------------------------------------- */
/*　 下層ヘッダー 　*/

@media only screen and (min-width: 961px) {
h1.sub_hi {
	font-style: normal;
	font-size: 0.687rem;
	text-align: right;
}
#navi_sub {
	position: relative;
	width: 100%;
	background-color: #C2E8F5;
	text-align: center;
	color: #fff;
	padding: 10px 0px;
	margin-bottom: 0;
	height: 120px;
}
#navi_sub nav ul {
	padding-top: 50px;
	}
}
@media only screen and (max-width: 960px){
h1.sub_hi {
	font-size: 0.5rem;
}
#navi_sub {
	height: 150px;
	background-image: url(../image/menu_logo.png);
	background-repeat: no-repeat;
	background-position: center 1.05em;
	background-size: 39% auto;
	background-color: #C2E8F5;
	color: #FFFFFF;
	}
}
@media only screen and  (max-width: 767px) {
h1.sub_hi {
	display: none;
}
#navi_sub {
	height: 110px;
	background-image: url(../image/menu_logo.png);
	background-repeat: no-repeat;
	background-position: center 1.05em;
	background-size: 35% auto;
	background-color: #C2E8F5;
	color: #FFFFFF;
}
}
	
/*　 下層ページ タイトル*/


@media only screen and (max-width: 767px){
.sub_title {
	width: 100%;
	object-fit: cover;
	background-repeat: no-repeat;
	position: relative;
	padding-top: 40%;
	background-size: 100% auto;
	}
.tt_about {
	background-image: url(../image/sub/title_about_s.jpg);
	}
.tt_service {
	background-image: url(../image/sub/title_service_s.jpg);
	}	
.tt_price {
	background-image: url(../image/sub/title_price_s.jpg);
	}
.tt_voice {
	background-image: url(../image/sub/title_voice_s.jpg);
	}
.tt_breeding {
	background-image: url(../image/sub/title_breeding_s.jpg);
	}
}

@media only screen and (min-width: 768px) {
.sub_title {
	width: 100%;
	object-fit: cover;
	background-repeat: no-repeat;
	position: relative;
	padding-top: 25%;
	background-size: 100% auto;
	}
.tt_about {
	background-image: url(../image/sub/title_about.jpg);
	}
.tt_service {
	background-image: url(../image/sub/title_service.jpg);
	}
.tt_price {
	background-image: url(../image/sub/title_price.jpg);
	}
.tt_voice {
	background-image: url(../image/sub/title_voice.jpg);
	}
.tt_breeding {
	background-image: url(../image/sub/title_breeding.jpg);
	}
}

/*　 h2.icon 　*/
@media only screen and (max-width: 460px){
h2.icon {
	width: 80%;
	text-indent: 2.5em;
	height: 40px;
	background-size: 70px auto;
	padding-top: 0.5em;
	font-size: 1.25rem;
}
}

@media only screen and (min-width: 461px) {
h2.icon {
	width: 450px;
	text-indent: 80px;
	font-size: 34px;
	height: 50px;
	padding-top: 10px;
	}
	}
/*　 h3.icon 　*/
@media only screen and (max-width: 530px){
h3.icon {
	width: 80%;
	height: 40px;
	background-size: 70px auto;
	padding-top: 40px;
	font-size: 1.25rem;
	background-position: center 0%;
}
}

@media only screen and (min-width: 531px) {
h3.icon {
	text-indent: 80px;
	font-size: 34px;
	height: 50px;
	padding-top: 10px;
	}
.i600 {
	width: 520px;
	font-size: 28px!important;
	}
.i530 {
	width: 530px;
}
.i400 {
	width: 400px;
}
.i200 {
	width: 200px;
}
	}
/*i600*/
@media only screen and (max-width: 767px) {
	i600 {
	width: 600px;
	}
}

/*h3voice*/
@media only screen and (max-width: 767px) {
	h3.voice {
	width: 90%;
	}
}
@media only screen and (min-width: 768px) {
	h3.voice {
	width: 90%;
	max-width: 900px;
	clear: both;
	}
}
/*h4*/
@media only screen and (max-width: 767px) {
	h4 {
	width: 90%;
	}
}
@media only screen and (min-width: 768px) {
	h4 {
	width: 90%;
	max-width: 800px;
	}
}
/*　 omoi 　*/

@media only screen and (min-width: 961px) {
.omoibox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.omoi01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.omoi01 p {
	margin: 0 auto;
	width: 80%;
	padding-top: 1em;
	font-size: 1.25rem;
	max-width: 500px;
}
}
@media only screen and (max-width: 960px){
.omoibox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.omoi01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
	.omoi01 p {
	margin: 0 auto;
	width: 95%;
	padding-top: 2%;
	font-size: 1rem;
}
}
@media only screen and (max-width: 767px){
.omoibox {
    display:-webkit-box;/*--- Androidブラウザ用 ---*/
    display:-ms-flexbox;/*--- IE10 ---*/
    display:-webkit-flex;/*--- safari（PC）用 ---*/
    display:flex; 
    -ms-flex-wrap:wrap;/*--- IE10用 ---*/
    -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
    flex-wrap:wrap;
}
	.o1 {
   order: 1;
}
	.o2 {
   order: 2;
	}
.omoi01 {
	width: 100%;
}
.omoi01 p {
	margin: 0 auto;
	width: 90%;
	padding: 2em 0;
	font-size: 1rem;
}
}
/*料金*/
@media only screen and (max-width: 767px) {
	table.price {
	width: 90%;
	margin: 0px auto 1em;
}
	table.price th,
  table.price td {
	display: block;
  }
}
@media only screen and (min-width: 768px) {
	table.price {
	width: 90%;
	max-width: 800px;
	margin: 0px auto 1.5em;
}
	table.price th,
  table.price td {
	  text-align: left;
	  padding: 1em;
  }
	.ryokin {
	text-align: right!important;
	vertical-align: bottom;
}
}
/*lesson*/
@media only screen and (max-width: 767px) {
.lesson {
	width: 90%;
	text-align: center;
}
	}
@media only screen and (min-width: 768px) {
.lesson {
	width: 90%;
	max-width: 800px;
}
	}

/*ol.flow*/
@media only screen and (max-width: 767px) {
ol.flow {
	width: 90%;
	margin: 0 auto 3em;
	}
ol.flow li {
	line-height: 1.8em;
}
}
@media only screen and (min-width: 768px) {
ol.flow {
	width: 90%;
	max-width: 900px;
	margin: 0 auto 5em;
	}
ol.flow li {
	font-size: 1.25rem;
	line-height: 1.8em;
}
}
/*ul.comp */
@media only screen and (max-width: 767px) {
ul.comp{
	width: 90%;
	margin: 0 auto 3em;
	}
ul.comp li {
	text-align: center;
	margin-bottom: 1em;
}
	
}
@media only screen and (min-width: 768px) {
ul.comp {
	display:flex;
    justify-content: center;
	}
ul.comp li {
	margin: 0px 2% 3em;
}
}
/*Ｑ＆Ａ*/

@media only screen and (max-width: 560px) {
label {
	padding: 0 2em 0 1em;
	 line-height: 2;
}
}
@media only screen and (max-width: 767px) {
.half {
	width: 90%;
	margin: 0 auto 3em;
	}

}
@media only screen and (min-width: 768px) {
.half {
	width: 90%;
	max-width: 924px;
	margin: 0 auto 5em;
	}
}
/*ブリーディング*/
@media only screen and (max-width: 767px) {
	.breeding {
	margin-bottom: 3em;
}	
}
@media only screen and (min-width: 768px) {
.breeding {
	margin-bottom: 5em;
}	
}


/************************************
** デバイス専用
************************************/
@media only screen and (max-width: 767px) {
.img_right {
	float: right;
	margin: 5px;
	}
.img_left {
	float: left;
	margin: 5px;
	}
.w90m700 {
	width: 90%;
	margin: 0 auto 3em;
	}
.w90m800 {
	width: 90%;
	margin: 0 auto 3em;
	}
.w95m1000 {
	width: 90%;
	margin: 0 auto 3em;
	}
.w90m800 img {
	width: 40%;
	}
.w95m1000 img {
	width: 40%;
	}
dl {
	width: 90%;
	margin: 0 auto 3em;
	text-align: left;
	}	
dt {
	color: #1B81A3;
	font-weight: bold;
	background-image: url(../image/sub/icon_born.png);
	background-repeat: no-repeat;
	background-position: left 0%;
	padding-left: 2em;
	font-size: 1.125rem;
	}
dd {
	margin-bottom: 5px;
	}
}
@media only screen and (min-width: 768px) {
.img_right {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
	}
.img_left {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	}
.w90m700 {
	width: 90%;
	max-width: 700px;
	margin: 0 auto 5em;
}
.w90m800 {
	width: 90%;
	max-width: 800px;
	margin: 0 auto 5em;
	}
.w95m1000 {
	width: 95%;
	max-width: 1000px;
	margin: 0 auto 5em;
	}
dl {
	width: 90%;
	max-width: 800px;
	margin: 0 auto 5em;
	text-align: left;
	display: flex;
	flex-wrap: wrap;
	border-bottom: 1px dotted #CCCCCC;
	padding-bottom: 10px;
	}
.pcmt3 {
	margin-top: 3em!important;
}
.pcpb3 {
	padding-bottom: 3em;
}
dt {
	color: #1B81A3;
	font-weight: bold;
	background-image: url(../image/sub/icon_born.png);
	background-repeat: no-repeat;
	background-position: left 0%;
	padding-left: 2em;
	font-size: 1.25rem;
	width: 25%;
  box-sizing: border-box;
	}
dd {
	margin-bottom: 10px;
	width: 75%;
  box-sizing: border-box;
	}
}

@media only screen and (max-width: 960px){
.smp_txt {
	font-size: 95%;
	margin-bottom: 10px;	
}
.smt1 {
	padding-top: 1em;
}
.smtb3 {
	padding-top: 3em;
	padding-bottom: 3em;
}
.smtb_10 {
	padding-top: 10px;
	padding-bottom: 10px;
}
.smmb170 {
	margin-bottom: 170px;	
}
.smmb20 {
	margin-bottom: 2em;	
}
.sp_c {
	margin: 0 auto 10px;
	display: block;
}
.sp_center {
	margin: 0 auto 10px;
	text-align: center;
}
.sp_size90 {
	margin: 0 5%;
}
.sp_f80 {
	font-size: 80%;
}
.nowrap {
	white-space :nowrap;
}
.pc_header,
.pc_img,
.pc_txt,
.side_inq,
.head_r,
.head_l,
#topwrap,
#gnavi,
.head_tel,
.snsarea span,
.fbox2,
#sidenavi,
.pcbr,
.sp_no,
.pc_table
{
	display: none;
}

.space_bottom_ll {
	margin-bottom: 4em!important;
}
.space_bottom_l {
	margin-bottom: 3em!important;
}
.space_bottom_m {
	margin-bottom: 1em;
}
.space_bottom_s {
	margin-bottom: 0.5em;
}
.space_top_b {
	margin-top: 2em;
}
.wid300 {
	width: 300px;
	margin: 0 auto 2em;
}
.wid200 {
	width: 200px;
	margin: 0 auto 2em;
}
.wid150 {
	width: 150px;
	margin: 0 auto;
}

/* 画像サイズ */
img.wid50 {
	width: 50%;
}
img.wid45 {
	width: 45%;
}
img.wid30 {
	width: 30%;
}
img.wid65 {
	width: 65%;
}
.wid50p {
	width: 50px !important;
}
img.wid65 {
	width: 65% !important;
}
img.wid80 {
	width: 80% !important;
}
img.wid95 {
	width: 95% !important;
}

}
@media only screen and (min-width: 961px) {
img.full_pc {
	width: 100%;
	text-align: center;
}
.wid600 {
	width: 600px;
	margin: 0 auto 3em;
}

.wid300 {
	width: 300px;
	margin: 0 auto 3em;
}
.pcwid300 {
	width: 300px;
	margin: 0 auto 1em;
}
.wid200 {
	width: 200px;
	margin: 0 auto 3em;
}
.wid150 {
	width: 150px;
	margin: 0 auto;
}
.smp_tel,
.smp_header,
.smp_txt,
.smp_tt,
.smp_img,
.smp_navi,
.spbt_inq,
#pd_menu,
.pd_icon,
.smpbr,
.smp_table,
.sp_ftel {
	display: none;
}
.pc_left {
	float: left;
}
.pc_right {
	float:right;
}
.pct_left {
	text-align: left;
}
.pct_right {
	text-align: right;
}
.pcmb30 {
	margin-bottom: 30px;
}
.pcml20 {
	margin-left: 20px;
}
.pcml30 {
	margin-left: 30px;
}
.pcml30 {
	margin-left: 30px;
}
.pcml90 {
	margin-left: 90px;
}
.pcmr10 {
	margin-right: 10px;
}
.pcmr20 {
	margin-right: 20px;
}
.pcmr50 {
	margin-right: 50px;
}
.pcpb50 {
	padding-bottom: 50px;
}
.space_bottom_ll {
	margin-bottom: 7em!important;
}
.space_bottom_l {
	margin-bottom: 5em!important;
}
.space_bottom_m {
	margin-bottom: 2.5em;
}
.space_bottom_s {
	margin-bottom: 1em;
}
}
/************************************
** スマートフォン用のメディアクエリ
************************************/
/*767px以下*/
@media only screen and (max-width: 767px) {
}

/************************************
** タブレッド用のメディアクエリ
************************************/
/*960px以下*/
@media only screen and (max-width: 960px){
}

/************************************
** スマートフォン・タブレッド用のメディアクエリ
************************************/
/*960px以下*/
@media only screen and (max-width: 960px){

}
/************************************
** タブレッド・PC用のメディアクエリ
************************************/
/*768px以上*/
@media only screen and (min-width: 768px) {
}

/************************************
** PC用のメディアクエリ
************************************/
/*961px以上*/
@media only screen and (min-width: 961px) {
	
}



