@charset "UTF-8";

/* --------------------------------------------------
	MAIN
-------------------------------------------------- */

div#main { position: relative; }
div#main img.logo { margin: 0 auto; width: 263px; display: block; position: absolute; left: 0; right: 0; z-index: 52; opacity: 0; }
div#main ul img { width: 100%; height: auto; }

@media screen and (max-width: 767px) {
div#main { padding: 15px 0; }
div#main img.logo { margin: 0 auto 15px; width: 150px; position: static; }
div#main ul img { margin: 0 0 0 -25%; width: 150%; }
}

/* --------------------------------------------------
	LOGO
-------------------------------------------------- */

div.logo { display: none; }

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

/* --------------------------------------------------
	GLOBAL NAVIGATION
-------------------------------------------------- */

nav#globalNavi li:nth-child(1):hover::after { display: block; }
nav#globalNavi a.navi01 { padding-top: 6px; }
nav#globalNavi a.navi01::after { content: 'Home'; }

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

/* --------------------------------------------------
	SECTION
-------------------------------------------------- */

main { width: auto; }
main > div.clearfix { margin: 40px auto 50px; width: 1200px; }
section h2 { color: #4e3b2e; font-size: 150%; font-weight: normal; text-align: center; }
section h2::before { margin: 0 0 5px; color: #ef9295; font-size: 60%; line-height: 1; display: block; }
section h2::after { content: ''; margin: 10px auto 40px; width: 70px; height: 2px; background: #ef9295; display: block; }
section#topics h2::before { content: 'Topics'; }
section#hours h2::before { content: 'Medical Hours'; }
section#about h2::before { content: 'About'; }
section#features h2::before { content: 'Features'; }
section#recruit h2::before { content: 'Recruit'; }
section#personnel h2::before { content: 'Medical Personnel'; }
section#access h2::before { content: 'Access'; }

@media screen and (max-width: 767px) {
main > div.clearfix { margin: 10px auto 30px; width: auto; }
section h2 { font-size: 130%; }
section h2::before { margin: 0 0 3px; font-size: 70%; }
section h2::after { margin: 5px auto 20px; width: 50px; }
}

/* --------------------------------------------------
	TOPICS
-------------------------------------------------- */

section#topics { width: 600px; float: left; }
section#topics ul { list-style: none; }
section#topics li { padding: 10px 0; border-bottom: dashed 1px #4e3b2e; }
section#topics li br { display: none; }
section#topics span.date { margin: 0 0.5em 0 0; color: #4e3b2e; display: inline-block; }
section#topics span.category { margin: 0 0.5em 0 0; width: 90px; border-radius: 20px; color: #fff; font-size: 80%; text-align: center; display: inline-block; }
section#topics span.information { background: #ef9295; }
section#topics span.recruit { background: #ce5a5f; }
section#topics span.new { padding: 3px 5px; background: #ce5a5f; color: #fff; font-size: 90%; line-height: 1; display: inline-block; white-space: nowrap; }

@media screen and (max-width: 767px) {
section#topics { margin: 0 0 30px; width: auto; float: none; }
section#topics li { padding: 12px 0; }
section#topics li br { display: block; }
section#topics span.date { margin: 0 0.5em 0.2em 0; display: inline-block; }
}

/* --------------------------------------------------
	MEDICAL HOURS
-------------------------------------------------- */

section#hours { padding: 0 0 0 50px; width: 550px; float: right; }
section#hours table { margin: 0 0 1em; width: 100%; border-collapse: collapse; }
section#hours thead th { padding: 8px 12px; background: #4e3b2e; color: #fff; }
section#hours tbody { background: #fff; }
section#hours tbody th { padding: 8px 12px; color: #4e3b2e; font-weight: normal; }
section#hours tbody td { padding: 8px 12px; color: #ef9295; text-align: center; }
section#hours tbody td span { color: #4e3b2e; }
section#hours p { color: #4e3b2e; text-align: right; }
section#hours p strong { padding: 0 0 0 36px; background: url(../images/common/telPink.svg) 0 center no-repeat; background-size: 24px auto; color: #ce5a5f; font-size: 200%; }

@media screen and (max-width: 767px) {
section#hours { padding: 0; width: auto; float: none; }
section#hours thead th { padding: 8px 5px; }
section#hours tbody th { padding: 8px 5px; }
section#hours tbody td { padding: 8px 5px; }
section#hours p { text-align: center; }
section#hours p strong { padding: 0 0 0 24px; background-size: 18px auto; front-size: 140%; }
}

/* --------------------------------------------------
	OTHER SECTIONS
-------------------------------------------------- */

section.img dl {}
section.img dt { width: 50%; height: 390px; float: left; position: relative; }
section.img dt img { width: 600px; height: 390px; position: absolute; z-index: 2; }
section.img dd { width: 50%; height: 390px; background: #fff; float: left; position: relative; }
section.img dd div.inner { width: 500px; height: 310px; background: #fff; position: absolute; z-index: 1; }
section.img dd p.name { color: #ce5a5f; text-align: right; }
section.img dd a { margin: 1.5em auto 0; width: 220px; height: 45px; background: #ef9295 url(../images/common/arrowWhite.svg) right 20px center no-repeat; background-size: 7px auto; border: solid 1px #ef9295; border-radius: 24px; color: #fff; text-align: center; text-decoration: none; line-height: 45px; display: block; }
section.img dd a:hover { background: #fff url(../images/common/arrowPink.svg) right 20px center no-repeat; background-size: 7px auto; color: #ef9295; text-decoration: none; }
section.imgR { margin: 0 0 150px; }
section.imgR dt { float: right; }
section.imgR dt img { top: 50px; }
section.imgR dd { float: left; }
section.imgR dd div.inner { padding: 40px 108px 40px 50px; right: -58px; float: right; }
section.imgL { margin: 0 0 50px; }
section.imgL dt { float: left; }
section.imgL dt img { top: -50px; right: 0; }
section.imgL dd { float: left; }
section.imgL dd div.inner { padding: 40px 50px 40px 108px; left: -58px; }

@media screen and (max-width: 767px) {
section.img { padding; 0 10px; }
section.img dt { width: auto; height: auto; float: none; }
section.img dt img { width: 100%; height: auto; position: static; }
section.img dd { width: auto; height: auto; float: none; }
section.img dd div.inner { width: auto; height: auto; position: static; }
section.img dd a { margin: 0.5em auto 0; width: 200px; height: 36px; background-size: 6px auto; line-height: 36px; }
section.imgR { margin: 0 0 30px; }
section.imgR dt { float: none; }
section.imgR dd { float: none; }
section.imgR dd div.inner { padding: 20px 10px; }
section.imgL { margin: 0 0 30px; }
section.imgL dt { float: none; }
section.imgL dd { float: none; }
section.imgL dd div.inner { padding: 20px 10px; }
}

/* --------------------------------------------------
	SLIDE GALLERY
-------------------------------------------------- */

div#gallery { margin: 0 0 40px; }

@media screen and (max-width: 767px) {
div#gallery { zoom: 0.5; }
}

/* --------------------------------------------------
	ACCESS
-------------------------------------------------- */

section#access iframe { width: 100%; height: 486px; }

@media screen and (max-width: 767px) {
section#access iframe { height: 300px; }
}