@charset "utf-8";
/* **************************************************

Name: dc_2026.css

Description: Original CSS

Create: 2026.10

Copyright 2026 Hitachi Systems, Ltd.

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

/* common */
#Contents.datecenters .GridSet,
#Contents.facility .GridSet,
#Contents.resources .GridSet,
#Contents.operation .GridSet,
#Contents.ssos .GridSet {
	width: 1145px;
}
@media screen and (max-width: 1304px) {
	#Contents.datecenters .GridSet,
	#Contents.facility .GridSet,
	#Contents.resources .GridSet,
	#Contents.operation .GridSet,
	#Contents.ssos .GridSet {
		width: auto;
	}
}
#Contents.datecenters p,
#Contents.facility p,
#Contents.resources p,
#Contents.operation p,
#Contents.ssos p {
	font-size: 120%;
}
#Contents.facility .branding,
#Contents.resources .branding,
#Contents.operation .branding,
#Contents.ssos .branding {
	align-items: start;
	height: 450px;
}
#Contents.facility .branding:before,
#Contents.resources .branding:before,
#Contents.operation .branding:before,
#Contents.ssos .branding:before,
#Contents.facility .branding:after,
#Contents.resources .branding:after,
#Contents.operation .branding:after,
#Contents.ssos .branding:after {
	background: none;
}
@media screen and (max-width: 1304px) {
	#Contents .branding {
		margin: 0;
	}
}
@media screen and (max-width: 994px) {
	#Contents.datecenters .branding,
	#Contents.facility .branding,
	#Contents.resources .branding,
	#Contents.operation .branding,
	#Contents.ssos .branding {
		height: 400px;
	}
}
@media screen and (max-width: 1304px){
	#Contents.datecenters,
	#Contents.facility,
	#Contents.resources,
	#Contents.operation,
	#Contents.ssos {
		padding-left: 0;
		padding-right: 0;
	}
	#Contents.datecenters .Section,
	#Contents.facility .Section,
	#Contents.resources .Section,
	#Contents.operation .Section,
	#Contents.ssos .Section {
		padding-left: 30px;
		padding-right: 30px;
	}
}
@media screen and (max-width: 579px){
	#Contents.datecenters .Section {
		padding-left: 15px;
		padding-right: 15px;
	}
}
#Contents.facility .Section.output_area div.server,
#Contents.resources .Section.output_area div.server,
#Contents.operation .Section.output_area div.server,
#Contents.ssos .Section.output_area div.server {
	margin-bottom: 20px;
}
#Contents.facility .branding h1,
#Contents.resources .branding h1,
#Contents.operation .branding h1,
#Contents.ssos .branding h1 {
	margin-top: 1em;
	text-align: left;
	font-size: 3em;
	line-height: 130%;
}
@media screen and (max-width: 994px) {
	#Contents.facility .branding h1,
	#Contents.resources .branding h1,
	#Contents.operation .branding h1,
	#Contents.ssos .branding h1 {
		font-size: 2em;
	}
}
#Contents .Section.Lead_wrap {
	padding-top: 20px;
	margin-bottom: 50px;
}
#Contents .Section.Lead_wrap .Section.flex_wrap {
	padding-top: 0;
}
.Section.Lead_wrap .Section.flex_wrap div.card_flex {
	display: flex;
}
.Section.Lead_wrap .Section.flex_wrap div.card_flex .image_icon {
	margin-top: -50px;
	z-index: 10;
}
#Contents .Section.Lead_wrap .Section.flex_wrap div.card_flex .image_icon img {
	width: 144px;
	max-width: 144px;
	border-radius: 10px;
}
.Section.Lead_wrap .Section.flex_wrap div.card_flex div.text {
	margin: 20px 10px 0 20px;
	display: inline-block;
}
@media screen and (max-width: 579px) {
	.Section.Lead_wrap .Section.flex_wrap div.card_flex {
		display: block;
		position: relative;;
	}
	.Section.Lead_wrap .Section.flex_wrap div.card_flex .image_icon {
		position: absolute;
	}
	.Section.Lead_wrap .Section.flex_wrap div.card_flex div.text {
		margin-top: 100px;
	}
}
#Contents .Section.Lead_wrap .Section.flex_wrap div.card_flex div.text p.title {
	font-size: 18pt;
	font-weight: bold;
}
.Section.Lead_wrap .Section.flex_wrap div.card_flex div.text p.letter_body {
	margin-top: 15px;
}
#Contents .Section.Lead_wrap .Section.flex_wrap div.card_flex ul.tag {
	margin-top: 20px;
}
#Contents .Section.Lead_wrap .Section.flex_wrap div.card_flex ul.tag li {
	display: inline-block;
	margin: 10px 5px;
	padding: 3px 15px;
	border-radius: 30px;
}
#Contents .Section.Lead_wrap .Section.flex_wrap div.card_flex p.output {
	padding: 10px;
	margin-top: 10px;
	border-radius: 10px;
	background-color: #F4F4F4;
}
#Contents .Section.Lead_wrap .Section.flex_wrap div.card_flex p.output span {
	display: inline-block;
	margin: 0 10px;
}
#Contents h2 {
	margin-bottom: 10px;
	background: none;
	text-align: left;
	font-size: 20pt;
}
#Contents h2:after {
	content: "";
	display: block;
	margin: 10px 0;
	height: 5px;
	width: 60px;
	border-radius: 3px;
}
#Contents .Section.overview_area,
#Contents.ssos .Section.features_area,
#Contents.ssos .Section.consultation_area {
	background-color: #F4F4F4;
}
#Contents .Section.overview_area ul {
	margin-top: 30px;
}
#Contents .Section.overview_area ul li {
	margin-bottom: 20px;
	background-color: #ffffff;
	padding: 20px 40px;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25);
}
#Contents .Section.overview_area ul li p.title {
	margin-bottom: 10px;
	font-size: 18pt;
	font-weight: bold;
}
#Contents .Section.output_area div.server p.title,
#Contents .Section.output_area div.server div.text {
	padding: 5px 20px;
}
#Contents .Section.output_area div.server p.title {
	font-size: 16pt;
	font-weight: bold;
	border-radius: 10px 10px 0 0;
}
#Contents .Section.output_area div.server div.text {
	border-radius: 0 0 10px 10px;
	display: flex;
}
#Contents .Section.output_area div.server div.text p.letter_body {
	width: calc(100% - 120px);
	margin-right: 20px;
}
#Contents .Section.output_area div.server div.text p img {
	width: 120px;
}
#Contents .Section.usecase_area .UseCaseBox p.title {
	font-size: 20pt;
	font-weight: bold;
	padding: 10px;
	margin-bottom: 20px;
}
#Contents .Section.usecase_area .UseCaseBox p.lead {
	font-weight: normal;
	text-align: left;
}
#Contents .Section.usecase_area .UseCaseBox p.image.Main_photo:before {
	content: "";
	display: inline-block;
	height: 100px;
	width: 110px;
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	top: 0;
	left: 50px;
}
@media screen and (max-width: 767px) {
	#Contents .Section.usecase_area .UseCaseBox p.image.Main_photo:before {
		height: 70px;
		width: 70px;
	}
}
#Contents .Section.usecase_area .UseCaseBox p.image img {
	width: 100%;
}
#Contents .Section.usecase_area .UseCaseBox p.image.Main_photo img {
	border-radius: 50px 50px 0 0;
}
#Contents .Section.usecase_area .UseCaseBox p.image.use {
	margin-top: 30px;
}
#Contents .Section.usecase_area .UseCaseBox p.image.smart {
	display: none;
}
@media screen and (max-width: 767px) {
	#Contents .Section.usecase_area .UseCaseBox p.image.pc {
		display: none;
	}
	#Contents .Section.usecase_area .UseCaseBox p.image.smart {
		display: block;
	}
}
#Contents .Section.usecase_area .UseCaseBox ul.multi-cloud-list {
	display: flex;
	justify-content: center;
}
#Contents .Section.usecase_area .UseCaseBox ul.multi-cloud-list li {
	display: inline-block;
	margin: 20px 10px;
}
#Contents .Section.usecase_area .UseCaseBox ul.multi-cloud-list li img {
	max-width: 100%;
}
@media screen and (max-width: 975px) {
	#Contents .Section.usecase_area .UseCaseBox ul.multi-cloud-list li {
		width: 30%;
	}
}
@media screen and (max-width: 767px) {
	#Contents .Section.usecase_area .UseCaseBox ul.multi-cloud-list {
		display: block;
	}
	#Contents .Section.usecase_area .UseCaseBox ul.multi-cloud-list li {
		width: 80%;
		margin: 5px 0;
	}
}

