@charset "utf-8";

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* *
* *  Basic information:
* *  - CSS guideline: FLOCSS
* *  - Created: 2014-12-22
* *  - Last update: 2014-12-24 by Matsubara
* *
* *  Order of discription:
* *  - Foundation  [ reset / base ]
* *  - Layout [ header / main / sidebar / footer ]
* *  - Object [ component / project / utility ]
* *  	* projectは各ページ個別のCSSに記載
* *  	* utilityはutility.cssに記載
* *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */



/* ==========================================================================
   Foundation  [ reset / base ]
   ========================================================================== */

/* Reset
   ----------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
html{
	overflow-y: scroll;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
input, textarea{
	margin: 0;
	padding: 0;
}
ol, ul{
	list-style:none;
}
table{
	border-collapse: collapse;
	border-spacing:0;
}
caption, th{
	text-align: left;
}
a:focus {
	outline:none;
}
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}
* html .clearfix {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}
.both{
	clear:both;
}


@font-face {
font-family: 'Hina2ndGrade';
src: url('https://www.otsuka.co.jp/decoboco-eye/font/Hina2ndGrade.eot') format('eot'),
	url('https://www.otsuka.co.jp/decoboco-eye/font/Hina2ndGrade.woff') format('woff'),
	url('https://www.otsuka.co.jp/decoboco-eye/font/Hina2ndGrade.ttf') format('truetype');
 font-weight: normal;
 font-style: normal;
}
.font_tsuka {font-family: 'Hina2ndGrade';}

/* Base
   ----------------------------------------------------------------- */
body {
	background: #fafcfd;
	font: 13px/1.231 'メイリオ',Meiryo,Helvetica,Arial,Sans-Serif;
}
a { color: #69c; text-decoration: none; }
img {
	display: block;
}

/* ==========================================================================
   Layout [ header / main / sidebar / footer ]
   ========================================================================== */

/* Header
   ----------------------------------------------------------------- */
header {
	height: auto;
	margin-bottom: 20px;
}
#header a:hover,
#footer a:hover {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
}
/* header上部 */
.header__top {
	width: 100%;
	height: 30px;
	line-height: 30px;
	background-color: #20404f;
}
.header__top__wrap {
	width: 946px;
	height: 30px;
}

/*header下の網ボーダー*/
header:after {
	content: "　";
	display: block;
	background-color: rgba(41,39,39,0);
	background-image:
		-webkit-gradient(linear, left top, right bottom,
			from(rgba(238,238,238,1)),
			color-stop(50%,rgba(238,238,238,1)),
			color-stop(51%,white),
			to(white)),
		-webkit-gradient(linear, left top, right top,
			from(rgba(0,0,0,0)),
			color-stop(50%,rgba(0,0,0,0)),
			color-stop(51%,rgba(0,0,0,0)),
			to(rgba(0,0,0,0)));
	-webkit-background-size:2px 2px,100% 100%;
	background-size:2px 2px,100% 100%;
	background-repeat:repeat,repeat;
	width: 100%;
	height: 5px;
}
@-moz-document url-prefix() {
  header:after {
	content: "";
	display: block;
	background-color: #eeeeee;
	width: 100%;
	height: 10px;
  }
}

/*@media only screen and (max-width: 946px) {
	.header__top {
		text-align: center;
	}
	.header__top__wrap {
		width: 100%;
	}
	.header__top__wrap h2 {
		text-align: center;
		float: none;
	}
	#textsizer {
		display: none;
	}
}
@media only screen and (max-width: 640px) {
	.header__top__wrap h2 {
		font-size: 50%!important;
	}
}*/

/**
 * .header__logo
 */
 .header__logo {
 	width: 100%;
 	border-bottom: 2px dotted #147ec2;
 	padding: 14px 0;
 	background-color: #ffffff;
 }
.header__logo__wrap {
	width: 946px;
	margin: 0 auto;
}
.header__logo__wrap h1 a {
	width: 140px;
}
.header__logo__wrap h1 img {
	width: 140px;
	height: auto;
	margin: 0 auto;
}
/*@media only screen and (max-width: 946px) {
	.header__logo__wrap {
		width: 100%;
	}
}*/


/**
 * #nav
 */
