@charset "UTF-8";

/*----------------------------------------
ベース
----------------------------------------*/
.contents-ai {
	/* min-width: 1500px; */
	padding-block-start: 6.25rem;
	color: #fff;
	font-size: 1.8rem;
	line-height: 1.5;
	font-family: "Noto Sans JP", "游ゴシック体", "Yu Gothic",
		"ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "ヒラギノ角ゴ Pro W3",
		"Hiragino Kaku Gothic Pro", sans-serif;
	position: relative;
	letter-spacing: 1px;
	overflow-x: hidden;
	overflow: visible;
}
@media screen and (max-width: 767px) {
	.contents-ai {
		padding-block-start: 4.4375rem;
	}
}
.contents-ai a {
	color: #444;
	transition: all 0.3s;
}

.top_bg {
	padding: 2em 4%;
	display: block;
	background: url(/img/business/ai-translation/bg_mv.jpg) center center / cover;
	position: relative;
	text-align: center;
}

div,
ul,
ol,
li,
p {
	position: static;
}

a:hover {
	opacity: 1;
}

.contents-ai a:link,
.contents-ai a:visited {
	/* color: #FFF; */
	text-decoration: none;
}

.inner {
	max-width: 1280px;
	margin: 0 auto;
}

@media screen and (max-width: 1280px) {
	.inner {
		width: 92%;
	}
}

br.pc-br {
	display: block;
}

.txt-block {
	line-height: 2.5;
}

.txt-block p {
	font-size: 2rem;
	font-weight: bold;
}

.txt-block ul {
	margin-top: 1.5em;
	list-style-type: disc;
	list-style-position: inside;
}

.txt-block ul li {
	text-indent: -1.2em;
	padding-left: 1.2em;
}

.w_100 {
	width: 100%;
}

img {
	max-width: 100%;
}

@media screen and (max-width: 1500px) {
	.contents-ai {
		min-width: 0;
	}
}

@media screen and (max-width: 930px) {
	.contents-ai {
		font-size: 1.5rem;
	}

	.txt-block {
		line-height: 1.6;
	}

	.txt-block p {
		font-size: 1.5rem;
		font-weight: bold;
	}

	br.pc-br {
		display: none;
	}
	.inner {
		width: 92%;
	}
}

/*----------------------------------------
タイトル
----------------------------------------*/

.ttl-block .txt-eng {
	font-size: 9.2rem;
	letter-spacing: 0.1em;
	margin-bottom: 0.5em;
	font-family: "Bebas Neue";
}

.ttl-block h3 {
	font-size: 2.8rem;
	font-weight: bold;
	letter-spacing: 0.1em;
	/* word-break: keep-all; */
}

.h1-l {
	text-align: center;
	font-weight: bold;
	margin: 30px 0 10px;
	font-size: 50px; /*文字の大きさh1*/
}
.h1-l + img {
	max-width: 240px;
}
.sub_title_img {
	margin: 30px 0 10px 0;
}
.sub_title {
	text-align: center;
	font-size: 18px;
	margin: 30px 0 50px 0;
}

.turn01 {
	display: none;
}

@media screen and (max-width: 930px) {
	.h1-l {
		font-size: 30px;
	}
	.h1-l + img {
		max-width: 240px;
		width: 56vw;
	}
	.sub_title {
		font-size: 16px;
	}
}

/*----------------------------------------
ボタン
----------------------------------------*/