/* index */
#Contents.datecenters .Section.DataCenter_wrap {
	margin-bottom: 100px;
}
@media screen and (max-width: 1304px){
	#Contents.datecenters .Section.DataCenter_wrap {
		padding-left: 0;
		padding-right: 0;
	}
}
.Section.DataCenter_wrap .DataCenter_wrap_bg {
	background-image: url(/-/media/solution/th/datacenter/image/data_center_bg.png);
	background-size: cover;
	background-position: bottom;
}
.Section.DataCenter div.link {
	margin: 30px;
	padding: 30px 30px 50px 30px;
	border-radius: 10px;
	background-color: #ffffff;
	background-image: url(/-/media/solution/th/datacenter/image/data_center_link_bg.png);
	background-size: cover;
	box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25);
}
#Contents.datecenters .Section.DataCenter div.link h3 {
	font-size: 30pt;
	color: #0C0C0C;
}
@media screen and (max-width: 994px) {
	.Section.DataCenter div.link h3 {
		font-size: 20pt;
	}
}
#Contents.datecenters .Section.DataCenter ul.cards {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 30px 0;
}
#Contents.datecenters .Section.DataCenter ul.cards > li {
	width: calc((100% - 100px) / 2);
	border-radius: 10px;
	background-color: #ffffff;
	box-shadow: 4px 4px 10px rgba(208, 223, 245, 1);
	margin-top: 20px;
	position: relative;
}
@media screen and (max-width: 1304px){
	#Contents.datecenters .Section.DataCenter ul.cards {
		display: block;
		margin: 30px;
	}
	#Contents.datecenters .Section.DataCenter ul.cards > li {
		width: auto;
		margin: 20px auto 0;
	}
}
#Contents.datecenters .Section.DataCenter ul.cards > li a {
	display: block;
	padding: 20px;
	min-height: 250px;
	color: #0C0C0C;
}
#Contents.datecenters .Section.DataCenter ul.cards > li a:link,
#Contents.datecenters .Section.DataCenter ul.cards > li a:visited,
#Contents.datecenters .Section.DataCenter ul.cards > li a:hover,
#Contents.datecenters .Section.DataCenter ul.cards > li a:active {
	color: #0C0C0C;
	text-decoration: none;
}
.Section.DataCenter ul.cards > li a:hover {
	opacity: 0.6; 
}
.Section.DataCenter li:nth-child(2n+1) {
	margin-right: 20px;
}
.Section.DataCenter ul.cards li div.card_flex {
	display: flex;
}
@media screen and (max-width: 579px) {
	.Section.DataCenter ul.cards li div.card_flex {
		display: block;
	}
}
.Section.DataCenter ul.cards li.card_facility {
	border: solid 5px #00964E;
}
#Contents.datecenters .Section.DataCenter ul.cards li.card_resources {
	border: solid 5px #0064FA;
}
#Contents.datecenters .Section.DataCenter ul.cards li.card_operation {
	border: solid 5px #FA6900;
}
#Contents.datecenters .Section.DataCenter ul.cards li.card_ssos {
	border: solid 5px #9B00FA;
}
#Contents.datecenters .Section.DataCenter ul.cards li div.card_flex img {
	width: 144px;
}
@media screen and (max-width: 767px) {
	#Contents.datecenters .Section.DataCenter ul.cards li div.card_flex img {
		width: 120px;
		max-width: none;
	}
}
#Contents.datecenters .Section.DataCenter ul.cards li div.card_flex div.text {
	margin: 10px 10px 0 20px;
	display: inline-block;
	width: 100%;
}
@media screen and (max-width: 579px) {
	#Contents.datecenters .Section.DataCenter ul.cards li div.card_flex div.text {
		margin: 0;
	}
}
#Contents.datecenters .Section.DataCenter ul.cards li div.card_flex div.text p.title {
	font-size: 19pt;
	font-weight: bold;
	line-height: 110%;
	padding-bottom: 10px;
}
@media screen and (max-width: 994px) {
	#Contents.datecenters .Section.DataCenter ul.cards li div.card_flex div.text p.title {
		font-size: 18pt;
	}
}
#Contents .Section.DataCenter ul.cards li.card_facility div.card_flex div.text p.title {
	border-bottom: solid 1px #00964E;
}
.Section.DataCenter ul.cards li.card_resources div.card_flex div.text p.title {
	border-bottom: solid 1px #0064FA;
}
.Section.DataCenter ul.cards li.card_operation div.card_flex div.text p.title {
	border-bottom: solid 1px #FA6900;
}
.Section.DataCenter ul.cards li.card_ssos div.card_flex div.text p.title {
	border-bottom: solid 1px #9B00FA;
}
.Section.DataCenter ul.cards li div.card_flex div.text p.letter_body {
	margin-top: 15px;
	margin-bottom: 15px;
}
.Section.DataCenter ul.cards li ul.tag li {
	display: inline-block;
	margin: 5px 2px;
	padding: 3px 15px;
	border-radius: 30px;
	border: solid 1px #ffffff;
}
.Section.DataCenter ul.cards li.card_facility ul.tag li {
	background-color: rgba(0, 150, 78, 0.2);
}
.Section.DataCenter ul.cards li.card_resources ul.tag li {
	background-color: rgba(0, 100, 250, 0.15);
}
.Section.DataCenter ul.cards li.card_operation ul.tag li {
	background-color: rgba(250, 105, 0, 0.2);
}
.Section.DataCenter ul.cards li.card_ssos ul.tag li {
	background-color: rgba(208, 150, 253, 0.2);
}
.Section.DataCenter ul.cards li p.details_link {
	position: absolute;
	right: 30px;
	bottom: 20px;
	color: #222222;
}
@media screen and (max-width: 767px) {
	.Section.DataCenter ul.cards li p.details_link {
		position: static;
		text-align: right;
	}
}
.Section.DC_support {
	background-color: #F8F9FB;
}
#Contents.datecenters .Section.DC_support .Section.Decarbonization h2 {
	font-size: 30pt;
	text-align: center;
}
#Contents.datecenters .Section.DC_support .Section.Decarbonization h2 span {
	display: inline;
	font-size: 100%;
	padding: 0;
	background-color: transparent;
	border-bottom: solid 7px #00964E;
}
#Contents.datecenters .Section.DC_support .Section.Decarbonization h3 {
	margin-top: 60px;
	margin-bottom: 20px;
	font-size: 16pt;
	font-weight: normal;
	color: #ffffff;
	text-align: center;
}
#Contents.datecenters .Section.DC_support .Section.Decarbonization h3 span {
	display: inline-block;
	padding: 10px 50px;
	border-radius: 30px;
	background-color: #00964E;
}
@media screen and (max-width: 994px) {
	#Contents.datecenters .Section.DC_support .Section.Decarbonization h2 {
		font-size: 24pt;
	}
}
@media screen and (max-width: 767px) {
	#Contents.datecenters .Section.DC_support .Section.Decarbonization h2 {
		font-size: 22pt;
	}
	#Contents.datecenters .Section.DC_support .Section.Decarbonization p.lead {
		font-weight: normal;
	}
	#Contents.datecenters .Section.DC_support .Section.Decarbonization h3 {
		font-size: 14pt;
	}
}
#Contents.datecenters .Section.DC_support .Section.Decarbonization .img_map_wrap {
	position: relative;
}
#Contents.datecenters .Section.DC_support .Section.Decarbonization img {
	display: block;
	width: 100%;
}
#Contents.datecenters .Section.DC_support .Section.Decarbonization .img_map_wrap .img_map_link {
	position: absolute;
	left: 43.5%;
	top: 22%;
	width: 19%;
	height: 6%;
}
@media screen and (max-width: 1304px) {
	#Contents.datecenters div.Section.link,
	#Contents.datecenters div.RelatedLink {
		padding-left: 15px;
		padding-right: 15px;
	}
	#Contents.datecenters div.RelatedLink p {
		font-size: 100%;
	}
}
#Contents.datecenters .RelatedLinkList .link_seminar .hilight {
	font-size: 1.2rem;
}

