@charset "utf-8";
/* CSS Document */


/*
 * 製品一覧
 */
.products-col2-box {
	max-width: 800px;
	margin: 0 auto;
	display: -webkit-flex;
	display: flex;
	width: calc(100% + 20px);
}
.products-col2-box + * {
	margin-top: 14px;
}
.products-col2-box > .img {
	max-width: 25%;
	-webkit-flex-grow: 3;
	flex-grow: 3;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-flex-flow: column;
	flex-flow: column;
	-webkit-justify-content: center;
	justify-content: center;
	text-align: center;
}
.products-col2-box > .img .img-inner {
	padding-right: 10px;
}
.products-col2-box > .contents {
	max-width: 75%;
	-webkit-flex-grow: 9;
	flex-grow: 9;
}
@media only screen and (max-width: 480px) {
.products-col2-box {
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.products-col2-box > .img,
 .products-col2-box > .contents {
	max-width: 100%;
}
.products-col2-box > .img .img-inner {
	margin-right: 0;
	margin-bottom: 10px;
}
}
/*
 * お問い合わせアイコン位置調整
 */
.list-contact-a a[href^="tel:"].diff-iconpos-inner .contact-inner::before {
	content: "";
	background-image: url(//www.fujitsu.com/imgv5/common/icon/sprite2.png);
	display: block;
	position: absolute;
	content: "";
	left: -44px;
	top: 50%;
	background-position: -56px -25px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
}
.list-contact-a a[href^="tel:"].diff-iconpos-inner .contact-inner {
	position: relative;
}
.list-contact-a a[href^="tel:"].diff-iconpos-inner::before {
	display: none;
}
/*
 * KV部タイトル
 */
.lyt-visual-item-a a:hover,.lyt-visual-item-a a:active,.lyt-visual-item-a a:focus {
	opacity: 1 !important;
}
.lyt-visual-item-a .visual-title {
	max-width: 1280px;
	margin: 0 auto;
	text-align: left;
	height: 427px;
	display: flex;
	flex-wrap: wrap;
	position: relative;
	flex-flow: column;
	justify-content: center;
	padding: 0 80px;
}
.lyt-visual-item-a .visual-title span {
	z-index: 1;
	position: relative;
	display: inline-block;
	padding: 28px 30px;
	background: rgba(255, 255, 255, 0.8);
	align-self: flex-start;
	text-shadow: 0 0 15px #fff, 0 0 15px #fff, 0 0 4px #fff;
}
.lyt-visual-item-a .visual-title.diff-right span{
	align-self: flex-end;
}
@media only screen and (max-width: 980px) {
.lyt-visual-item-a .visual-title {
	height: auto;
	background: #fff;
	padding: 0;
}
.lyt-visual-item-a .visual-title span,
.lyt-visual-item-a .visual-title.diff-right span {
	background: none;
	align-self: auto;
}
}

/*
 * 背景定義
 */

.main-contents .section.diff-bg-image-promise {
	background: url(/jp/imagesgig5/tab-bg_tcm102-3743477_tcm102-2750236-32.png) no-repeat;
}
.main-contents .section.diff-bg-top-platform {
	background: url(/jp/imagesgig5/bg_top01_tcm102-3752399_tcm102-2750236-32.jpg) no-repeat;
	background-position: top center;
}
.main-contents .section.diff-bg-d.diff-bg-top-proposal {
	background: url(/jp/imagesgig5/bg_top02_tcm102-3752401_tcm102-2750236-32.jpg) no-repeat;
	background-position: top center;
	background-color: #000;
}
.main-contents .section.diff-bg-message-mission  {
	background: url(/jp/imagesgig5/bg_message01_tcm102-3752418_tcm102-2750236-32.jpg) no-repeat;
	background-position: top center;
	background-color: #fff;
}
.main-contents .section.diff-bg-message-strategy  {
	background: url(/jp/imagesgig5/bg_message02_tcm102-3752419_tcm102-2750236-32.jpg) no-repeat;
	background-position: top center;
	background-color: #01151e;
	color: #fff;
}
.main-contents .section.diff-bg-message-future  {
	background: url(/jp/imagesgig5/bg_message03_tcm102-3752420_tcm102-2750236-32.jpg) no-repeat;
	background-position: bottom center;
	background-color: #ecf0f3;
}
.main-contents .section.bg-size-cover {
	background-size: cover !important;
}


/*
 * 製品群調整
 */
 
/* リスト */
.list-products-wrap {
	max-width: 960px;
	margin: 0 auto;
}
.list-products {
	margin-left: -20px;
	display: flex;
	flex-wrap: wrap;
}
.list-products li {
	margin-left: 20px;
	margin-bottom: 20px;
	width: 225px;
}
.lyt-producuts h3{
	font-size: 1.6rem;
	margin-top: 0;
	margin-bottom: 0;
}

/* 中身 */
.lyt-producuts a {
	padding: 15px;
	display: block;
	border: 1px solid #7e7265;
	width: 225px;
	margin: 0 auto;
	text-decoration: none;
}
.lyt-producuts a .productname {
	height: calc((1.6rem * 1.6) * 3);
	display: block;
}
.lyt-producuts a .img {
	display: block;
	max-width: 165px;
	margin: 0 auto;
	margin-top: 8px;
}


/*
 * 製品群調整 v2
 */
 
.list-products-a-wrap {
	max-width: 960px;
	margin: 0 auto;
}
.list-products-a {
	margin-left: -20px;
	display: flex;
	flex-wrap: wrap;
}
@media only screen and (max-width: 1000px) {
	.list-products-a {
		justify-content: center;
	}
	.list-products-a:before,
	.list-products-a:after {
		content: "";
		display: block;
		width: 225px;
		margin-left: 20px;
		order: 2;
	}
}
.list-products-a li {
	margin-left: 20px;
	margin-bottom: 20px;
	width: 225px;
}
.lyt-producuts-a {
	border: 1px solid #7e7265;
	margin-left: 20px;
	margin-bottom: 20px;
	width: 225px;
	padding: 15px;
	display: block;
	text-align: center;
	text-decoration: none;
	transition: opacity .4s;
	transform: translate(0,0);
}
.lyt-producuts-a:hover {
	text-decoration: underline;
	opacity: .7;
}
.lyt-producuts-a .productname{
	font-size: 1.6rem;
	font-weight: 700;
	display: block;
	height: calc((1.6rem * 1.6) * 2);
}
.lyt-producuts-a .img {
	display: flex;
	align-items: center;
	max-width: 165px;
	margin: 0 auto;
	margin-top: 8px;
}
.lyt-producuts-a .img:before{
	padding-top: 100%;
	content: "";
	display: block;
}
.lyt-producuts-a .img-inner {
	width: 100%;
}
.lyt-producuts-a .desc {
	display: block;
	font-size: 1.4rem;
	margin-top: 8px;
}

 
/* リスト */


/*
 * 3つの約束
 */

.main-contents .section.diff-bg-black {
	background: #000;
	color: #fff;
}
.main-contents .section.diff-bg-promise {
	color: #fff;
	background: url(/jp/imagesgig5/bg_promise_tcm102-3749125_tcm102-2750236-32.jpg) no-repeat;
	background-color: #000;
	background-size: cover !important;
	position: relative;
}
.button-promise {
	color: #fff;
	text-decoration: none !important;
	font-weight: 700;
	display: flex;
	flex-flow: column;
	max-width: 300px;
	margin: 0 auto;
	padding-bottom: 50px;
	position: relative;
	text-align: center;
	transition: opacity .2s;
	pointer-events: none;
}
.button-promise[href] {
	pointer-events: auto;
}
.button-promise:hover,.button-promise:active,.button-promise:focus {
	color: #fff;
	opacity: .7;
}
.button-promise.diff-color-red,
.button-promise.diff-color-red:hover,
.button-promise.diff-color-red:active,
.button-promise.diff-color-red:focus {
	color: #f00;
	opacity: 1;
}
.button-promise:before {
	content: "もっと詳しく";
	position: absolute;
	bottom: 0px;
	display: inline-block;
	left: 50%;
	transform: translateX(-50%);
	font-size: 1.3rem;
}
.button-promise:after {
	content: "";
	display: inline-block;
	width: 40px;
	height: 12px;
	position: absolute;
	bottom: 28px;
	background: url(/jp/imagesgig5/arrow_down_m_tcm102-3748848_tcm102-2750236-32.png) no-repeat center;
	left: calc(50% - 20px);
}

.diff-modal-none .button-promise {
	padding-bottom: 20px;
}
.diff-modal-none .button-promise:before,
.diff-modal-none .button-promise:after {
	display: none;
}
	
.button-promise .img {
	margin-bottom: 20px;
}
.button-promise .title {
	font-size: 2rem;
}
.button-promise .sub {
	margin-top: 5px;
	font-size: 1.4rem;
}

@media only screen and (max-width: 767px) {
.button-promise {
	margin-bottom: 40px;
	padding-left: 70px;
	text-align: left;
}
.button-promise .img {
	position: absolute;
	left: 0;
	top: 0;
	width: 50px;
}
}
.hdg-b.diff-center.diff-accent-none:before {
	display: none;
}

/* モーダル */
#promise-modal {
	position: absolute;
	max-width: 1080px;
	width: 100%;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	margin: 0 !important;
	background: rgba(255, 255, 255, .95);
	color: #000;
	z-index: 1;
}
#promise-modal .modal-contents{
	padding: 40px !important;
	overflow: hidden;
}
#promise-modal .modal-contents .section {
	overflow-x: auto;
}
#promise-modal .section-inner {
	padding: 0 !important;
	max-height: 400px;
}
#promise-modal .button-close {
	border: none;
	right: 10px;
	top: 10px;
	position: absolute;
}

