@charset "UTF-8";
/* ***********************************************************************
    Ota Kids & Family Clinic - <Common> 
*********************************************************************** */
/*
    1 : Initialize
    2 : Format (header, contents area, footer)
    3 : Text  (h1~, p, etc.)
    4 : Space (margin, padding, etc.)
	5 : Other (breadcrumb, pageTop, imgOnMouse, etc.)
	6 : Clear
*/

/* ***********************************************************************
    1 : Initialize (html5)
*********************************************************************** */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
	margin        : 0;
	padding       : 0;
	border        : 0;
	outline       : 0;
	font-size     : 100%;
	vertical-align: baseline;
	background    : transparent;
}
body {
	line-height: 1;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
	display: block;
}

nav ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

a {
	margin        : 0;
	padding       : 0;
	border        : 0;
	font-size     : 100%;
	vertical-align: baseline;
	background    : transparent;
}

ins {
	background-color: #ff9;
	color           : #000;
	text-decoration : none;
}

mark {
	background-color: #ff9;
	color           : #000;
	font-style      : italic;
	font-weight     : bold;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom: 1px dotted #000;
	cursor       : help;
}

table {
	border-collapse: collapse;
	border-spacing : 0;
}

hr {
    display   : block;
    height    : 1px;
    border    : 0;
    border-top: 1px solid #cccccc;
    margin    : 1em 0;
    padding   : 0;
}

input, select {
	vertical-align: middle;
}


/**追加**/

img {
	vertical-align: bottom;
}

a {
	outline-style: none;
}

a img {
	border: none;
}

ul {
	list-style         : none;
	list-style-image   : none;
	list-style-position: outside;
}

ol {
	list-style-type    : decimal;
	list-style-image   : none;
	list-style-position: outside;
}



/* ***********************************************************************
    2 : Format (header, contents area, footer)
*********************************************************************** */
/**************************
	COMMON 
**************************/
* {
	font-size               : 16px;
    -webkit-text-size-adjust: 100%; /* ブラウザ側での自動調整をなしにする */
}
body {
	text-align              : center;
	-webkit-text-size-adjust: none;
	color                   : #000;
	font-family             : "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
}

/**************************
	HEADER
**************************/
/** [ SP ] **/
header {
	position   : relative;
	width      : 100%;
	height     : auto;
	padding-top: 72px;
	text-align : center;
}
#btn_toRecruit {
	position: absolute;
	top     : 0;
	right   : 2.5%;
	display : block;
	width   : 24%;
	height  : 45px;
	z-index : 10;
}
#btn_toRecruit img {
	width : 100%;
	height: auto;
}
@media (min-width:768px) {
/** [ TABLET ] **/
	header {
		width : 90%;
		margin: 0 auto;
	}
}
@media (min-width:1080px) {
/** [ PC ] **/
	header {
		position  : relative;
		width     : 980px;
		height    : 448px;
		margin    : 0 auto 105px;
		text-align: left;
	}
	#btn_toRecruit {
		position: absolute;
		top     : 0;
		right   : 20px;
		display : block;
		width   : 170px;
		height  : 74px;
		z-index : 10;
	}
}


/**************************
	MAIN
**************************/
/** [ SP ] **/
main {
	width     : 100%;
	text-align: center;
}
.box {
	width         : 90%;
	margin        : 0 auto;
	border-top    : solid 1px #bdbdbd;
	padding-top   : 32px;	
	padding-bottom: 80px;
}
.box:first-child {
	border-top: none;
}
.box .text p {
	margin-top : 1.0em;
	font-size  : 1.1em;
	line-height: 2.0em;
	text-align : left;
}
@media (min-width:768px) {
/** [ TABLET ] **/
}
@media (min-width:1080px) {
/** [ PC ] **/
	main {
		width     : 980px;
		height    : auto;
		margin    : 0 auto;
		text-align: left;
	}
	.box {
		width     : 980px;
		margin-top: 40px;
		padding   : 60px 0; 
		text-align: left;
	}
	.box:first-child {
		border-top: none;
	}
	.box .text {
		float : right;
		width : 700px;
		height: auto;
	}
}

