@charset "UTF-8";

:root {
	--color-primary-brown: #693b00;
	--color-secondary-gold: #fede66;
}

.menuToggle {
	display: none;
}
.menuClose {
	display: none;
}
@media screen and (max-width: 480px) {
	body {
		min-width: 0;
		text-align: left;
		-webkit-text-size-adjust: 100%;
	}
	body.menu-open {
		overflow: hidden;
	}
	img {
		max-width: 100%;
		height: auto;
	}
	iframe {
		max-width: 100%;
	}
	#header,
	#globalNav ul,
	#main,
	#pageTop,
	#footer .copyright {
		width: auto;
	}
	#header {
		box-sizing: border-box;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		height: auto;
		min-height: 74px;
		padding: 8px 12px 10px;
	}
	.logo {
		position: static;
		flex: 0 0 auto;
	}
	.logo a {
		width: 236px;
		max-width: calc(100vw - 76px);
		background-size: contain;
	}
	.headerTel,
	.headerMail {
		position: static;
		flex: 0 0 100%;
		margin: 8px 0 0;
	}
	.headerTel img,
	.headerMail img {
		width: auto;
		max-width: 100%;
	}
	#globalNav {
		display: none;
		box-sizing: border-box;
		width: 100%;
		height: 100%;
		background: rgba(105,59,0,0.96);
		padding: 74px 24px 28px;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
		overflow-y: auto;
	}
	#globalNav.is-open {
		display: block;
	}
	.menuToggle {
		display: block;
		box-sizing: border-box;
		width: 44px;
		height: 44px;
		flex: 0 0 44px;
		margin-left: auto;
		color: #fff;
		text-indent: -9999px;
		background: var(--color-primary-brown);
		border: 0;
		border-radius: 4px;
		padding: 0;
		position: relative;
		cursor: pointer;
		overflow: hidden;
	}
	.menuToggle span,
	.menuToggle:before,
	.menuToggle:after {
		content: "";
		display: block;
		width: 22px;
		height: 2px;
		background: #fff;
		position: absolute;
		left: 11px;
	}
	.menuToggle span {
		top: 50%;
		margin-top: -1px;
	}
	.menuToggle:before {
		top: 13px;
	}
	.menuToggle:after {
		bottom: 13px;
	}
	.menuClose {
		display: block;
		width: 44px;
		height: 44px;
		text-indent: -9999px;
		background: transparent;
		border: 0;
		position: absolute;
		top: 14px;
		right: 14px;
		cursor: pointer;
		overflow: hidden;
	}
	.menuClose:before,
	.menuClose:after {
		content: "";
		display: block;
		width: 28px;
		height: 2px;
		background: #fff;
		position: absolute;
		top: 21px;
		left: 8px;
	}
	.menuClose:before {
		transform: rotate(45deg);
	}
	.menuClose:after {
		transform: rotate(-45deg);
	}
	#globalNav ul {
		display: block;
		border-top: 1px solid rgba(255,255,255,0.25);
	}
	#globalNav li,
	#globalNav li a {
		float: none;
		display: block;
		width: auto;
		height: auto;
		text-indent: 0;
	}
	#globalNav li a {
		color: #fff;
		font-size: 18px;
		line-height: 1.4;
		text-decoration: none;
		background: none !important;
		border-bottom: 1px solid rgba(255,255,255,0.18);
		padding: 16px 4px;
	}
	#globalNav li.active a,
	#globalNav li a:hover {
		color: var(--color-secondary-gold);
		background: var(--color-secondary-gold);
	}
	#mainVisual {
		margin: 12px 0;
	}
	#slide {
		width: 100%;
		height: 29.1667vw !important;
		aspect-ratio: 24 / 7;
		overflow: hidden;
	}
	#slide img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	#main {
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		margin: 12px 0 20px;
		padding: 0 10px;
	}
	#content {
		order: 1;
		float: none;
		box-sizing: border-box;
		width: 100%;
	}
	#side {
		order: 2;
		float: none;
		box-sizing: border-box;
		width: 100%;
		margin-top: 20px;
	}
	#content .inner {
		padding: 0 14px 22px;
	}
	#content h1,
	#content h2,
	.oneDay p {
		text-align: center;
	}
	#content .leftColumn,
	#content .rightColumn,
	#content .img_left,
	#content .img_right,
	.story .storyBox,
	.story .message,
	.workflow .photo,
	.workflow .comment,
	.missionTxt {
		float: none;
		width: auto;
		margin: 0 0 15px;
	}
	.zaitaku .zaitakuImage {
		background: none;
		padding: 10px;
	}
	.topMessageBox {
		padding: 14px;
	}
	#content .topDx {
		border-radius: 6px;
		padding: 18px;
	}
	.topLetter li img {
		display: block;
		margin: 0 auto 10px !important;
	}
	#content table {
		display: block;
		overflow-x: auto;
	}
	ul.sideBnr {
		text-align: center;
	}
	ul.sideBnr li {
		margin-bottom: 12px;
	}
	#pageTop {
		box-sizing: border-box;
		padding: 0 10px;
	}
	#footer .copyright {
		box-sizing: border-box;
		text-align: center;
		padding: 0 10px;
	}
	#content .for_pharmacist .left,
	#content .for_pharmacist .skillup,
	#content .for_pharmacist .otherCase,
	#content .for_pharmacist .otherCase .photo {
		float: none;
		box-sizing: border-box;
		width: auto !important;
		max-width: 100%;
		margin: 0 0 15px;
	}
	#content .for_pharmacist .left {
		text-align: center;
	}
	#content .for_pharmacist .skillup h3,
	#content .for_pharmacist .otherCase h3 {
		line-height: 1.45;
		word-break: normal;
		overflow-wrap: anywhere;
	}
	#content .for_pharmacist .skillup p,
	#content .for_pharmacist .otherCase p {
		overflow-wrap: anywhere;
	}
	#content .for_pharmacist .skillup img,
	#content .for_pharmacist .otherCase img {
		max-width: 100%;
		height: auto;
	}
	#content .for_pharmacist .skillup table,
	#content .for_pharmacist .otherCase table {
		display: table;
		box-sizing: border-box;
		width: 100% !important;
		table-layout: fixed;
		overflow: visible;
	}
	#content .for_pharmacist .skillup table th,
	#content .for_pharmacist .otherCase table th {
		box-sizing: border-box;
		width: 82px !important;
		padding: 6px;
	}
	#content .for_pharmacist .skillup table td,
	#content .for_pharmacist .otherCase table td {
		box-sizing: border-box;
		padding: 6px 8px;
		overflow-wrap: anywhere;
	}
}