/* facility */
#Contents.facility .branding {
	background-image: url(/-/media/solution/th/datacenter/image/facility/bb_Title_facility.png);
}
#Contents.facility .branding h1 {
	color: #0C0C0C;
	text-shadow: 1px 1px 0 #ffffff, -1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px -1px 0 #ffffff, 0px 1px 0 #ffffff, 0 -1px 0 #ffffff, -1px 0 0 #ffffff, 1px 0 0 #ffffff;
}
#Contents.facility h2:after {
	background-color: #00964E; 
}
#Contents.facility .Section.Lead_wrap .Section.flex_wrap div.card_flex ul.tag li {
	background-color: rgba(0, 150, 78, 0.2);
}
#Contents.facility  .Section.overview_area ul li {
	border-left: solid 6px #00964E;
}
#Contents.facility .Section.overview_area ul li p.title span {
	border-bottom: solid 3px #00964E;
}
#Contents.facility .Section.output_area div.server p.title,
#Contents.facility .Section.output_area div.server div.text {
	border: solid 1px #00964E;
}
#Contents.facility .Section.output_area div.server p.title {
	background-color: rgb(0, 150, 78, 0.2);
}
#Contents.facility .Section.output_area div.server div.text {
	border-top: none;
}
#Contents .Section.output_area div.datacenter_sites {
	text-align: center;
}
#Contents .Section.output_area div.datacenter_sites h3 {
	margin: 100px 0 50px;
	font-size: 20pt;
}
#Contents .Section.output_area div.datacenter_sites .sites {
	display: flex;
	justify-content: center;
	margin: 0 auto 50px;
}
@media screen and (max-width: 579px) {
	#Contents .Section.output_area div.datacenter_sites .sites {
		flex-wrap: wrap;
	}
}
#Contents .Section.output_area div.datacenter_sites .sites .datacenter {
	width: 15em;
	margin: 0 25px;
}
@media screen and (max-width: 767px) {
	#Contents .Section.output_area div.datacenter_sites .sites .datacenter {
		margin: 0 10px;
	}
}
@media screen and (max-width: 579px) {
	#Contents .Section.output_area div.datacenter_sites .sites .datacenter {
		margin: 20px 10px;
	}
}
#Contents .Section.output_area div.datacenter p.title {
	font-weight: bold;
	color: #ffffff;
	padding: 10px;
	border-radius: 10px 10px 0 0;
	background-color: #00964E;
}
#Contents .Section.output_area div.datacenter ul {
	font-size: 14pt;
	font-weight: bold;
	padding: 10px;
	border-radius: 0 0 10px 10px;
	background-color: #F4F4F4;
	min-height: 110px;
}
@media screen and (max-width: 579px) {
	#Contents .Section.output_area div.datacenter ul {
		font-size: 12pt;
		padding: 10px 0;
	}
}
#Contents .Section.output_area div.datacenter ul > li a:link,
#Contents .Section.output_area div.datacenter ul > li a:visited,
#Contents .Section.output_area div.datacenter ul > li a:active {
	color: #0C0C0C;
	text-decoration: underline;
}
#Contents .Section.output_area div.datacenter ul > li a:hover {
	color: #CC0000;
}
#Contents .Section.output_area div.datacenter ul > li span.link_decoration {
	color: #737373;
	font-size: 0.7em;
}
#Contents .Section.output_area div.datacenter_sites p.image img {
	width: 100%;
	max-width: 700px;
	margin-bottom: 50px;
}

