@charset "utf-8";


/************************************************************
	共通設定
*************************************************************/
a { -webkit-tap-highlight-color:rgba(0, 0, 0, 0)!important; } 

/*.mm-menu {
    -webkit-overflow-scrolling: auto;
}*/

/************************************************************
	display設定
*************************************************************/
#page nav {
	display: none;
}

	@media all and (min-width: 1000px){
		nav#global ,
		nav#sub ,
		nav#side {
			display: block !important;
		}
		/* mmenu 開閉 非表示 */
		header#mmenu{
			display: none;
		}
		nav.ft-main,
		nav.ft-sub {
			display: block !important;
		}
		.slidemenu-close {
			display: none;
		}
	}
	@media screen and (max-width: 999px){
		nav#side ,
		nav.ft-sub {
			display: block !important;
		}
	}


/********************************************************
	ヘッダー
*********************************************************/

	/********************************************************
		jQuery.mmenu CSS // Mobile
	*********************************************************/
	@media only screen and (max-width: 999px){
		/* 基本設計
		------------------------------------------------------------*/
		/* jquery.mmenu.all.css */	

		/* 開閉メニュー
		------------------------------------------------------------*/
		header#mmenu {
			background: #1C1F87 none repeat scroll 0 0;
			height: 50px;
			position: fixed;
			width: 100%;
			z-index: 100;
		}
		header#mmenu a {
			display: block;
			width: 100%;
			color: #fff;
			text-decoration: none;
		}
		header#mmenu a i {
			padding: 0 0.3em;
			font-size: 1.5em;
			line-height: 50px !important;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			vertical-align: middle !important;
		}
		/* Icon
		------------------------------------------------------------*/
		.mm-navbar-bottom a:before {
			margin-right: 0.4em;
			font-family: FontAwesome;
			font-style: normal;
			font-weight: normal;
			line-height: 1;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			content: "\f07a";
		}

		/* Theme Black 文字色（テーマ上書き）
		------------------------------------------------------------*/
		.mm-menu.mm-theme-black { color: rgba(255, 255, 255, 1) !important;} /* default 0.6 */
		.mm-menu.mm-theme-black .mm-navbar > *, .mm-menu.mm-theme-black .mm-navbar a { color: rgba(255, 255, 255, 1) !important;} /* default 0.4 */
		.mm-menu.mm-theme-black em.mm-counter { color: rgba(255, 255, 255, 1) !important;} /* default 0.4 */
		.mm-menu.mm-theme-black .mm-listview > li .mm-prev::before, .mm-menu.mm-theme-black .mm-listview > li .mm-next::after, .mm-menu.mm-theme-black .mm-listview > li .mm-arrow::after { border-color: rgba(255, 255, 255, 1) !important;} /* default 0.4 */
	}



	/********************************************************
		nav#global
	*********************************************************/
	@media all and (min-width: 1000px){
		/* 基本設計
		------------------------------------------------------------*/
		.sf-menu,
		.sf-menu * {
			margin: 0;
			padding: 0;
			list-style: none;
		}
		.sf-menu > li {
			color:#666666;
			height:60px;
			float: left;
			font-size: 1.3rem;
			font-weight:bold;
			padding: 1rem 0;
			padding: 1.3rem 0 1rem\0;
			text-align: center;
			line-height: 40px;
			cursor:default;
			position:static;
			box-sizing: border-box;
		}
		.sf-menu a {
			display: block;
			position: relative;
		}

		nav#global {
			white-space: nowrap;
			*white-space: normal;
			margin: 0;
			float: left;
			z-index: 60;
		}
		nav#global ul {
			margin: 0 auto;
			width: 600px;
		}
		nav#global ul > li {
			line-height: 19px;
		}
		nav#global ul > li#menu01 {width:135px;}
		nav#global ul > li#menu02 {width:135px;}
		nav#global ul > li#menu03 {width:165px;}
		nav#global ul > li#menu04 {width:165px;}

		nav#global ul > li.active ,
		nav#global ul > li:hover {
			cursor:pointer;
			background: #F9F8F8 none repeat scroll 0 0;
			border-left: 1px solid #E4E7EB;
			border-right: 1px solid #E4E7EB;
			box-sizing: border-box;
		}
		
		/* ナビゲーション
		------------------------------------------------------------*/
		.sf-menu {
		}
		.sf-menu ul {
			/*min-width: 12em;  allow long menu items to determine submenu width */
			*width: 12em; /* no auto sub width for IE7, see white-space comment below */
		}
		.sf-menu li {
			white-space: nowrap; /* no need for Supersubs plugin */
			*white-space: normal; /* ...unless you support IE7 (let it wrap) */
			-webkit-transition: background .2s;
			transition: background .2s;
		}
	
	}	
	@media only screen and (min-width: 769px) and (max-width: 999px) {
		nav#global ul#dropdown {
			width: auto;
		}
		nav#global {
		}
		.sf-menu > li {
			padding: 1rem 3% 1rem 0;
		}
	}
	@media only print {
		nav#global {
			width: 1000px !important;/*★印刷幅★*/
			margin: 0 auto !important;
		}
	}


	/********************************************************
		nav#sub
	*********************************************************/
	nav#sub {
		height: 60px;
		position: absolute;
		right: 0;
		top: 0;
		z-index: 60;
	}
		nav#sub ul li {
			float:left;
			line-height:60px;
			line-height:57px\0;
			padding:0 2rem;
			padding: 0.3rem 2rem 0\0;
			border-left:1px solid #CCC;
		}
		nav#sub ul > li.active ,
		nav#sub ul li:hover {
			background: #F9F8F8 none repeat scroll 0 0;
		}
		nav#sub > ul > li {
			padding: 0 1rem;
			border-left: 1px solid #E4E7EB;
			line-height: 60px;
			height: 60px;
		}
		nav#sub ul li:last-of-type {
			border-right:1px solid #E4E7EB;
		}
			nav#sub > ul > li > span:before {
				content: "";
				padding: 2px 17px;
				background-repeat: no-repeat;
			}
			nav#sub > ul > li:nth-of-type(1) > span:before {
				background-image: url("/images/common/icon-head-company.png")
			}
			nav#sub > ul > li:nth-of-type(2) > span:before {
				background-image: url("/images/common/icon-head-catalog.png");
			}


	/********************************************************
		Mega
	*********************************************************/
	/* 基本（共通項目）設定 */
	#MegaWrapper {
		clear: both;
		margin: 0 auto;
		position: fixed;
		top:0;
		width: 100%;
		z-index: 50;
	}
		#MegaWrapper .Mega {
			background: #F9F8F8 none repeat scroll 0 0;
			font-weight: bold;
			display: block;
			position: absolute;
			top: 40px;
			opacity: 0;
			visibility: hidden;
			width: 100%;
			height:300px;
			transition-property: top,opacity;
			transition: 0.2s linear;
		}
		#MegaWrapper .Mega.active {
			top: 60px;
			opacity: 1;
			visibility: visible;
		}
		#MegaWrapper .Mega .columnC ul.active {
			display:block;
		}
		
		#MegaWrapper .Mega .MegaInner {
			width:1080px;
			margin:0 auto;
		}
			#MegaWrapper .Mega .columnA,
			#MegaWrapper .Mega .columnB,
			#MegaWrapper .Mega .columnC {
				display: block;
				float: left;
				vertical-align: top;
				box-sizing: border-box;
			}
				#MegaWrapper .Mega .columnB ul li ,
				#MegaWrapper .Mega .columnC ul li {
					line-height:4rem;
					height:4rem;
				}
					#MegaWrapper .Mega .columnB ul li a ,
					#MegaWrapper .Mega .columnC ul li a {
						text-decoration: none;
						font-size: 1.4rem;
						width: 100%;
						display: block;
						padding: 0 3rem;
						box-sizing: border-box;
					}
					#MegaWrapper .Mega .columnB ul li a:hover ,
					#MegaWrapper .Mega .columnC ul li a:hover {
						color: #333;
					}
	
		/* columnA */
		#MegaWrapper .Mega .columnA {
			padding: 4rem;
			width: 350px;
			margin-right:10px;
		
		}
			#MegaWrapper .Mega .columnA dt {
				line-height:1.6;
				color:#1A1F85;
				font-size:2rem;
				margin-bottom:4rem;
			}
			#MegaWrapper .Mega .columnA dd {
				font-size:1.4rem;
			}
	
		/* columnB */
		#MegaWrapper .Mega .columnB {
			width: 360px;
			padding: 4rem 0;
			box-sizing: border-box;
		}
				#MegaWrapper .Mega .columnB ul li a:hover {
					background: #E8E8E8 none repeat scroll 0 0;
				}
	
		/* columnC */
		#MegaWrapper .Mega .columnC {
			width: 360px;
			height: 300px;
			background: #E8E8E8 none repeat scroll 0 0;
			padding: 4rem 0;
			box-sizing: border-box;
			position:relative;
		}
			#MegaWrapper .Mega .columnC ul {
				display:none;
				position:absolute;
				width: 100%;
			}
				#MegaWrapper .Mega .columnC ul li a:hover {
					background: #C9D1E0 none repeat scroll 0 0;
				}
				#MegaWrapper .Mega .columnB ul li a.faml,
				#MegaWrapper .Mega .columnC ul li a.faml {
					position:relative;
				}
				#MegaWrapper .Mega .columnB ul li a.faml:after ,
				#MegaWrapper .Mega .columnC ul li a.faml:after {
					position:absolute;
					top:50%;
					right:2rem;
					margin-top:-8px;
					content:"\f105";
					margin-left: 1rem;
				}

			#MegaWrapper .veterinary-menu .columnC ul.MegaChild01 {top:40px}
			#MegaWrapper .veterinary-menu .columnC ul.MegaChild02 {top:80px}
			#MegaWrapper .veterinary-menu .columnC ul.MegaChild03 {top:120px}
			#MegaWrapper .veterinary-menu .columnC ul.MegaChild04 {top:160px}

			#MegaWrapper .pet-biz-menu .columnC ul.MegaChild01 {top:40px}

			#MegaWrapper .pet-owner-menu .columnC ul.MegaChild01 {top:40px}
			#MegaWrapper .pet-owner-menu .columnC ul.MegaChild02 {top:80px}
			#MegaWrapper .pet-owner-menu .columnC ul.MegaChild03 {top:120px}

			#MegaWrapper .medical-menu .columnC ul.MegaChild01 {top:40px}

			#MegaWrapper .company-menu .columnC ul.MegaChild01 {top:80px}
			#MegaWrapper .company-menu .columnC ul.MegaChild02 {top:120px}

		@media only screen and (max-width: 999px){
			#MegaWrapper {
				display:none;
			}
		}