header nav#nav {
	height: 55px;
 	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_bg.png);
	box-sizing: border-box;
}
@media only screen and (max-width: 640px) {
	header nav#nav {
		height: 0;
		border: none;
	}
}
header nav#nav > ul {
	/*width: 946px;*/
	width: 810px;
	display: table;
	box-sizing: border-box;
	table-layout: fixed;
	margin: 0 auto;
}
header nav#nav > ul > li {
	display: table-cell;
	text-align: center;
	position: relative;
}
header nav#nav > ul > li.last a {
	border-right: 1px solid #e4eef8;
}
header nav#nav > ul > li > a {
	height: 55px;
	width: 100%;
	display: inline-block;
	box-sizing: border-box;
	border-left: 1px solid #e4eef8;
	text-indent: -9999px;
}
header nav#nav > ul > li a span {
	display: none;
}
header nav#nav > ul > li a.top {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_top.png);
}
header nav#nav > ul > li a.check {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_check.png);
}
header nav#nav > ul > li a.misunderstanding {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_misunderstanding.png);
}
header nav#nav > ul > li a.symptoms {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_symptoms.png);
}
header nav#nav > ul > li a.inspection {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_inspection.png);
}
header nav#nav > ul > li a.tv {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_tv.png);
}
header nav#nav > ul > li a.top.is-active ,
header nav#nav > ul > li a.top:hover {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_top_on.png);
	height: 60px;
}
header nav#nav > ul > li a.check.is-active ,
header nav#nav > ul > li a.check:hover {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_check_on.png);
	height: 60px;
}
header nav#nav > ul > li a.misunderstanding.is-active ,
header nav#nav > ul > li a.misunderstanding:hover {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_misunderstanding_on.png);
	height: 60px;
}
header nav#nav > ul > li a.symptoms.is-active ,
header nav#nav > ul > li a.symptoms:hover {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_symptoms_on.png);
	height: 60px;
}
header nav#nav > ul > li a.inspection:hover {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_inspection_on.png);
	height: 55px;
}
header nav#nav > ul > li a.inspection.is-active {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_inspection_on.png);
	height: 60px;
}
header nav#nav > ul > li a.tv.is-active ,
header nav#nav > ul > li a.tv:hover {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/nav_tv_on.png);
	height: 60px;
}
header nav#nav > ul > li > ul {
	display: none;
	background-color: #137dc1;
	position: relative;
	z-index: 1000;
	color: #137dc1;
	top: -5px;
}
header nav#nav > ul > li:hover > ul ,
header nav#nav > ul > li a:hover + ul {
	display: block;
	position: relative;
	top: -5px;
}
header nav#nav > ul > li > ul > li  a {
	box-sizing: border-box;
	border-bottom: 1px solid #fff;
	position: relative;
	z-index: 1000;
	width: 100%;
	padding: 20px 0;
}
header nav#nav > ul > li > ul > li:first-child a {
	padding: 12px 0;
}
header nav#nav > ul > li a.is-active + ul {
	box-sizing: boder-box;
	border-bottom: 1px solid #fff;
	position: relative;
	z-index: 1000;
	margin-top: 0;
	margin-bottom: 0;
}
header nav#nav > ul > li > ul a {
	color: #fff;
	padding: 10px 0;
	display: inline-block;
	box-sizing: border-box;
	font-size: 93%;
}
header nav#nav > ul > li > ul a:hover {
	color: #137dc1;
	background-color: #fff;
}
header nav#nav > ul > li > ul a.is-disabled {
	color: #9eafc8;
	background-color: #f6f6f6;
}
header nav#nav > ul > li > ul a.is-disabled:hover {
	color: #9eafc8;
	background-color: #f6f6f6;
	opacity: 1;
	cursor: default;
}
.nav__btn {
	display: none;
}
header nav#nav > ul > li a.sp {
	display: none;
}
#nav_sp {
	display: none;
}