/**************************
	ごあいさつ
**************************/
h3#ill_01 span img {
	height: 60px;
	width : auto;
}
#greeting #name {
	margin-top  : 1.2em;
	margin-right: 1%;
	float       : right;
	/***/
	font-family : "UD Shin Go Conde90 L", sans-serif;
	font-size   : 20px;
	line-height : 1.5em;
	text-align  : right;
	/***/
	display    : inline-block;
	transform  : scale(1.1, 1);
}
#greeting #name span {
	display  : block;
	font-size: 14px;
}

/**************************
	プロフィール
**************************/
h3#ill_02 span img {
	height: 45px;
	width : auto;
}
#profile {
	width       : 90%;
	margin-left : auto;
	margin-right: auto;
}
#profile div dl dt,
#profile div dl dd {
	float     : left;
	font      : normal 15px/2.0em "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-align: left;	
}
#profile div dl dt {
	width: 25%;
}
#profile div dl dd {
	width: 75%;
}
#profile p {
	margin-top: 0;
	font-size : 15px;
}

/**************************
	場所
**************************/
h3#ill_03 span img {
	height: 45px;
	width : auto;
}
#map #gifImg img {
	width     : 100%;
	height    : auto;
	margin-top: 30px;
}
#map a {
	display   : inline-block;
	width     : 100%;
	margin-top: 8px;
	text-align: right;
	font      : normal 14px/1.5em "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#map p {
	width      : 100%;
	margin-top : 16px;
	font-size  : 16px;
	line-height: 2.0em;
}


@media (min-width:768px) {
/** [ TABLET ] **/
	#profile div dl dt {
		width: 15%;
	}
	#profile div dl dd {
		width: 85%;
	}
}
@media (min-width:1080px) {
/** [ PC ] **/
	/**************************
		ごあいさつ
	**************************/
	h3#ill_01 span img {
		height     : 120px;
		margin-left: 6px;
	}
	#greeting #name {
		margin-top  : 1.2em;
		margin-right: 1%;
		float       : right;
		/***/
		font-family : "UD Shin Go Conde90 L", sans-serif;
		font-size   : 20px;
		line-height : 1.5em;
		text-align  : right;
		/***/
		display    : inline-block;
		transform  : scale(1.1, 1);
	}
	#greeting #name span {
		display  : block;
		font-size: 14px;
	}
	
	/**************************
		プロフィール
	**************************/
	h3#ill_02 {
		line-height: 1.25em!important;
	}
	h3#ill_02 span img {
		height     : 90px;
		margin-left: 6px;
	}
	#profile {
		float: right;
		width: 700px;
	}
	#profile div {
		float      : left;
		width      : 330px;
		height     : auto;
		margin-left: 40px;
		padding    : 0;
		text-align : left;
	}
	#profile div:first-child {
		margin-left: 0;
	}
	#profile div h4 {
		transform  : scale(1.0, 1)!important;
	}
	#profile div dl dt,
	#profile div dl dd {
		font : normal 16px/2.0em "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	#profile div dl dt {
		width : 80px;
		height: auto;
	}
	#profile div dl dd {
		width : 250px;
		height: auto;
	}
	#profile div p {
		font : normal 16px/32px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	
	/**************************
		場所
	**************************/
	h3#ill_03 span img {
		height     : 90px;
		margin-left: 6px;
	}
	#map {
		float     : right;
		margin-top: 0;
	}
	#map #gifImg img {
		display: block;
		width  : 700px;
		height : 500px;
	}
	#map a {
		display   : block;
		width     : 700px;
		height    : 14px;
		margin-top: 12px;
		text-align: right;
		font      : normal 14px/14px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	#map p {
		width      : 700px;
		height     : 58px;
		text-align : center;
		font-size  : 18px;
		line-height: 58px;!important
	}
}