#promise-modal:not(.js-init) {
	display: none;	
}

/*
 * H2アクセント（番号付き）
 */
.hdg-b[class*="diff-accent-hex"] {
	padding-left: 90px;
	padding-top: 24px;
	padding-bottom: 28px;
	position: relative;
	border-bottom: 2px solid #c0b9b3;
}
.hdg-b[class*="diff-accent-hex"]:after {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: calc(50% - 40px - 2px);
	width: 70px;
	height: 81px;
}
.hdg-b[class*="diff-accent-hex"]:before {
	background: #7f7365;
	height: 2px;
	bottom: -2px;
}
.hdg-b.diff-accent-hex-01:after {
	background: url(/jp/imagesgig5/icon_s_01_tcm102-3748862_tcm102-2750236-32.png) no-repeat;
}
.hdg-b.diff-accent-hex-02:after {
	background: url(/jp/imagesgig5/icon_s_02_tcm102-3748863_tcm102-2750236-32.png) no-repeat;
}
.hdg-b.diff-accent-hex-03:after {
	background: url(/jp/imagesgig5/icon_s_03_tcm102-3748864_tcm102-2750236-32.png) no-repeat;
}

/*
 * H2アクセント（メッセージ）
 */
 
.hdg-b.diff-message-accent {
	padding-bottom: 0;
	font-size: 3.8rem;
	color: #f00;
}
.hdg-b.diff-message-accent:before {
	display: none;
}
.hdg-b.diff-message-accent span {
	display: block;
	font-size: 1.8rem;
	padding-top: 14px;
	position: relative;
	margin-top: 12px;
	color: #000;
}
.hdg-b.diff-message-accent.diff-light span {
	color: #fff;
}
.hdg-b.diff-message-accent span:before {
	content: "";
	position: absolute;
	top: 0;
	display: block;
	width: 60px;
	height: 1px;
	background-color: #f00;
	left: 50%;
	transform: translateX(-50%);
}

