/*!
 * Start Bootstrap - Grayscale v5.0.9 (https://startbootstrap.com/template-overviews/grayscale)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-grayscale/blob/master/LICENSE)
 */

 @import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);


 html, body {
 	margin: 0;
 	padding: 0;
  font-size: 1vw;
    -webkit-text-size-adjust:100%;
  min-width: 490px
  height:100vh;

}
a{
color: #ffffff;
text-decoration: none;
}

 	.wrapper {
    width: 100%;
    margin: 0;
    font-family: 'Noto Serif JP', serif, 'Noto Sans Japanese', serif;
    font-weight: bold;
    overflow: hidden;
 	}


.jp{
    font-family: 'Noto Sans Japanese', serif;
    font-weight: bold;
    padding: 0;
}

.tel{
  font-family: 'Noto Sans Japanese', serif;
  font-weight: normal;
}


.lspacing_2{
letter-spacing: 2px;
}
/* top */
#top{
  display: flex;
  margin-bottom: 8%;
  justify-content: flex-end;
}


.top-left{
  width: 26%;
 height: auto;
  margin: 5% 2.2% 0 11%;
}

.top-right{
  width: 65%;
height: auto;
}

.top-right-slider{
  width:100%;

}

.slogan{
  font-size: 40px;
margin-bottom: 20%;
height: 48%;
}

.slogan_description{
  height: 11%;
margin-bottom: 0;
font-size: 18px;
line-height: 1.8em;
}


.title{
  margin-bottom: 16%;
    height: 5%;
}

.title img{
width: 235px;
    height: auto;
}


/* about */
.about{
  margin: 0 10% 9.5% 10%;
  display: flex;
}

.about_left{
  margin: 0 7.3% 0 0;
}

.about_left p{
  font-size: 52px;
  writing-mode: vertical-rl;
  margin-block-start: 0em;
      margin-block-end: 0em;
}

.philosophy_left{
  margin: 0 7.3% 0 0;
}

.philosophy_left p{
  font-size: 52px;
  writing-mode: vertical-rl;
  margin-block-start: 0em;
  margin-block-end: 0em;
}


.about_right{
  display: block;
  width: 90%;
}

.right_text_top{
  font-size: 28px;
  line-height: 3.5rem;
  margin-bottom: 4%;
  word-break: inherit;
text-align: justify;
}

.right_text_bottom{
  display: flex;
justify-content: space-between;

}

.right_text_left{
  margin-right: 4.6%;
  width: 40%;
}
.right_text_left img{
  width: 100%;
  height: auto;

}

.right_text_right{
  font-size: 14px;
    line-height: 2.1em;
    width: 60%;
    word-break: inherit;
    text-align: justify;
    margin: 0;
}


/* philosophy */
.philosophy{
  margin:0 11.3% 8.7% 10.5%;
  display: flex;
}

.philosophy_left {
  margin: 0 7.3% 0 0;

}
.philosophy_right{
  display: block;
  margin-bottom: 8.769rem;
}

.philosophy_right_text_top{
  font-size: 28px;
  margin-bottom: 4%;
  line-height: 3.5rem;
  word-break: inherit;
text-align: justify;
}

.philosophy_right_text_bottom{
  display: flex;
  justify-content: space-between;
}
.philosophy_right_text_bottom > ul {
  display: flex;
  list-style-type: none;
  align-items: center;
  width: 100%;
  justify-content: inherit;
  margin: 0;
  padding: 0;
}


.philosophy_right_text_bottom > ul > li {
  margin-right: 27px;
}

.philosophy_right_text_bottom > ul > li {
  margin-right: 3.2%;
  position: relative;
}

.philosophy_right_text_bottom > ul > li:first-child {
  margin-left: 0;
  position: relative;
}

.philosophy_right_text_bottom > ul > li:last-child {
  margin-right: 0;
  position: relative;
}

.mr_no3{
  margin-right: 4.235rem!important;
  margin-left: 2.058rem;
}

.philosophy_right_text_bottom > ul > li > img{
  width:100%;
  height:auto;
}

.philosophy_right_text_bottom > ul > li > .text_white_en {
  position: absolute;
      color: black;
      font-size: 14px;
  }

