@charset "Shift_JIS";

/* **************************************************

Name: top.css

Description: Setting of top page

Create: 2012.09.20
Update: 2017.04.13

<!--Rev. 200325 P19138 htc-->
<!--Rev. 170413 P16118 htc-->
<!--Rev. 170310 P16116 htc-->
<!--Rev. 160923 P15121 htc-->
<!--Rev. 140909 P14028 htc-->

Copyright 2012 Hitachi, Ltd.

***************************************************** */




/* ---h2 商品・サービスを探す--- */
div#Contents div.BoxPatternA.TopSearch01 {
	padding-top: 0;
	padding-bottom: 0;
}


div#Contents div.BoxPatternA.TopSearch01 h2.Image {
	margin: 0;
	background: none;
	border: 1px solid #0d73a3;
	background-color: #007cb7;
	padding: 5px 4px;
}


div#Contents div.BoxPatternA.TopSearch01 h2.Image span {
	color:#fff;
	border-left: 5px solid #FFF;
	font-weight: bold;
	padding: 5px 5px 2px 13px;
	display: block;
	font-size: 115%;
}


div#Contents div.BoxPatternA.TopSearch01 h2.Image img {
	vertical-align: bottom;
}


div#Contents div.BoxPatternA.TopSearch01 div.Inner {
	padding: 11px 0 11px 11px;
	background-color: #e1e1e1;
	border: none;
	border-top: 2px solid #c4c4c4;
}


div#Contents div.BoxPatternA.TopSearch01 div.Inner ul {
	margin: 0 ;
}

div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li {
	float: left;
	margin: 0 10px 0 0;
}


/* ---h2 お客さまへのお知らせ--- */

div#Contents div.BoxPatternA.Topics {
	padding-top: 0;
	padding-bottom: 10px;
}

div#Contents div.BoxPatternA.Topics h2.Image,
div#Contents div.Introduction h2.Image,
div#Contents div.Movie h2.Image {
	margin: 0;
	padding: 0 0 5px 5px;
	background: none;
	border-top: none;
	line-height: 1;
	font-size: 120%;
	border-bottom: 2px solid #c4c4c4;
}


div#Contents div.Introduction h2.Image,
div#Contents div.Movie h2.Image{
	margin-bottom: 17px;
}

div#Contents div.BoxPatternA.Topics h2.Image span,
div#Contents div.Introduction h2.Image span,
div#Contents div.Movie h2.Image span {
	background-image: none;
	padding: 5px 4px 3px 10px;
	border-left: 5px solid #009de4 ;
	display: block;
}

div#Contents div.BoxPatternA.Topics h2.Image img {
	vertical-align: bottom;
}

div#Contents div.BoxPatternA.Topics div.Inner {
	border: none;
}

div#Contents div.BoxPatternA.Topics dl.DateListStyle2 { font-size: 100%; }

div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dt { letter-spacing: -1em; }

div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dt span { letter-spacing: normal; }

div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dt span.Date {
	min-width: 107px;
	display: inline-block;
	font-size: 83%;
	*display: inline;
	*zoom: 1;
}

div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dd {
	margin-left: 13.2em;
	padding-top: 0.15em;
}

div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dd .ListStyle2,
div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dd .LinkListStyle2 {
	font-size: 76%;
}

div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dd .ListStyle2 li,
div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dd .LinkListStyle2 li {
	line-height: 160%;
}


/*
div.BoxPatternA.Topics div.Inner table th,
div.BoxPatternA.Topics div.Inner table td {
	border: none;
	vertical-align: top;
	padding: 2px;
}

div.BoxPatternA.Topics div.Inner table th {
	background-color: #fff;
	width: 110px;
}

div.BoxPatternA.Topics div.Inner ul li {
	line-height: 1.5em;
}

div.BoxPatternA.Topics div.Inner ul li.link {
	background: url("/image/h1/add/icon/icon_link_right_top.gif") no-repeat 0 0.1em;　
}

20160915*/

