@charset "UTF-8";

/* ======================
 Common
=========================*/
.section.section-bg-blk {
    background: #0b1227;
}

.section.section-bg-blk h2 {
    color: #fff;
}

/*
*カード型パネル
*****************************/

.l-grid {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: -1.5625%;
    margin-right: -1.5625%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: -3.125%
}

.l-grid>.l-grid-col-2 {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 13.5416666667%;
    flex: 0 0 13.5416666667%;
    width: 13.5416666667%;
    margin-left: 1.5625%;
    margin-right: 1.5625%;
    margin-bottom: 3.125%
}

.l-grid>.l-grid-col-3 {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 21.875%;
    flex: 0 0 21.875%;
    width: 21.875%;
    margin-left: 1.5625%;
    margin-right: 1.5625%;
    margin-bottom: 3.125%
}

.l-grid>.l-grid-col-4 {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 30.2083333333%;
    flex: 0 0 30.2083333333%;
    width: 30.2083333333%;
    margin-left: 1.5625%;
    margin-right: 1.5625%;
    margin-bottom: 3.125%
}

.l-grid>.l-grid-col-6 {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 46.875%;
    flex: 0 0 46.875%;
    width: 46.875%;
    margin-left: 1.5625%;
    margin-right: 1.5625%;
    margin-bottom: 3.125%
}

.c-card {
    text-decoration: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    height: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: #fff;
    padding: 18px
}

.c-card-border {
    border: 2px solid #eee
}

.c-card-border .c-card_inr {
    padding-left: 10px;
    padding-right: 10px
}

.c-card_date {
    color: #606060;
    font-size: 1.4rem;
    font-weight: 700;
    margin-bottom: 20px
}

.c-card_title {
    color: #000;
    font-size: 1.8rem;
    line-height: 1.6;
    font-weight: 700
}

.c-card_title-l {
    font-size: 2.1rem
}

.c-card_inr {
    padding-left: 15px;
    padding-right: 15px
}

.c-card_text {
    font-size: 1.5rem;
    color: #000
}

.c-card_title+.c-card_text {
    margin-top: 15px
}

.c-card_img {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: calc(1 / 1.618 * 100%);
    margin-bottom: 20px;
    overflow: hidden
}

.c-card_img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.165,.84,.44,1);
    transition: -webkit-transform 1s cubic-bezier(.165,.84,.44,1);
    -o-transition: transform 1s cubic-bezier(.165,.84,.44,1);
    transition: transform 1s cubic-bezier(.165,.84,.44,1);
    transition: transform 1s cubic-bezier(.165,.84,.44,1),-webkit-transform 1s cubic-bezier(.165,.84,.44,1)
}

.c-card_foot {
    margin-top: 15px
}

.c-card_foot_l {
    float: left;
    display: inline-block
}

.c-card_foot_r {
    float: right;
    display: inline-block
}

a.c-card:hover .c-card_img img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1)
}

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

    .l-grid {
        margin-bottom: -3.125%
    }

    .l-grid>.l-grid-col-md-4 {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 30.2083333333%;
        flex: 0 0 30.2083333333%;
        width: 30.2083333333%;
        margin-left: 1.5625%;
        margin-right: 1.5625%;
        margin-bottom: 3.125%
    }

    .l-grid>.l-grid-col-md-6 {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 46.875%;
        flex: 0 0 46.875%;
        width: 46.875%;
        margin-left: 1.5625%;
        margin-right: 1.5625%;
        margin-bottom: 3.125%
    }

    .l-grid>.l-grid-col-md-12 {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 96.875%;
        flex: 0 0 96.875%;
        width: 96.875%;
        margin-left: 1.5625%;
        margin-right: 1.5625%;
        margin-bottom: 3.125%
    }
}

/*
* ボタンレイアウト（角丸�E�E
**********************************/

.u-btn-accent-wrapper{
	display: flex;
	justify-content: center;
}

.u-btn-accent-wrapper > .u-btn-accent + .u-btn-accent{
	margin-left:30px;
}