.btn-link {
	position: relative;
	display: inline-block;
	font-size: 2rem;
	margin-top: 3em;
	z-index: 99;
}
.btn-link-txt {
	font-size: 0.79rem;
	font-weight: 500;
	letter-spacing: -0.025em;
	text-transform: uppercase;
	transition: all 0.5s ease-in-out;
	font-family: "Bebas Neue";
}
.button-inner {
	align-items: center;
	display: flex;
}
.button-circle-border {
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	height: 0;
	width: 0;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	transition: all 0.3s ease-in-out;
}
.button-circle {
	border: solid 2px #fff;
	transition: 0.5s;
}
@media (max-width: 480px) {
	.button-circle {
		border: solid 1px #fff;
	}
}
.button-circle-in {
	color: #fff;
}
.button-circle-bg {
	background-color: #0600c8;
}
.button-circle-border {
	border: solid 0px #fff;
}
.btn-link-txt {
	color: #f8f8f8;
	font-size: 3.1rem;
	transition: all 1s;
	letter-spacing: 0.15em;
	font-family: "Bebas Neue";
}
/* .--black {
    color: #2b2b2b
} */
.--black .button-circle-border {
	border: solid 1px #fff;
}
.button-inner:hover .button-circle {
	border: solid 1px #0600c8;
}
.button-inner:hover .btn-link-txt {
	padding-left: 4px;
}
.button-inner:hover .button-circle-bg {
	height: 100%;
	width: 100%;
}
.button-inner:hover .button-circle-border {
	border: solid 2px #0600c8;
	height: 125%;
	width: 125%;
}
.button-inner:hover .button-circle-in {
	color: #f8f8f8;
	font-weight: 700;
}
.button-circle-bg {
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	height: 0;
	width: 0;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	transition: all 0.2s ease-in-out;
	z-index: 0;
}
.button-circle {
	border-radius: 50%;
	margin-right: 1.5em;
	height: 120px;
	position: relative;
	width: 120px;
}
.button-circle-in {
	font-size: 0.558rem;
	font-weight: 700;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	margin: auto;
	z-index: 1;
}
.button-circle-in img {
	vertical-align: middle;
}

@media screen and (max-width: 930px) {
	.button-circle {
		height: 60px;
		width: 60px;
	}
	.button-circle img {
		width: 10px;
	}
	.btn-link-txt {
		font-size: 2rem;
	}
}

/*----------------------------------------
main-area
----------------------------------------*/
.h3-m {
	color: #fff;
	font-size: 35px; /*文字の大きさh3*/
	font-weight: bold;
	text-align: center;
	position: relative;
	padding: 0.8rem 0;
	margin: 0 auto 0.2rem;
}

.t_c {
	font-size: 22px;
	font-weight: bold;
	border-bottom: solid 2px #fff;
	margin-bottom: 10px;
}

.ai_img01 {
	display: flex;
	align-items: center;
	justify-content: center;
}

.ai_top_img {
	width: 65%;
	margin-top: 30px;
}

.con_btn01 {
	margin: 40px 0 40px 0;
}
.con_btn01 a {
	color: #13133d;
}

.con_btn01 span {
	font-size: 26px;
	font-weight: bold;
	display: block;
}

.contents-ai a.button_solid003 {
	font-size: 62.5%;
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 400px;
	margin: 0 auto;
	padding: 1rem 3rem;
	font-weight: bold;
	border-radius: 100vh;
	transition: 0.5s;
	background: #fff;
	overflow: hidden;
}
.contents-ai a.button_solid003:hover {
	color: #fff;
	background: #13133d;
}

@media screen and (max-width: 930px) {
	.contents-ai a.button_solid003 {
		font-size: 14px;
		padding: 1rem 2rem;
	}
	.con_btn01 {
		margin: 10px 0 30px 0;
	}
	.con_btn01 span {
		font-size: 18px;
	}
	.h3-m {
		font-size: 24px;
	}
	.t_c {
		font-size: 20px;
		margin-bottom: 0;
	}
	.about-ai-area .p_ai_box01 p {
		font-size: 14px;
	}
}

@media screen and (max-width: 480px) {
	.ai_top_img {
		width: 100%;
		margin-top: 15px;
	}
	.h1-1 {
		font-size: 36px;
	}
	.turn01 {
		display: block;
		font-size: x-large;
	}
	.contents-ai a.button_solid003 {
		width: 100%;
	}
}