/* resources */
#Contents.resources .branding {
	background-image: url(/-/media/solution/th/datacenter/image/resources/bb_Title_ITresources.png);
}
#Contents.resources .branding h1 {
	color: #FFFFFF;
	text-shadow: 1px 1px 0 #000000, -1px -1px 0 #000000, -1px 1px 0 #000000, 1px -1px 0 #000000, 0px 1px 0 #000000, 0 -1px 0 #000000, -1px 0 0 #000000, 1px 0 0 #000000;
}
#Contents.resources .Section.Lead_wrap .Section.flex_wrap div.card_flex ul.tag li {
	background-color: rgba(0, 100, 250, 0.15);
}
#Contents.resources h2:after {
	background-color: #0064FA; 
}
#Contents.resources .Section.overview_area ul li {
	border-left: solid 6px #0064FA;
}
#Contents.resources .Section.overview_area ul li p.title span {
	border-bottom: solid 3px #0064FA;
}
#Contents.resources .Section.output_area div.server p.title,
#Contents.resources .Section.output_area div.server div.text {
	border: solid 1px #0064FA;
}
#Contents.resources .Section.output_area div.server p.title {
	background-color: rgba(0, 100, 250, 0.15);
}
#Contents.resources .Section.output_area div.server div.text {
	border-top: none;
}
#Contents.resources .Section.usecase_area .UseCaseBox {
	margin-bottom: 30px;
	border: 1px solid #4d4d4d;
	border-radius: 50px;
	text-align: center;
	position: relative;
}
#Contents.resources .Section.usecase_area .UseCaseBox .UseCaseBox_contents {
	padding: 30px;
}
#Contents.resources .Section.usecase_area .UseCaseBox.UseCaseBox01 p.image.Main_photo:before {
	background-image: url(/-/media/solution/th/datacenter/image/resources/icon_check_case01.png);
}
#Contents.resources .Section.usecase_area .UseCaseBox.UseCaseBox02 p.image.Main_photo:before {
	background-image: url(/-/media/solution/th/datacenter/image/resources/icon_check_case02.png);
}
#Contents.resources .Section.usecase_area .UseCaseBox.UseCaseBox03 p.image.Main_photo:before {
	background-image: url(/-/media/solution/th/datacenter/image/resources/icon_check_case03.png);
}
#Contents.resources .Section.usecase_area .UseCaseBox.UseCaseBox04 p.image.Main_photo:before {
	background-image: url(/-/media/solution/th/datacenter/image/resources/icon_check_case04.png);
}
#Contents.resources .Section.usecase_area .UseCaseBox p.image.Main_photo img {
	border-bottom: solid 3px #0064FA;
}
#Contents.resources .Section.usecase_area .UseCaseBox div.multi-cloud-results {
	margin-top: 20px;
	padding: 20px 30px 20px;
	border-radius: 10px;
	background-color: rgba(0, 100, 250, 0.15);
}
@media screen and (max-width: 767px) {
	#Contents.resources .Section.usecase_area .UseCaseBox div.multi-cloud-results {
		margin-top: 10px;
		padding: 10px;
	}
}
#Contents.resources .Section.usecase_area .UseCaseBox div.multi-cloud-results p.title {
	font-size: 16pt;
	margin-bottom: 0;
}
#Contents.resources .Section.usecase_area .UseCaseBox div.multi-cloud-results p.image {
	background-color: #ffffff;
	padding: 10px;
	border-radius: 10px;
}
#Contents.resources .Section.usecase_area .UseCaseBox div.multi-cloud-results img {
	width: 100%;
	margin-top: 10px;
	margin-bottom: 30px;
}
#Contents.resources .Section.usecase_area .UseCaseBox p.sub_title {
	display: inline-block;
	color: #FFFFFF;
	background-color: #0064FA;
	border-radius: 3px;
	padding: 3px 10px;
	font-weight: bold;
}
#Contents.resources .Section.usecase_area .UseCaseBox ul.multi-cloud-check {
	text-align: left;
	list-style-image: url(/-/media/solution/th/datacenter/image/resources/icon_check.png);
	padding-left: 35px;
}
#Contents.resources .Section.usecase_area .UseCaseBox ul.multi-cloud-check li {
	margin-top: 5px;
}