/* ---h2 事業・技術の紹介--- */

div.Introduction h2.Image {
	margin: 0 0 15px;
	padding: 0;
	background: none;
	border: none;
}

div.Introduction h2.Image img {
	vertical-align: bottom;
}

/* ---右メニュ共通ー--- */

div#Contents .Grid4 .Column1 div.BoxPatternA {
	padding-top: 0;
	padding-bottom: 0;
}

div#Contents .Grid4 .Column1 div.BoxPatternA div.Inner {
	border-top-color: #c0c0c0;
}

div#Contents div.BoxPatternA.TopRightBox h2.Title,
div#Contents div.BoxPatternA.InquiryBox h2.Title,
div#Contents div.BoxPatternA.TopRightBox h2.BtnTitle_Recruit {
	border: 1px solid #f0f0f0;
	border-bottom-style: none;
	background-color: #F8F8F8;
	background-image: none;
	padding: 0;
}

div#Contents div.BoxPatternA.TopRightBox h2.Title strong,
div#Contents div.BoxPatternA.InquiryBox h2.Title strong,
div#Contents div.BoxPatternA h2.BtnTitle_Recruit a:link,
div#Contents div.BoxPatternA h2.BtnTitle_Recruit a:visited,
div#Contents div.BoxPatternA h2.BtnTitle_Recruit a:hover,
div#Contents div.BoxPatternA h2.BtnTitle_Recruit a:active,
div#Contents div.BoxPatternA h2.BtnTitle_Recruit a span {
	color:#333;
	font-weight: bold;
	text-decoration: none;
}

div#Contents div.BoxPatternA.TopRightBox h2.Title strong,
div#Contents div.BoxPatternA.InquiryBox h2.Title strong,
div#Contents div.BoxPatternA.TopRightBox h2.BtnTitle_Recruit a {
	display: block;
	padding: 10px 15px 7px;
	border-bottom: 3px solid #007cb7;
}

div#Contents div.BoxPatternA h2.BtnTitle_Recruit a {
	background: none !important;
	border-right-style: none;
}

/* ---右メニュー--- */

div#Contents div.BoxPatternA.TopRightBox h2.Title {
	margin: 0;
	/*padding: 0;*/
}

div.BoxPatternA.TopRightBox h2.Title strong {
	margin:0;
	padding: 0;
	border: none;
	background: none;
}

div.BoxPatternA.TopRightBox h2.Title strong img {
	vertical-align: bottom;
}

div.BoxPatternA.TopRightBox ol {
	list-style: none;
	margin: 0 0 10px;
}

div.BoxPatternA.TopRightBox h2.BtnTitle_Recruit a img {
	vertical-align: bottom;
}

div.BoxPatternA.TopRightBox div.Inner {
	border-top: none;
}

/*　--震災メッセージBOX--　*/

div.BoxPatternC.MsgBox {
	padding: 10px 9px 0;
}


/* ---お問い合わせBOX--- */


div#Contents div.BoxPatternA.InquiryBox h2.Title {
	margin: 0;
	/*padding: 0;*/
}

div.BoxPatternA.InquiryBox h2.Title strong {
	margin:0;
	padding: 0;
	border: none;
	background: none;
}

div.BoxPatternA.InquiryBox h2.Title strong img {
	vertical-align: bottom;
}

div.BoxPatternA.InquiryBox div.Inner {
	border-top: none;
}

div.BoxPatternA.InquiryBox div.Inner.Inquiry {
	padding: 12px 14px 2px;
	overflow: hidden;
}

div.BoxPatternA.InquiryBox ul.Inq {
	margin: 0;
}

div.BoxPatternA.InquiryBox ul.Inq li {
	margin: 0 0 10px 1px;
	width: 204px;
	height: 44px;
}

div.BoxPatternA.InquiryBox ul.Inq li a img {
	vertical-align: bottom;
}

/*　--バドミントンBOX--　*/