/*
 * H3アクセント（メッセージ）
 */
 
.accent-message-line {
	font-size: 2.4rem;
	position: relative;
	padding: 7px 0;
	margin-top: 60px !important;
	margin-bottom: 40px;
}
.accent-message-line:before ,
.accent-message-line:after {
	content: "";
	position: absolute;
	display: block;
	width: 100%;
	max-width: 1080px;
	height: 1px;
	top: 0;
	left: 50%;
	background-color: #fff;
	transform: translateX(-50%);
}
.accent-message-line:after {
	top: auto;
	bottom: 0;
}

/*
 * H3アクセント（展示一覧）
 */


.main-contents .section .list-futures,
.list-futures {
	margin-left: -20px;
	margin-bottom: -20px !important;
	display: flex;
	flex-wrap: nowrap;
	margin-top: 160px !important;
	justify-content: center;
}

.list-futures li {
	width: 305px;
	margin-left: 20px;
	margin-bottom: 20px;
}

.list-futures a {
	border: none;
	display: block;
	overflow: hidden;
	position: relative;
	padding-top: 62.5%;
	box-shadow: 0px 5px 16px rgba(0, 0, 0, 0.44);
}

.list-futures a > img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
}

.list-futures a > span {
	display: block;
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 10px;
	padding-right: 30px;
	background: rgba(255, 255, 255, .9);
	font-weight: bold;
}
.list-futures a > span > img {
	position: absolute;
	right: 13px;
	top: 50%;
	transform: translateY(-50%);
}
@media only screen and (max-width: 1023px) {
.main-contents .section .list-futures,
.list-futures {
	flex-wrap: wrap;	
}	
}
@media only screen and (max-width: 480px) {
.main-contents .section .list-futures,
.list-futures {
	margin-top: 0;
}
}
/*
 * ナビゲーション黒+白矢印
 */
