/*==================================================
スタートアニメーション
===================================*/
.start {
	background:#9A9887;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 90000;
}
.start p {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: none;
	z-index: 99999;
	width: 26%;
}


.fv_logo{
position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-transform: uppercase;
    width: 40%;
}
.fv_logo img{
  width: 100%;
}

/*==================================================
スライダーのためのcss
===================================*/
.slider {
    position:relative;
  z-index: 1;
  /*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/
  height: 100vh;/*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
}
.slider ::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    opacity: 0.2;
    z-index: 1;
}
/*　背景画像設定　*/

.slider-item01 {
    background:url(images/top_01.jpg);
}

.slider-item02 {
    background:url(images/top_02.jpg);
}

.slider-item03 {
    background:url(images/top_03.jpg);
}

.slider-item {
    width: 100%;/*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/
    height:100vh;/*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
    background-repeat: no-repeat;/*背景画像をリピートしない*/
    background-position: center;/*背景画像の位置を中央に*/
    background-size: cover;/*背景画像が.slider-item全体を覆い表示*/
}

/*矢印の設定*/

.slick-prev, 
.slick-next {
    position: absolute;
  z-index: 3;
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #fff;/*矢印の色*/
    border-right: 2px solid #fff;/*矢印の色*/
    height: 25px;
    width: 25px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left:2.5%;
    transform: rotate(-135deg);
}

.slick-next {/*次へ矢印の位置と形状*/
    right:2.5%;
    transform: rotate(45deg);
}

/*ドットナビゲーションの設定*/

.slick-dots {
  position: relative;
  z-index: 3;
    text-align:center;
  margin:-50px 0 0 0;/*ドットの位置*/
}

.slick-dots li {
    display:inline-block;
  margin:0 5px;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width:8px;/*ドットボタンのサイズ*/
    height:8px;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#fff;/*ドットボタンの色*/
}

.slick-dots .slick-active button{
    background:#333;/*ドットボタンの現在地表示の色*/
}

/*=============
indexコンテンツ
=============*/
.index_copy{
	padding: 50px 0;
}
.index_copy .txt{
	text-align: center;
    font-size: 2rem;
    line-height: 2;
}
.section_menu{
	position: relative;
}
.section_menu img{
	
}
.section_menu .section_ttl{
    text-align: center;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    top: 50px;
	background: #f9f9f9;
	width: 100%;
}
.section_menu .section_ttl h2{
    font-size: 2rem;
    padding: 20px 0;
    display: inline-block;
}
.section_menu .section_ttl .txt{
    padding: 3%;
    display: inline-block;
	width: 90%;
	text-align: center;
}
.section_menu .section_ttl .txt h3{
    font-size: 2rem;
    padding: 20px 0;
	line-height: 2em;
}
.section_menu .section_ttl .txt p{
	font-size: 1.5rem;
	line-height: 2em;
}
.section_menu .section_ttl .txt .more{
	float: right;
	margin: 5% 0;
}
.txt .right{
	text-align: right;
}
.section_menu .contetns_menu{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 20px;
}
.section_menu .contetns_menu li{
	width: calc((100% - 10px));
    margin-top: 10px;
}
.section_menu .contetns_menu li img{
	width: 100%;
}
.section_menu .contetns_menu li a{
    display: block;
    padding: 15px 0;
    border: 1px solid #ededed;
    text-align: center;
    font-size: 1.8rem;
}
.section_menu .contetns_menu li a:hover{
	background: #fff;
}

.service ul{
	width: 100%;
	justify-content: space-between;
	padding: 20px;
	text-align: center;
}
.service li{
	display: inline-block;
	font-size: 2rem;
	width: 100%;
	margin: 10px;
	text-align: center;
}
.service li img{
	width: 100%;
}
.contact{
	width: 100%;
	border: solid 0.5px rgba(50,50,50,1.00);
	padding: 30px;
	font-size: 3rem;
	margin: 20px auto;
	text-align: center;
	position: relative;
}
.section_menu .section_ttl .contact h2{
	font-size: 3rem;
	padding: 0 0 20px;
}
.section_menu .section_ttl .contact p{
	text-align: center;
	padding: 0;
}
.section_menu .section_ttl .contact a{
    position: absolute;
    top: 0;
    left: 0;
    height:100%;
    width: 100%;
}
.section_menu .section_ttl .contact a:hover{
	background: #fff;
	opacity: 0.5;
}

#main{
	padding-bottom: 280vh;
}