div#Contents div.BoxPatternC.BdmBox {
	padding: 10px 24px 0;
}

/*　--アクセスランキング--　*/

ol.Ranking li {
	margin: 0 0 7px 0;
	padding: 0 0 2px 25px;
}

ol li.no1 {	background: url("/images/index/icon_ranking01.jpg") no-repeat 0 0.1em;}
ol li.no2 {	background: url("/images/index/icon_ranking02.jpg") no-repeat 0 0.1em;}
ol li.no3 {	background: url("/images/index/icon_ranking03.gif") no-repeat 0 0.1em;}
ol li.no4 {	background: url("/images/index/icon_ranking04.gif") no-repeat 0 0.1em;}
ol li.no5 {	background: url("/images/index/icon_ranking05.gif") no-repeat 0 0.1em;}


/* ---マウスオーバー_商品・サービスを探す--- */

div.BoxPatternA.TopSearch01 div.Inner ul li a {
	width: 167px;
	height: 84px;
	display: block;
	background-repeat: no-repeat;
	background-position: 0 -84px;
}

li.TopBtnBuss a {
	background-image: url("/images/index/btn_lineup_business.gif");
}

li.TopBtnIssue a {
	background-image: url("/images/index/btn_lineup_issue.gif");
}

li.TopBtnKey a {
	background-image: url("/images/index/btn_lineup_keyword.gif");
}

li.TopBtnList a {
	background-image: url("/images/index/btn_lineup_list.gif");
}

div.BoxPatternA.TopSearch01 div.Inner ul li a:hover,
div.BoxPatternA.TopSearch01 div.Inner ul li a:active {
	background-position: 0 0;
}

li.TopBtnBuss a span,
li.TopBtnIssue a span,
li.TopBtnKey a span,
li.TopBtnList a span {
	display: none;
}

/*--- ピックアップ ---*/

div.Column168 {
	float: left;
	width: 168px;
	margin: 0 0 0 16px;
	display: block;
}

div.Column168.FirstItem { margin: 0; }

/* ---マウスオーバー_h2タイトル　お客さまへお知らせ--- */

/*h2.TopBtnTitle1_topics a:hover { background-position: 0 -38px;
}

h2.TopBtnTitle1_topics a {
	background-image: url("/images/index/top_title1_topics.gif");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 720px;
	height: 38px;
	display: block;
	vertical-align: bottom;
}

h2.TopBtnTitle1_topics a span {
	display: none;
}*/


/* ---マウスオーバー_事業・技術の紹介--- */

p.TopBtnIct a {
	background-image: url("/images/index/btn_itc.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 230px;
	height: 87px;
	display: block;
}

p.TopBtnIctNews a {
	background-image: url("/images/index/btn_itc_news.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 230px;
	height: 87px;
	display: block;
}

p.TopBtnTech a {
	background-image: url("/images/index/btn_tech.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 230px;
	height: 87px;
	display: block;
}

p.TopBtnEng a {
	background-image: url("/images/index/btn_engineering.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 100%;
	height: 104px;
	display: block;
}

p.TopBtnSol a {
	background-image: url("/images/index/btn_solution.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 100%;
	height: 104px;
	display: block;
}

p.TopBtnManu a {
	background-image: url("/images/index/btn_manufacturing.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 230px;
	height: 87px;
	display: block;
}

p.TopBtn_ip a {
	background-image: url("/images/index/banner_ip.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 100%;
	height: 104px;
	display: block;
}

p.TopBtn_plat a {
	background-image: url("/images/index/banner_plat.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 100%;
	height: 104px;
	display: block;
}

p.TopBtn_Column a {
	background-image: url("/images/index/banner_column.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 100%;
	height: 104px;
	display: block;
}

.Column168 p a {
	background-repeat: no-repeat;
/*	background-size: cover;*/
	background-position: 0 0;
	width: 100%;
	height: 193px;
	display: block;
}

p.TopBtnPickup01 a {
	background-image: url("/images/index/btn_pick_up_01.jpg");
}

p.TopBtnPickup02 a {
	background-image: url("/images/index/btn_pick_up_02.jpg");
}

p.TopBtnPickup03 a {
	background-image: url("/images/index/btn_pick_up_03.jpg");
}

p.TopBtnPickup04 a {
	background-image: url("/images/index/btn_pick_up_04.jpg");
}

p.TopBtnMovie a {
	display: block;
	width: 720px;
	height: 118px;
}

p.TopBtnMovie a:hover {
	background-image: url("/images/index/btn_movie_on.jpg");
	background-repeat: no-repeat;
}

p.TopBtnMovie a:hover img {
	display: none;
}

p.TopBtnMovie.forRwd {
	display: none;
	}



p.TopBtnIct a:hover,
p.TopBtnIctNews a:hover,
p.TopBtnTech a:hover,
p.TopBtnManu a:hover { background-position: 0 -87px; }

p.TopBtnPickup01 a:hover,
p.TopBtnPickup01 a:active,
p.TopBtnPickup02 a:hover,
p.TopBtnPickup02 a:active,
p.TopBtnPickup03 a:hover,
p.TopBtnPickup03 a:active,
p.TopBtnPickup04 a:hover,
p.TopBtnPickup04 a:active { background-position: 0 -193px; }



p.TopBtnEng a:hover,
p.TopBtnEng a:active,
p.TopBtnSol a:hover,
p.TopBtnSol a:active,
p.TopBtn_ip a:hover,
p.TopBtn_ip a:active,
p.TopBtn_plat a:hover,
p.TopBtn_plat a:active,
p.TopBtn_Column a:hover,
p.TopBtn_Column a:active { background-position: 0 -104px; }

p.TopBtnIct a span,
p.TopBtnIctNews a span,
p.TopBtnTech a span,
p.TopBtnEng a span,
p.TopBtnSol a span,
p.TopBtnManu a span,
p.TopBtn_ip a span,
p.TopBtn_plat a span,
p.TopBtn_Column a span,
p.TopBtnPickup01 a span,
p.TopBtnPickup02 a span,
p.TopBtnPickup03 a span,
p.TopBtnPickup04 a span {
	display: none;
}

/* ---マウスオーバー_採用--- */

/*div#Contents div.BoxPatternA h2.BtnTitle_Recruit a {
	background-image: url("/images/index/top_box_title_recruit.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 230px;
	height: 43px;
	display: block;
	vertical-align: bottom;
}

div#Contents div.BoxPatternA h2.BtnTitle_Recruit a:hover { background-position: 0 -43px; }

div#Contents div.BoxPatternA h2.BtnTitle_Recruit a span {
	display: none;
}

*/

/* ---マウスオーバー_お問い合わせ--- */

li.BtnIncForm a {
	background-image: url("/images/index/btn_inquiry_form.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 204px;
	height: 44px;
	display: block;
	vertical-align: bottom;
}

li.BtnIncTel a {
	background-image: url("/images/index/btn_inquiry_telephone.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 204px;
	height: 44px;
	display: block;
}

li.BtnIncCon a {
	background-image: url("/images/index/btn_inquiry_contact.jpg");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 204px;
	height: 44px;
	display: block;
}

li.BtnIncForm a:hover,
li.BtnIncForm a:active,
li.BtnIncTel a:hover,
li.BtnIncTel a:active,
li.BtnIncCon a:hover,
li.BtnIncCon a:active { background-position: 0 100%; }

li.BtnIncForm a span,
li.BtnIncTel a span,
li.BtnIncCon a span {
	display: none;
}

/* ---下余白--- */

div.Bottom0 { margin-bottom: 0px; }
div.Bottom5 { margin-bottom: 5px; }
div.Bottom10 { margin-bottom: 10px; }
div.Bottom15 { margin-bottom: 15px; }
div.Bottom20 { margin-bottom: 20px; }
div.Bottom25 { margin-bottom: 25px; }
div.Bottom30 { margin-bottom: 30px; }


/* content===========================================

[-] for all
[-] for 995px -
[-] for - 994px
[-] for - 767px
[-] for - 579px
[-] for - 399px

===================================================== */

/* for 995px -
=========================================================================================== */

@media screen and (min-width: 995px) {

}


/* for - 994px
=========================================================================================== */

@media screen and (max-width: 994px) {
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner {
		padding-right: 1px;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li {
		width: 25%;
		padding-right: 10px;
		margin-right: 0;
		box-sizing: border-box;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a {
		width: 100%;
		height: 0;
		padding-bottom: 50.3%;
		background-size: 100% auto;
		background-position: 0 100%;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:hover,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:active {
		background-position: 0 0;
	}

	.JS .Introduction .Column1andHalf p a {
		height: 0;
		padding-bottom: 29.46%;
		-webkit-background-size: 100% 200%;
		background-size: 100% 200%;
	}

	.JS .BoxPatternA.Movie p a{
		height: auto;
		max-width: 100%;
		background-color: #fff;
		background-size: cover;
	}

	.JS .BoxPatternA.Movie p a:hover {
		padding-bottom: 16.38%;
	}


	.JS .Pickup { margin-left: -16px; }

	.JS .Pickup .Column168 {
		width: 25%;
		margin-left: 0;
		padding-left: 16px;
		box-sizing: border-box;
	}

	.JS .Pickup .Column168 p a {
		width: 100%;
		height: 0;
		/*padding-bottom: 100%; 20170413*/
		padding-bottom: 114.88%;
		/*-webkit-background-size: 100% 200%;
		background-size: 100% 200%; 20170413*/
		-webkit-background-size: cover;
		background-size: cover;
	}

/* 20170115bk 不要なら削除
	.JS .Introduction .Column1 p a {
		width: 96%;
		height: 0;
		padding-bottom: 37.8%;
		-webkit-background-size: 100% 200%;
		background-size: 100% 200%;
	}

*/

	.JS div.BoxPatternA.InquiryBox ul.Inq li {
		width: 100%;
		height: 0;
		margin-left: 0;
		padding-bottom: 21.57%;
		float: none;
	}


	.JS div.BoxPatternA.InquiryBox ul.Inq li a {
		width: 100%;
		-webkit-background-size: 100% 200%;
		background-size: 100% 200%;
		height: 0;
		padding-bottom: 21.57%;
	}

	.JS p.TopBtn_ip a,
	.JS p.TopBtn_plat a,
	.JS p.TopBtn_Column a {
		height: 0;
		padding-bottom: 14.44444444%;
		background-size: 100% 200%;
	}

	.JS p.TopBtnIct a:hover,
	.JS p.TopBtnIctNews a:hover,
	.JS p.TopBtnManu a:hover,
	.JS p.TopBtnTech a:hover,
	.JS p.TopBtnEng a:hover,
	.JS p.TopBtnEng a:active,
	.JS p.TopBtnSol a:hover,
	.JS p.TopBtnSol a:active,
	.JS p.TopBtn_ip a:hover,
	.JS p.TopBtn_ip a:active,
	.JS p.TopBtn_plat a:hover,
	.JS p.TopBtn_plat a:active,
	.JS p.TopBtn_Column a:hover,
	.JS p.TopBtn_Column a:active,
	.JS p.TopBtnPickup01 a:hover,
	.JS p.TopBtnPickup01 a:active,
	.JS p.TopBtnPickup02 a:hover,
	.JS p.TopBtnPickup02 a:active,
	.JS p.TopBtnPickup03 a:hover,
	.JS p.TopBtnPickup03 a:active,
	.JS p.TopBtnPickup04 a:hover,
	.JS p.TopBtnPickup04 a:active { background-position: 0 100%; }

}

/* for - 767px
=========================================================================================== */

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

	.JS .Grid4 .Introduction .Column1andHalf {
		float: left;
		/*width: 33.333333%;*/
		width: 50%;
	}

	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 {
		display: -webkit-flex;
		-webkit-flex-flow: row wrap;
		-webkit-justify-content: flex-end;
		-webkit-align-items: stretch;
		-webkit-align-content: stretch;
		display: flex;
		flex-flow: row wrap;
		justify-content: flex-end;
		align-items: stretch;
		align-content: stretch;
		margin-left: -15px;
	}

	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 div.BoxPatternA,
	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 div.BoxPatternC {
		display: -webkit-flex;
		-webkit-flex-flow: column nowrap;
		-webkit-justify-content: flex-start;
		-webkit-align-items: stretch;
		-webkit-align-content: stretch;
		display: flex;
		flex-flow: column nowrap;
		justify-content: flex-start;
		align-items: stretch;
		align-content: stretch;
		flex-basis: calc(50% - 15px);
		margin-left: 15px;
		box-sizing: border-box;
	}

	.JS div#Contents .Grid4 .Column1 div.BoxPatternA div.Inner {
		-webkit-flex-grow: 1;
		flex-grow: 1;
	}

	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 div.BoxPatternA ul.LinkListStyle2 {
		margin-bottom: 15px;
	}

	.JS div.BoxPatternA.InquiryBox ul.Inq {
		max-width: 204px;
		margin-left: auto;
		margin-right: auto;
	}

	.JS div.BoxPatternA.InquiryBox ul.Inq li,
	.JS div.BoxPatternA.InquiryBox ul.Inq li a {
		width: 100%;
		height: 44px;
		padding-bottom: 0;
	}

	.JS div#Contents div.BoxPatternC.BdmBox {
		padding-left: 0;
		padding-right: 0;
	}

	.JS div.BoxPatternC.BdmBox p.ImgOnlyStyle,
	.JS div.BoxPatternC.BdmBox ul.LinkListStyle2 {
		width: calc(100% - 20px);
		max-width: 180px;
		margin-left: auto;
		margin-right: auto;
	}

	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 > .ImgOnlyStyle.CenterAdjust {
		margin-left: 15px;
		margin-right: 0;
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.JS .BoxPatternA.Movie p a:hover {
		padding-bottom: 16.40%;
}

}


@media screen and (-ms-high-contrast: none) and (max-width: 767px) {
	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 div.BoxPatternC.BdmBox { flex-basis: calc(50% - 17px); }
}


/* for - 579px
=========================================================================================== */

@media screen and (max-width: 579px) {
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner {
		padding-bottom: 1px;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li {
		width: 50%;
		padding-bottom: 10px;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a {
		width: 100%;
		height: 85px;
		padding-bottom: 10px;
		text-decoration: none;
		background-color: #fff;
		background-image: url("/images/index/icon_link.png");
		background-repeat: no-repeat;
		background-position: calc(100% - 3px) calc(100% - 3px) !important;
		background-size: 10px 10px;
		box-sizing: border-box;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:hover,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:active {
		padding-top: 10px;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a span {
		display: block;
		width: 100%;
		height: 70px;
		padding: 20px 5px 10px 50%;
		color: #333;
		font-weight: bold;
		background-repeat: no-repeat;
		background-position: 13% 12px;
		background-size: 70px 114px;
		box-sizing: border-box;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:hover span,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:active span {
		padding-top: 10px;
		background-position: 13% -56px;
	}

	.JS li.TopBtnBuss a span {
		background-image: url("/images/index/icon_lineup_business.png");
	}

	.JS li.TopBtnIssue a span {
		background-image: url("/images/index/icon_lineup_issue.png");
	}

	.JS li.TopBtnKey a span {
		background-image: url("/images/index/icon_lineup_keyword.png");
	}

	.JS li.TopBtnList a span {
		background-image: url("/images/index/icon_lineup_list.png");
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a:hover,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a:active {
		padding-top: 20px;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a span {
		padding-left: 42%;
		background-size: 60px auto;
		background-position: 13% 20px;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a:hover span,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a:active span {
		padding-top: 0;
		background-position: 13% -50px;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a span strong {
		display: block;
		margin: 0;
		font-size: 130%;
		color: #333;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a span strong { font-size: 110%; }

	.JS div#Contents div.BoxPatternA.Topics dl.DateListStyle2 dd { margin-left: 0; }

	.JS .Grid4 .Introduction .ColumnSet {
		max-width: 353px;
		margin: 0 auto;
	}

	.JS .Grid4 .Introduction .Column1andHalf {
		float: none;
		width: 100%;
		padding-left: 0;
	}

	.JS .Grid4 .Introduction .Column1andHalf.FirstItem {
		margin-bottom: 15px;
	}

	.JS .Introduction .Column1andHalf p a {
		height: 104px;
		padding-bottom: 0;
	}

	.JS .Pickup {
		max-width: 352px;
		margin: 0 auto 15px;
	}

	.JS .Pickup .Column168 {
		width: 50%;
		padding-left: 8px;
		margin-bottom: 15px;
	}

	.JS .Pickup .Column168:nth-child(odd) {
		padding-left: 0;
		padding-right: 8px;
	}

	.JS div.BoxPatternA.InquiryBox ul.Inq li,
	.JS div.BoxPatternA.InquiryBox ul.Inq li a {
		height: 0;
		padding-bottom: 21.57%;
	}

	.JS p.TopBtnMovie {
	display: none;
	}


	.JS p.TopBtnMovie.forRwd {
	display: block;
	text-align: center;
	max-width: 353px;
	margin: 0 auto;
	}

	.JS .BoxPatternA.Movie p.TopBtnMovie.forRwd a:hover {
		background-image: url("/images/index/btn_movie_rwd_on.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		padding-bottom: 33.42%;
	}

	.JS .BoxPatternA.Movie p.TopBtnMovie.forRwd a:hover img {
		display: none;
	}



}


/* for - 399px
=========================================================================================== */


@media screen and (max-width: 399px) {
	.JS .Introduction .Column1andHalf p a {
		height: 0;
		padding-bottom: 37.96%;
	}


	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul {
		letter-spacing: -1em;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li {
		letter-spacing: normal;
		float: none;
		display: inline-block;
		vertical-align: top;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a {
		height: 0;
		padding-bottom: 50.3%;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:hover,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:active {
		padding-top: 7%;
		padding-bottom: 43.3%;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a span {
		height: 0;
		background-size: 40% auto;
		font-size: 90%;
		padding-top: 12%;
		padding-bottom: 28%;
		background-position: 13% -30%;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:hover span,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a:active span {
		padding-top: 5%;
		background-position: 13% 100%;
	}


	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a:hover,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a:active {
		padding-top: 12%;
		padding-bottom: 38.3%;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a span {
		padding-left: 33%;
		padding-right: 0;
		padding-bottom: 25%;
		background-size: 30% auto;
		background-position: 5% -100%;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a:hover span,
	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li.TopBtnKey a:active span {
		padding-top: 0;
		background-position: 5% 100%;
	}

	.JS div#Contents div.BoxPatternA.TopSearch01 div.Inner ul li a span strong { line-height: 100%; }

	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1,
	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 div.BoxPatternA,
	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 div.BoxPatternC {
		display: block;
		margin-left: 0;
	}

	.JS div.BoxPatternA.InquiryBox ul.Inq li,
	.JS div.BoxPatternA.InquiryBox ul.Inq li a {
		height: 44px;
		padding-bottom: 0;
	}

	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 div.BoxPatternA ul.LinkListStyle2 { margin-bottom: 10px; }

	.JS div#Contents .Grid4 > .Section > .ColumnSet > .Column1 > .ImgOnlyStyle.CenterAdjust {
		display: block;
		width: auto;
		margin-left: auto;
		margin-right: auto;
	}

}