/* operation */
#Contents.operation .branding {
	background-image: url(/-/media/solution/th/datacenter/image/operation/bb_title_IToperation.png);
}
#Contents.operation .branding h1 {
	color: #FFFFFF;
	text-shadow: 1px 1px 0 #000000, -1px -1px 0 #000000, -1px 1px 0 #000000, 1px -1px 0 #000000, 0px 1px 0 #000000, 0 -1px 0 #000000, -1px 0 0 #000000, 1px 0 0 #000000;
}
#Contents.operation .Section.Lead_wrap .Section.flex_wrap div.card_flex ul.tag li {
	background-color: rgba(250, 105, 0, 0.2);
}
#Contents.operation h2:after {
	background-color: #FA6900;
}
#Contents.operation .Section.features_area {
	background-color: rgba(250, 105, 0, 0.2);
}
#Contents.operation .Section.overview_area ul li {
	border-left: solid 6px #FA6900;
}
#Contents.operation .Section.overview_area ul li p.title span {
	border-bottom: solid 3px #FA6900;
}
#Contents.operation .Section.overview_area ul li ul.letter_body_strong {
	margin-top: 15px
}
#Contents.operation .Section.overview_area ul li ul.letter_body_strong li {
	margin-left: 30px;
	margin-bottom: 0;
	padding: 0;
	border-left: 0;
	box-shadow: none;
	list-style-type: disc;
	font-size: 120%;
	color: #222222;
}
#Contents.operation .Section.output_area div.server p.title,
#Contents.operation .Section.output_area div.server div.text {
	border: solid 1px #FA6900;
}
#Contents.operation .Section.output_area div.server p.title {
	background-color: rgba(250, 105, 0, 0.2);
}
#Contents.operation .Section.output_area div.server div.text {
	border-top: none;
}
#Contents.operation .Section.usecase_area .UseCaseBox {
	margin-bottom: 30px;
	border: 1px solid #4d4d4d;
	border-radius: 50px;
	text-align: center;
	position: relative;
}
#Contents.operation .Section.usecase_area .UseCaseBox .UseCaseBox_contents {
	padding: 30px;
}
#Contents.operation .Section.usecase_area .UseCaseBox.UseCaseBox01 p.image.Main_photo:before {
	background-image: url(/-/media/solution/th/datacenter/image/operation/icon_check_case01.png);
}
#Contents.operation .Section.usecase_area .UseCaseBox.UseCaseBox02 p.image.Main_photo:before {
	background-image: url(/-/media/solution/th/datacenter/image/operation/icon_check_case02.png);
}
#Contents.operation .Section.usecase_area .UseCaseBox.UseCaseBox03 p.image.Main_photo:before {
	background-image: url(/-/media/solution/th/datacenter/image/operation/icon_check_case03.png);
}
#Contents.operation .Section.usecase_area .UseCaseBox.UseCaseBox04 p.image.Main_photo:before {
	background-image: url(/-/media/solution/th/datacenter/image/operation/icon_check_case04.png);
}
#Contents.operation .Section.usecase_area .UseCaseBox p.image.Main_photo img {
	border-bottom: solid 3px #FA6900;
}
#Contents.operation .Section.usecase_area .UseCaseBox ul.multi-cloud-check {
	text-align: left;
	list-style-image: url(/-/media/solution/th/datacenter/image/operation/icon_check.png);
	padding-left: 35px;
}
#Contents.operation .Section.usecase_area .UseCaseBox ul.multi-cloud-check li {
	margin-top: 5px;
}

