ｎhtml,body{
	color: #3e3a39;
	width: 100%;
}

/*
	リンクボタンにopacityをかけると、リンク押下→戻る操作でopacityが残ってしまうことがあるのでかけない
*/
a:hover img {
	opacity: 1;
}

h2 {
	margin-top: 40px;
}

#TOP h2 {
	margin-top: 0;
}


/*
	PC / mobile
*/
#pcHeader {
	display: none;
}

.image_slider {
	display: block;
}

.logo {
	padding-right: 0;
}

.company_message {
	text-align: left;
	font-size: 10px;
	padding-left: 0;
	margin-left: 10px;
}

.company_message.en {
    font-size: 14px;
    margin-bottom: 8px;
}

#mobileHeader {
	display: block;
	width: 100%;
	color: #3e3a39;
	background-color: white;
	height: auto;
}
/*
	タイトル部分
*/
	ul.boxTitle {
		display: flex;
		flex-flow: row nowrap;
		margin: 0;
		justify-content: flex-start;
		align-items: flex-end;
		width: 100%;
		height: auto;
		padding: 0;
		margin-top: 10px;
	}

	ul.boxTitle > li:last-child {
		margin-left: 0;
		margin-right: auto;
	}

	ul.boxTitle.en > li:last-child {
		margin-left: 0;
		margin-right: auto;
	}


	.boxTitle h1 {
		margin: auto 0 8px 0;
	}

.boxMenu {
	border-top: solid 1px rgb(204,204,204);
	border-bottom: solid 1px rgb(204,204,204);
	padding-left: 0;
	padding-right: 0;
}

.boxMenu > ul {
	display: flex;
	flex-flow: row nowrap;
	margin: 0;
	justify-content: center;
	align-items: flex-end;
	width: 100%;
	height: auto;
	padding: 0;
}

	.boxMenu li {
		border-left: solid 1px rgb(204,204,204);
	}
	.boxMenu li:last-child {
		border-left: solid 1px rgb(204,204,204);
		border-right: solid 1px rgb(204,204,204);
	}

	.boxMenu li.boxFill {
		display: flex;
		align-items: center;
		width: 100%;
		height: 100%;
	}


	.boxMenu li a {
		display: block;
		width: 100%;
		height: 100%;
	}

	.boxMenu li a img {
		opacity: 1;
	}

	.current_position,
	.boxMenu li a:hover {
		background-color: #ffeb10 !important;
	}



.for_pc {
	display: none !important;
}

.for_mobile {
	display: block !important;
}

.container {
	width: 100%;
	padding: 0;
}

.round_button {
	width: 100%;
}

.inner {
	width: 100%;
}

.sub {
	font-size: 10px;
	margin-top: 5px;
	text-align: left;
}

header {
	width: 100%;
	height: auto;
}

img {
	max-width: 100%;
	width: 100%;
	height: auto;
}

table {
	width: 100%;
	margin: 20px auto 0 auto;
}

h3 {
	width: 100%;
/*	font-size: 18px;*/
	line-height: 1.5em;
}

.main {
	width: 100%;
	line-height: 1.8;
/*
	background-image: url(../img/back2.png);
	background-size: calc( 1200px / 2 ) calc( 360px / 2 );
	background-repeat: repeat-x;
*/
	padding-top: 0;
}

.container > .row {
	width: 100%;
}


#TOP.main {
	line-height: 1.8;
	padding-top: 0;
}

nav {
	background-color: transparent;
}

ul.mobile_navi,
ul.navi_inner {
	padding-start: 0;
	padding-left: 0;
	-webkit-padding-start: 0;
	-moz-padding-start: 0;
}

.mobile_navi {
	display: none;
	list-style: none;
	padding-left: 0;
	z-index: 3;
	-webkit-transition: none;
	-moz-transition: none;
	-ms-transition: none;
	transition: none;
	-webkit-transform-style: preserve-3d;
	overflow: hidden;
	margin: 0 auto;
	width: 100%;
}