/********************************************************
	サイドバー
*********************************************************/
nav#side {
	margin-bottom:4rem;
}
nav#side > ul > li {
    color: #666666;
    font-size: 13px;
    font-weight: bold;
}
	nav#side > ul > li > span {
		border-top:1px solid #DBDEE3;
		background: #F9F8F8;
		line-height: 20px;
		display: block;
		box-sizing: border-box;
		padding: 2rem;
		padding: 2.3rem 2rem 2rem\0;
		position:relative;
		cursor: pointer;
	}
	nav#side > ul > li:last-of-type > span {
		border-bottom:1px solid #DBDEE3;
	}
	nav#side > ul > li > span:after {
		content:"\f105";
		position: absolute;
		right: 2rem;
		font-size: 2rem;
		top: 50%;
		margin-top: -1rem;
	}
		nav#side > ul > li > ul {
			padding:2rem;
			display: none;
		}
		nav#side > ul > li > ul.active {
			display: block;
			border-top:1px solid #DBDEE3;
		}
		nav#side > ul > li:last-of-type > ul.active {
			border-top:none;
		}
			nav#side > ul > li > ul > li a {
				color: #666666;
				font-size: 13px;
				line-height: 30px;
				cursor: pointer;
				text-decoration:none;
				display: block;
			}
			nav#side > ul > li > ul > li a.current,
			nav#side > ul > li > ul > li a:hover {
				color:#757ABF;
			}
			nav#side > ul > li > ul > li a:before {
				content:"\f138";
				margin-right: 1rem;
				color:#757ABF;
			}