.philosophy_right_text_bottom > ul > li > .text_white_topic{
  position: absolute;
  color: black;
  font-size: 26px;
}
.philosophy_right_text_bottom > ul > li > .text_white_ja {
  position: absolute;
  color: black;
  font-size: 10px;
}


.text_sub_1{
  width: 100%;
  text-align: center;
  top: 13%;
  margin: 0;
}

.text_main_1{
  top: 23%;
  width: 100%;
  text-align: center;
  margin: 0;

}

.text_ja_1{
  top: 57%;
  width: 98%;
  text-align: center;
  line-height: 1.5rem;
  margin: 0 1%;
}

.text_main_3 {
  top: 23%;
  width:100%;
  text-align: center;
  line-height: 1em;
  margin: 0;
}

.text_ja_3 {
  top: 49%;
  width:100%;
  text-align: center;
  line-height: 2em;
  margin: 0;
}


.photo{
  background: url("../img/bg_1.jpg") no-repeat center center;
  background-size: cover;
  width:100%;
  height: 886px;
  padding:0;
  position: relative;

}



.our_think{
  margin-bottom: 9rem;
  position: relative;
}

.frame{
  background-color: #f7f8f8;
  margin-top: -25px;
}


.title_5{
  font-size: 52px;
  margin-left: 9.3%;
}

li{
  list-style-type: none;
}




.our_think_contents{
  padding-top: 9.3%;
  display: block;
  margin:0 10.3%;
  position: relative;
}
.our_think_1{
  display: flex;
    position: relative;
    margin-bottom: 5.4%;
}