.show {
	display: block;
	max-height: 2000px;
	opacity: 1;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

.mobile_navi li {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	overflow: hidden;
	z-index: 2;
	border-bottom: 2px solid #3e3a39;
	font-weight: bold;
	background-color: #ffeb10;
	font-size: 18px;
	height: 60px;
	line-height: 60px;
}

.mobile_navi li a {
	/*overflow: hidden;*/
	display: block;
	width: 100%;
	height: 100%;
	color: #3e3a39;
	z-index: 3;
	padding-left: 30px;
}

.current_position {
	color: #45c9e4 !important;
}

/*
.menu_text {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	font-size: 16px;
	height: 60px;
}
*/


.category {
	display: block;
	position: relative;
	overflow: hidden;
	z-index: 2;
	overflow: hidden;
	color: white;
	background-color: #285dbf;
	width: 100%;
	height: 100%;
	margin-left: 30px;
	line-height: 68px;
}


.category .glyphicon {
	margin-right: 10px;
}

.boxApply {
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 59px;
	padding: 0;
	border-bottom: 2px solid #3e3a39;
	margin-bottom: 0;
}

.boxApply li {
	display: flex;
	justify-content: center;
	align-items: center;
	list-style: none;
	text-align: center;
	width: 100%;
	height: 100%;
	margin: auto;
}

.boxApply li:last-child {
	border-left: 2px solid #3e3a39;
}


ul.navi_inner {
	display: none;
}

.navi_inner li {
	display: block;
	width: 100%;
	height: auto;
 	background-color: #e0e0e0;
}

.navi_inner li a {
    display: block;
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
 	background-color: #e0e0e0;
	color: black;
	width: 100%;
	height: 68px;
	line-height: 68px;
	padding-left: 4em;
	border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.navi_inner li:last-child a {
	border-bottom: none;
}

.logo_and_menu {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	color: black;
	height: 62px;
	padding: 0;
	margin-left: 0;
	border-bottom: 2px solid #3e3a39;
}

.title_logo {
	display: block;
/*	width: 100%;*/
	height: 62px;
	font-size: 12px;
	z-index: 1;
	text-align: left;
	margin: 0;
	padding-left: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.boxBtnDrawer {
	display: block;
	text-align: center;
	margin: 0 0 0 auto;
	width: 60px;
	height: 60px;
	background-color: #ffeb10;
	color: #3e3a39;
}

.txtMenu {
	color: #3e3a39;
	font-size: 10px;
	width: 100%;
	margin: 40px 0 0 0;
}

.btn_drawer {
	display: block;
	position: absolute;
	margin: 0 15px 0 15px;
	height: 40px;
	width: 30px;
	color: #3e3a39;
}

.btn_drawer.active {
	background-color: #ffeb10;
}

	.btn_drawer a {
		position: relative;
		display: block;
		-webkit-transition: all .4s;
		transition: all .4s;
	}
	.btn_drawer span {
		position: absolute;
		display: inline-block;
		left: 0;
		width: 100%;
		height: 2px;
		background-color: #3e3a39;
		border-radius: 2px;
		-webkit-transition: all .4s;
		transition: all .4s;
	}
	.btn_drawer span:nth-of-type(1) {
		top: 10px;
	}
	.btn_drawer span:nth-of-type(2) {
		top: 20px;
	}
	.btn_drawer span:nth-of-type(3) {
		top: 30px;
	}
	.btn_drawer span:nth-of-type(2)::after {
		position: absolute;
		top: 0;
		left: 0;
		content: '';
		width: 100%;
		height: 2px;
		background-color: #3e3a39;
		border-radius: 2px;
		-webkit-transition: all .4s;
		transition: all .4s;
	}

	.btn_drawer.active span:nth-of-type(2) {
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
		background-color: #3e3a39;
	}
	.btn_drawer.active span:nth-of-type(2)::after {
		-webkit-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
		background-color: #3e3a39;
	}
	.btn_drawer.active span:nth-of-type(1) {
		-webkit-transform: translateY(20px) scale(0);
		-ms-transform: translateY(20px) scale(0);
		transform: translateY(20px) scale(0);
		background-color: #3e3a39;
	}
	.btn_drawer.active span:nth-of-type(3) {
		-webkit-transform: translateY(-20px) scale(0);
		-ms-transform: translateY(-20px) scale(0);
		transform: translateY(-20px) scale(0);
		background-color: #3e3a39;
	}

form,
#MOVIES form.confirm {
	width: 100%;
}

#fnav {
	display: none;
}

/* Footer */
footer {
	display: block;
	width: 100%;
	height: auto;
    padding-bottom: 20px;
    padding-top: 0;
	color: white;
	background-color: black;
}

footer .container {
	display: block;
	height: auto;
}


.page-top-bar {
	display: block;
	width: 100%;
	height: 34px;
    line-height: 34px;
    font-size: 14px;
	background-color: #e6e6e6;
	text-align: center;
	text-decoration: underline;
}

footer .page-top-bar a {
	color: #0000ff;
}


.footerLink {
	margin-top: 5px;
	margin-bottom: 10px;
	text-align: center;
	line-height: 2em;
	font-size: 14px;
}

.footerLink.en {
	font-size: 16px;
}

/*
	パンくずリスト
*/
.box_topic_path {
	font-size: 12px;
	line-height: 2;
	margin: 10px 0;
	height: auto;
	margin-left: 10px;
	padding-right: 0px;
}

ul.topic_path li:after {
	content: ">";
	padding: 0 5px;
}

table.contact {
	width: 100%;
}

form.confirm {
	width: 100%;
}

.form_title {
	text-align: left;
	border-right: none;
	padding-right: 10px;
	margin-bottom: 5px;
}

.form_title[class~="essential_mark"]:after {
	content: "必須";
	display: inline-block;
	font-size: 12px;
	line-height: 16px;
	background-color: red;
	color: #FFFFFF;
	padding: 3px;
	border-radius: 3px;
	font-weight: bold;
	margin: 0 0 0 10px;
}
.form_title[class~="without_essential_mark"]:after{
	content:"";
	display:inline-block;
	width:40px;
}

/* 確認ボタン */
.submitButton {
}

/* 送信ボタン */
.sendButton{
	margin:0;
}

/* 戻るボタン */
.backButton{
	margin:0;
}


.buttonLeft,
.buttonRight {
	text-align: center;
}

#complete_message dt {
	float: left;
	width: auto;
	text-align: right;
	padding-right: 15px;
	font-size: 18px;
	font-weight: normal;
}