.nav-b.diff-computing-nav,
.nav-b.diff-computing-nav .nav-b-inner{
	background: #000;
}
.nav-b.diff-computing-nav .nav-b-inner a{
	color: #fff;
	padding-left: 0;
	padding-right: 28px;
}
.nav-b.diff-computing-nav ul {
	width: 100% !important;
	display: table;
	margin-bottom: 0;
}
.nav-b.diff-computing-nav ul > li {
	white-space: normal;
	display: table-cell;
	vertical-align: top;
}
.nav-b.diff-computing-nav ul > li a:after {
	display: none;
}
.nav-b.diff-computing-nav ul > li a:before {
	width: 18px;
	height: 9px;
	display: block;
	position: absolute;
	content: "";
	right: 0;
	top: .44em;
	background: url(/jp/imagesgig5/arrow_down_s_tcm102-3748966_tcm102-2750236-32.png) no-repeat;
}
.nav-b.diff-computing-nav ul > li a {
	width: 100%;
}
.nav-b.diff-computing-nav ul>li::before {
	display: none;
}
.is-fixed .nav-b.diff-computing-nav ul {
	display: table;
}
.is-fixed .nav-b.diff-computing-nav ul>li {
	white-space: normal;
}
.is-fixed .nav-b.diff-computing-nav .nav-b-inner {
	overflow-x: auto;
	overflow-y: hidden;
}
@media only screen and (max-width: 767px) {
.js-nav-fixed:not(.is-fixed) .nav-b.diff-computing-nav ul {
	display: flex;
	flex-wrap: wrap;
}
.js-nav-fixed .nav-b.diff-computing-nav ul > li{
	width: auto;
}
.js-nav-fixed:not(.is-fixed) .nav-b.diff-computing-nav ul > li{
	width: 100%;
}
.is-fixed .nav-b.diff-computing-nav ul>li {
	white-space: nowrap;
}
}
/* ナビゲーション トップ用調整 */
.js-nav-fixed.diff-computing-top .nav-b.diff-computing-nav {
	background: rgba(0, 0, 0, 0.6);
}
.js-nav-fixed.diff-computing-top.is-fixed .nav-b.diff-computing-nav {
	background: #000;
}
.js-nav-fixed.diff-computing-top .nav-b.diff-computing-nav .nav-b-inner {
	background: none;
}
.js-nav-fixed.diff-computing-top .nav-b ul>li {
	padding: 0 20px;
}
@media only screen and (max-width: 767px) {
.js-nav-fixed.diff-computing-top .nav-b ul>li {
	padding: 0 4px 12px;
}
.js-nav-fixed.diff-computing-top .nav-b ul>li:last-child {
	padding-bottom: 0;
}
.js-nav-fixed.diff-computing-top.is-fixed .nav-b ul>li{
	padding: 0 30px;
}
}
/*
 * セクション幅調整
 */
 
.maxw-640px {
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
}
.maxw-1080px {
	max-width: 1080px;
	margin-left: auto;
	margin-right: auto;
}


/*
 * お問い合わせ 中央寄せ
 */
 .lyt-help-a .columns {
	 justify-content: space-around !important;
 }