/* ssos */
#Contents.ssos .branding {
	background-image: url(/-/media/solution/th/datacenter/image/ssos/bb_title_ssos.png);
}
#Contents.ssos .branding h1 {
	color: #FFFFFF;
	text-shadow: 1px 1px 0 #000000, -1px -1px 0 #000000, -1px 1px 0 #000000, 1px -1px 0 #000000, 0px 1px 0 #000000, 0 -1px 0 #000000, -1px 0 0 #000000, 1px 0 0 #000000;
}
#Contents.ssos .Section.Lead_wrap .Section.flex_wrap div.card_flex ul.tag li {
	background-color: rgba(208, 150, 253, 0.2)
}
#Contents.ssos h2:after {
	background-color: #540096;
}
#Contents.ssos .Section.Lead_wrap p.text_link a {
	display: inline-block;
	margin-top: 25px;
	padding: 3px 20px 3px 10px;
	border: solid 3px #540096;
	border-radius: 15px;
	font-weight: bold;
}
#Contents.ssos .Section.Lead_wrap p.text_link a:link,
#Contents.ssos .Section.Lead_wrap p.text_link a:visited,
#Contents.ssos .Section.Lead_wrap p.text_link a:active {
	color: #0C0C0C;
	text-decoration: none;
}
#Contents.ssos .Section.Lead_wrap p.text_link a:hover {
	color: #CC0000;
	text-decoration: underline;
}
#Contents.ssos .Section.Lead_wrap p.text_link a span.flext_wrap {
	display: flex;
	align-items: center;
}
#Contents.ssos .Section.Lead_wrap p.text_link a span.flext_wrap .flext_contents.img {
	display: inline-block;
	margin-left: 10px;
}
#Contents.ssos .Section.Lead_wrap p.text_link a span.flext_wrap img {
	height: 30px;
	width: 30px;
	max-width: none;
}
#Contents.ssos .Section.overview_area ul li {
	border-left: solid 6px #540096;
}
#Contents.ssos .Section.overview_area ul li p.title span {
	border-bottom: solid 3px #540096;
}
#Contents.ssos .Section.effect_area h3 {
	display: inline-block;
	padding: 3px 10px;;
	font-size: 20pt;
	color: #ffffff;
	background-color: #540096;
	border-radius: 5px;
}
#Contents.ssos .Section.effect_area ul.flex_wrap {
	display: flex;
	align-items: center;
	margin-bottom: 40px;
}
#Contents.ssos .Section.effect_area ul.flex_wrap li {
	margin: 5px 20px;
	padding: 20px;
	width: calc((100% - 100px) / 3);
	text-align: center;
	vertical-align: middle;
	border-radius: 10px;
}
#Contents.ssos .Section.effect_area ul.flex_wrap li:first-child {
	margin-left: 0;
}
#Contents.ssos .Section.effect_area ul.flex_wrap li:last-child {
	margin-right: 0;
}
@media screen and (max-width: 767px) {
	#Contents.ssos .Section.effect_area ul.flex_wrap {
		display: block;
	}
	#Contents.ssos .Section.effect_area ul.flex_wrap li {
		margin: 20px 10px;
		width: auto;
	}
	#Contents.ssos .Section.effect_area ul.flex_wrap li:first-child {
		margin-left: 10px;
	}
	#Contents.ssos .Section.effect_area ul.flex_wrap li:last-child {
		margin-right: 10px;
	}
}
#Contents.ssos .Section.effect_area ul.flex_wrap.trouble li {
	border: solid 0.5px #000000;
}
#Contents.ssos .Section.effect_area ul.flex_wrap.trouble li img {
	width: 100%;
	max-width: 300px;
}
#Contents.ssos .Section.effect_area ul.flex_wrap.trouble li p.letter_body {
	margin-top: 20px;
}
#Contents.ssos .Section.effect_area ul.flex_wrap.effect li {
	position: relative;
	min-height: 200px;
	border: solid 1px #540096;
}
#Contents.ssos .Section.effect_area ul.flex_wrap.effect li p.letter_body {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform : translate(-50%,-50%);
	transform : translate(-50%,-50%);
	width: 90%;
	font-weight: bold;
}
#Contents.ssos .Section.features_area h2 {
	text-align: center;
}
#Contents.ssos .Section.features_area h2:after {
	height: 8px;
	width: 100px;
	margin: 10px auto 0;
}
#Contents.ssos .Section.features_area p.h2_sub {
	text-align: center;
	font-size: 16pt;
	font-weight: bold;
	margin-bottom: 20px;
}
#Contents.ssos .Section.features_area p.h2_sub.card_title {
	margin-top: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
}
#Contents.ssos .Section.features_area p.h2_sub.card_title img {
	height: 25px;
}
#Contents.ssos .Section.features_area p.h2_sub.card_title span {
	display: inline-block;
	margin-left: 10px;
	margin-right: 10px;
}
#Contents.ssos .Section.features_area ul.cards {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 30px;
}
#Contents.ssos .Section.features_area ul.cards > li {
	width: calc((100% - 100px) / 2);
	background-color: #ffffff;
	margin-top: 20px;
	padding: 20px;
	min-height: 250px;
	color: #0C0C0C;
	position: relative;
}
#Contents.ssos .Section.features_area ul.cards li.card:nth-child(2n+1) {
	margin-right: 20px;
}
@media screen and (max-width: 994px){
	#Contents.ssos .Section.features_area ul.cards {
		display: block;
	}
	#Contents.ssos .Section.features_area ul.cards > li.card,
	#Contents.ssos .Section.features_area ul.cards li.card:nth-child(2n+1) {
		width: 90%;
		margin: 20px auto 0;
	}
}
@media screen and (max-width: 767px) {
	#Contents.ssos .Section.features_area ul.cards {
		margin: 0 0 30px 0;
	}
}
#Contents.ssos .Section.features_area ul.cards > li.card:before {
	content: "";
	display: inline-block;
	width: 177px;
	height: 147px;
	position: absolute;
	top: 0;
	left: 0;
	background-size: contain;
	background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
	#Contents.ssos .Section.features_area ul.cards > li.card:before {
		width: 130px;
		height: 120px;
	}
}
#Contents.ssos .Section.features_area ul.cards > li.card_01:before {
	background-image: url(/-/media/solution/th/datacenter/image/ssos/ssos_card_num_01.png);
}
#Contents.ssos .Section.features_area ul.cards > li.card_02:before {
	background-image: url(/-/media/solution/th/datacenter/image/ssos/ssos_card_num_02.png);
}
#Contents.ssos .Section.features_area ul.cards > li.card_03:before {
	background-image: url(/-/media/solution/th/datacenter/image/ssos/ssos_card_num_03.png);
}
#Contents.ssos .Section.features_area ul.cards > li.card_04:before {
	background-image: url(/-/media/solution/th/datacenter/image/ssos/ssos_card_num_04.png);
}
#Contents.ssos .Section.features_area ul.cards li div.card_flex {
	display: flex;
}
#Contents.ssos .Section.features_area ul.cards li div.card_flex img {
	width: 144px;
}
@media screen and (min-width: 995px) and (max-width: 1304px) {
	#Contents.ssos .Section.features_area ul.cards li div.card_flex img {
		max-width: initial;
	}
}
@media screen and (max-width: 994px) {
	#Contents.ssos .Section.features_area ul.cards li div.card_flex img {
		max-width: initial;
	}
}
@media screen and (max-width: 767px) {
	#Contents.ssos .Section.features_area ul.cards li div.card_flex img {
		width: 120px;
	}
}
#Contents.ssos .Section.features_area ul.cards li div.text p.title {
	margin: 20px 20px 20px 140px;
	font-size: 18pt;
	font-weight: bold;
	line-height: 110%;
	padding-bottom: 20px;
	border-bottom: solid 1px #540096;
}
@media screen and (max-width: 767px) {
	#Contents.ssos .Section.features_area ul.cards li div.text p.title {
		margin-left: 80px;
	}
}
#Contents.ssos .Section.features_area ul.cards li ul.check {
	text-align: left;
	list-style: none;
}
#Contents.ssos .Section.features_area ul.cards li ul.check li {
	margin-top: 5px;
	background-image:  url(/-/media/solution/th/datacenter/image/ssos/icon_check.png);
	padding-left: 30px;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: left top;
}
#Contents.ssos .Section.output_area div.server p.title,
#Contents.ssos .Section.output_area div.server div.text {
	border: solid 1px #540096;
}
#Contents.ssos .Section.output_area div.server p.title {
	background-color: rgba(208, 150, 253, 0.2)
}
#Contents.ssos .Section.output_area div.server div.text {
	display: block;
	border-top: none;
}
#Contents .Section.output_area p.supplement {
	font-size: 10pt;
}
#Contents.ssos .Section.consultation_area p.h2_sub {
	text-align: center;
	font-size: 20pt;
	font-weight: bold;
}
#Contents.ssos .Section.consultation_area {
	margin-top: 4rem;
	margin-bottom: 4rem;
	padding-bottom: 4rem;
	text-align: center;
}
#Contents.ssos .Section.consultation_area div.consultation_flex {
	display: flex;
	justify-content: center;
	align-items:center;
	margin-bottom: 30px;
}
#Contents.ssos .Section.consultation_area div.consultation_flex p.h2_image {
	margin-right: 20px;
}
#Contents.ssos .Section.consultation_area div.consultation_flex p.h2_image img {
	max-width: 80px;
	min-width: 80px;
}