.our_think_1 > ul {
    padding: 0;
    margin: 0;
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.our_think_2 {
  display: flex;
    position: relative;
    margin-bottom:  6.3%;
justify-content: space-between;
padding: 0;
}



.our_think_3 {
  position: relative;
  margin-bottom: 6.4%;
}


.our_think_3 > ul > li > .text_white_topic{
  position: absolute;
  color:black ;
  font-size: 24px;
}
.our_think_3 > ul > li > .text_white_ja {
  position: absolute;
  color: black;
  font-size: 10px;
}


.our_think_3 > ul {
  padding:0;
  margin: 0;
  display: flex;
  width:100%;
  margin-bottom: 2.461rem;
  align-items: center;
  justify-content: space-between;
}
.our_think_3 > ul > li {
  margin-right: 0.2%;
  position: relative;
}


.our_think_3 > ul > li > img {
    width: 100%;
    height: auto;
}

.mr_no5{
  width: 100%;
  height: auto;
}


.text_main_9{
  top: 14%;
  width:100%;
  text-align: center;
  line-height: 32px;
}

.text_ja_9{
  top: 45%;
  width:100%;
  text-align: center;
  line-height: 20px;
}

.text_main_10{
  top: 10%;
  width:100%;
  text-align: center;
  line-height: 32px;
}

.text_ja_10{
  top: 55%;
  text-align: center;
  line-height: 20px;
  width:100%;

}

.text_main_11{
  top: 14%;
  width:100%;
  text-align: center;
  line-height: 32px;
}

.text_ja_11{
  top: 45%;
  width:100%;
  text-align: center;
  line-height: 20px;

}

.illust1{
    margin-right: 4.1%;
}
.illust1 img{
width: 100%;
height: auto;
}

.illust2 img{
width: 100%;
height: auto;

}

.illust3 img{
width: 100%;
height: auto;
}

.illust3{
margin-left:4.1%;
}


.our_think_4{
  height:auto;
  width:100%;
  text-align: center;
  border: 1px solid #000;
  background-color: #000;
  color:#fff;
}

.our_think_4 p {
  line-height: 4.538rem;
  font-size: 20px;
}




.our_workflow{
  height: 15.384rem;
  margin:0;
  background-color:#000000 ;
  padding: 2.307rem 0 0 10rem;
  display: flex;
  justify-content: space-between;
  padding: 0 9.3%;
  align-items: center;
}

.our_workflow_title{
  color:#fff ;
  font-size: 4rem;
  margin: 0;
  padding-bottom: 0.769rem;
}


.work_flow_1{
  display: flex;
}
.flow_1 {
  width: 100%;
}

.flow_1 img {
  width: 100%;
  height: auto;
}

.flow_2 {
  width: 100%;
}

.flow_2 img{
  width: 100%;
  height: auto;
}

.work_flow_2{
  height:auto;
  font-size: 2.153rem;
  text-align: center;
}

.inverted_triangle{
  top:0;
}


.work_flow_2 {
    height: auto;
}
.work_flow_2 p{
 font-size: 42px;
}

.stage{
  display: block;
  width: 27%;
}

.stage_table{
  width: 70%;
  padding-left: 9%;
}

.stage_title{
text-align: center;
font-size: 24px;
padding-bottom: 8.9%;
border-bottom: 1.5px solid;
margin-bottom: 25px;
}

.stage_text1{
  padding: 0 5% 0 0;
      margin: 0;
      border-right: 1.5px solid #000;
      font-size: 14px;
      width: 20%;
}

.stage_text2{
font-size:10px;
list-style-type: disc;
margin-bottom: 5%;
word-break: inherit;
    text-align: justify;
}

.stage_text2-2{
  font-size:10px;
  list-style-type: none;
  margin-bottom: 5%;
  word-break: inherit;
      text-align: justify;
      letter-spacing: -0.3px;
}


.point_1, .stage_text3 {
  text-align: center;
}

.point_1{
  margin-bottom: 7%;
}

.point_2{
  text-align: center;
  position: relative;
  height: 0;
}

.point_2 img{
  position: relative;
  top:-95px;
}
.stage_text3 p, .stage_text5 p, .stage_text4 p {
font-size: 28px;
padding: 0;
border-bottom: 1.5px solid #000;
text-align: center;
}
.stage_text3 {
width: 25%;
margin: auto;
}

.mb_no1{
  margin-bottom: 30px;
}

.stage_text4 {
width: 59%;
margin: auto;
}

.stage_text5 {
width: 73%;
margin: auto;
}
.stage_text_1and2{
  display: flex;
height: 90px;
margin-bottom: 47px;
}

.stage_text_only3{
  display: flex;
height: 90px;
margin-bottom: 47px;
}


.stage_text1, .stage_text3, .stage_text4, .stage_text5  {
font-family: 'Ropa Sans', sans-serif;}

.stage_text1, .stage_text3, .stage_text4, .stage_text5  {
font-family: 'Noto Sans Japanese', serif;}


/***********************Contact**********************/

		.contact {
			background-color: #000;
				margin-left: calc(((100vw - 100%) / 2) * -1);
			margin-right: calc(((100vw - 100%) / 2) * -1);
			color: #fff;
			text-align: center;
			font-family: "游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
      position: relative;

		}


		.contact > ul li {
			list-style: none;
			margin-bottom: 3px;
      font-size: 20px;
}


		.contact_text {
			width: 90%;
			height: 80%;
			margin: 0 auto;
			list-style-type: none;
			text-align: center;
			padding:70px 0 50px 0!important;
		}




		li >.contact_title {
			font-size: 18px;
			padding-top:10px;


		}

		li >.tel {
			font-size:  60px;
			padding-top:10px;
			color: #fff;
			letter-spacing: 2px;
		}


		.mail_form {
			font-weight: bold;
			position: relative;
			display: inline-block;
			margin: 2em 0 1em;
			padding: 3% 22%;
			min-width: 120px;
			max-width: 80%;
			color: #231815;
			font-size: 20px;
			background: #FFF;
			box-sizing: border-box;
			line-height: 1.5em!important;
		}

    .fs_regular {
        font-size: 19px;
        margin: 0!important;
        padding: 0 0;
    }
		.fs_small {
			margin: 0!important;
			font-size: 16px;
			margin: 0;
			padding: 0 0;
      text-align: left;
		}



    .contact_text2{
      display: flex;
      justify-content: space-evenly;
      align-items: center;
      width: 78%;
      margin: auto;
      padding: 0;
    }

    .copyright{
    font-size: 12px;
    margin: 40px 9.3% 40px;
    margin-right: 9.3%;
    display: flex;
    justify-content: flex-end;
    font-weight: bold;

    }

.mr_no4{
  background: url(../img/14.png) no-repeat center center;
background-size: contain;
width: 4%;
height: auto;
padding: 0;
position: relative;
background-position-y: inherit;
top: 20px;
}


ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;
}

.slider li {
display: none;
}
.bx-viewport .slider li {
display: block !important;
}