.lyt-help-a .columns .column-content.diff-center {
	 align-items: center;
 }
 
 
/*
 * lyt-idx-b 1カラム表示
 */
.lyt-idx-b.diff-col1 {
	flex-flow: column;
}
.lyt-idx-b.diff-col1 .text-box.diff-type-b {
	padding: 15px 35px 15px 24px;
}
.lyt-idx-b.diff-col1 a{
	border:none;
	color:#fff;
}
.lyt-idx-b.diff-col1 .text-box.diff-type-b.bg-facility{
	background:#000 url(/jp/imagesgig5/img_facility_tcm102-3871182_tcm102-2750236-32.jpg) no-repeat left center;
}
.lyt-idx-b.diff-col1 .text-box.diff-type-b.bg-service{
	background:#000 url(/jp/imagesgig5/img_service_tcm102-3871184_tcm102-2750236-32.jpg) no-repeat left center;
}
@media only screen and (max-width: 767px) {
	.lyt-idx-b.diff-col1 .text-box.diff-type-b .title{
		align-self: flex-end;
		text-shadow: 0px 0px 15px #000;
	}

}
.lyt-idx-b.diff-text-inline {
	display: flex;
	flex-flow: column;
}

.lyt-idx-b.diff-text-inline .text-box{
	padding: 15px 35px 15px 24px;
	display: flex;
	flex-flow: column;
}
.lyt-idx-b.diff-text-inline .text-box::before {
	display: none;
}
.lyt-idx-b.diff-text-inline .text-box .title{
	align-self: center;
	position: relative;
	padding-right: 20px;
}
.lyt-idx-b.diff-text-inline .text-box .title:after {
	display: inline-block;
	content: "";
	position: absolute;
	top: 50%;
	right: 8px;
	width: 10px;
	height: 10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-top: -5px;
}


/*バナー一覧*/

.main-contents .section.p-common-moreinfo .section-inner>ul:last-child,
.p-common-moreinfo ul {
	margin: 0 -10px -20px;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.p-common-moreinfo ul:after {
	display: block;
	clear: both;
	content: '';
}

.p-common-moreinfo li {
	float: left;
	width: 25%;
	padding: 0 9px 20px;
}

@media screen and (max-width: 768px) {
	.main-contents .section.p-common-moreinfo .section-inner>ul:last-child,
	.p-common-moreinfo ul {
		margin: 0 10px -20px;
	}

	.p-common-moreinfo li {
		width: 50%;
	}
}

@media screen and (max-width: 480px) {
	.p-common-moreinfo li {
		width: 100%;
	}
}

.p-common-moreinfo li a {
	display: block;
	text-align: center;
}

.p-common-moreinfo a span {
	display: none;
}

@media screen and (max-width: 480px) {
	/* キャプション一時非表示中 */ .p-common-moreinfo a span {
		display: none;
		margin-top: .5em;
	}
}

/* トピックス */
.p-pf-updates {
	width: 100%;
	margin: 0 auto 64px;
	padding: 0 16px;
}
.p-pf-updates-inner {
	margin: 0 auto !important;
	padding: 1em;
	max-width: 1080px;
	background: #f3f3f3;
}
.p-pf-updates h2 {
  font-size: 1em;
  font-weight: bold;
  position: absolute;
  width: 115px;
  text-align: right;
  color: #a20a19;
}
.p-pf-updates .c-pf-datelist {
  font-size: .875em;
  overflow-y: auto;
  max-height: 5em;
  margin-left: 130px;
  padding-left: 1em;
  border-left: 1px solid #666;
  min-height: 110px;
}
@media only screen and (max-width: 480px) {
  .p-pf-updates h2 {
	position: static;
	margin-bottom: 0;
	text-align: left;
  }
  .p-pf-updates .c-pf-datelist {
	margin-left: 0;
	border-left: none;
  }
}

/* ソリューション */
#anc-06 .lyt-item-b.is-img-l .img img {
  width: 240px;
}
@media only screen and (max-width: 768px) {
	#anc-06 .lyt-item-b.is-img-l .img img {
	  width: 100%;
  }
}
#anc-06 .col.c-column-a--2col__col a {
  text-decoration: none;
}
#anc-06 .col.c-column-a--2col__col p+p {
  margin-top: 8px !important;
}
@media screen and (min-width: 768px) {
	.c-column-a .c-column-a--2col__col.c-column-a--pd {
		width: calc((100% - 16px) / 2);
	}
}