#complete_message dd {
	float: left;
	width: auto;
	text-align: left;
	padding-left: 15px;
	font-size: 18px;
}

#TOP .row,
 .row {
	width: 100%;
}

/*
	top page
*/
#TOP .boxMainVisual {
	padding-right: 0;
	padding-left: 0;
}

#TOP .boxCatalog {
	height: auto;
}

#TOP .innerLeft,
#TOP .innerLeft_en {
	padding-left: 15px;
	padding-right: 15px;
}

#TOP .innerLeft > .row {
	width: 100%;
}

#TOP .innerLeft_en > .row {
	width: 100%;
}

#TOP .innerLeft > .row > div {
	padding-left: 0;
	padding-right: 0;
}

#TOP .innerRight {
	background-color: rgb(240, 240, 240);
	padding: 30px 15px;
}

#TOP .innerRight > .row > div {
	text-align: right;
	padding-right: 0;
}

#TOP .catalog_link {
	font-size: 18px;
}

#TOP .special_banner {
	margin-bottom: 10px;
}

#TOP .primary_banner {
	margin-bottom: 10px;
}


/*
#TOP h3 {
	display: block;
	width: 100%;
	background-image: url(../img/top/diagonal.jpg);
	background-repeat: repeat-x;
	font-size: 16px;
	height: 30px;
	line-height: 30px;
	padding-left: 15px;
	color: white;
	font-weight: bold;
	margin: 0 0 10px 0;
}
*/