.u-btn-accent-wrapper > .u-btn-accent{
	max-width: 400px;
	width: 100%;
}

.u-btn-accent-wrapper > .u-btn-accent >a,
.u-btn-accent-wrapper > .u-btn-accent >span{
	width: 100%;	
}

.u-btn-accent.diff-lyt-rc > a,
.u-btn-accent.diff-lyt-rc > span{
    border-radius: 32px;
    padding: 16px 32px;
    text-decoration:none;
    display: inline-block;
}
.u-btn-accent.diff-btn-wide > a,
.u-btn-accent.diff-btn-wide > span{
    border-radius: 50px;
    padding: 8px 64px;
}
.u-btn-accent.diff-lyt-rc.diff-bg-d80083 > a{
    color:#fff;
    background: #d80083;
}
.u-btn-accent.diff-lyt-rc.diff-bg-bfbfbf > span{
    color:#fff;
    background: #bfbfbf;
}

.u-btn-accent a:hover{
    opacity:0.8;
}

@media screen and (max-width:767px){
	.u-btn-accent-wrapper{
		display: block;
	}
	
	.u-btn-accent-wrapper > .u-btn-accent + .u-btn-accent{
		margin-left: auto;
		margin-top: 30px;
	}

	.u-btn-accent-wrapper > .u-btn-accent{
		margin: 0 auto;
	}

}

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

	.u-btn-accent-wrapper > .u-btn-accent{
		max-width: 300px;
	}
	
	.u-btn-accent.diff-lyt-rc > a,
	.u-btn-accent.diff-lyt-rc > span{
	   padding: 18px;
	}

}

/*
*  ナビゲーション
************************************************** */
.lab-navigation {
    color: #000;
    background: #fff;
}

.lab-navigation .lab-nav a {
    text-decoration: none;
    color: #000;
    display: block;
}

@media screen and (max-width: 820px) {
	.lab-navigation { position: relative; }
	.lab-navigation .lab-nav {
		background: #000;
		display: none;
		z-index: 1;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		-webkit-transform: translateY(100%);
		transform: translateY(100%);
	}
	.lab-navigation .lab-nav > li {
		font-size: 1.3rem;
		border-top: 1px solid #898989;
	}
}

@media screen and (min-width: 821px) {
	.lab-navigation {position: relative;}
	.lab-navigation .lab-nav {
		display: flex !important;
		max-width: 1280px;
		margin: 0 auto;
		align-items: center;
	}
	.lab-navigation .lab-nav > li {
		font-size: 1.6rem;
		text-align: center;
		border-left: 1px solid #fff;
		flex: 1;
		-webkit-transition: background 0.2s ease-in-out;
		transition: background 0.2s ease-in-out;
		padding: 16px 0;
	}
	.lab-navigation .lab-nav > li:last-child {
		border-right: 1px solid #fff;
	}

	.lab-navigation .lab-nav-content {
		background: rgba(0,0,0,0.7);
		display: block !important;
		height: auto !important;
		padding: 0 16px;
		z-index: 100;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translateY(100%);
		transform: translateY(100%);
		-webkit-transition: opacity 0.2s ease-in-out, visibility 0s 0.2s;
		transition: opacity 0.2s ease-in-out, visibility 0s 0.2s;
	}
	.lab-navigation .lab-nav-content .nav-content-inner {
		max-width: 1280px;
		margin: 0 auto;
	}

	.lab-navigation .lab-nav > li:hover { opacity: .7; }
}

/*
*  KV Area for lab-ai-ethics (拡張�E�hero-area-c)
***********************************************/