/**************************
	リクルート
**************************/
/** [ SP ] **/
#recruit {
	background-color: #f4f4f2;
	max-width       : 100%;
	/*width           : 88.24%;*/
	width           : 88%;
	margin-top      : 40px;
	margin-left     : auto;
	margin-right    : auto;
	padding-bottom  : 45px;
	text-align      : left;
	border          : solid 4px #3bbaee;
}
#recruit h3 {
	/***/
	transform  : scale(1.0, 1)!important;
	/***/
	background      : url(../images/h3_recruit.gif) center center no-repeat;
	background-color: #fff;
	background-size : auto 50%;
	width           : 100%;
	height          : 72px;
	margin-bottom   : 15px;
	border-bottom   : solid 3px #3bbaee;
	text-indent     : -9999px;
}
#recruit p {
	width : 90%;
	margin: 0 auto;
	font  : normal 16px/26px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#recruit .graph {
	background      : url(../images/dottedline.gif) left bottom repeat-x;
	background-color: #a1daf0;
	width           : 90%;
	margin          : 16px auto;
}
#recruit .graph dl {
	background : url(../images/dottedline.gif) left top repeat-x;
	width      : 100%;
	padding-top: 1px;
}
#recruit .graph dl dt {
	float      : left;
	width      : 27.6%;
	padding    : 10px 0;
	font-size  : 15px;
	line-height: 1.5em;
	text-align : center;
}
#recruit .graph dl dd {
	float           : right;
	background-color: #fff;
	width           : 67.36%;
	padding         : 10px 1.68% 10px 3.36%;
	font-size       : 15px;
	line-height     : 1.5em;
	text-align      : left;
}
#recruit .graph dl dd p {
	width      : 100%;
	font-size  : 15px;
	line-height: 1.5em;
	text-align : left;
}
#recruit #btn_appli {
	display: block;
	width  : 90%;
	height : auto;
	margin : 32px auto 0;
}
#recruit #btn_appli img {
	width : 100%;
	height: auto;
}

@media (min-width:768px) {
/** [ TABLET ] **/
	#recruit p {
		text-align: center;
	}
	#recruit #btn_appli {
		width  : 50%;
	}
}
@media (min-width:1080px) {
/** [ PC ] **/
	#recruit {
		width         : 964px;
		margin-top    : 80px;
		padding-bottom: 50px;
		text-align    : center;
		border-width  : 6px;
	}
	#recruit h3 {
		width        : 964px;
		height       : 100px;
		margin-bottom: 25px;
		border-width : 6px;
	}
	#recruit p {
		font : normal 18px/28px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	#recruit .graph {
		width         : 804px;
		padding-bottom: 1px;
		margin-top    : 30px;
	}
	#recruit .graph dl {
		width: 804px;
	}
	#recruit .graph dl dt {
		width      : 222px;
		min-height : 26px;
		padding    : 15px 0;
		font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-size  : 18px;
		line-height: 26px;
		text-align : center;
	}
	#recruit .graph dl dd {
		width  : 552px;
		padding: 15px 10px 15px 20px;
		font   : normal 16px/26px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	#recruit .graph dl dd p {
		font-size  : 16px;
		line-height: 26px;
	}
	#recruit .graph dl dd h5:first-child {
		margin-top: 0;
	}
	#recruit #btn_appli {
		display: block;
		width  : 460px;
		height : 81px;
		margin : 40px auto 0;
	}
}




/**************************
	Footer
**************************/
/** [ SP ] **/
footer {
	/*background-color: #3bbaee;*/
	background-color: #ccc;
	width           : 100%;
	margin-top      : 80px;
	padding         : 24px 0;
	text-align      : center;
}
footer p img {
	display: block;
	height : 15px;
	width  : auto;
	margin : 0 auto;
}
@media (min-width:768px) {
/** [ TABLET ] **/
	footer {
		margin-top: 100px;
	}
}
@media (min-width:1080px) {
/** [ PC ] **/
}


/* ***********************************************************************
    3 : Text  (h1~, p, etc.)
*********************************************************************** */
/** [ SP ] **/
h1 {
	background     : url(../images/h1_logo.png) center top no-repeat;
	background-size: 258px auto;
	width          : 258px;
	height         : 204px;
	margin         : 0 auto;
	text-indent    : -9999px;
	font-size      : small;
}
h2 {
	background     : url(../images/h2_open_s.png) center center no-repeat;
	background-size: auto 55px;
	width          : 90%;
	height         : 55px;
	margin         : 40px auto 0;
	padding        : 14px 0 16px;
	border         : solid 2.5px #e4007f;
	border-radius  : 20px;
	text-indent    : -9999px;
	font-size      : small;
}
h3 {
	font-family: "UD Shin Go Conde90 L", sans-serif;
	font-size  : 24px;
	line-height: 1.0em;
	text-align : center;
	/***/
	display    : inline-block;
	transform  : scale(1.1, 1);
}
h3 span {
	display   : block;
	margin    : 14px auto 0;
	text-align: center;
}
h4 {
	background     : url(../images/h4_dotted_s.gif) left bottom repeat-x;
	background-size: auto 2px;
	width          : 100%;
	height         : 21px;
	padding-bottom : 12px;
	margin-top     : 32px;
	margin-bottom  : 16px;
	font           : normal 21px/1.0em "UD Shin Go Conde90 L", sans-serif;
	text-align     : center;
	/***/
	display    : inline-block;
	transform  : scale(1.1, 1);
}
h5 {
	color     : #3bbaee;
	font      : bold 15px/25px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	margin-top: 10px;
}