#TOP h3 {
	display: block;
	width: 100%;
	background-color: #222222;
	font-size: 16px;
	height: 36px;
	line-height: 36px;
	padding-left: 15px;
	color: white;
	font-weight: bold;
	margin: 0 0 10px 0;
}

#TOP .banner_description {
	font-size: 14px;
}

#TOP .innerLeft_en > .row > div.flex-right,
#TOP .innerLeft > .row > div.flex-right,
#TOP .flex-right {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-end;
	padding-left: 2px;
}

#TOP .innerLeft_en > .row > div.flex-left,
#TOP .innerLeft > .row > div.flex-left,
#TOP .flex-left {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	padding-right: 2px;
}

#TOP .innerRight > .flex-right {
	padding-left: 10px !important;
}

#TOP .innerLeft > .flex-left {
	padding-right: 10px !important;
}

#TOP .innerRight > .row > div.flex-right {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-end;
	padding-left: 10px;
}

#TOP .innerRight > .row > div.flex-left {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	padding-left: 0;
	padding-right: 10px;
}

#TOP .boxTitle {
	display: block;
	margin: 0 10px 15px 10px;
	border-bottom: none;
}

#TOP .boxTitle .title {
	color: #31C0DC;
	font-size: 16px;
	text-align: left;
	border-bottom: solid 1px #31C0DC;
}

#TOP .boxTitle .update_list {
	color: black;
	font-size: 12px;
	width: 100%;
	padding-top: 0;
	text-align: right;
}

#TOP .boxTitle .update_list a {
	color: black;
}

#TOP .catalog-list1 {
	display: flex;
	flex-wrap: column nowrap;
	align-items: center;
	justify-content: center;
}

#TOP .catalog-list2 {
	display: flex;
	flex-wrap: column nowrap;
	align-items: center;
	justify-content: center;
}

#TOP .catalog-list1 li:nth-child(odd),
#TOP .catalog-list2 li:nth-child(odd) {
	margin-right: 15px;
}

#TOP .boxContents {
	margin-top: 30px;
}

#TOP .border_link_recruit {
	display: block;
	width: 100%;
	height: 50px;
	line-height: calc(50px - 4px * 2);
	font-size: 18px;
	font-weight: bold;
	color: #595757;
	margin-top: 30px;
	margin-bottom: 0;
}

#TOP .border_link_manufacturing {
	margin-bottom: 20px;
}

#TOP .catalog_for_school {
	/*margin-bottom: calc(  ((100vw - 80px) / 2) * (((280 + 440) - ( 224 * 2 )) / 540) + 8px ) !important;*/
}

#TOP .banner_button {
	max-width: calc(540px  / 2);
	max-height: calc(148px  / 2);
	width: 100%;
	height: calc(148px / 540px);
	font-size: calc(16 / 480 *  100vw);
	line-height: 1.2;
}

/* 会社概要 */
#COMPANY dl {
	width: 100%;
}

#COMPANY dd {
	margin-left: 100px;
}

#COMPANY dd.en {
	margin-left: 130px;
}


#COMPANY dl.history dd {
	display: block;
	margin-left: 70px;
	padding-right: 10px;
	font-weight: normal;
}

/* 採用情報 */
#RECRUIT .row.index {
	width: 100%;
}

#RECRUIT.main.container {
	width: 90%;
}

#RECRUIT .linkPanel {
	flex-flow: column nowrap;
}

#RECRUIT .linkPanel a {
	width: 100%;
	margin-right: 0;
	margin-bottom: 30px;
}

#RECRUIT .linkPanel a:last-child {
	margin-right: 0;
	margin-bottom: 0;
}

#RECRUIT .link_button {
	width: 100%;
	height: auto;
	padding: 30px 0;
	margin-left: 0;
	margin-right: 0;
}

#RECRUIT .rikunavi_button {
	width: 100%;
	height: auto;
	padding: 15px;
}

#RECRUIT .salary a,
#RECRUIT .salary {
	color: #3e3a39;
	font-size: 16px;
}