#bnrArea {
	margin-bottom:2rem;
}
#bnrArea img:not(:last-of-type) {
	margin-bottom:2rem;
}

	@media only screen and (min-width: 768px) and (max-width: 999px) {
		nav#side > ul > li > span {
			padding: 2rem 4rem 2rem 1rem;
			position: relative;
		}
			nav#side > ul > li > span  > span {
				display:block;
			}
	}
/************************************************************
	フッター
*************************************************************/

	/* 基本設定
	------------------------------------------------------------*/
	footer {
		border-top:1px solid #CCC;
	}
		footer > div {
		}
			footer > div > div {
				width:1080px;
				margin:0 auto;
			}
		@media only screen and (max-width: 999px){
			footer {
				border-top: 1px solid #ccc;
				margin: 0 auto;
			}
				footer > div > div {
					width:100%;
				}
		}
		@media only screen and (max-width: 767px){
		}

	/* 1段目
	------------------------------------------------------------*/
	footer > div:nth-of-type(1) {
		padding:3rem 0;
		background: #F9F8F8;
	}
			footer > div:nth-of-type(1) > div > div {
				float:right;
			}
				footer > div:nth-of-type(1) > div > div > p {
					font-size: 12px;
					line-height: 75px;
					margin: 0;
				}	
					footer > div:nth-of-type(1) > div > div > p a {
						background: #333 none repeat scroll 0 0;
						color: #fff;
						display: block;
						font-size: 17px;
						font-weight: bold;
						padding: 0 50px 0 20px;
						text-decoration: none;
						position:relative;
					}
						footer > div:nth-of-type(1) > div > div > p a i {
							font-size: 40px;
							position: absolute;
							right: 20px;
							top: 15px;
						}
		@media only screen and (max-width: 999px){
			footer > div:nth-of-type(1) {
				padding: 0;
			}
				footer > div:nth-of-type(1) > div > div {
					float: none;
					text-align: center;
				}
		}
		@media only screen and (max-width: 767px){
			footer > div:nth-of-type(1) {
				display:none;
			}
		}
	
	/* 2段目
	------------------------------------------------------------*/
	footer > div:nth-of-type(2) {
		padding:1rem 0;
	}
		footer > div:nth-of-type(2) > div > img {
			height: 50px;
		}
		footer > div:nth-of-type(2) > div > section {
			float: right;
			width: 65%;
		}
			footer > div:nth-of-type(2) > div > section > h1 {
				display: block;
				float: right;
				line-height: 6rem;
			}
				footer > div:nth-of-type(2) > div > section > h1 img {
				}
			footer > div:nth-of-type(2) > div > section > div {
				display: block;
				float: left;
				padding: 0 1rem;
			}
		@media only screen and (max-width: 999px){

			footer > div:nth-of-type(2) > div > section {
				float: none;
				width: 100%;
			}
				footer > div:nth-of-type(2) > div > section > div {
					float: none;
				}
				footer > div:nth-of-type(2) > div > section > h1 {
					display: block;
					float: none;
					text-align: center;
					line-height: 2rem;
				}
			footer > div:nth-of-type(2) > div > img {
				display: block;
				float: none;
				margin: 0 auto;
				width: 33px;
				height: auto;
			}
		}
	
	/* ナビゲーション（コンテンツ）
	------------------------------------------------------------*/
	nav.ft-main {
		width: 100%;
	}
		nav.ft-main > section {
			float: left;
			width: 25%;
		}
			nav.ft-main > section > h1 {
				font-weight: bold;
				margin-bottom: 10px;
				color: #1D1F86;
				font-weight: bold;
				font-size: 1.4rem;
			}
			nav.ft-main > section > ul {
			}
				nav.ft-main > section > ul > li {
					margin-bottom: 2rem;
				}
					nav.ft-main > section > ul > li a {
						text-decoration: none;
						font-size: 1.3rem;
					}
					nav.ft-main > section > ul > li > a:before {
						content:"\f0da";
						color:#5F7DBA;
						margin-right: 5px;
					}
						nav.ft-main > section > ul > li > ul > li {
							padding-left: 1rem;
							line-height: 1.4;
							font-weight: normal;
						}
						nav.ft-main > section > ul > li > ul > li > a {
						}
							nav.ft-main > section > ul > li > ul > li a:before {
								content:"・";
								margin-right: 5px;
							}
		@media only screen and (max-width: 999px){
			nav.ft-main {
				margin: 0 auto 20px;
				width: 90%;
			}
				nav.ft-main > section {
					border-bottom: 1px dashed #ccc;
					float: none;
					margin-bottom: 10px;
					margin-right: 0;
					padding-bottom: 10px;
					width: 100%;
				}
				nav.ft-main > section:last-of-type {
					border-bottom: none;
					margin-bottom: 0;
					padding-bottom: 0;
				}
					nav.ft-main > section > h1 {
						background: #1D1F86;
						font-weight: bold;
						margin-bottom: 10px;
						padding: 5px;
						text-align: center;
						color: #FFF;
					}
					nav.ft-main > section > ul > li {
						float: left;
						font-weight: bold;
						width: 33%;
					}
		}
		@media only screen and (max-width: 767px){
					nav.ft-main > section > ul > li {
						width: 50%;
					}
		}

	/* ナビゲーション（サブコンテンツ）
	------------------------------------------------------------*/
	nav.ft-sub > ul > li {
		float: left;
		margin-left: 1rem;
		padding-left: 1rem;
		border-left: 1px solid #CCC;
	}
	nav.ft-sub > ul > li:first-of-type {
		border-left: none;
	}
	nav.ft-sub > ul > li a {
		text-decoration: none;
		font-size: 1.3rem;
	}
		@media only screen and (max-width: 999px){
			nav.ft-sub {
				margin-bottom: 0;
				padding: 0 10px;
			}
				nav.ft-sub > ul > li {
					background: #fff none repeat scroll 0 0;
					border: 1px solid #ccc;
					float: left;
					font-size: 10px;
					font-weight: bold;
					margin: 5px;
					padding: 0;
					text-align: center;
					width: 46%;
				}
				nav.ft-sub > ul > li:first-of-type {
					border-left: 1px solid #ccc;
				}
					nav.ft-sub > ul > li a {
						padding: 10px 0;
						display: block;
					}
		}
		@media only screen and (max-width: 399px){
			nav.ft-sub > ul > li {
				width: 100%;
			}
		}


	/* COPYRIGHT
	------------------------------------------------------------*/
	footer small {
		display: block;
		font-size: 1rem;
		letter-spacing: 0;
		text-align: right;
		line-height: 2.5;
	}
	@media only screen and (max-width: 999px){
		footer small {
			text-align: center;
		}
	}
	@media only screen and (max-width: 767px){
		footer small {
			font-size: 8px;
			}
	}