@media only screen and (min-width: 767px){
	.hero-area-b.kv-lab-ai-ethics{
		max-height: 500px;
		min-height: 500px;
	}
	.hero-area-b.kv-lab-ai-ethics .content{
		max-width:1280px;
		margin:0 auto;
	}

	.hero-area-b.kv-lab-ai-ethics .content .content-inner{
		background:#fff;
		padding: 40px;
		max-width: 500px;
		margin: 0 auto 0 0;
	}
	.hero-area-b.kv-lab-ai-ethics .content .main-txt>*{
		color: #000;
		display: block;
		background: none;
		line-height: 1.3;
		padding: 0 5px;
		font-weight: normal;
	}
}

@media only screen and (max-width: 767px){
	.hero-area-b.kv-lab-ai-ethics .content .main-txt>*{
		display: block;
		font-weight: normal;
	}
}

/*
* KV 言語切り替えボタン
***********************************************/
.lang-ch-btn.aiethics-lang-ch-btn-for-pc {
    position: absolute;
    top: 14%;
    right: 0%;
}

.aiethics-lang-ch-btn-for-pc {
	display: block;
}

.aiethics-lang-ch-btn-for-tab {
	display: none!important;
}

@media only screen and (max-width: 767px) {
	.aiethics-lang-ch-btn-for-pc {
		display: none!important;
	}

	.aiethics-lang-ch-btn-for-tab {
	    display: inline-block!important;
	    font-size: 1.4rem!important;
	}

}

/* ======================
 Topics
=========================*/
.diff-bg-efefef {
	background: #efefef;
}

.section-csr202206-a .section-inner {
	padding: 100px 50px !important;
}

.lyt-col-csr202206-a[class*=diff-col] {
	margin-left: -38px;
	margin-bottom: -38px !important;
}

.lyt-col-csr202206-a[class*=diff-col] > * {
	padding-left: 38px;
	padding-bottom: 38px;
}

.lyt-col-csr202206-a[class*=diff-col] > * > * {
	display: block;
	height: 100%;
	padding: 26px 30px 34px;
	background: #fff;
}

.lyt-col-csr202206-a[class*=diff-col] > * > a {
	text-decoration: none;
}

.lyt-col-csr202206-a[class*=diff-col] > * > * > span {
	display: block;
}

.lyt-col-csr202206-a[class*=diff-col] > * > a .date {
	color: #7F7F7F;
}

@media only screen and (max-width: 767px) {
	.lyt-col-csr202206-a[class*=diff-col] {
		margin-left: 0;
		margin-bottom: -15px !important;
	}

	.lyt-col-csr202206-a[class*=diff-col] > * {
		padding-left: 0;
		padding-bottom: 0;
		margin-bottom: 15px;
	}
}

/* ============================================
 KV VIレイアウト インフィニティマークなし
===============================================*/
.lab-aiethics-vi-kv {
    margin-top: 10px!important;
}

.lab-aiethics-vi-kv {
    display: flex;
    max-height: 560px;
    position: relative;
    overflow: hidden;
}

.lab-aiethics-vi-kv .aiethics-kv-contents {
    background-size: cover;
    background-position: 50%;
}

.lab-aiethics-vi-kv.lab-aiethics-bg-sb-h2-t1 .aiethics-kv-contents {
    background-image: url(/jp/imagesgig5/7935-14-FJ_SB_H2_T1_RGB_tcm102-7106267_tcm102-2750236-32.png);
    color: #fff;
    background-size: 250%;
    background-position: 50% 0;
}

.lab-aiethics-vi-kv.lab-aiethics-bg-sb-h3-t1 .aiethics-kv-contents {
    background-image: url(/jp/imagesgig5/7935-14-FJ_SB_H3_T1_RGB_tcm102-6600782_tcm102-2750236-32.png);
    color: #fff;
}

.aiethics-kv-contents {
    display: flex;
    width: 50%;
    align-items: center;
    justify-content: flex-end;
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: left top;
}

.aiethics-kv-contents-inner {
    margin-right: 170px;
    max-width: 630px;
    padding-left: 10%;
}

.aiethics-kv-hero-hdg {
    font-size: 4rem;
    font-weight: 800;
    line-height: 1.4;
}

/*.aiethics-kv-hero-hdg .sub {
    font-size: 1.6rem;
    font-weight: normal;
}*/