/*----------------------------------------
about-area
----------------------------------------*/
.about-ai-area {
	margin: 0 auto;
	padding: 2em 0;
	background: linear-gradient(to bottom right, #464646, #000000);
}

.about-ai-area .ai_box {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 30px;
	margin-top: 20px;
}

.about-ai-area .item01 {
	background: #fff;
	width: 32%;
	margin: 0 2% 1em 0;
}
.about-ai-area .item01:nth-child(3n) {
	margin-right: 0;
}
.about-ai-area .p_ai_box01 {
	color: #221815;
	padding: 10px 20px 20px 20px;
}
.about-ai-area .p_ai_box01 p {
	font-size: 18px;
}

@media screen and (max-width: 930px) {
	.about-ai-area .ai_box {
		display: block;
	}

	.about-ai-area .item01 {
		width: 100%;
	}
}

/*----------------------------------------
translation-area
----------------------------------------*/
.pc-br {
	display: block;
}

.sp-br {
	display: none;
}

.ai_box02 {
	margin: 0 auto;
	padding-bottom: 30px;
}

.h2_01 {
	color: #221815;
	font-size: 35px; /*文字の大きさh2*/
	text-align: center;
	font-weight: bold;
	position: relative;
	padding-bottom: 20px;
	margin-bottom: 40px;
}
.h2_01:before {
	content: "";
	display: block;
	position: absolute;
	background: linear-gradient(to bottom right, #191960, #6060e9);
	width: 110px;
	height: 10px;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}

.translation-ai-area {
	margin: 0 auto;
	overflow: hidden;
	background: url(/img/business/ai-translation/ai_bg_features.svg) no-repeat center
		center / cover;
	padding: 80px 0 40px 0;
}

.ai_box02 {
	display: flex;
	flex-wrap: wrap;
}
.ai_box02 .item02 {
	width: 49%;
	margin: 0 2% 20px 0;
	border: 2px solid #181886;
	background: #fff;
}
.ai_box02 .item02:nth-child(2n) {
	margin: 0 0 20px 0;
}

.t_title01 {
	color: #13136a;
	text-align: center;
	font-weight: bold;
	background: #d6e3f8;
	padding: 10px;
}

.ai_box02 .ai-t_box01 {
	color: #000000;
	font-size: 16px;
	display: flex;
	justify-content: space-between;
	padding: 20px;
	height: 100%;
}

.ai_box02 .ai-t_box01 > figure {
	width: 22%;
	text-align: center;
}
.ai_box02 .ai-t_box01 > p {
	width: 74%;
}

@media screen and (max-width: 930px) {
	.translation-ai-area {
		padding: 40px 0 20px 0;
	}
	.h2_01 {
		font-size: 25px;
	}
	.h2_01:before {
		height: 5px;
	}
	.ai_box02 .item02 {
		width: 100%;
		margin: 0 0 20px 0;
	}
}

/*----------------------------------------
service-area
----------------------------------------*/
.service-ai-area {
	background: #f1f4fa;
	padding: 60px 0;
}

.p_04 {
	color: #000000;
	font-size: 18px;
	font-weight: 500;
	width: 72%;
	margin: 0 auto 2em auto;
	padding-top: 10px;
	text-align: left;
}

.ai_box03 {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 0 auto;
	padding-bottom: 10px;
}

.ai_box03 > div {
	width: 48%;
	background: #fff;
	margin: 0 2% 2% 0;
}
.ai_box03 > div .txt {
	color: #000000;
	font-size: 16px;
	padding: 20px;
}
.ai_box03 + .attention {
	margin-bottom: 60px;
	color: #000;
	font-size: 52.084%;
}
.right {
	text-align: right;
}
.mb0 {
	margin-bottom: 0px !important;
}
.visible_sp {
	display: none !important;
}
@media screen and (max-width: 736px) {
	.visible_sp {
		display: block !important;
	}
}
.t_title02 {
	color: #13136a;
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 8px;
}

@media screen and (max-width: 720px) {
	.ai_box03 + .attention {
		margin-bottom: 20px;
	}
}

@media screen and (max-width: 930px) {
	.service-ai-area {
		padding: 30px 0;
	}
	.p_04 {
		width: 100%;
		font-size: 15px;
	}
	.ai_box03 > div {
		width: 100%;
		margin: 0 0 15px 0;
	}
	.ai_box03 > div .txt {
		padding: 10px 15px;
		font-size: 14px;
	}
	.t_title02 {
		font-size: 18px;
	}
}

/*----------------------------------------
achievements-area
----------------------------------------*/
.achievements-ai-area {
	margin: 0 auto;
	padding: 40px 0;
}

.ai_box04 {
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto;
}

.ai_box04 > div {
	width: 32%;
	margin: 0 2% 1em 0;
	position: relative;
}
.ai_box04 > div:nth-child(3n) {
	margin: 0 0 1em 0;
}

.h_03 {
	font-size: 62.5%;
	color: #fff;
	font-weight: bold;
	padding: 10px;
	text-align: center;
	background: rgba(0, 0, 0, 0.45);
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
}

.item04 {
	background-color: #129deb;
	padding: 10px;
	flex-basis: 20%;
	width: calc(96% / 2); /* 96%幅を2で割るという指定 */
	/*width: calc( ( 100% – 60px ) / 3 );*/
	margin: 5px;
}

.p_06 {
	color: #fff;
	font-size: 19px;
	font-weight: bold;
	padding: 5px;
	text-align: center;
	height: 80px;
}

@media screen and (max-width: 930px) {
	.item04 {
		width: 90%;
		margin: 0 auto;
		margin-bottom: 10px;
	}
	.ai_box04 > div {
		width: 100%;
		margin: 0 0 1em 0;
	}
}

@media screen and (max-width: 480px) {
	.ai_box04 {
		flex-direction: column;
		margin-top: 5px;
	}
}

/*----------------------------------------
news-area
----------------------------------------*/
.ai_box05 {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 10px;
	margin-top: 20px;
}

.news-ai-area {
	margin: 0 auto 40px auto;
}
.news-ai-area .inner {
	background: #f2f2f2;
	display: flex;
	flex-wrap: wrap;
	padding: 40px 60px;
}
.news-ai-area .h2_01 {
	width: 20%;
	text-align: left;
}
.news-ai-area .h2_01:before {
	display: none;
}
.news-ai-area .news-block {
	width: 80%;
}
.news-ai-area .in_line {
	padding: 10px 0;
	border-bottom: 1px solid #c4c4c4;
}
.news-ai-area .in_line dt .date {
	color: #000000;
	font-size: 14px;
	font-weight: bold;
	width: 70%;
}
.news-ai-area .in_line dt .ico-news {
	color: #191960 !important;
	border: none;
	font-size: 12px;
	font-weight: normal;
	padding: 5px 10px;
	background: #fff;
}
.news-ai-area .in_line dt .ico-new {
	background: #e60012;
	font-weight: bold;
	border: none;
	font-size: 12px;
	padding: 4px 10px;
	margin-left: 10px;
}
.news-ai-area .in_line dd {
	font-size: 16px;
	font-weight: bold;
	margin-top: 10px;
}

@media screen and (max-width: 930px) {
	.news-ai-area .h2_01 {
		width: 100%;
		margin-bottom: 0;
		padding-bottom: 10px;
	}
	.news-ai-area .news-block {
		width: 100%;
	}
	.news-ai-area .inner {
		padding: 30px 20px;
	}
	.news-ai-area .in_line dt .date {
		font-size: 12px;
	}
	.news-ai-area .in_line dd {
		font-size: 14px;
	}
}

/*--- view all ボタン ---*/

.clicktxt {
	color: #808080;
	text-align: right;
}

.switchdsp input {
	display: none;
}

.switchdsp .dsp {
	height: 0;
	overflow: hidden;
	transition: 0.9s;
	opacity: 0;
}

.switchdsp input:checked ~ .dsp {
	height: auto;
	opacity: 1;
}

/*----------------------------------------
contents-ai-area
----------------------------------------*/
.contents-ai-area {
	background: url(/img/business/ai-translation/bg_contact.jpg) center center / cover;
}
.contents-ai-area .ai-con_box {
	padding: 100px;
}

.contents-ai-area .ai-con_box > p {
	font-size: 22px;
	text-align: center;
}
.button_solid004 {
	margin: 0 auto;
	padding: 20px;
	text-align: center;
}

.button_solid004 a {
	font-size: 62.5%;
	position: relative;
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin: 0 auto;
	max-width: 520px;
	padding: 20px 30px;
	color: #191960;
	transition: 0.3s ease-in-out;
	font-weight: bold;
	background: #fff;
	border-radius: 49px;
}
.button_solid004 a:hover {
	color: #fff;
	background: #191960;
}
.last_text {
	text-align: center;
	padding-bottom: 10px;
	font-size: 40px;
	font-weight: bold;
	color: #fff;
}

@media screen and (max-width: 930px) {
	.contents-ai-area .ai-con_box {
		padding: 40px 20px;
	}
	.last_text {
		font-size: 26px;
	}
	.contents-ai-area .ai-con_box > p {
		font-size: 16px;
	}
	.button_solid004 a {
		padding: 10px 20px;
	}
}

.a_gaibu:after {
	content: "";
	display: inline-block;
	width: 11px;
	height: 10px;
	margin: 0 0.4em;
	background: url(/img/business/ai-translation/icon_gaibu.png) no-repeat center center;
}