p {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

a {
	color          : #009ee8;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

/***/
.bigger {
	font-size: 18px;
}
.smaller {
	font-size: 14px;
}
.align_right {
	text-align: right;
}

/***/
.brown {
	color: #5d4538;
}

@media (min-width:768px) {
/** [ TABLET ] **/
	h1 {
		background-size: 70% auto;
		width          : 70%;
		height         : 275px;
	}
	h2 {
		width : 90%;
		height: 55px;
		margin: 32px auto 0;
	}
	h3 {
		font-size: 28px;
	}
}
@media (min-width:1080px) {
/** [ PC ] **/
	h1 {
		position   : absolute;
		top        : 64px;
		left       : -44px;
		background-position: left top;
		background-repeat  : no-repeat;
		background-size    : 492px 384px;
		width      : 492px;
		height     : 384px;
	}
	h2 {
		border: none;
		/***/
		position   : absolute;
		top        : 32px;
		right      : -40px;
		background : url(../images/h2_open_p.png) left top no-repeat;
		width      : 360px;
		height     : 360px;
	}
	h3 {
		float     : left;
		width     : 280px;
		font-size : 32px;
		line-height: 1.25em;
		/*font      : normal 32px/1.25em "UD Shin Go Conde90 L", sans-serif;*/
		text-align: left;
	}
	h3 span {
		margin    : 32px 0 0;
		text-align: left;
	}
	.smaller {
		font-size  : 12px;
		line-height: 18px;
	}
}


/**************************
	br
**************************/
/** [ SP ] **/
.br {
	display: inline;
	margin : 0;
}
.brSP {
	display: block;
}
@media (min-width:768px) {
/** [ TABLET / PC ] **/
	.br {
		display: block;
		margin : 0;
	}
	.brSP {
		display: inline;
	}
}


/* ***********************************************************************
    4 : Space (margin, padding, etc)
*********************************************************************** */

.mgn_top_5 {
	margin-top: 5px;
}
.mgn_top_15 {
	margin-top: 15px;
}
.mgn_top_20 {
	margin-top: 20px;
}
.mgn_top_25 {
	margin-top: 25px;
}
.mgn_top_30 {
	margin-top: 30px;
}
.mgn_top_35 {
	margin-top: 35px;
}
.mgn_top_40 {
	margin-top: 40px;
}
.mgn_top_50 {
	margin-top: 50px;
}
.mgn_top_80 {
	margin-top: 80px;
}




/* ***********************************************************************
	5 : Other (breadcrumb, graph,  pageTop, imgOnMouse, etc.)
*********************************************************************** */
/** [ SP ] **/
#page-top {
	position: fixed;
	bottom  : 5px;
	right   : 2.5%;
	z-index : 2000;
}
#page-top a {
	display        : block;
	background     : url(../images/pageTop.png) left top no-repeat;
	background-size: 64px auto;
	width          : 64px;
	height         : 64px;
	text-indent    : -9999px;
}
@media (min-width:768px) {
/** [ TABLET / PC ] **/
	#page-top {
		bottom: 18px;
		right : 20px;
	}
	#page-top a {
		background-size: 72px auto;
		width          : 72px;
		height         : 72px;
	}
}
@media (min-width:1080px) {
/** [ PC ] **/
	#page-top a {
		background-size: 80px auto;
		width          : 80px;
		height         : 80px;
	}
	#page-top a:hover {
		opacity : 0.6;
		filter  : alpha(opacity=60);
	}
}




/**************************
   IMG DISPLAY
**************************/
/** [ SP ] **/
.pcImg {
	display: none;
}
.spImg {
	display: block;
}
@media (min-width:768px) {
/** [ TABLET / PC ] **/
	.spImg {
		display: none;
	}
}



/* ***********************************************************************
	6 : Clear
*********************************************************************** */

.clear {
	clear: both;
}


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

.clearfix { display: inline-block; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */




