@charset "Shift_JIS";
:root {
  --color-pred1:#fa000f;
  --color-pred2:#cc0000;
  --color-pwhite:#ffffff;
  --color-pgray1:#f4f4f4;
  --color-pgray2:#d9d9d9;
  --color-pgray3:#b3b3b3;
  --color-pgray4:#737373;
  --color-pgray5:#4d4d4d;
  --color-pgray6:#222222;
  --color-pblack:#0c0c0c;
	--unit:8px;
	--gap:25px;
	--ratio:16 / 9;
}



/* ===================================================
   共通
==================================================== */
.bg{
	background-color:var(--color-pgray1);
	/*padding:calc(var(--gap) * 3) 0;*/
}
.bg2{
	background-color:var(--color-pgray2);
	/*padding:calc(var(--gap) * 3) 0;*/
}
.bgNeutral{
	background-image: url(/image/hsc2/top/bg.jpg);
	background-position: top center;
	background-repeat:no-repeat;
	background-size:cover;
}
.bgNeutral2{
	background-image: url(/image/hsc2/top/bg2.jpg);
	background-position: center center;
	background-repeat:no-repeat;
	background-size:cover;
}
.bgGray{
	background-image: url(/image/hsc2/top/bg3.jpg);
	background-position: center center;
	background-repeat:no-repeat;
	background-size:cover;
}
.ColumnSet img{
  width: 100%;
}
#Content .mb25 {
	margin-bottom: 25px;
}
.withShadow {
	box-shadow: 1px 1px 10px 0 var(--color-pgray2), -1px -1px 10px 0 var(--color-pgray2);
}
.plate {
	padding:var(--gap);
	background-color:var(--color-pgray1);
	border-radius:var(--unit);
	box-sizing:border-box;
}
.border{
	border:1px solid var(--color-pgray2);
}
.ImgOnlyStyle img{
	margin:inherit;
}
.ColumnSet:after{
	content:none;
}
.ShowU1305,
.ShowU995,
.ShowU580,
.ShowU400 {
	display: none;
}
.disp_ib {
	display: inline-block;
	max-width: 100%;
}
.disp_flex {
	display: flex;
}
.hidden {
	visibility: hidden;
}
@media screen and (max-width: 1304px) {
	.JS #Contents{
		padding:inherit;
	}
	.l-section{
		margin:0 15px;
	}
  .OptionWideRWD .GridSet,.OptionWideRWD .ColumnSet {
    margin:inherit;
  }
}



/* ===================================================
   レイアウト
==================================================== */
.ColumnSet.Flex {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap:20px;
	flex-wrap: wrap;
}
.ColumnSet.Flex > *{
	flex:1;
}
.l-section__header,
.l-section .Section,
.ColumnSet .TxtArea{
	display:flex;
	gap:var(--gap);
	flex-direction:column;
}
.ColumnSet.Flex .Inner {
	position: relative;
}
.ColumnSet.Flex .Column2 {
	max-width: 625px;
	width:100%;
}
.ColumnSet.Flex:after {
	display: none;
}
.ColumnSet.Flex.Reverse {
	flex-direction: row-reverse;
}
.ColumnSet.Flex.AlignCenter {
	align-items: center;
}
.ColumnSet.Flex.Stretch {
	align-items: stretch;
}
.ColumnSet.Flex .Column2 {
	display: flex;
	max-width: 600px;
	margin: 0;
}
.ColumnSet.Flex.Box .Inner {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	margin-bottom: 15px;
}
.ColumnSet.Flex.Box .Inner .Img {
	position: relative;
	width: 46.667%;
	height: 280px;
}
.ColumnSet.Flex.Box .Inner .Img img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
}
.ColumnSet.Flex.Box .Inner .Txt {
	display: flex;
	flex-grow: 1;
	height: 100%;
	margin-left: -23.3334%;
	background-color: #ffffff;
	box-shadow: 1px 1px 10px 0 #e5e5e5, -1px -1px 10px 0 #e5e5e5;
}
.ColumnSet.Flex.Box .Inner .Txt .TxtInner {
	width: 100%;
	height: 100%;
	min-height: 335px;
	padding: 50px 30px 50px 37%;
	box-sizing: border-box;
}
.ColumnSet.Flex.Box .Inner .Txt h2 {
	margin-bottom: 10px;
}
.ColumnSet.Flex.Box .Inner .Txt .LinkListStyle1 {
	margin-bottom: 0;
}
.ColumnSet.Flex.Special {
	max-width: 1125px;
	margin: 0 auto 40px;
}
.ColumnSet.Flex.Special .Column {
	width: 40%;
}
.ColumnSet.Flex.Special .Column h2 {
	margin: 0 0 20px;
	background-image: none;
}
.ColumnSet.Flex.Special .Column h2 span {
	padding: 0;
	font-size: 200%;
	color: #333333;
	background-color: transparent;
}
.ColumnSet.Flex.Special .Column .Txt {
	font-weight: bold;
}
.ColumnSet.Flex.Special .Img {
	width: 20%;
	padding: 20px 6% 0;
	text-align: center;
	box-sizing: border-box;
}
.ColumnSet.Flex.Box01 .Column2 {
	max-width: none;
	margin-bottom: 25px;
	padding-top: 0.8em;
}
.ColumnSet.Flex.Box01 .Column2 .Inner {
	position: relative;
	display: flex;
	padding: 50px 20px 40px;
	flex-direction: column;
	justify-content: space-between;
	background-color: #f2f2f2;
}
.ColumnSet.Flex.Box01 .Column2 .Inner h3 {
	position: absolute;
	left: 20px;
	top: 0;
	width: calc(100% - 40px);
	margin-top: -0.6em;
	text-align: center;
	font-size: 150%;
	color: #cc0022
}
.ColumnSet.Flex.Box01 .Column2 .Inner h3 span {
	position: relative;
	display: inline-block;
	padding: 0 40px;
}
.ColumnSet.Flex.Box01 .Column2 .Inner h3 span:before,
.ColumnSet.Flex.Box01 .Column2 .Inner h3 span:after {
	content: "";
	position: absolute;
	top: 50%;
	width: 1px;
	height: 120%;
	background-color: #000000;
	transform-origin: top;
}
.ColumnSet.Flex.Box01 .Column2 .Inner h3 span:before {
	left: 0;
	transform: translateY(-40%) rotate(-45deg);
}
.ColumnSet.Flex.Box01 .Column2 .Inner h3 span:after {
	right: 0;
	transform: translateY(-40%) rotate(45deg);
}
.ColumnSet.Flex.Box01 .Column2 .Inner .CatchCopy {
	margin-bottom: 15px;
	font-size: 100%;
	font-weight: bold;
}
.ColumnSet.Flex.Box01 .Column2 .Inner .BoxList {
	display: flex;
	flex-wrap: wrap;
	margin-left: -10px;
	padding-top: 10px;
}
.ColumnSet.Flex.Box01 .Column2 .Inner .BoxList li {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: calc(33.33333333% - 10px);
	margin: 0 0 10px 10px;
	padding: 15px 5px 25px;
	background-color: #ffffff;
	box-sizing: border-box;
}
.ColumnSet.Flex.Box01 .Column2 .Inner h4 {
	font-size: 90%;
	line-height: 140%;
	text-align: center;
}
.ColumnSet.Flex.Box01 .Column2 .Inner .Img {
	display: flex;
	width: 100%;
	height: 90px;
	justify-content: center;
	align-items: center;
}
.ColumnSet.Flex.Box01 .Column2 .Inner .TextStyle1.etc {
	position: absolute;
	bottom: 0;
	right: 20px;
}
body #HeaderArea2 {
	z-index: 10;
}
body {
	padding-bottom: 0;
	letter-spacing: 0.075em;
}
#TopicPath ul:not(.Visible) {
	visibility: hidden;
}
#TopicPath.Wide ul {
	width: 1275px;
}
#TopicPath + .l-wrapper {
	margin-top: -1px;
	padding-top: 1px;
}
.l-section {
	position: relative;
}
.l-section .Section {
	position: relative;
	z-index: 1;
}
em.download {
	font-style: normal;
	white-space: nowrap;
}
img + em.download {
	display: none;
}
/* MegaMenu */
#HeaderArea2 #MegaMenu {
	width: auto!important;
	margin: 0!important;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: row;
	flex-direction: row;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
#HeaderArea2 .MMSet {
	top: 100%;
}
#HeaderArea2 .MMGlobalNaviStyle a {
	line-height: 60px;
}
#HeaderArea2 .MMGlobalNaviStyle.Current.MMSetMenu a {
	line-height: 60px;
}
#HeaderArea2 .MMGlobalNaviStyle.Current.MMSetMenu a.Strong strong {
	line-height: 60px;
}
#HeaderArea2 .MMGlobalNaviStyle.Current a strong {
	line-height: 60px;
}
#HeaderArea2 .MMGlobalNaviStyle.Current a em {
	line-height: 60px;
}
#HeaderArea2 .MMGlobalNaviStyle.Current.MMSetMenu a em {
	line-height: 60px;
}
	@media screen and (max-width: 1304px) {
	}
	@media screen and (max-width: 994px) {
	}
	@media screen and (min-width: 768px) {
		section:nth-child(n+2) .l-section .Section {
			padding: 90px 0 75px;
		}
		.l-section .Section.Wide {
			padding-bottom: 70px;
		}
	}
	@media screen and (max-width: 767px) {
		section:nth-child(n+2) .l-section .Section {
			padding: 45px 0 32px;
		}
		#HeaderArea2 > .Container #MegaMenu {
			display: none;
		}
	}
	@media screen and (max-width: 579px) {
	}
	@media screen and (max-width: 399px) {
	}



/* ===================================================
   見出し
==================================================== */
h1,h2,h3,h4,h5{
	color:inherit;
	background:none;
}
h1 span,h2 span,h3 span,h4 span,h5 span{
	background-color:inherit;
	padding:0 0 0.5em ;
}
h1.c-hd--type01 .c-hd--type01__main,
h2.c-hd--type01 .c-hd--type01__main{
	font-weight:bold;
}
h1.c-hd--type01{
	padding-top: 25px;
	display: block;
	margin-bottom: 0;
	white-space: normal;
	font-size: 100%;
}
h1.c-hd--type01,
h2.c-hd--type01{
	margin-left: 0;
	margin-right: 0;
	background-image: none;
}
h1.c-hd--type01 span,
h2.c-hd--type01 span{
	padding: 0;
}
h1.c-hd--type01 span.c-hd--type01__sub,
h2.c-hd--type01 span.c-hd--type01__sub{
	font-size:1.25rem;
	color:var(--color-pgray4);
	font-weight: normal;
	display: block;
	letter-spacing:0;
}
h2.c-hd--type02,h2.c-hd--type02 span{
	font-size:1.625rem;
  margin-bottom:0;
}
h2.c-hd--type02::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  margin: 0 auto;
  background: linear-gradient(to right, var(--color-pred1) 0 150px, var(--color-pgray2) 150px 100%);
}
.CatchCopy.Large {
	font-size:1.25rem;
	margin-bottom: 0;
}
@media screen and (min-width: 768px) {
	h1.c-hd--type01 span.c-hd--type01__main,
	h2.c-hd--type01 span.c-hd--type01__main{
		font-size:2.25rem;
		line-height:1.4;
	}
}
@media screen and (max-width: 767px) {
	h1.c-hd--type01 span.c-hd--type01__main,
	h2.c-hd--type01 span.c-hd--type01__main{
		font-size:2rem;
		line-height:1.4;
	}
}



/* ===================================================
   ボタン、リンク
==================================================== */
main .LinkListStyle1 li{
	padding-top:0;
}
main #Contents .LinkListStyle1 li a:link,
main #Contents .LinkListStyle1 li a:visited{
	background-image:none;
	color:var(--color-pred2);
	font-weight: 500;
	transition: 0.2s;
	margin:inherit;
	padding:inherit;
	align-items: center;
}
main #Contents li.NewWin a{
	background-image:none !important;
}
main a:not(.ImgOnlyStyle .ModalYouTubeLink)::after,
main .InnerLink2 a:not(.ImgOnlyStyle .ModalYouTubeLink)::after{
	content:"";
	width:1em;
	height:1em;
	display:inline-block;
	position: relative;
	font-weight:normal;
	vertical-align:baseline;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
	margin-left:0.25em;
	background-image:url(/image/hsc2/solution/icon/icon_arrow_r.svg);
}
.no-icon a::after{
	content:none !important;
}
main .InnerLink1 a:not(.ImgOnlyStyle .ModalYouTubeLink)::after,
main .InnerLink1 a:not(.ImgOnlyStyle .ModalYouTubeLink):hover::after{
	background-image:url(/image/hsc2/solution/icon/icon_arrow_w.svg);
}
main a:not(.ImgOnlyStyle .ModalYouTubeLink)[href*="youtube"]::after,
.JS .ResponsiveLinkListStyle ul.LinkListStyle2 li a[href*="youtube"]{
	width:1.5em;
	height:1em;
	background-size:cover;
	width:1.5rem;
	background-image:url(/image/hsc2/solution/icon/icon_movie_r.svg);
}
main .InnerLink1 a:not(.ImgOnlyStyle .ModalYouTubeLink)[href*="youtube"]::after{
	background-image:url(/image/hsc2/solution/icon/icon_movie_w.svg);
}
main a:not(.ImgOnlyStyle .ModalYouTubeLink)[href*="youtube"]:hover::after,
main .InnerLink2 a:not(.ImgOnlyStyle .ModalYouTubeLink)[href*="youtube"]::after,
.JS .ResponsiveLinkListStyle ul.LinkListStyle1 li a[href*="youtube"]:hover{
	background-image:url(/image/hsc2/solution/icon/icon_movie_r.svg);
}
main #Contents .InnerLink1 a[target*="_blank"]::after,
#Contents .InnerLink1 a[target*="_blank"]::after{
	background-image:url(/image/hsc2/solution/icon/icon_newwin_w.svg);
}
main #Contents a[target*="_blank"]::after{
	background-image:url(/image/hsc2/solution/icon/icon_newwin_r.svg);
}
main #Contents a[href*=".pdf"]::after,
main #Contents a[target*="_blank"][href*=".pdf"]::after{
	background-image:url(/image/hsc2/solution/icon/icon_pdf_r.svg);
}
main #Contents a[href*=".pdf"]:hover::after,
main #Contents a[target*="_blank"][href*=".pdf"]:hover::after{
	background-image:url(/image/hsc2/solution/icon/icon_pdf_r.svg);
}
/* InnerLink2 */
main #Contents .InnerLink2 a:hover::after{
	background-image:url(/image/hsc2/solution/icon/icon_arrow.svg);
}
main #Contents .InnerLink2 a[target*="_blank"]:hover::after{
	background-image:url(/image/hsc2/solution/icon/icon_newwin.svg);
}
main #Contents .InnerLink2 a:not(.ImgOnlyStyle .ModalYouTubeLink)[href*="youtube"]:hover::after{
	background-image:url(/image/hsc2/solution/icon/icon_movie.svg);
}
main .ImgOnlyStyle a::after {
  content: none;
}

main [class*="InnerLink"] a,
#slidebox [class*="InnerLink"]{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:13rem;
	border-radius:100px;
	border:2px solid var(--color-pred2);
	padding:var(--unit) calc(var(--unit) * 3);
	font-weight:bold;
	text-decoration:none;
	text-align:center;
	color:var(--color-pwhite);
	background-color:var(--color-pred2);
}
main .InnerLink1 a,
main .InnerLink1 a:visited,
#slidebox .InnerLink1{
	background-color:var(--color-pred2);
	color:var(--color-pwhite);
}
main .InnerLink2 a{
	color:var(--color-pred2);
	background-color:var(--color-pwhite);
}
main .InnerLink1 a:hover,
main .InnerLink1 a:active,
#slidebox a:hover .InnerLink1,
#slidebox a:active .InnerLink1 {
	border:2px solid var(--color-pblack);
	background-color:var(--color-pblack);
}
main .InnerLink2 a:hover{
	border:2px solid var(--color-pblack);
	color:var(--color-pblack);
}
main .InnerLink2 a:hover::after{
	background-image:url(/image/hsc2/solution/icon/icon_arrow.svg);
}
main .ItemList li{
	font-size:1.125rem;
	margin-bottom:calc(var(--gap) / 2);
}
.ButtonStyle1.Flex {
	display: flex;
	flex-wrap: wrap;
	max-width: 100%;
}
.ButtonStyle1.Flex.CenterAdjust {
	justify-content: center;
}
.ButtonStyle1.Flex a {
	display: flex;
	padding: 5px 40px 2px;
	justify-content: center;
	align-items: center;
	line-height: 150%;
	background-position: right 15px center;
	background-size: 32px auto;
	box-sizing: border-box;
	transition: 0.2s;
}
.ButtonStyle1.Flex a:hover,
.ButtonStyle1.Flex a:active {
	background-position: right 12px center;
}
.l-section .Section .ButtonStyle1.Flex a {
	width:100%;
	max-width: 450px;
	min-height: 100px;
	font-size: 112.5%;
	color: #333333;
	background-color: rgba(255, 255, 255, 0.7);
	background-image: url(/image/jp/r1/icon/icon_link_right_hd.gif);
	background-size: 32px auto;
	border: 1px solid #333333;
}
.l-section .Section .ButtonStyle1.Flex a:hover,
.l-section .Section .ButtonStyle1.Flex a:active {
	color: #ffffff;
	background-color: #b1000e;
	background-image: url(/image/jp/r1/icon/icon_link_right_white_hd.gif);
	border-color: #b1000e;
}
.l-section .Section .ColumnSet + .ButtonStyle1.Flex,
.l-section .Section .p-summary + .ButtonStyle1.Flex {
	margin-top: 55px;
}
.l-section .Section .ButtonStyle1.Flex a:nth-child(n+2) {
	margin-top: 15px;
}
.l-section .SectionInner .ButtonStyle1.Flex {
	margin-top: 70px;
}
	@media screen and (min-width: 768px) {
		main .InnerLink1 a{
			min-width:20rem;
		}
	}
	@media screen and (max-width: 767px) {
		.JS .ResponsiveLinkListStyle ul.LinkListStyle1 li{
			padding:0;
		}
		.JS .ResponsiveLinkListStyle ul.LinkListStyle1 li a[target*="_blank"]::after{
			background-image:url(/image/hsc2/solution/icon/icon_newwin.svg);
		}
		.JS .ResponsiveLinkListStyle ul.LinkListStyle1 li a[target*="_blank"]:hover::after{
			background-image:url(/image/hsc2/solution/icon/icon_newwin_r.svg);
		}
		.JS .ResponsiveLinkListStyle ul.LinkListStyle1 li a[href*="youtube"]::after{
			background-image:url(/image/hsc2/solution/icon/icon_movie.svg);
		}
		.JS .ResponsiveLinkListStyle ul.LinkListStyle1 li a[href*="youtube"]:hover::after{
			background-image:url(/image/hsc2/solution/icon/icon_movie_r.svg);
		}
		.JS .ResponsiveLinkListStyle ul.LinkListStyle1 li a:hover{
			color:var(--color-pred2);
		}
		.JS .ResponsiveLinkListStyle ul.LinkListStyle1 li a:hover:after{
			right:7px;
		}
	}



/* ===========================================
	リスト
=========================================== */
.l-section .SectionInner .InnerLinksArea {
	padding: 25px 0 10px;
}
.l-section .SectionInner .InnerLinksArea .LinkListStyle5 li {
	margin-right: 20px;
}
.l-section .SectionInner .InnerLinksArea .LinkListStyle5 li:last-child {
	margin-right: 0;
}
.l-section .SectionInner .Section .ResponsiveLinkListStyle {
	display: flex;
	flex-wrap: wrap;
	margin-left: -25px;
}
.l-section .SectionInner .Section .LinkListStyle1 {
	width: 50%;
	margin: 0;
	padding-left: 25px;
	box-sizing: border-box;
}
.l-section .SectionInner .Section .LinkListStyle1.long {
	width: 100%;
	margin-top: 15px;
}



/* ===========================================
	ボックス *強調
=========================================== */
.SpecialBox{
	margin: 0 auto 30px;
	justify-content: flex-start;
	background-color:var(--color-pgray1);
	border:0;
	padding:2rem;
	max-width: 925px;
	font-size:0.875rem;
}
.SpecialBox [class*="InnerLink"] a{
	font-weight:normal;
}
.SpecialBox .Flex{
	display:flex;
	gap:var(--gap);
}
.SpecialBox .LinkListStyle1{
	margin-bottom:0;
}
	@media screen and (max-width: 767px) {
		.SpecialBox .Flex{
			flex-direction:column;
		}
	}


/* ===================================================
   ブランディング
==================================================== */
#Branding {
	margin-bottom: 25px;
	overflow: hidden;
	position: relative;
	padding-bottom: 45px;
	position:relative;
}
#Branding a::after {
	content: none;
}
#Branding #slidebox a{
	text-decoration:none;
	color:var(--color-pblack);
}
#Branding a .InnerLink1::after{	content:"";
	width:1em;
	height:1em;
	display:inline-block;
	position: relative;
	background-image:url(/image/hsc2/solution/icon/icon_arrow_w.svg);
}
#Branding #slidebox .slide {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	box-sizing: border-box;
}
#Branding #slidebox .slide.slide01 {
	background-image: url(/image/hsc2/top/branding4_bg.jpg);
}
#Branding #slidebox .slide.slide02 {
	background-image: url(/image/hsc2/top/branding5_bg.jpg);
}
#Branding #slidebox .slide.slide03 {
	background-image: url(/image/hsc2/top/branding3_bg.jpg);
}
#Branding #slidebox .slide .Inner {
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	box-sizing:border-box;
	text-align:center;
}
#Branding #slidebox .slide .Inner .Title {
	font-weight:bold;
	margin-bottom:var(--gap);
}
#Branding #slidebox .slick-dots {
	position:absolute;
	padding:1rem;
  left: -100px;
  margin-left: 50%;
}
#Branding #slidebox .slick-dots li {
	display: inline-block;
	width: 20px;
	margin: 0 10px;
	vertical-align: top;
	background-color: transparent;
}
#Branding #slidebox .slick-dots button {
	position: relative;
	display: block;
	width: 20px;
	height: 20px;
	font-size: 0;
	line-height: 100%;
	border-style: none;
	background-color: transparent;
	cursor: pointer;
}
#Branding #slidebox .slick-dots button:before {
	content: "";
	position: absolute;
	top: 5px;
	left: 5px;
	display: block;
	border-radius:10px;
	width: 10px;
	height: 10px;
	background-color:var(--color-pgray3);
}
#Branding #slidebox .slick-dots .slick-active button:before,
.PC #Branding #slidebox .slick-dots button:hover:before,
.PC #Branding #slidebox .slick-dots button:active:before {
	background-color:var(--color-pred2);
}
#Branding #Controller button {
	position: relative;
	display: block;
	width: 13px;
	height: 16px;
	margin: 0 15px;
	line-height: 100%;
	cursor: pointer;
	background-color: transparent;
	border-style: none;
}
#Branding #Controller button.pause:before,
#Branding #Controller button.pause:after {
	content: "";
	position: absolute;
	top: 0;
	width: 5px;
	height: 100%;
	background-color: #b1000e;
}
#Branding #Controller button.pause:before {
	left: 0;
}
#Branding #Controller button.pause:after {
	right: 0;
}
#Branding #Controller button.play:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	border-left: 13px solid #b1000e;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
}
#Branding .Controller {
	position: absolute;
	bottom:3px;
	margin-left: 50%;
	left: +50px;
}
#Branding .Controller button {
  position: relative;
  display: flex;
  justify-content:space-evenly;
  align-items: center;
	cursor: pointer;
	border-style:none;
	border-radius:4px;
	width:32px;
	height:32px;
	background-color:var(--color-pgray2);
}
#Branding .Controller button:before,
#Branding .Controller button:after {
	content: "";
	width:4px;
	height:1rem;
	border-radius:3px;
	background-color:var(--color-pblack);
}
#Branding .Controller button:before {
	left: 0;
}
#Branding .Controller button:after {
	right: 0;
}
#Branding .Controller button.paused:before {
	width: 0;
	height: 0;
	background-color: transparent;
	border-left: 13px solid var(--color-pred2);
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
}
#Branding .Controller button.paused:after {
	display: none;
}
#Branding .pauseBtn{
	background-color:var(--color-pgray2);
}
	@media screen and (max-width: 1304px) {
	}
	@media screen and (max-width: 994px) {
	}
	@media screen and (min-width: 768px) {
		#Branding #slidebox .slide .Inner .Title strong{
			font-size:3.125rem;
		 }
		#Branding #slidebox .slide .Inner .Title {
			font-size:2.25rem;
		}
		#Branding #slidebox .slide.slide03 .Inner {
			margin-left: 41.1765%;
		}
		#Branding #slidebox .slide.slide03 .Inner .Title img {
			min-width:600px;
		}
		#Branding #slidebox .slide .Inner {
			height:600px;
		}
	}
	@media screen and (max-width: 767px) {
		#Branding #slidebox .slide .Inner .Title strong{
			font-size:2.25rem;
		 }
		#Branding #slidebox .slide .Inner .Title {
			font-size:1.375rem;
		}
		#Branding #slidebox .slide .Inner {
			height:500px;
		}	}
	@media screen and (max-width: 579px) {
	}
	@media screen and (max-width: 399px) {
	}



/* ===================================================
   インフォメーション
==================================================== */
.p-post__search {
	display: flex;
	gap:var(--unit);
  margin:calc(var(--gap) / 2);
  justify-content: center;
}
.p-post__search li {
	position: relative;
	padding: 5px 13px 3px;
	font-size: 90%;
	border:1px solid var(--color-pgray3);
	background-color:var(--color-pgray1);
	cursor: pointer;
	transition: 0.2s;
	border-radius:var(--unit);
	font-weight:bold;
}
a.p-post__link{
	color:var(--color-pblack);
}
a.p-post__link:hover{
	color:var(--color-pred2);
}
.PC .p-post__search li:hover{
	color:var(--color-pred2);
	border-color:var(--color-pred2);
}
.p-post__search li.is_active,
.PC .p-post__search li:active {
	color:var(--color-pwhite) !important;
	background-color:var(--color-pgray5) !important;
	border-color:var(--color-pgray5) !important;
}
.p-post__search li.is_active:before,
.PC .p-post__search li:hover:before,
.PC .p-post__search li:active:before {
	opacity: 1;
}
.p-post__pulldown {
	display: none;
}
.DateListStyle2 .LinkListStyle1{
	margin:0;
}
.DateListStyle2.p-post {
	border-bottom: 1px solid var(--color-pgray2);;
}
.DateListStyle2.p-post div {
	border-top: 1px solid var(--color-pgray2);;
}
.JS #top-information .ResponsiveLinkListStyle.TopBorderSet,
.JS #top-information .ResponsiveLinkListStyle.BottomBorderSet{
	border:none;
}
.DateListStyle2.p-post dt {
	letter-spacing: -1em;
}
.DateListStyle2.p-post .p-post__time {
	display: inline-block;
	width: 11em;
	letter-spacing: normal;
	vertical-align: middle;
}
.DateListStyle2.p-post .p-post__cat {
	display: inline-block;
	width: 13em;
	padding: 4px 0.5em;
	text-align: center;
	font-size: 90.3%;
	vertical-align: middle;
	border: 1px solid var(--color-pgray2);;
	letter-spacing: normal;
	box-sizing: border-box;
}
.DateListStyle2.p-post dd {
	margin: 0.4em 0 0 26em;
}
.LinkListStyle1.l-information__more {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	/*margin-right: -15px;*/
	font-weight:bold;
	gap:var(--gap);
}
/*
.LinkListStyle1.l-information__more li {
	padding: 0 0 15px;
	margin-right: 15px;
}
*/
.lineheight{
	display: block;
}
	@media screen and (max-width: 1304px) {
	}
	@media screen and (max-width: 994px) {
	}
	@media screen and (min-width: 768px) {
		.DateListStyle2.p-post div {
			padding: 20px 0;
		}
	}
	@media screen and (max-width: 767px) {
	  .double .Date {
	    display: none !important;
	  }
	  .lineheight{
			display: block;
			content: "";
			height: 15px;
	  }
		.p-post__search{
			flex-wrap: wrap;
		}
		.p-post__search li {
			width:calc((100% - var(--unit)) / 2);
			text-align:center;
			box-sizing:border-box;
		}
		.p-post__search li:before {
			display: none;
		}
		.JS main #Contents .ResponsiveLinkListStyle li a {
			padding:1em 2em 1em 1em;
		}
	}
	@media screen and (max-width: 579px) {
	}
	@media screen and (max-width: 399px) {
	}



/* ===================================================
   legacy--Each Section
==================================================== */
.ColumnSet.Flex .Inner .Txt .InnerLink2{
	font-size:0.875rem;
}
.ColumnSet.Flex .Inner .Txt h3 {
	margin-bottom: 20px;
	font-size: 150%;
}
.ColumnSet.Flex .Inner .Txt h3 a {
	padding: 5px 35px 0 0;
	color:var(--color-pblack);
	background-image: url(/image/jp/r1/icon/icon_link_right_white_hd.gif);
	background-size: 32px auto;
	background-position: right 3px center;
	transition: 0.2s;
}
.ColumnSet.Flex .Inner .Txt h3 a:hover,
.ColumnSet.Flex .Inner .Txt h3 a:active {
	background-position: right center;
}


/* ===================================================
   新ガイドライン風
==================================================== */
.style--a img,.style--b img{
	border-radius:var(--unit);
}
.style--a .LinkListStyle1,
.style--b .LinkListStyle1{
	font-size:1.125rem;
}
.ColumnSet.Flex.style--a .Inner .Txt {
	position:absolute;
	z-index: 1;
	width: 350px;
	min-height: 170px;
	box-sizing: border-box;
  background: transparent linear-gradient(27deg, var(--color-pred1) -110%, #fff 25%) 0 0 no-repeat padding-box;
  max-width: 100%;
	backdrop-filter: blur(8px);
	border: 1px solid var(--color-pgray3);
	border-radius:var(--unit);
	max-width: 29rem;
	padding: 1.5rem;
	opacity: .9;
}
.style--b .Img {
	max-width:625px;
	width:100%;
	max-height:325px;
	overflow:hidden;
	border-radius:var(--unit);
}
.ColumnSet.Flex.type2 .Inner .Img img{
	width:100%;
	height:auto;
}
	@media screen and (max-width: 1499px) {
		.ColumnSet.Flex.style--a{
			align-items:center;
		}
		.ColumnSet.Flex.style--a .Inner .Txt {
			position:relative;
		  top:-50px;
			margin:auto;
		}
		.ColumnSet.Flex .Inner .Img{
			text-align:center;
		}
	}
	@media screen and (max-width: 994px) {
	}
	@media screen and (min-width: 768px) {
	}
	@media screen and (max-width: 767px) {
	}
	@media screen and (max-width: 579px) {
	}
	@media screen and (max-width: 399px) {
		.ColumnSet.Flex.style--a .Inner .Txt {
			width:90%;
		}
	}



/* ===================================================
  イメージ付きリンクボックス@ * company/index.html内SNSほか
==================================================== */
.ColumnSet.Flex.ImgHeadingSet {
	flex-wrap: wrap;
	justify-content: center;
}
.ColumnSet.Flex.ImgHeadingSet .Column1:not(.FirstItem) {
	margin-left: 50px;
}
.ColumnSet.Flex.ImgHeadingSet a.ImgHeadingStyle {
	display: block;
	text-decoration: none;
	position: relative;
}
.ColumnSet.Flex.ImgHeadingSet .Title h2 {
	display: flex;
	align-items: center;
	min-height: 40px;
	margin-bottom: 0;
	font-size: 90%;
	background-image: none;
	background-color: rgba(0, 0, 0, 0.68);
}
.ColumnSet.Flex.ImgHeadingSet .Title h2 .Inner {
	display: block;
	width: 100%;
	margin: -10px;
	padding: 10px 22px 10px 15px;
	border-right: solid 3px transparent;
	font-weight: inherit;
	text-decoration: inherit;
	background-image: url(/image/jp/r1/icon/icon_link_right_l_white_hd.gif);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 16px 16px;
}
.ColumnSet.Flex.ImgHeadingSet a:hover .Title h2 .Inner,
.ColumnSet.Flex.ImgHeadingSet a:active .Title h2 .Inner {
	padding-right: 24px;
	text-decoration: underline;
	border-right: solid 1px transparent;
}
.ColumnSet.Flex.ImgHeadingSet .Title h2 .Inner * {
	font-weight: inherit;
	text-decoration: inherit;
}
#sns .ImgHeadingSet{
	gap:calc(var(--gap) * 2);
}
#sns .ImgHeadingStyle{
	margin:inherit;
}
#sns .ImgHeadingStyle .Img{
	width:100%;
}
#sns .ColumnSet.Flex.ImgHeadingSet .Title {
	background-color:var(--color-pgray5);
	box-sizing:border-box;
	width: 100%;
	padding:0.5em 1em;
	font-weight: inherit;
	text-decoration: inherit;
	background-image: url(/image/jp/r1/icon/icon_link_right_l_white_hd.gif);
	background-repeat: no-repeat;
	background-position: right 0.5em center;
	background-size: 16px 16px;
}
#sns .ImgHeadingSet a::after{
	content:none;
}
#sns .ImgHeadingSet a:hover{
	opacity:0.9;
}
	@media screen and (max-width: 1304px) {
		.JS .ColumnSet.Flex.ImgHeadingSet .Column1 {
			width: 33.33333333%;
			max-width: 350px;
			margin: 0;
			padding: 0 0 0 50px;
		}
	}
	@media screen and (max-width: 994px) {
		.JS .ImgHeadingStyle{
			width:100%;
		}
		.JS .ColumnSet.Flex.ImgHeadingSet .Column1 {
			max-width: 315px;
			padding: 0 0 0 15px;
		}
	}
	@media screen and (min-width: 768px) {
		#sns .ImgHeadingSet > *{
			max-width:300px;
			flex: 0 0 auto;
		}
	}
	@media screen and (max-width: 767px) {
		.JS .ColumnSet.Flex.ImgHeadingSet {
			display: flex;
		}
	}
	@media screen and (max-width: 579px) {
		.JS .ColumnSet.Flex.ImgHeadingSet .Column1 {
			width: 50%;
		}
	}
	@media screen and (max-width: 399px) {
		.JS .ColumnSet.Flex.ImgHeadingSet .Column1 {
			width: 100%;
			max-width: none;
		}
		.JS .ColumnSet.Flex.ImgHeadingSet .Title h2 {
			background-color: transparent;
		}
		.JS .ColumnSet.Flex.ImgHeadingSet .Title h2 .Inner {
			display: inline-block;
			margin: 0;
			padding: 0 17px 0 0 !important;
			font-weight: bold;
			background-image: url(/image/jp/r1/icon/icon_link_right_l_hd.gif);
			background-repeat: no-repeat !important;
			background-position: center right !important;
			border-right: none !important;
			text-decoration: none;
		}
		.JS .ColumnSet.Flex.ImgHeadingSet a:hover .Title h2 .Inner,
		.JS .ColumnSet.Flex.ImgHeadingSet a:active .Title h2 .Inner {
			color: #b1000e;
			background-image: url(/image/jp/r1/icon/icon_link_right_l_hover_hd.gif);
		}
	}


/* ===================================================
  イメージ付きリンクボックスA ※TOP導入事例など
==================================================== */
.p-summary {
	display: flex;
	gap:var(--gap);
}
.p-summary .p-summary__item {
	margin-bottom: 10px;
	box-sizing: border-box;
}
.p-summary .p-summary__item a {
	text-decoration: none;
	color: inherit;
}
.p-summary .p-summary__item a::after {
	content:none;
}
.p-summary .p-summary__item figure {
	background-color:var(--color-pwhite);
}
.p-summary .p-summary__item h3 {
	padding-right: 20px;
	background-image:url(/image/hsc2/solution/icon/icon_arrow_r.svg);
	background-repeat: no-repeat;
	background-position: right center;
	background-size:1em;
	display: inline-block;
	color:var(--color-pred2);
}
.p-summary .p-summary__item a:hover h3,
.p-summary .p-summary__item a:active h3 {
	text-decoration:underline;
/*
	color:var(--color-pred2);
	background-image:url(/image/hsc2/solution/icon/icon_arrow_r.svg);
*/
}
main a.p-summary__link:after{
	content:none !important;
}
.p-summary .p-summary__item .p-case__top {
	font-size: 90%;
	margin-bottom: 15px;
}
.p-summary .p-summary__item .p-case__keyword {
	display: flex;
	flex-wrap: wrap;
	margin-left: -5px;
}
.p-summary .p-summary__item .p-case__keyword li {
	margin: 0 0 5px 5px;
	padding: 6px 12px 5px;
	line-height: 130%;
	font-size: 81.25%;
	background-color:var(--color-pwhite);
}
	@media screen and (max-width: 1304px) {
	}
	@media screen and (max-width: 994px) {
	}
	@media screen and (min-width: 768px) {
		.p-summary .p-summary__item {
			width:calc(100% / 3);
		}
		.p-summary .p-summary__item figure {
			position: relative;
			width: 100%;
			height: 0;
			margin: 0 0 25px;
			padding-bottom: 62.25%;
			overflow: hidden;
		}
		.p-summary .p-summary__item figure img {
			position: absolute;
			top: 50%;
			left: 50%;
			max-width: 100%;
			transform: translate(-50%, -50%);
			transition: 0.2s;
		}
		.p-summary .p-summary__item a:hover figure img,
		.p-summary .p-summary__item a:active figure img {
			transform: translate(-50%, -50%) scale(1.1);
		}
	}
	@media screen and (max-width: 767px) {
		.p-summary{
			flex-direction:column;
		}
		.p-summary__link{
			display:flex;
			gap:var(--gap);
      flex-direction: column;
		}
		.p-summary__figure{
			width:100%;
			padding: 1rem;
			margin: 0;
			text-align:center;
			box-sizing: border-box;
		}
		.p-summary__figure img{
			width:auto;
		}
	}
	@media screen and (max-width: 579px) {
	}
	@media screen and (max-width: 399px) {
		.JS .l-section .p-summary .p-summary__item .p-summary__text {
			width: 100%;
			margin-left: 0;
		}
	}



/* ===================================================
 コラム＆フェイスブック ※TOPほか
==================================================== */
#column .ColumnSet.Flex .Column2.ColumnBoxWrapper {
	flex-direction: column;f
	margin-bottom: 15px;
}
#column .l-section .ColumnBoxWrapper h2 {
	position: relative;
	z-index: 1;
	padding: 0;
}
#column .ColumnBox {
	width: 100%;
	height: 100%;
}
#column .ColumnBox .BoxInner {
	display: flex;
	flex-direction: column;
	gap: var(--gap);
	width: 100%;
	height: 100%;
	padding:7%;
	background-color: #ffffff;
	box-sizing: border-box;
	clip-path: polygon(0 0, calc(100% - 90px) 0, 100% 90px, 100% 100%, 90px 100%, 0 calc(100% - 90px));
}
#column .LinkListStyle1.PanelLink {
	border-bottom: 1px solid var(--color-pgray2);
	margin-bottom:0;
}
#column .LinkListStyle1.PanelLink li {
	border-top: 1px solid var(--color-pgray2);
}
main #Contents #column .LinkListStyle1.PanelLink li a {
	position: relative;
	display: block;
	padding:1em;
	transition: 0.2s;
	background-image:url(/image/hsc2/solution/icon/icon_arrow_r.svg);
}
main #Contents #column .LinkListStyle1.PanelLink li a:hover,
main #Contents #column .LinkListStyle1.PanelLink li a:active {
	background-color:var(--color-pgray1);
}
main #column .LinkListStyle1.PanelLink .p-summary__title{
	color:var(--color-pred2);
	display:inline-block;
}
#column .LinkListStyle1.PanelLink .p-summary__time {
	display: inline-block;
	width: 9em;
	color:var(--color-pblack);
}
#column .LinkListStyle1.PanelLink .p-summary__cat {
	display: inline-block;
	min-width: 8em;
	margin: 0 5px 5px 0;
	padding: 4px 0.5em;
	text-align: center;
	font-size: 90.3%;
	vertical-align: middle;
	border: 1px solid var(--color-pgray2);
	letter-spacing: normal;
	box-sizing: border-box;
	color:var(--color-pblack);
}
main #Contents #column .LinkListStyle1 li a:hover{
	background-color:inherit;
}
main #Contents #column .LinkListStyle1.PanelLink li a:hover{
	background-color:var(--color-pgray1) !important;
	text-decoration: none;
}
	@media screen and (min-width: 768px) {
		main #Contents #column .LinkListStyle1.PanelLink li a{
			padding:1em;
			margin:0;
		}
	}
	@media screen and (max-width: 767px) {
		.JS #column .ResponsiveLinkListStyle ul.LinkListStyle1 li{
			padding:0;
		}
		.JS #column .ResponsiveLinkListStyle ul.LinkListStyle1 a{
			padding-right:2em;
		}
		.JS #column .ResponsiveLinkListStyle .LinkListStyle1.PanelLink li a{
			padding:1em;
			margin:inherit;
		}
		.JS #column .ResponsiveLinkListStyle ul.LinkListStyle1 li a{
			background-image: url(/image/hsc2/solution/icon/icon_arrow_r.svg) !important;
		}
		.JS #column .ResponsiveLinkListStyle ul.LinkListStyle1 li a:after{
			content:none;
		}
		#column .LinkListStyle1.PanelLink li a{
			padding: 1em 2em 1em 0;
		}
	}
	@media screen and (max-width: 399px) {
		.JS main #Contents .l-section .ColumnBox .BoxInner {
			clip-path: polygon(0 0, calc(100% - 45px) 0, 100% 45px, 100% 100%, 45px 100%, 0 calc(100% - 45px));
		}
	}


/* ===================================================
　TOP・企業情報
==================================================== */
#hsctop #company .ColumnSet.Flex .Inner{
	text-align:center;
}
#hsctop #company .ColumnSet.Flex .Inner .Img img{
	max-width:532px;
}
#hsctop #company .ColumnSet.Flex.style--a .Inner .Txt{
	position:relative;
  top: -60px;
  left: 0;
	text-align:left;
}



/* ===================================================
　TOP・サステナビリティ
==================================================== */
#sustainability .ImgOnlyStyle img{
	border-radius:var(--unit);
}



/* ===================================================
　TOP・採用情報
==================================================== */
#recruit .ImgOnlyStyle img{
	border-radius:var(--unit);
}



/* ===================================================
 レスポンシブ
==================================================== */
@media screen and (max-width: 1304px) {
	.JS #Branding #SlideArea li {
		padding: 0 15px;
	}
	.JS #Branding #SlideArea li.slide01 {
		background-position: -125px center;
	}
	.JS #Branding #SlideArea li.slide02,
	.JS #Branding #SlideArea li.slide03 {
		background-position: -310px center;
	}
	.JS #Branding #SlideArea li.slide03 .Inner {
		margin-left: 41.1765%;
	}
	.JS #Branding #SlideArea li.slide03 .ButtonStyle1.Flex {
		margin-right: 0;
	}
	.JS #Branding #slidebox .slide {
		padding: 0 15px;
	}
	.JS #Branding #slidebox .slide.slide03 .ButtonStyle1.Flex {
		margin-right: 0;
	}
	.JS .ColumnSet.Flex .Inner {
		align-items: flex-end;
	}
}
@media screen and (max-width: 399px) {
	.JS .l-section#business .Section .ButtonStyle1.Flex a,
	.JS .l-section#case .Section .ButtonStyle1.Flex a {
		padding-left: 10%;
	}
}/* ===========================================
	フッター
=========================================== */
footer.l-footer {
	padding: 0 15px;
	background-color: #fafafa;
	border-top: 1px solid #dddddd;
}footer.l-footer * {
	box-sizing: border-box;
}footer.l-footer .l-footer__inner {
	max-width: 1275px;
	margin: 0 auto;
	padding: 60px 0 90px;
	letter-spacing: 0.075em;
}
.l-footer .p-sitemap {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 0 -30px;
	padding: 35px 0 0;
}
.l-footer .p-sitemap__nav {
	width: 25%;
	padding-left: 30px;
}
.l-footer .p-sitemap__cat {
	margin-bottom: 15px;
	font-size: 87.5%;
	color: #333333;
}
.l-footer .p-sitemap__item {
	font-size: 81.25%;
	color: #333333;
}
.l-footer .p-sitemap__item {
	margin-bottom: 3px !important;
}
.l-footer .p-sitemap__cat a,
.l-footer .p-sitemap__item a {
	text-decoration: none;
	color: inherit;
}
.l-footer .p-sitemap__cat a:hover,
.l-footer .p-sitemap__cat a:active,
.l-footer .p-sitemap__item a:hover,
.l-footer .p-sitemap__item a:active {
	text-decoration: underline;
}
.l-footer .p-sitemap__cat a *,
.l-footer .p-sitemap__item a * {
	text-decoration: inherit;
}
#PageTopControler {
	position: relative;
}
#PageTopControler #FooterPageTop {
	width: 50px;
	height: 50px;
	right: 50px;
	top: auto;
	bottom: 50px;
	z-index: 10;
	background-color: transparent;
	border-radius: 50%;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
	overflow: hidden;
}
#PageTopControler #FooterPageTop.Fixed {
	position: fixed;
}
#PageTopControler #FooterPageTop:before,
#PageTopControler #FooterPageTop:after {
	display: none;
}
#PageTopControler #FooterPageTop img {
	width: 100%;
	height: 100%;
	transition: 0.2s;
}
.PC #PageTopControler #FooterPageTop:hover img,
.PC #PageTopControler #FooterPageTop:active img {
	opacity: 0.7;
}
.SP .download--pdf {
	display: none;
}


/* ===========================================
	side parts
=========================================== */
#navi_parts_area {
	width: 100%;
}
#VerticalLocalNavi + #navi_parts_area {
	margin-top: 25px;
}



/* ===================================================
   for Responsive Web Design
==================================================== */
@media screen and (min-width: 1305px) {
	.l-section#hsctop-information {
		overflow: hidden;
	}
	.Container.Wide .MMColumnArea {
		width: 1275px;
		padding-bottom: 15px;
	}
	.Container.Wide .MMGrid1,
	.Container.Wide .MMColumn1,
	.Container.Wide .MMTopColumnMenu1,
	.Container.Wide .MMBottomColumnMenu {
		width: 300px;
		margin: 0 0 0 25px;
	}
	.Container.Wide .MMGrid2,
	.Container.Wide .MMColumn2,
	.Container.Wide .MMTopColumnMenu2 {
		width: 625px;
		margin: 0 0 0 25px;
	}
	.Container.Wide .MMGrid3,
	.Container.Wide .MMColumn3,
	.Container.Wide .MMTopColumnMenu3 {
		width: 950px;
		margin: 0 0 0 25px;
	}
	.Container.Wide .MMGrid4,
	.Container.Wide .MMColumn4,
	.Container.Wide .MMTopColumnMenu4 {
		width: 1275px;
	}
	.Container.Wide .MMGrid1.MMFirstItem,
	.Container.Wide .MMGrid2.MMFirstItem,
	.Container.Wide .MMGrid3.MMFirstItem,
	.Container.Wide .MMColumn1.MMFirstItem,
	.Container.Wide .MMColumn2.MMFirstItem,
	.Container.Wide .MMColumn3.MMFirstItem,
	.Container.Wide .MMTopColumnMenu1.MMFirstItem,
	.Container.Wide .MMTopColumnMenu2.MMFirstItem,
	.Container.Wide .MMTopColumnMenu3.MMFirstItem,
	.Container.Wide .MMBottomColumnMenu.MMFirstItem {
		margin: 0;
	}
	.Container.Wide ul.MMLinkListStyle {
		margin: -5px -25px 15px 0;
		overflow: hidden;
	}
	.Container.Wide ul.MMLinkListStyle li {
		width: calc(100% - 25px);
		margin: 0 25px 0 0;
	}
}
@media screen and (min-width: 768px) {
	.OptionWide .p-breadcrumb,
	.OptionWide .l-article {
		max-width: 1275px;
	}
	.OptionWide .l-txt-figure.u-fw10 .c-txt_box {
		width: calc(100% - 100px);
		flex-basis: calc(100% - 100px);
	}
	.OptionWide .l-txt-figure.u-fw20 .c-txt_box {
		width: calc(100% - 200px);
		flex-basis: calc(100% - 200px);
	}
	.OptionWide .l-txt-figure.u-fw30 .c-txt_box {
		width: calc(100% - 300px);
		flex-basis: calc(100% - 300px);
	}
	.OptionWide .l-txt-figure.u-fw40 .c-txt_box {
		width: calc(100% - 380px);
		flex-basis: calc(100% - 380px);
	}
	.OptionWide .l-txt-figure.u-fw50 .c-txt_box {
		width: calc(100% - 420px);
		flex-basis: calc(100% - 420px);
	}
}@media screen and (min-width :995px) and (max-width: 1304px) {
	.Container.Wide .MMSet {
		min-width: 965px;
	}
	.Container.Wide .MMColumnArea {
		width: auto;
		padding: 0 15px 15px 0;
		margin-left: -10px;
	}
	.Container.Wide .MMGrid1 {
		width: 25%;
		margin: 0;
		padding: 0 0 0 25px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	.Container.Wide .MMGrid2 {
		width: 50%;
		margin: 0;
		padding: 0 0 0 25px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	.Container.Wide .MMGrid3 {
		width: calc(75% + 25px);
		margin: 0 0 0 -25px;
		padding: 0 0 0 25px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	.Container.Wide .MMGrid4 {
		width: 100%;
		margin: 0;
	}
	.Container.Wide .MMBannerLinkStyle img {
		width: 100%;
		height: auto;
	}
	.Container.Wide .MMGrid1 > div,
	.Container.Wide .MMGrid2 > div,
	.Container.Wide .MMGrid3 > div,
	.Container.Wide .MMGrid4 > div {
		margin: 0;
		padding: 0 0 0 25px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	.Container.Wide .MMGrid1 .MMColumn1,
	.Container.Wide .MMGrid1 .MMTopColumnMenu1,
	.Container.Wide .MMGrid1 .MMBottomColumnMenu,
	.Container.Wide .MMGrid2 .MMColumn2,
	.Container.Wide .MMGrid2 .MMTopColumnMenu2,
	.Container.Wide .MMGrid3 .MMColumn3,
	.Container.Wide .MMGrid3 .MMTopColumnMenu3,
	.Container.Wide .MMGrid4 .MMColumn4,
	.Container.Wide .MMGrid4 .MMTopColumnMenu4,
	.Container.Wide .MMColumn1 ul.MMLinkListStyle li,
	.Container.Wide .MMTopColumnMenu1 ul.MMLinkListStyle li,
	.Container.Wide .MMBottomColumnMenu ul.MMLinkListStyle li {
		width: 100%;
	}
	.Container.Wide .MMGrid4 .MMColumn3,
	.Container.Wide .MMGrid4 .MMTopColumnMenu3 {
		width: 75%;
	}
	.Container.Wide .MMGrid2 .MMColumn1,
	.Container.Wide .MMGrid2 .MMTopColumnMenu1,
	.Container.Wide .MMGrid2 .MMBottomColumnMenu,
	.Container.Wide .MMGrid4 .MMColumn2,
	.Container.Wide .MMGrid4 .MMTopColumnMenu2,
	.Container.Wide .MMColumn2 ul.MMLinkListStyle li,
	.Container.Wide .MMTopColumnMenu2 ul.MMLinkListStyle li {
		width: 50%;
	}
	.Container.Wide .MMGrid3 .MMColumn1,
	.Container.Wide .MMGrid3 .MMTopColumnMenu1,
	.Container.Wide .MMGrid3 .MMBottomColumnMenu,
	.Container.Wide .MMColumn3 ul.MMLinkListStyle li,
	.Container.Wide .MMTopColumnMenu3 ul.MMLinkListStyle li {
		width: 33.3333333%;
	}
	.Container.Wide .MMGrid3 .MMColumn2,
	.Container.Wide .MMGrid3 .MMTopColumnMenu2 {
		width: 66.6666666%;
	}
	.Container.Wide .MMGrid4 .MMColumn1,
	.Container.Wide .MMGrid4 .MMTopColumnMenu1,
	.Container.Wide .MMGrid4 .MMBottomColumnMenu,
	.Container.Wide .MMColumn4 ul.MMLinkListStyle li,
	.Container.Wide .MMTopColumnMenu4 ul.MMLinkListStyle li {
		width: 25%;
	}
	.Container.Wide h2.MMSubHeaderStyle,
	.Container.Wide h3.MMSubHeaderStyle {
		margin-left: 0;
	}
	.Container.Wide ul.MMLinkListStyle {
		margin: -5px -25px 15px 0;
		overflow: hidden;
	}
	.Container.Wide ul.MMLinkListStyle li {
		width: calc(100% - 10px) !important;
		margin: 0;
		padding: 5px 15px 0 0;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	.Container.Wide h2.MMBannerLinkStyle,
	.Container.Wide h3.MMBannerLinkStyle {
		margin-left: 0;
	}
	.Container.Wide .MMGrid3 p.MMSubHeaderStyle {
		padding-left: 25px;
	}
}@media screen and (max-width: 1304px) {
	.JS #TopicPath.Wide ul {
		width: auto;
		max-width: 1275px;
		padding: 20px 15px 5px;
	}
	.JS .HideU1305 {
		display: none;
	}
	.JS .ShowU1305 {
		display: block;
	}
	.JS br.ShowU1305,
	.JS strong.ShowU1305,
	.JS em.ShowU1305,
	.JS sub.ShowU1305,
	.JS sup.ShowU1305,
	.JS img.ShowU1305,
	.JS span.ShowU1305 {
		display: inline;
	}
	.JS .withBg.company {
		background-position: center center;
		background-size: auto;
	}
	.JS .PageTitleWrapper#domain {
		background-position: 35% bottom;
	}
	.JS .PageTitleWrapper#domain .PageTitle {
		margin-left: 30%;
	}
	.JS .l-section#domain_intro {
		background-size: auto;
	}
	.JS .l-section#domain_innovation {
		background-position: center top;
		background-size: auto;
	}
}@media screen and (max-width: 994px) {
	.JS .Container.Wide .MMSet {
		min-width: 738px;
	}
	.JS .Container.Wide .MMGrid3 {
		width: calc(75% + 15px);
		margin-left: -15px;
	}
	.JS .Container.Wide ul.MMLinkListStyle li {
		width: calc(100% - 10px) !important;
	}
	.JS .Container.Wide .MMGrid3 p.MMSubHeaderStyle {padding-left: 15px;}
	.JS .HideU995 {
		display: none;
	}
	.JS .ShowU995 {
		display: block;
	}
	.JS br.ShowU995,
	.JS strong.ShowU995,
	.JS em.ShowU995,
	.JS sub.ShowU995,
	.JS sup.ShowU995,
	.JS img.ShowU995,
	.JS span.ShowU995 {
		display: inline;
	}
	.JS .ColumnSet.Flex.Box .Inner {
		display: block;
		padding-top: 100px;
	}
	.JS .ColumnSet.Flex.Box .Inner .Img {
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		width: 200px;
		height: 200px;
	}
	.JS .ColumnSet.Flex.Box .Inner .Txt {
		display: block;
		margin-left: 0;
	}
	.JS .ColumnSet.Flex.Box .Inner .Txt .TxtInner {
		min-height: auto;
		padding: 130px 30px 40px 30px;
	}
	.JS .p-sitemap {
		margin-left: -15px;
	}
	.JS .p-sitemap__nav {
		padding-left: 15px;
	}
	.JS .PageTitleWrapper .PageTitle h1 {
		font-size: 150%;
	}
	.JS .ColumnSet.Flex.Box01 .Column2 .Inner .BoxList li {
		width: calc(50% - 10px);
	}
}@media screen and (max-width: 767px) {
	.JS h2{
		margin:inherit;
	}
	.JS .ColumnSet.Flex {
		flex-direction:column;
	}
	.JS .ColumnSet.Flex .Column2 {
		max-width: none;
	}
	.JS .ColumnSet.Flex.Box .Column2.FirstItem .Inner {
		margin-bottom: 50px;
	}
	.JS .ColumnSet.Flex.Box .Inner .Txt .TxtInner {
		padding: 130px 15px 25px 15px;
	}
	.JS .ColumnSet.Flex .ResponsiveLinkListStyle {
		margin-left: 0;
		margin-right: 0;
	}
	.JS footer.l-footer .l-footer__inner {
		padding-bottom: 60px;
	}
	.JS .l-footer .p-sitemap {
		margin-left: 0;
	}
	.JS .l-footer .p-sitemap__nav {
		width: 100%;
		margin: 0 0 15px !important;
		padding: 0 0 15px;
		border-bottom: 1px solid #dddddd;
	}
	.JS .l-footer .p-sitemap__list {
		display: block;
	}
	.JS .l-footer .p-sitemap__item {
		width: 100%;
		margin-bottom: 10px !important;
	}
	.JS #PageTopControler #FooterPageTop {
		right: 15px;
		bottom: 15px;
	}
	.JS .PageTitleWrapper {
		margin-bottom: 50px;
	}
	.JS .PageTitleWrapper .PageTitle {
		min-height: 230px;
		padding: 20px 0;
	}
	.JS .PageTitleWrapper .PageTitle .Inner {
		text-align: left;
	}
	.JS .PageTitleWrapper .PageTitle .SubTitle {
		margin-bottom: 30px;
		font-size: 100%;
	}
	.JS .PageTitleWrapper .PageTitle h1 {
		margin-bottom: 0;
		font-size: 125%;
	}
	.JS .CenterAdjustClear1 {
		text-align: left;
	}
	.JS .l-section#domain_intro {
		background-image: url(/company/about/domain/image/bg_intro_sp.jpg);
	}
	.JS .l-section#domain_innovation {
		background-image: none;
	}
	.JS .l-section#domain_innovation:before {
		content: "";
		position: absolute;
		top: -180px;
		left: 0;
		width: 100%;
		height: 100%;
		background: url(/company/about/domain/image/bg_innovation.jpg) no-repeat center top;
	}
	.JS .ColumnSet.Flex.Box01 .Column2.FirstItem {
		margin-bottom: 40px;
	}
	.JS .ColumnSet.Flex.Box01 .Column2 .Inner {
		margin-left: -15px;
		margin-right: -15px;
		padding-top: 1px;
	}
	.JS .ColumnSet.Flex.Box01 .Column2 .Inner h3 {
		position: static;
		width: auto;
		margin-bottom: 30px;
	}
	.JS .ColumnSet.Flex.Box01 .Column2 .Inner .BoxList li {
		width: calc(33.33333333% - 10px);
	}
	.JS .l-section .SectionInner .InnerLinksArea .LinkListStyle5 {
		display: block;
		text-align: left;
	}
	.JS .l-section .SectionInner .InnerLinksArea .LinkListStyle5 li {
		margin-right: 0;
	}
	.JS .l-section .SectionInner .Section .ResponsiveLinkListStyle {
		display: block;
		margin-left: -15px;
	}
	.JS .l-section .SectionInner .Section .LinkListStyle1 {
		width: auto;
		padding-left: 0;
	}
	.JS .l-section .SectionInner .Section .LinkListStyle1:not(:last-child) {		border-bottom: solid 1px #ddd;
	}
	.JS .l-section .SectionInner .Section .LinkListStyle1.long {
		border-top: solid 1px #ddd;
	}
	.JS .Grid1 #navi_parts_area {
		margin-bottom: 45px;
	}
	.JS .l-txt-figure.u-fw10 .c-txt_box,
	.JS .l-txt-figure.u-fw20 .c-txt_box,
	.JS .l-txt-figure.u-fw30 .c-txt_box,
	.JS .l-txt-figure.u-fw40 .c-txt_box,
	.JS .l-txt-figure.u-fw50 .c-txt_box {
		width: 100%;
		flex-basis: 100%;
	}
	.JS .l-txt-figure.u-fw10 + .c-txt_box,
	.JS .l-txt-figure.u-fw20 + .c-txt_box,
	.JS .l-txt-figure.u-fw30 + .c-txt_box,
	.JS .l-txt-figure.u-fw40 + .c-txt_box,
	.JS .l-txt-figure.u-fw50 + .c-txt_box {
		margin-top: 20px;
	}
}@media screen and (max-width: 579px) {
	.JS .HideU580 {
		display: none;
	}
	.JS .ShowU580 {
		display: block;
	}
	.JS br.ShowU580,
	.JS strong.ShowU580,
	.JS em.ShowU580,
	.JS sub.ShowU580,
	.JS sup.ShowU580,
	.JS img.ShowU580,
	.JS span.ShowU580 {
		display: inline;
	}
	.JS .PageTitleWrapper#domain {
		background-position: 30% bottom;
	}
	.JS .PageTitleWrapper#domain .PageTitle {
		margin-left: 37%;
	}
	.JS .ColumnSet.Flex.Box01 .Column2 .Inner h3 span {
		padding: 0 30px;
	}
	.JS .ColumnSet.Flex.Box01 .Column2 .Inner .BoxList li {
		width: calc(50% - 10px);
	}
}@media screen and (max-width: 399px) {
	.JS .HideU400 {
		display: none !important;
	}
	.JS .ShowU400 {
		display: block;
	}
	.JS br.ShowU400,
	.JS strong.ShowU400,
	.JS em.ShowU400,
	.JS sub.ShowU400,
	.JS sup.ShowU400,
	.JS img.ShowU400,
	.JS span.ShowU400 {
		display: inline;
	}
	.JS .PageTitleWrapper .PageTitle .SubTitle {
		font-size: 90%;
	}
	.JS .PageTitleWrapper .PageTitle h1 {
		font-size: 100%;
	}
	.JS .l-section .SectionInner .ButtonStyle1.Flex a {
		padding-left: 10%;
	}
}