@charset "UTF-8";

/*------------------------------------------------------------
    基本設定 コンテンツ幅
------------------------------------------------------------*/
.content_area {
    padding: 0 20px;
    margin: 0 auto;
}
.content_area.nopadding{padding-left:0;padding-right:0;}
@media screen and (min-width: 768px) {
	.content_area {
		 padding: 0 30px;
		 max-width: 1060px;
	}
}
@media screen and (min-width: 992px) {
	.content {
			margin-bottom: 120px;
	}
	.content_area {
			padding: 0 30px;
	}
}
/*------------------------------------------------------------
    基本設定　カラー
------------------------------------------------------------*/
.bg_gray{background-color:#D9D9D9;}
.bg_lightgray{background-color:#F2F2F2;}
.bg_darkgray{background-color:#5A5A5A;}
.bg_white{background-color:#fff;}
.text_white{color:#ffffff;}
.text_red{color:var(--color-red);}
.text_black{color:#000;}
.text_orange{color:var(--color-orange);}

/*------------------------------------------------------------
    基本設定　テキスト
------------------------------------------------------------*/
.text_center{text-align:center;}
.font_eng{font-family:"Helvetica Neue";}
strong{font-weight:bold;}

/*------------------------------------------------------------
  共通パーツ
------------------------------------------------------------*/
h2{
	font-size:4.5vw;
}
h3{
	font-size:7vw;
}
h4{
	font-size:5vw;
}
@media screen and (min-width: 768px) {
	h2{font-size:18px;}
	h3{font-size:32px;}
	h4{font-size:28px;}
}
@media screen and (min-width: 960px) {
}

	/*問合せTELボタン*/
.contact_tel{
	padding:40px 5% 40px;
}
.contact_tel .backline{
	font-size:4vw;
  position: relative;
  padding: 0;
  text-align: center;
	line-height:1.5;
	display:flex;
	justify-content:center;
	margin:0 auto 0.5em;
	width:80%;
}
.contact_tel .backline span{
	display:block;
	background:#fff;
	padding:0 1em;
}
.contact_tel .backline::before, .contact_tel .backline::after {
  position: absolute;
  top: calc(50% - 1px);
  width: 50%;
  height: 2px;
  content: '';
  background: #000;
	z-index:-1;
}
.contact_tel .backline::before{left:0;}
.contact_tel .backline::after{right:0;}
.contact_tel_button a{
	color: #fff;
	border: 2px solid var(--color-orange);
	background-color: var(--color-orange);
	border-radius: 2em;
	padding: 0.4em 1em;
	color:#fff;
	display:block;
	font-size:7vw;
	text-align:center;
	transition: var(--animation-sec);
	margin-bottom:0.5em;
}
.contact_tel_button a:hover{
		background-color: #fff;
		color: var(--color-orange);
	transition: var(--animation-sec);
}
.contact_tel p.annotation{
	text-indent:-1em;
	padding:0 2em 0;
	font-size:4vw;
}

@media screen and (min-width: 768px) {
	.contact_tel .backline{font-size:20px;}
	.contact_tel_button a{font-size:32px;}
	.contact_tel p.annotation{font-size:20px;}
}
@media screen and (min-width: 960px) {
}


	/*MENU区切り*/
.subtitle_eng{
	font-size:9vw;
	margin-bottom:10px;
}
@media screen and (min-width: 768px) {
	.subtitle_eng{font-size:46px;}
}
@media screen and (min-width: 960px) {
}

	/*page topblock*/
.page_topblock{padding-top:80px;}
@media screen and (min-width: 768px) {
}
@media screen and (min-width: 960px) {
}



/*------------------------------------------------------------
  TOP
------------------------------------------------------------*/

	/* MV */
.top_mv{
	background-image:url(../img/top/mv.jpg);
	background-size:cover;
	background-position:center center;
	height:30vh;
	display:flex;
	justify-content:center;
	align-items:center;
}
.top_mv_copy{
	width:70%;
	background:rgba(255,255,255,0.6);
}

@media screen and (min-width:960px){/*PC*/
	.top_mv{min-height:500px;}
	.top_mv_copy{width:auto;}
}
	/* SERVICES */


	/* COMPANY */
.block_title_text dl{
	font-size:4vw;
	padding:0 0 15px;
	margin-bottom:15px;
	line-height:1.5;
}
.block_title_text.underline dl{border-bottom:1px solid #ccc;}

#top_company{
	background-image:url(../img/top/company_bg.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
}

.top_history_block{position:relative;z-index:1;}
.top_history_block .arrow{
	width:40px;
	height:100%;
	background: transparent linear-gradient(180deg, #EEEEEE 0%, #DFDFDF 100%) 0% 0% no-repeat;
	position:absolute;
	top:0;
	right:0;
	z-index:-1;
	clip-path: polygon(0 0,100% 0, 100% 94%, 50% 100%,0 94%);
}

@media screen and (min-width: 768px) {
	.basic_text_block{padding-left:8%;}
	.block_title_text dl{font-size:20px;}
	.block_title_text dl.fx-row dt{padding-left:8%;}
	.top_history_block .arrow{left:25%;right:auto;}
}
@media screen and (min-width: 960px) {
}

	/* SDGs */
.sdgs_logo{
	width:60%;
	margin:auto;
	padding:30px 0;
}
@media screen and (min-width: 768px) {
	.sdgs_logo{
		width:60%;
		padding:80px 0 30px;
	}
}

	/* CONTACT */
.contact_text a{
	display:block;
	border:1px solid var(--color-orange);
	padding:0.5em 0.5em;
	font-size:1.25em;
	text-align:center;
	transition: var(--animation-sec);
}
.contact_text a:hover{
	transition: var(--animation-sec);
	background:var(--color-orange);
	color:#fff;
}
@media screen and (min-width: 768px) {
}
@media screen and (min-width: 960px) {
}


/*------------------------------------------------------------
   お問い合わせ
------------------------------------------------------------*/