/*@media only screen and (max-width: 946px) {
	header nav#nav ul {
		width: 100%;
	}
	header nav#nav > ul > li a {
		font-size: 85%;
		line-height: 1.5;
	}
}*/
/*@media only screen and (max-width: 640px) {
	.nav__btn {
		position: absolute;
		top: 23px;
		display: block;
		padding: 16px 20px;
		color: #007dc5;
		font-size: 300%;
		-webkit-transition: .1s linear;
	}
	.nav__btn:hover {
		cursor: pointer;
		opacity: 0.5;
		filter: alpha(opacity=50);
		-ms-filter: "alpha(opacity=50)";
		-moz-opacity:0.5;
		-khtml-opacity: 0.5;
	}
	body header nav#nav {
		display: none;
	}
	#nav_sp {
		display: block;
		height: 3000px;
		background-color: #007dc5;
		position: absolute;
		width: 100%;
		z-index: 1000;
		opacity: 1;
		filter: alpha(opacity=100);
		-ms-filter: "alpha(opacity=100)";
		-moz-opacity:1;
		-khtml-opacity: 1;
		padding: 20px;
		box-sizing: border-box;
	}
	#nav_sp.togmenu {
		display: none;
	}
	section h1 {
	    background-color: #007dc5;
	    border-bottom: solid 1px #ffffff;
	    color: #FFF;
	    cursor: pointer;
	    position: relative;
	    font-size: 85%;
	    font-weight: bold;
		-webkit-transition: .1s;
	}
	section h1 a {
		color: #fff;
		font-weight: bold;
		display: block;
	    padding: 18px 15px;
	}
	section h1.is-active ,
	section h1.is-active a ,
	section h1:hover a ,
	section h1:hover {
		-webkit-transition: .1s;
		background-color: #fff;
		color: #007dc5;
		opacity: 1;
		filter: alpha(opacity=100);
		-ms-filter: "alpha(opacity=100)";
		-moz-opacity:1;
		-khtml-opacity: 1;
	}
	.accordion_ul li:first-child section h1 {
		border-top: 1px solid #fff;
	}
	section h1.parent {
	    padding: 18px 15px;
	}

	section li {
	    font-size: 85%;
	    border-bottom: solid 1px #fff;
	}
	section li.is-active ,
	section li.is-active a {
		background-color: #fff;
		color: #007dc5;
	}

	section li a {
	    position: relative;
	    display: block;
	    color: #fff;
	    padding: 12px 0 12px 40px;
	}
	section li:hover {
		color: #007dc5;
	    background-color: #fff;
	}
	section li:hover a {
		color: #007dc5;
	    opacity: 1;
		filter: alpha(opacity=100);
		-ms-filter: "alpha(opacity=100)";
		-moz-opacity:1;
		-khtml-opacity: 1;
	}
	section h1.parent:hover ,
	section li.disabled:hover a {
		color: #fff;
		cursor: default;
		background-color: #007dc5;
		pointer-events: none;
	}

}*/
/* Main
   ----------------------------------------------------------------- */
#container {
	width: 946px;
	margin: 0 auto;
}
/*@media only screen and (max-width: 946px) {
	#container {
		width: 96%;
	}
}
@media only screen and (max-width: 640px) {
	#container {
		width: 100%;
		margin-right: 0px;
	}
}*/

#main {
	width: 700px;
	float: left;
}
h3 {
	display: table;
	margin: 0 auto;
	margin-top: 15px;
	text-align: center;
}
h3 img {
	display: table-cell;
	text-align: center;
	margin: 0 auto;
}
h3:after {
	content: "　";
	display: block;
	width: 700px;
	height: 0px;
	margin-bottom: 30px;
	border-bottom: 2px dotted #137dc1;
}
.main__content {
	width: 700px;
	overflow: hidden;
}
.main__content p {
	line-height: 2;
}
h3 span {
	content: "　";
	line-height: 2px;
	margin-top: 40px;
	width: 100%;
	border-top: 2px dotted #137dc1;
	margin-left: 2px;
	width: 100%;
	display: block;
}
h4 {
	clear: both;
	margin-top: 50px;
	margin-bottom: 20px;
	padding-bottom: 20px;
	color: #007dc5;
	font-weight: bold;
	border-bottom: 1px solid #137dc1;
}
/*@media only screen and (max-width: 946px) {
	#main {
		width: 100%;
		margin-left: 10px;
	}
	h3 {
		display: block;
		text-align: center;
		margin-right: 250px;
	}
	h3::after {
		width: 100%;
		margin-right: 250px;
	}
	.main__content {
		width: 100%;
	}
	.main__content p ,
	.main__content h4 {
		margin-right: 250px;
	}
}
@media only screen and (max-width: 640px) {
	#main {
		width: 100%;
		margin-left: 0;
		box-sizing: border-box;
	}
	h3 {
		display: block;
		text-align: center;
		margin-right: 0px;
		box-sizing: border-box;
		overflow: hidden;
	}
	h3 img {
		width: 80%;
	}
	h3::after {
		width: 100%;
		margin-right: 0px;
		box-sizing: border-box;
	}
	h3 span {
		content: "";
		line-height: 2px;
		margin-top: 40px;
		width: 100%;
		border-top: 2px dotted #137dc1;
		margin-left: 2px;
		width: 100%;
		display: block;
	}
	h4 {
		clear: both;
		bo-sizing: border-box;
		margin-top: 30px;
		margin-bottom: 20px;
		padding-bottom: 20px;
		color: #007dc5;
		font-weight: bold;
		text-align: center;
		line-height: 1.5;
	}
	.main__content {
		width: 100%;
		box-sizing: border-box;
		padding: 0 15px;
	}
	.main__content p ,
	.main__content h4 {
		margin-right: 0px;
		padding: 0;
		box-sizing: border-box;
	}
}*/

/* Sidebar
   ----------------------------------------------------------------- */