/************************************************************
	PAGE TOP
*************************************************************/
#page-top {
	position: fixed;
	bottom: 1em;
	right: 1em;
	font-size: 90%;
}
	#page-top a {
		border:3px solid #1C1F87;
		display: block;
		line-height: 17px;
		padding: 0.4em 1em;
		opacity: 0.7;
		filter: alpha(opacity=70);
		-moz-opacity:0.7;
		-ms-filter: "alpha( opacity=70 )";
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
		-webkit-box-shadow: 0 0 1px #666; /* for Android2.3 */
		background: #FFF;
		text-decoration: none;
		color: #1C1F87;
		text-align: center;
	}
				#page-top a:before {
					font-family: FontAwesome;
					font-style: normal;
					font-weight: normal;
					line-height: 1;
					-webkit-font-smoothing: antialiased;
					-moz-osx-font-smoothing: grayscale;
					content: "\f106";
				}
		#page-top a:hover {
			color: #fff;
			background: #1C1F87;
			-moz-transition: 0.5s ease-in-out;
			-webkit-transition: 0.5s ease-in-out;
			transition: 0.5s ease-in-out;
			text-decoration: none;
		}
			#page-top a span {
				display: block;
			}

	@media only screen and (max-width: 767px){
		#page-top {
			bottom: 3em;
			right: 0.5em;
			font-size: 100%;
		}
			#page-top a {
				padding: 1em 0.5em;
			}
				#page-top a:before {
					margin-right: 0.2em;
					font-family: FontAwesome;
					font-style: normal;
					font-weight: normal;
					line-height: 1;
					-webkit-font-smoothing: antialiased;
					-moz-osx-font-smoothing: grayscale;
					content: "\f106";
				}
				#page-top a span {
					display: none;
				}
	}