#CONTACT form,						/* お問い合わせ */
#CONTACT form.confirm,
#CONTACT table,
#MUSIC_BOX.main.container,			/* オルゴール試聴 */
#MYSERIES_TEMPLATE.main.container,	/* マイシリーズテンプレート */
#AWARDS.main.container,
#UPDATE.main.container {
	width: 100%;
}

#CONTACT td {
	font-size: 14px;
}

#CATALOG .link-button {
	font-size: 14px;
}

#CATALOG .name {
	height: 3em;
	line-height: 1.5em;
}

#MANUFACTURING .antena {
	font-size: 30px;
	text-align: center;
}

#MANUFACTURING .index {
	font-size: 20px;
	text-align: center;
	margin-top: 30px;
}

#MANUFACTURING .boxPhoto {
	padding-left: 15px;
}


#MYSERIES_TEMPLATE .description {
	margin-left: 0;
}

#TAIKO .boxMovie {
/*	width: 100%;*/
	height: auto;
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

#TAIKO .boxMovie iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}

#AWARDS .description {
	margin-bottom: 30px;
}

#AWARDS .title {
	margin-bottom: 0;
}

#AWARDS .boxLogoLeft,
#AWARDS .boxLogoRight {
	margin-top: 30px;
	text-align: center;
}

#AWARDS .award_description {
	display: block;
	height: 5em;
	margin-bottom: 30px;
}

#BUSINESS .orgTitle {
	margin-top: 90px;
	margin-bottom: 20px;
}

#catalog-list-area .catalog p {
  display: block;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #0068CC;
  border-radius: 2px;
  color: #0068CC;
  line-height: 1.5em;
  height: 3em;
  font-size: 14px;
  padding: 0 5px;
}


/* ページトップへ戻るボタン */
#page-top{
	display:none;
}

#page-top a{
	display:none;
}

.monodukuri {
	text-align: center;
}

#MONODZUKURI.main.container {
	width: 100%;
}

#MONODZUKURI .boxMonodzukuri {
	padding: 36px 15px;
	border: solid 1px #cccccc;
	margin-top: 60px;
}

/*
	更新情報表示
*/
.box_title {
	width: 100%;
	font-size: 21px;
}

.link_update_list {
	display: flex;
	justify-content: flex-end;
	align-content: flex-end;
	font-size: 12px;
	padding-top: 0;
}

.box_update {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: flex-start;
	width: 100%;
}

.box_article{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: flex-start;
	width: 50%;
	border: solid 1px #ffffff;
	margin: 0;
	border-collapse: collapse;
}

.box_article:nth-child(5) {
	display: none;
}

.box_thumbnail{
	/*width: 92px;*/
	/*display: inline-block;*/
	position: relative;
	overflow: hidden;
}

.box_thumbnail:after{
	position: absolute;
	display: block;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.3) 25%, rgba(0, 0, 0, 0)); /* 塗りつぶす */
}

.box_excerpt {
	background-color: transparent;
	color: #ffffff;
	background-color: #0984e3;
	width: 100%;
	padding: 10px 10px 0 10px;
	height: auto;
}

.article_date {
	/*font-size: calc(12px / 3);*/
	font-weight: bold;
	text-align: left;
}

.box_update {
	width: auto;
	margin-left: 15px;
	margin-right: 15px;
}

#NEWS .box_update_outer {
	margin-top: 30px;
	background-color: #0984e3;
	text-align: center;
	padding: 10px 0 15px 0;
	color: #ffffff;
}

.article_title {
	font-weight: bold;
	text-align: left;
	height: 2.6em;
}

.article_content {
	text-align: justify;
	line-height: 1.4;
	overflow: hidden;
	margin-top: 0;
	margin-bottom: 10px;
}

#UPDATE_LIST dt {
	float: none;
	font-size: 16px;
	font-weight: normal;
	margin-left: 0;
	margin-right: 0;
}

#UPDATE_LIST dd {
	font-size: 16px;
	font-weight: normal;
}

#UPDATE ul {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: flex-start;
	margin-top: 30px;
}

#UPDATE li,
#UPDATE li:nth-child(3n-1) {
	margin-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
}

.box_back {
	margin-top: 30px;
}