/*
 * 追加スタイル 20201119 - 共通
 */

.diff-bg-gray{
	background-color: #f3f3f3!important;
}

.c-lnk-arrow-a{
  align-self: center;
  position: relative;
  padding-right: 20px;
}

.c-lnk-arrow-a a:after{
	display: inline-block;
	content: "";
	position: absolute;
	top: 50%;
	width: 10px;
	height: 10px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-top: -5px;
	margin-left: 8px;
}

.c-lnk-arrow-b a:after{
 	display: inline-block;
	content: "";
	width: 10px;
	height: 10px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-top: -5px;
	margin-left: 8px;
}

.c-lnk-arrow-a a.diff-lnk-cl-a:after,
.c-lnk-arrow-b a.diff-lnk-cl-a:after{
  border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}

.c-lnk-arrow-a a.diff-lnk-cl-b:after,
.c-lnk-arrow-b a.diff-lnk-cl-b:after{
  border-top: 2px solid #a30b1a;
	border-right: 2px solid #a30b1a;
}

/*
 * 追加スタイル 20201119 - Fujitsu ActivateNow
 */
 
.main-contents .section.diff-bg-top-fan .section-inner{
    background: url(/jp/imagesgig5/fan_bg_tcm102-5414667_tcm102-2750236-32.jpg) no-repeat;
    background-position: top center;
	background-size: cover !important;
}

.main-contents .section.diff-section-fan .c-lyt-article-2col{
    max-width: 800px;
    margin: 36px auto 0;
}

.main-contents .section.diff-section-fan ul.c-lyt-3col-a{
    display: flex;
    justify-content: space-between;
    max-width: 1102px;
    margin: 0 auto;
}
.main-contents .section.diff-section-fan ul.c-lyt-3col-a li{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.4rem;
}

.main-contents .section.diff-section-fan ul.c-lyt-3col-a li{
    max-width: 309px;
    width: 28vw;
}
.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel{
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    flex-flow: column;
    width: 100%;
    background: #ffffff;
}

.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-titlewrap{
    min-height: 0%;
}
.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-titlewrap img{
    width: 100%;
    max-width: 309px;
    height: auto;
}
.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-titlewrap .title{
    background: #ffffff;
    color: #000;
    padding: 24px 24px 16px 24px;
    margin: 0;
    font-size: 1.6rem;
    width: 100%;
    box-sizing: border-box;
}

.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-box-text{
    display: flex;
    flex-wrap: wrap;
    flex: 1 0 auto;
}
.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-box-text p{
    padding: 0 24px 24px 24px;
}

.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-box-text .item-btn-a{
    width:100%;
    margin:0 auto;
    align-self: end;
}
.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-box-text .btn-a{
    padding: 8px 16px;
    width: 90%;
    margin: 0 auto;
}

.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-box-text .btn-a.diff-btn-blk{
    color: white !important;
    background: #000;
    border: #000;
    margin-bottom: 34px;
}

.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-box-text .btn-a.diff-btn-blk:hover{
    opacity: 0.8;
}

.main-contents .section.diff-section-fan ul.c-lyt-3col-a li .panel .panel-box-text .btn-a.diff-btn-blk::before {
    border-color: #fff;
}

@media only screen and (max-width: 480px) {
    .main-contents .section.diff-section-fan {
        padding:0 16px;
    }
    .main-contents .section.diff-section-fan ul.c-lyt-3col-a {
        flex-wrap: wrap;
        max-width: 100%;
        width: 309px;
    }
    .main-contents .section.diff-section-fan ul.c-lyt-3col-a li {
        max-width: 100%;
        width: 100%;
    }
    .main-contents .section.diff-section-fan ul.c-lyt-3col-a > li {
        margin-bottom: 16px;
    }
    .main-contents .section.diff-section-fan ul.c-lyt-3col-a > li:last-child {
        margin-bottom: 0;
    }
}