#sidebar {
	width: 220px;
	float: right;
	box-sizing: border-box;
	border-radius: 10px;
	background-color: #e1e9f5;
	padding: 5px;
}
#sidebar li {
	height: 80px;
	line-height: 80px;
	text-align: center;
}
#sidebar a {
	display: block;
	color: #137dc1;
	line-height: 80px;
	height: 80px;
	box-sizing: borderbox;
}
#sidebar a.is-active ,
#sidebar a:hover {
	border: 4px solid #3791cb;
	background-color: #137dc1;
	height: 80px;
	line-height: 72px;
	box-sizing: border-box;
	color: #ffffff;
	opacity: 1.0
}
#sidebar li:first-child a.is-active ,
#sidebar li:first-child a:hover {
	border-radius: 8px 8px 0 0 ;
}
#sidebar li:last-child a.is-active ,
#sidebar li:last-child a:hover {
	border-radius:  0  0 8px 8px ;
}
/*@media only screen and (max-width: 946px) {
	#sidebar {
		width: 220px;
		margin-left: -300px;
		margin-right: 10px;
	}
}
@media only screen and (max-width: 640px) {
	#sidebar {
		display: none;
	}
}
*/
/* Footer
   ----------------------------------------------------------------- */

/**
 * toTop
 */
 .toTop {
 	clear: both;
 	float: right;
 	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/toTop.png);
 	width: 25px;
 	height: 25px;
 	text-indent: -9999px;
 }
 .toTop a {
 	width: 25px;
 	height: 25px;
 	display: block;
 }
/* @media only screen and (max-width: 946px) {
	.toTop {
		margin-right: 20px;
	}
}*/

/* @media only screen and (max-width: 946px) {
 	.footerBanner ul {
 		width: 500px;
 		margin: 0 auto;
 	}
	.footerBanner li {
		float: left;
		margin-right: 60px;
		margin-top: 20px;
	}
	.footerBanner li:nth-child(3) {
		clear: both;
	}
	.footerBanner li:nth-child(2) {
		margin-right: 0px;
	}
}
@media only screen and (max-width: 640px) {
 	.footerBanner ul {
 		width: 90%;
 		margin: 0 auto;
 	}
	.footerBanner li {
		width: 47%;
		float: left;
		margin-right: 6%;
		margin-top: 20px;
	}
	.footerBanner li img {
		width: 100%;
	}
	.footerBanner li:nth-child(3) {
		clear: both;
	}
	.footerBanner li:nth-child(2) {
		margin-right: 0px;
	}
}*/

#footer {
	width: 100%;
	overflow: hidden;
	border-top: 1px solid #ddd;
	margin-top: 40px;
}
.footer__logo {
	width: 100%;
	height: 70px;
	padding: 15px;
	box-sizing: border-box;
	background-color: #ffffff;
}
.footer__logo h1 {
	width: 130px;
	margin: 0 auto;
}
.footer__logo h1 a img {
	width: 130px;
	height: auto;
}

#footer nav {
	background-image: url(https://www.otsuka.co.jp/decoboco-eye/images/deco-bar.png);
	background-repeat: repeat-x;
	width: 100%;
	background-color: #017dc5;
	height: 90px;
}
#footer nav ul {
	margin: 0 auto;
	text-align: center;
	box-sizing: border-box;
	padding-top: 54px;
}
#footer nav li {
	display: inline-block;
	height: 24px;
	line-height: 24px;
	box-sizing: border-box;
	padding: 0 10px;
	border-right: 1px solid #ffffff;
}

#copyright {
	width: 100%;
	background-color: #017dc5;
	height: 30px;
	text-align: center;
}
#copyright p {
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
}

/*@media only screen and (max-width: 640px) {
	#footer nav {
		background-image: url(../images/deco-bar.png);
		background-repeat: repeat-x;
		width: 100%;
		background-color: #017dc5;
		height: 150px;
	}
	#footer nav ul {
		padding-top: 40px;
	}
	#footer nav li {
		display: block;
		height: 30px;
	}
	#copyright {
		font-size: 77%;
	}
}*/


 /* ==========================================================================
   Object [ component / project / utility ]
   ========================================================================== */
/* 病院検索 */
.fancybox-skin {
	background-color: #fff!important;
}
.fancybox-opened .fancybox-skin {
	filter: progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa, direction=0, strength=5, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa, direction=90, strength=5, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa, direction=180, strength=5, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa, direction=270, strength=5, enabled=true);
}
#data {
	text-align: center;
	background-color: #fff;
	color: #017dc5;
	width: 600px;
	padding: 60px 0;
	position: relative;
	z-index: 200;
}
#data img {
	margin: 0 auto;
}
/*@media only screen and (max-width: 640px) {
	#data {
		text-align: center;
		background-color: #fff;
		color: #017dc5;
		width: 100%;
		padding: 0 auto;
	}
	#data img {
		width: 70%;
		height: auto;
	}
}*/