/*=============
会社概要
=============*/
/*.company_profile{
font-size: 1.4rem;
    padding-top: 20vw;
    padding-bottom: 30vw;
}
.company_profile .page_ttl::before{
content: "Company";
}

.company_profile .company_profile_list{
display: flex;
    flex-wrap: wrap;
    line-height: 1.8;
    margin-top: 40px;
font-size: 1.2rem;
}
.company_profile dt{
   width: 30%;
  padding: 20px 0 0 0;
  font-weight: normal;
}
.company_profile dd {
  width:70%;
      padding: 20px 0 0 0;
  box-sizing: border-box;
}
.company_profile_img{
  background-color: #1c222d;
}
.company_profile_img img{
  opacity: 0.8;
}
*/
/*=============
index topメニュー
=============*/
.pc_top{
	position: absolute;
	width: 100%;
	top:48%;
	z-index: 10000;
	color: #fff;
	font-size: 1.3rem;
	letter-spacing: 0.3rem;
}
.pc_top ul{
	position: relative;
	width: 90%;
	margin: 0 auto;
	text-align: center;
}
.pc_top li{
	display: inline-block;
	margin: 0 50px;
	width: fit-content;
    height: 70px;
    vertical-align: middle;
    line-height: 45px;
}
.pc_top li a{
	position: relative;
}
.pc_top li a::after {
position: absolute; /*親要素であるaタグを基準に位置を指定*/
left: 0;            /*アンダーラインを各メニュー（aタグ）の左端に指定*/
content: '';        /*本来は、擬似要素に入るテキストなどを’’内に指定。今回はアンダーラインなので何も記載しない*/
width: 100%;        /*アンダーラインを各aタグの幅に合わせる*/
height: 1px;        /*アンダーラインの高さ（太さ）*/
background: #fff;/*アンダーラインの色*/
bottom: -4px;       /*アンダーラインが位置する、各リストの下端からの高さ　ヘッダーの下端に合わせています*/
visibility: hidden; /*ホバー前に、アンダーラインを可視化しない*/

}
.pc_top li a:hover::after {
visibility: visible; /*ホバー後、アンダーラインを可視化する*/
}

/*========= スクロールダウンのためのCSS ===============*/
/*====== 9-1-1 縦線が動いてスクロールを促す =======*/

/*スクロールダウン全体の場所*/
.scrolldown1{
    /*描画位置※位置は適宜調整してください*/
	position:absolute;
	left:50%;
	bottom:10px;
    /*全体の高さ*/
	height:50px;
	z-index: 10000;
}

/*Scrollテキストの描写*/
.scrolldown1 span{
    /*描画位置*/
	position: absolute;
	left:-20px;
	top: -15px;
    /*テキストの形状*/
	color: #eee;
	font-size: 1.1rem;
	letter-spacing: 0.3em;
}

/* 線の描写 */
.scrolldown1::after{
	content: "";
    /*描画位置*/
	position: absolute;
	top: 0;
    /*線の形状*/
	width: 1px;
	height: 30px;
	background: #eee;
    /*線の動き1.4秒かけて動く。永遠にループ*/
	animation: pathmove 1.4s ease-in-out infinite;
	opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
	0%{
		height:0;
		top:0;
		opacity: 0;
	}
	30%{
		height:30px;
		opacity: 1;
	}
	100%{
		height:0;
		top:50px;
		opacity: 0;
	}
}

/*==================================================
スライダーのためのcss
===================================*/
.slider2 img {
    width:100%;/*スライダー内の画像を横幅100%に*/
    height:auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider2 .slick-slide {
    margin:0 5px;/*スライド左右の余白調整*/
		z-index: 5000;
}

.slider2{
  margin:0;
  padding: 50px 0 20px;
  list-style: none;
	z-index: 5000;
	width: 100%;
}