.aiethics-kv-contents-inner .sub {
    display: block;
    margin-top: 18px;
    margin-bottom: 48px;
}

.aiethics-kv-hero-hdg.hdg-ptn-a {
    font-size: 5rem;
    line-height: 54px;
}

.aiethics-kv-hero-hdg.hdg-ptn-a span {
    font-size: 3.5rem;
}

.aiethics-kv-visual {
    width: 50%;
    height: 560px;
    position: relative;
    overflow: hidden;
}


.aiethics-kv-visual img {
    width: auto;
    height: auto;
    min-width: 100%;
    max-width: none;
    max-width: initial;
    min-height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.aiethics-kv-contents-inner .aiethics-kv-dlLink-column {
    text-decoration: none;
    color: #fff;
    display: flex;
    border: 1px solid #fff;
    padding: 12px 12px;
    margin-right: 12px;
}

.aiethics-kv-contents-inner a.aiethics-kv-dlLink-column:hover {
	opacity: .8;
}

.aiethics-kv-contents-inner .aiethics-kv-dlLink-column .col-img {
    max-width: 100px;
}

.aiethics-kv-contents-inner .aiethics-kv-dlLink-column .col-txt {
    display: flex;
    align-items: center;
    margin-left: 16px;
    font-weight: bold;
}



@media only screen and (max-width: 1600px) and (min-width: 1281px){
	.aiethics-kv-visual img {
	    transform: translateX(50%) translateY(-45%);
	}
}

@media screen and (min-width: 1001px) and (max-width: 1279px){
	width: calc(11 / 32 * 100vw);
    height: calc(11 / 32 * .777 * 100vw);
    margin-left: calc(11 / 32 * .054 * 100vw);
}

@media only screen and (max-width: 1600px){
	.aiethics-kv-visual img {
	    width: auto;
	    right: 75%;
	    transform: translateX(50%) translateY(-50%);
	}
}

@media only screen and (max-width: 1280px) {
	.aiethics-kv-contents-inner {
	    width: 100%;
	    padding-left: 8px;
	    margin-right: inherit;
	}
	
	.aiethics-kv-hero-hdg {
	    font-size: calc(46vw*100/1280);
	}
	
	.aiethics-kv-visual img {
	    height: 100%;
	    right: 65%;
	}
}

@media only screen and (max-width: 1000px) {
	.lab-aiethics-vi-kv {
	    flex-direction: column;
	    max-height: none;
	    max-height: initial;
	}
	
	.aiethics-kv-contents {
    	width: 100%;
	}
	
	.aiethics-kv-contents-inner {
	    width: inherit;
	    max-width: inherit;
	    padding: 20px 16px;
	    margin-right: inherit;
	}
	
	.lab-aiethics-vi-kv .aiethics-kv-contents .aiethics-kv-contents-inner {
		padding: 20px 16px 60px;
		max-width: inherit;
	}
	
	.aiethics-kv-hero-hdg {
	    font-size: 4rem;
	}
	
	.aiethics-kv-contents-inner .aiethics-kv-dlLink-column {
	    margin-right: inherit;
	}
	
	.aiethics-kv-visual {
	    width: 100%;
	    height: 0;
	    padding-top: 56.25%;
	}
	
	.aiethics-kv-visual img {
	    top: 0;
	    right: 50%;
	    transform: translateX(50%);
	}
}
/* KV c-btn */
.c-btn.kv-c-btn {
    color: #fff;
}

.c-btn.kv-c-btn .c-btn-ico::before {
    border: 1px solid #fff;
}

.c-btn.kv-c-btn .c-btn-ico svg {
    fill: #fff;
}

.c-btn.kv-c-btn .c-btn-ico svg .circle {
    stroke: #fff;
    stroke-width: 3px;
}

.c-btn.kv-c-btn:hover .c-btn-ico svg .circle {
    stroke: #fff;
    stroke-width: 3px;
}

@media screen and (max-width: 1000px) {
	.c-btn-ico svg .arrow {
	    stroke-width: 10px;
	}

	.c-btn-ico svg .circle {
	    stroke-width: 1.5px;
	}
}

/* ============================================
 もっと見るボタン
===============================================*/
.article-more-detail {
    margin-top: 80px;
    display: flex;
    justify-content: center;
    width: 100%;
}

.article-more-detail .article-more-detail-link {
    color: #fff;
    text-decoration: none;
    position: relative;
}

.article-more-detail .article-more-detail-link:after {
    content: "";
    position: absolute;
    display: inline-block;
    bottom: -18px;
    left: 50%;
    color: #fff;
    line-height: 1;
    width: 1em;
    height: 1em;
    border: 1px solid currentColor;
    border-left: 0;
    border-bottom: 0;
    box-sizing: border-box;
    transform: translateX(-50%) translateY(-25%) rotate(135deg);
}

/* 矢印：グレー */
.article-more-detail.arrow-gray .article-more-detail-link {
    color: #000;
}

.article-more-detail.arrow-gray .article-more-detail-link:after {
    color: #87867e;
}



/* ======================
 カルーセル
=========================*/
/* ▼カルーセルが3以上は下記コメントアウト */
/*
@media only screen and (min-width: 980px) {
    .slick-track {transform: translate3d(0px, 0px, 0px) !important;}
}
*/
/* ▲カルーセルが3以上は上記コメントアウト */

.slick-slide {
	-webkit-transform: scale(.9);
	-ms-transform: scale(.9);
	transform: scale(.9);
	-webkit-transform-origin: right;
	-ms-transform-origin: right;
	transform-origin: right;
}
.slick-slide.slick-active{
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
}

.c-topic-slider .slick-list {
    padding: 0 calc((100vw - 1170px) / 3) !important;
}

.c-topic-slider__slides {
	margin: 0 4px;
}
.c-topic-slider__slide-inner {
	position: relative;
	margin-bottom:16px;
	max-width: inherit;
}

.c-topic-slider__slides-text {
	padding: 0;
    font-size: 1.8rem;
    font-weight: bold;
}

.c-topic-slider__slides-text-description {
    margin: 28px 8px 20px;
}

.c-topic-slider__slides-text-title {
	font-weight:600;
}

.c-topic-slider.slick-initialized .c-topic-slider__slides a {
    padding: 20px 20px 50px;
    max-width: inherit;
    height: inherit!important;
}

.c-topic-slider.slick-initialized .c-topic-slider__slides.slick-active a {
	box-shadow: none !important;
	border:1px solid #DCDCDC;
	position: relative;
}
.c-topic-slider.slick-initialized .c-topic-slider__slides.slick-active a:hover,
.c-topic-slider.slick-initialized .c-topic-slider__slides.slick-active a:active,
.c-topic-slider.slick-initialized .c-topic-slider__slides.slick-active a:focus {
    box-shadow: 0 4px 13px 4px #DCDCDC;
}
.c-topic-slider__label {
	position:absolute;
	top:4px;
	left:4px;
	font-size:1.4rem;
	color:#fff;
	padding:4px 16px;
	background:#2400B0;
	min-width:120px;
	text-align:center;
}
.c-topic-slider .slick-arrow.slick-prev,
.c-topic-slider .slick-arrow.slick-next {
	background-color:rgba(220, 220, 220, 0.7);
	border-radius:50px;
	background-image: url(/jp/imagesgig5/carousel-arw_tcm102-7248038_tcm102-2750236-32.png) !important;
}

.c-topic-slider .slick-arrow.slick-prev {
    left: 2%;
}

.c-topic-slider .slick-arrow.slick-next {
	transform: rotateZ(180deg);
	right: 2%;
}
.c-topic-slider .slick-arrow,
.c-topic-slider .slick-arrow:hover {
	box-shadow: none;
}
.c-topic-slider.slick-initialized .slick-dots {
	display: none!important;
}