/*
Theme Name: fkled
Theme URI: https://mgc-led.com/
Description:株式会社　共立電照
Author: kusamura
Author URI: http://den55.com/
Version: 1.0
License: GNU General Public License
License URI:
Tags: red, white, two-columns, editor-style, custom-menu
Text Domain: den55
*/

/****************************************

General Setting

 *****************************************/
@import url(//use.fontawesome.com/releases/v5.15.4/css/all.css);

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

html{
  margin: 0;
  padding: 0;
}
body {
	font-family: 'Noto Sans JP', sans-serif;
	color: #3E3A39;
	font-size: 16px;
	line-height: 180%;
	background-color: #FFF;
	margin: 0px;
	padding: 0px;
}
/**/
.contentarea{
	margin-top:140px;
	margin-bottom:50px;
}
.wrapper{
    padding: 0 100px;
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#sp-wrap{

}
/*背景グレー*/
.bg_gray{
	background-color: #f8f9f9;
	margin: 0;
}
.bg_gray2{
	background-color: #f9f8f4;
	margin: 0;
}
/*背景白*/
.bg_white{
	background-color: #ffffff;
}

img {
  border:0;
}
a {
    color: inherit;
    text-decoration: none;
}

/* clearfix */

.clearfix {
  overflow: hidden;
  zoom: 1;
}
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}
.clear {
	clear:both;
}
.wp-caption{}
.wp-caption-text{}
.sticky{}
.gallery-caption{}
.bypostauthor{}
.aligncenter{}
p {
	margin: 0px;
	padding: 0px;
	line-height: 180%;
}
.screen-reader-text{}

/*スマホの時だけ改行させる*/
.sma{
    display: none;
}

hr{
    border-top: 1px solid #9f9fa0;
    border-right: none;
    border-bottom: none;
    border-left: none;
}

/****************************************

Typography

 *****************************************/


/*フォントの太さ*/

.weight200   {
    font-weight:200;
    }
 
.weight300   {
    font-weight:300;
    }
 
.weight400   {
    font-weight:400;
    }
 
.weight500   {
    font-weight:500;
    }
 
.weight600   {
    font-weight:600;
    }

/**/
.font_ryumin{
		font-family: "リュウミン M-KL",Ryumin Medium KL;
	}


h1, h2, h3, h4, h5, h6{
	font-weight: normal;
	margin: 0px;
}


h1{
		font-size:32px;
		margin-bottom:50px;
	}

/*固定ページごとにH1の背景を設定*/  
h1.title_img{
	width: 100%;
	position: relative;
}
h1.title_img img{
	width: 100%;
	height: auto;
}

h1.titlenoimg{
	font-size:28px;
	padding: 20px;
	background-color: #f6f6f6;
	border: 1px solid #eee;
	box-shadow: 1px 1px 0 rgba(255, 255, 255, .5) inset;
	margin-bottom:50px;
}

h2.title_img{
	width: 100%;
	padding: 0;
	margin-bottom: 30px;
	margin-left: 0;
	margin-right: 0;
	margin-top: 50px;
}
h2.title_img img{
	width: 100%;
	height: auto;
}

h2{
    font-weight: 400;
  color: #333333;
	font-size:clamp( 20px, 3vw, 32px) ;
	text-align: center;
	margin-bottom: 30px;
	margin-top: 30px;
}

h2.topics {
  overflow: hidden;
  text-align: center;
	font-weight: 400;
	font-size:clamp( 20px, 3vw, 32px) ;
	margin-top: 50px;
	margin-bottom: 50px;
}
h2.topics span {
  position: relative;
  display: inline-block;
  margin: 0 2.5em;
  padding: 1em;
  text-align: left;
}
h2.topics span::before,
h2.topics span::after {
  position: absolute;
  top: 50%;
  content: '';
  width: 400%;
  height: 1px;
  background-color: #3E3A39;
}
h2.topics span::before {
  right: 100%;
}
h2.topics span::after {
  left: 100%;
}
h2.custom{
		font-size: 120%;
	background-color: #004097;
	color: #FFFFFF;
	text-align: left;
	padding: 15px;
	margin-bottom: 30px;
	margin-top: 10px;
}
h2.lineuptitle {
  color: #1469a3;/*文字色*/
  padding: 0.5em 0;/*上下の余白*/
  border-top: solid 3px #1469a3;/*上線*/
  border-bottom: solid 3px #1469a3;/*下線*/
	text-align: left;
	margin-top: 20px;
	margin-bottom: 20px;
		font-weight: 400;
	font-size:clamp( 16px, 3vw, 26px) ;
}
h2.lineuplist {
  color: #1469a3;/*文字色*/
	border-left: solid 5px #1469a3;
	padding-left: 20px;
	text-align: left;
	margin-top: 50px;
	margin-bottom: 20px;
		font-weight: 400;
	font-size:clamp( 16px, 3vw, 26px) ;
}
/*top写真用文字*/
.shadow{
	-webkit-backdrop-filter: brightness(70%);
	backdrop-filter: brightness(70%);
	width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
}

/*スクロールダウン全体の場所*/
.scrolldown1{
    /*描画位置※位置は適宜調整してください*/
	position:absolute;
	left:50%;
	bottom:15px;
    /*全体の高さ*/
	height:50px;
}
/*Scrollテキストの描写*/
.scrolldown1 span{
    /*描画位置*/
	position: absolute;
	left:-15px;
	top: -15px;
    /*テキストの形状*/
	color: #eee;
	font-size: 0.7rem;
	letter-spacing: 0.05em;
}

/* 線の描写 */
.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;
	}
}
/****************************************

テキスト　装飾 画像デフォルトエリア

 *****************************************/
.text_center{
	text-align: center;
}
.text_left{
	text-align: left;
}
.text_right{
	text-align: right;
}
.bold{
	font-weight: bold;
}
.text_blue{
	color: #20367d;
}
.text_white{
	color: #FFFFFF;
}
.text_22{
	font-size:clamp( 18px, 3vw, 22px) ;
	
}
.text_18{
	font-size:clamp( 15px, 3vw, 18px) ;
	
}
.text_36{
	font-size:clamp( 20px, 3vw, 36px) ;

}
.text_70{
	font-size: 70%;
}
.text_80{
	font-size: 80%;
}
.text_90{
	font-size: 90%;
}
.img_area{
	width: 100%;
}
.img_area img{
	width: 100%;
	height: auto;
	vertical-align:top;
}
.margintop10{
	margin-top: 10px;
}
.margintop20{
	margin-top: 20px;
}
.margintop50{
	margin-top: 50px;
}
.marginbottom20{
	margin-bottom: 20px;
}
.marginbottom50{
	margin-bottom: 50px;
}
.padding_t50{
	padding-top: 50px;

}
.padding_b50{
	padding-bottom: 50px;

}
.padding_all20{
	padding: 20px;
}

.mb60{
	margin-bottom: 60px;
		}
		
.mt30{
	margin-top: 30px;
		}

/****************************************

header ヘッダー

 *****************************************/
.site-header{
    position:fixed;
    top:0;
    width:100%;
    height:120px;
    z-index:1000;
	background-color: #FFFFFF;
}

/*ロゴエリア*/
.logo_area{
	width:300px;
	padding:0;
	margin-top: 20px;
	margin-bottom: 20px;
	display: flex;
    align-items: center;
}
.logo_area img{
	width: 100%;
	height: auto;
}

.headright{
	display: flex;
	flex-wrap:wrap;
	justify-content: flex-end;
	align-items: center;

}
.recruitmentsite_area{
	margin: 20px 20px 0 0;
}
.instagram_logoarea{
	width: 25px;
	margin: 20px 0 0;
	padding: 0;
		}	
.instagram_logoarea img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
		}

.instagram_splogoarea{
	display: none;
}

	
/****************************************

トップページ　スタイル

****************************************/
/*画像*/
#top_meinimg img{
	vertical-align: top;
	
}
/*背景動画*/
#moviearea{
		position: relative;
	width: 100%;
	height: calc(100vh - 140px);

	}

.main-movie{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	}

.main-movie video {
	position: absolute;
	top: 50%;
	left: 50%;
	object-fit: cover;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
}
.main-movie #play{
    display:none;
    position:absolute;
    left:50px;
    bottom:15px;
    cursor: pointer;
}

.main-movie #play img{
    width: 25px;
    height:auto;
    
}

.main-movie #pause{
    display:block;
    position:absolute;
    left:50px;
    bottom:15px;
    cursor:pointer;
}

.main-movie #pause img{
    width: 25px;
    height:auto;
}
.main-movie.active #play{
    display:block;
}
.main-movie.active #pause{
   display:none;
}

/*音声*/

.main-movie #off{
	display:block;
    position:absolute;
    left:15px;
    bottom:15px;
    cursor: pointer;
}

.main-movie #off img{
    width: 25px;
    height:auto;
    
}

.main-movie #on{
	display:none;
    position:absolute;
    left:15px;
    bottom:15px;
    cursor:pointer;
}

.main-movie #on img{
    width: 25px;
    height:auto;
}
.main-movie.sound #on{
	display:block;
}
.main-movie.sound #off{
	display:none;

}

/*TVCMへ*/
.main-movie .tvcm{
	    position:absolute;
    left:90px;
    bottom:20px;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	font-size: 90%;
    cursor:pointer;
	background-color: rgba(255,255,255,0.5);
}
.main-movie .newproduct{
	    position:absolute;
    left:230px;
    bottom:20px;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	font-size: 90%;
    cursor:pointer;
	background-color: rgba(255,255,255,0.5);
}
.main-movie .newtopics{
	    position:absolute;
    left:370px;
    bottom:20px;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	font-size: 90%;
    cursor:pointer;
	background-color: rgba(255,255,255,0.5);
}
.main-movie .recruitmovie{
	    position:absolute;
    left:540px;
    bottom:20px;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	font-size: 90%;
    cursor:pointer;
	background-color: rgba(255,255,255,0.5);
}
.main-movie .recruitsite{
	    position:absolute;
    left:750px;
    bottom:20px;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	font-size: 90%;
    cursor:pointer;
	background-color: rgba(255,255,255,0.5);
}

/*スマホ用画像*/
.sp_mainbg{
    display:none;
}
.sptvcm{
	 display:none;
}
.spnewproduct{
	 display:none;
}
.sprecruitmovie{
	 display:none;
}
.sprecruitsite{
	 display:none;
}



/*リクルートバナー*/
.top_recruitimgarea{
width: 80%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 50px;
	padding-top: 50px;
}
.top_recruitimgarea img{
	width: 100%;
	height: auto;
}

/*808mera*/
.top_808meraarea{
	width: 30%;
	margin-left: auto;
	margin-right: auto;
}
.top_808meraarea img{
	width: 100%;
	height: auto;
}

/*parallax*/
.parallax_box{
	margin: 0;
	padding: 0;
	z-index: 1;
}

.parallax {
  width: 100%;
  height: 500px;
  position: sticky;
  top: 0;
  left: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;

}

.parallax01 {
		background-image: url("images/top_paraimg01.jpg");

}

.parallax02 {
background-image: url("images/top_paraimg02.jpg");
}


.front_content{
    background-color: #fff;
	padding-bottom: 30px;
	padding-top: 30px;
	margin: 0;
	z-index: 1;
	transform:translate3d(0,0,0);
}

.front_contextarea{
	width: 60%;
	margin-left: auto;
	margin-right: auto;
}


/*私たちがつくる「電機」 */


.top_area_ele_lin{
	width: 45%;
	
}
.top_electricimgarea{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}
.top_electricimgarea img{
	width: 100%;
	height: auto;
}
.top_lineupimgarea{
	width: 40%;
	margin-left: auto;
	margin-right: auto;
}
.top_lineupimgarea img{
	width: 100%;
	height: auto;
}
/*次の要素のために*/
.next_topm{
	margin-top: 600px;
}

/*商品ラインナップ*/
.top_kineupphotoarea{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}
.top_kineupphotoarea img{
	width: 100%;
	height: auto;
}

/*商品ラインナップの検索*/
.top_forserch{
	width: 40%;
}
	.search-form-003 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
    border: 1px solid #767d83;
    border-radius: 3px;
}

.search-form-003 input {
    width: 250px;
    height: 45px;
    padding: 5px 15px;
    border: none;
    box-sizing: border-box;
    font-size: 1em;
    outline: none;
}

.search-form-003 input::placeholder{
    color: #767d83;
}

.search-form-003 button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 45px;
    border: none;
    background-color: transparent;
    cursor: pointer;
}

.search-form-003 button::after {
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M23.7%2020.8%2019%2016.1c-.2-.2-.5-.3-.8-.3h-.8c1.3-1.7%202-3.7%202-6C19.5%204.4%2015.1%200%209.7%200S0%204.4%200%209.7s4.4%209.7%209.7%209.7c2.3%200%204.3-.8%206-2v.8c0%20.3.1.6.3.8l4.7%204.7c.4.4%201.2.4%201.6%200l1.3-1.3c.5-.5.5-1.2.1-1.6zm-14-5.1c-3.3%200-6-2.7-6-6s2.7-6%206-6%206%202.7%206%206-2.6%206-6%206z%22%20fill%3D%22%23767d83%22%3E%3C%2Fpath%3E%20%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    content: '';
}
.top_forserchtext{
	width: 56%;
}

/****************************************

top　セクションエリア

 *****************************************/
.section-area{
	padding-bottom: 50px;
	padding-top: 30px;
	margin: 0;
	width: 100%;
}

/*会社案内*/
.section-about{
	margin-top: 30px;
	width: calc(50% /5);
	margin-right: 12.5%;
	text-align: center;
}
.section-about:nth-of-type(5n){
	margin-top: 30px;
	width: calc(50% /5);
	margin-right: 0;
}
.circle-in{
position: relative;
border-radius: 50%;
padding-top: 100%;
	margin-bottom: 20px;
height: 0;
background-color: #004097;
color: #fff;
transition: transform .6s ease;
}
.circle-in:hover{
transform: scale(1.1);
background-color: #000;
}
.circle-in p{
position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 50%;
  left: 50%;
  transform : translate(-50%,-50%);
		}
/*FontAwesomeのアイコンサイズ*/
.fa-building:before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: '\f1ad';
	font-size: 4em;
		}
.fa-camera:before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: '\f083';
	font-size: 4em;
}
.fa-heart:before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: '\f4be';
	font-size: 4em;
}
.fa-users:before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: '\f0c0';
	font-size: 4em;
}
.fa-child:before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: '\f1ae';
	font-size: 4em;
}


.photo-area{
	width: calc((100% - 4px)/ 5);
	margin-right: 1px;
	margin-bottom: 1px;
	overflow:hidden;
	aspect-ratio: 4 / 3;
	display: flex;
	align-items: center;
}
.photo-area:nth-of-type(5n){
	width: calc((100% - 4px)/ 5);
	margin-right: 0;
	margin-bottom: 1px;
	overflow:hidden;
	aspect-ratio: 4 / 3;
		display: flex;
	align-items: center;
}
.photo-area img{
	width: 100%;
	height: auto;
	transition: transform .6s ease; 
}
.photo-area:hover img {
transform: scale(1.1); 
}
.our-team-area{
		width: calc((100% - 3px)/ 4);
	margin-right: 1px;
}
.our-team-area:nth-of-type(4n){
		width: calc((100% - 3px)/ 4);
	margin-right: 0;
}
.our-team-areatitle{
	text-align: center;
}
.our-team_setumei{
	  max-width: 90%;
  text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;

}
.our-team_setumei p{
	  display: inline-block;
  text-align: left;
	font-size: 70%;
}


/****************************************

top トピックス

****************************************/
/*top お知らせ*/
.top_newsline{
		border-bottom:solid 1px #004097;
	border-top:solid 1px #004097;
	padding-bottom: 30px;
	padding-top: 30px;
	margin-top: 20px;
}
.top_newsarea{
	display:flex;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: space-between;
	width: 70%;
	margin-left: auto;
	margin-right: auto;
	}
.top_newstitle{
	color:#004097;
	width:180px;
	align-self:center;
	font-size:32px;

	}
.infoday2{
	margin-right:30px;
}
.c_infolist{
	width:calc(100% - 180px);
margin:0;
padding:0;
  display: flex;
  flex-wrap: wrap;
}
.c_infolist dt {
  width: 10%;
  margin-bottom:8px;
}

.c_infolist dd {
  width: 80%;
  margin-bottom:8px;
}
span.new{
color: #ff0000;
margin-right:5px;
}

.top_topicsarea{
	width: 100%;
	padding-bottom: 30px;
	padding-top: 30px;
	border-bottom: solid 1px #cccccc;
	}
.top_topicstext{
	margin-left: 50px;
	width: calc(100% - 420px);
}

.top_topicsimg{
	width: 370px;
	height: 190px;
	}
.top_topicsimg img{
	width: 100%;
	 height: 100%;
  object-fit: cover;
	}
.top_topicstitle{
	font-size: 120%;
	font-weight: bold;
	margin-bottom: 30px;
	margin-top: 30px;
	}
.infoday{
	font-size: 80%;
}
.readmore{
	font-size: 80%;
	padding-left: 10px;
}
.to-a-list{
	margin-top: 30px;
	padding-left: 20px;
	padding-right: 20px;
	color: #004097;
	border: solid 1px #004097;
	text-align: center;
}
.to-a-list:hover{
	color: #ffffff;
	border: solid 1px #004097;
	background-color: #004097;
	text-align: center;
}

/****************************************

block　Flexbox スタイル　

****************************************/
/*並べただけ*/
.f-containerflex{
	display:flex;
	flex-wrap:wrap;

}
/*並べて上にそろえる*/
.f-containerflexatop{
	display:flex;
	flex-wrap:wrap;
	align-items: flex-start; 

}
/*並べて高さをあわせる*/
.f-containerflexh{
	display:flex;
	flex-wrap:wrap;
	align-items: center; 
}

/*並べて高さを上にあわせる*/
.f-containerflexhst{
	display:flex;
	flex-wrap:wrap;
	align-items: stretch; 
}
/*並べて中央高さをあわせる*/
.f-containercc{
	display:flex;
	align-items: center; 
	justify-content: center;
}
/*並べて中央高さをあわせる*/
.f-containerwcc{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
}
/*右寄せ*/
.f-containerr{
	display:flex;
	flex-wrap:wrap;
	justify-content: flex-end;
	align-items: stretch;
}
/*左寄せ*/
.f-containerl{
	display:flex;
	flex-wrap:wrap;
	justify-content: flex-start;
	align-items: stretch;
}

.f-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	align-items: stretch;
}
.f-containersa{
	display:flex;
	flex-flow: row wrap; 
	justify-content: space-around;
	align-items: stretch;
}
/*隙間なし*/
.f-containerno{
	display:flex;
	flex-wrap:wrap;
}
/*左から右*/
.f-containerreverse{
	display:flex;
	flex-wrap:wrap;
	flex-direction: row-reverse;
}
/*中央配置*/
.f-containercc{
  	display:flex;
	justify-content: center;
	align-items: center;
}
/*並べて高さをあわせる*/
.f-containerflexh{
	display:flex;
	flex-wrap:wrap;
	align-items: center; 
}

/*並べて高さを上にあわせる*/
.f-containerflexhst{
	display:flex;
	flex-wrap:wrap;
	align-items: stretch; 
}

/*等間隔両端のアイテム均等　アイテム中央*/
.f-containersbcenter{
	display:flex;
	flex-wrap:wrap;
	justify-content: space-around;
	align-items: center;

}
/*両端のアイテムを余白を空けずに均等*/
.f-containersb{
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	align-items: stretch;

}
/*両端のアイテムを余白を空けずに均等　アイテム下*/
.f-containersbend{
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	align-items: flex-end;

}
/*両端のアイテムを余白を空けずに均等　アイテム上*/
.f-containersbstart{
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	align-items: flex-start;

}
/**両端のアイテムを余白を空けずに均等 並べて中央高さをあわせる*/
.f-containerccsb{
	display:flex;
	align-items: center;
	justify-content: space-between;
}
/*縦に積んで中央*/
.f-align-center{
    display: flex;
    align-items: center;
    flex-direction: column;
  }
/*縦に積む*/
.f-containerh{
	display: flex;
	flex-direction: column; 
}
/****************************************

top　エフェクト

 *****************************************/
.fade{
  opacity : 0;
  transform: translateY(50px);
  transition: all 1s;
}

/****************************************

Footer

 *****************************************/
#footerarea{
	background-color: #3a3a3a;
	padding-top: 50px;
	margin-top: 100px;
	}

.footer_menuarea{
		background-image: url("images/footer_bgimg.png");
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: contain;
	height: 100%;
    display: flex;
	justify-content: space-between;
	color: #ffffff;
	padding-bottom: 150px;
}
.footer_grouparea{
	width:50%;
	}
.footer_title{
	font-size:18px;
	margin-bottom:20px;
	}
.footer_logo{
	width: 220px;
}
.footer_logo img{
	width: 100%;
	height: auto;
}
/*右寄せ*/
.footer-containerr{
	display:flex;
	flex-wrap:wrap;
	justify-content: flex-end;
	align-items: flex-end;
	}
ul.footer_grouplist{
	margin:0;
	padding:0;
	padding-left: 20px;
	list-style-type: none;
	font-size:11px;
	line-height:20px;
	}
p#copyright{
	background-color: #616161;
	text-align: center;
}

 

/****************************************

パンくずリスト用CSS

 *****************************************/
#bread{
	padding:0px;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	font-size: 90%;
}
#breadcrumb_list
{
	list-style-type:none;
	margin: 0px;
	padding: 0px;
	
}
#breadcrumb_list > li
{
	display:inline;
}
#breadcrumb_list > li+li:before
{
	content:"\00a0>\00a0 ";
}
/****************************************

editor

 *****************************************/
strong { font-weight: bold; }
em { font-style: italic; }
blockquote {
  display: block;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 40px;
  -webkit-margin-end: 40px;
}
                             
/* img */

.aligncenter {
  display: block;
  margin: 0 auto;
}
.alignright {
	float: right;
	margin-left: 30px;
	margin-top: 20px;
}
.alignleft {
	float: left;
	margin-right: 30px;
	margin-top: 20px;
}

img[class*="wp-image-"],
img[class*="attachment-"] {
  height: auto;
  max-width: 100%;
}

/****************************************

固定ページ　page.php

 *****************************************/
/*会社案内　加盟団体*/

/*挨拶写真*/
.kaityou_width{
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}
.kaityou_photo{
		float: right;
	margin-left: 30px;
	width: 240px;
}
.kaityou_photo img{
	width: 100%;
	height: auto;
}
.kaityou_photo p{
	text-align: center;
		}



ul.memberlist li{
	margin-bottom: 15px;

}

/*会社概要*/
.shisetu_photo{
	width: 60%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	}
.shisetu_photo img{
	width: 100%;
	height: auto;
	}
.img360{
	width: 100px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	
	}
.img360 img{
	width: 100%;
	height: auto;
	}
.companytable {
  margin: 20px auto;
  width:100%;
	border-collapse: collapse;
	border: solid 1px #aaaaaa;
	
}
.companytable th {
  background: #ebebeb;
  padding: 10px;
	width: 15%;
	border-collapse: collapse;
	border-bottom: solid 1px #aaaaaa;
	border-left: solid 1px #aaaaaa;
	border-top: solid 1px #aaaaaa;
}
.companytable td {
	padding: 10px;
		border-collapse: collapse;
	border-bottom: solid 1px #aaaaaa;
	border-right: solid 1px #aaaaaa;
	border-top: solid 1px #aaaaaa;
}
dl.companynaiyo{
	margin:0;
	padding:0;
	}
dl.companynaiyo dt{
		clear: left;
	float: left;
	width: 25%;
	}
dl.companynaiyo dd{
	margin-left: 25%;
	}
.company_photo{
	width: 40%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 50px;
}
.company_photo img{
	width: 100%;
	height: auto;
}
.iso{
	margin-right: 30px;
}

/*会長あいさつ*/
.tleft_bcenter{
	  max-width: 1000px;
  text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.tleft_bcenter p{
	  display: inline-block;
  text-align: left;
	font-weight: bold;
}

/*社長あいさつ*/
.greetings_width{
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}
.greetings_photo{
	float: left;
	margin-right: 30px;
	margin-bottom: 30px;
	width: 240px;
		}
.greetings_photo img{
	width: 100%;
	height: auto;
		}
.greetings_photo p{
	text-align: center;
		}
.greeting_text{
	float: left;
	width: calc(100% - 270px);
	
}

/*社会貢献*/
.sk_logo{
	width: 240px;
		text-align: right;
}
.sk_logo img{
	vertical-align: top;

	width: 50%;
}
.sk_textarea{
	width: calc(100% - 260px);
	margin-left: 20px;
}
.sk_textarea p{
	margin-bottom: 30px;
}
/** 社会貢献年表 */
.sktimeline {
    margin: 20px 0;
    padding: 30px 0;
    position: relative;
	border-top: 6px solid #79949f;
}
/** 年表の縦線 */
.sktimeline::before {
    display: block;
    position: absolute;
    top: 0; bottom: 0; left: 240px;
    margin: auto;
    content: "";
    width: 0;
    height: 100%;
    border: 3px solid #79949f;
    z-index: 0;
    transform-origin: top;
    animation: extend 4s;
	background-color: #79949f;
}
@keyframes extend {
    from { transform: scaleY(0) }
    to { transform: scaleY(1) }
}
/** 年表ボックス */
.sktimeline .box2 {
    position: relative;
    z-index: 1;
    margin-bottom: 0px;
}
.sktimeline .box2.left2 {
	color: #79949f;
	text-align: center;
	font-size: 32pt;
	width: 240px;
	margin: 0;
	padding: 0;

}
.wareki2{
			font-size: 50%;
	display: block;
	margin-top: 10px;
	padding: 0;
		}
.sktimeline .box2.right2 {
    text-align: left;
	width: calc(100% - 240px);
	margin-left: 240px;
	margin-top: -100px;

}
.year_kugiri{
	border-bottom: solid 1px #c9caca;
	width: 100%;
	margin-bottom: 50px;
	margin-top: 50px;
		}
/**/

div.skanimation_rl {
    opacity: 0;
  transform: translateX(30px);
  transition: 2s ease;
}




.sknaiyou {
    box-sizing: border-box;
	width: calc(100% -50px);
	margin-left: 50px;
	padding-bottom: 30px;
	padding-top: 30px;
	
}
.sknaiyou:nth-child(n+2) {
    box-sizing: border-box;
	border-top: solid 1px #c9caca;
}
dl.sknaiyoulist{
	border-left: solid 3px #0B318F;
	position: relative;
	padding-left: 10px;
		}
dl.sknaiyoulist dt{
			color: #0B318F;
			width: 3em;

		}
dl.sknaiyoulist dd{
	margin-left: 0;

		}

.skphotoarea{
	display: flex;
	justify-content: space-around;
	
		}


/** 年表の点 */
.skircle::after{
    display: block;
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
	top: 0;
	left: -53px;
    margin: auto;
    border: 1px solid #004981;
    border-radius: 6px;
    background: #004981;
}
	

/*歩み*/
.timeline_title{
	font-size:20px;
	font-weight:bold;
	background-color:#999;
	color:#FFF;
	text-align:center;
	padding:10px;
	width:100%;
	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	}
.naiyou {
    box-sizing: border-box;
    max-width: 980px;
    margin: auto;
	border-bottom: solid 1px #727171;
}
dl.naiyoulist{
		}
dl.naiyoulist dt{
	float: left;
	text-align: right;
			color: #0B318F;
			width: 3em;

		}
dl.naiyoulist dd{
margin-left: 3.5em;

		}
/*左用*/
dl.naiyoulistleft{
overflow:hidden;
	float:right;
		}
dl.naiyoulistleft dt{
	float: left;
	text-align: right;
			color: #0B318F;
			width: 3em;
		}
dl.naiyoulistleft dd{
	margin-left: 3.5em;

		}
p.font_blue{
			color: #0B318F;
			text-align: right;
			margin-top: 30px;
		}

/** 年表 */
.timeline {
    margin: 20px 0;
    padding: 30px 0;
    position: relative;
}
/** 年表の縦線 */
.timeline::before {
    display: block;
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    margin: auto;
    content: "";
    width: 0;
    height: 100%;
    border: 3px solid #0B318F;
    border-radius: 3px;
    z-index: 0;
    transform-origin: top;
    animation: extend 4s;
	background-color: #0B318F;
}
@keyframes extend {
    from { transform: scaleY(0) }
    to { transform: scaleY(1) }
}
/** 年表ボックス */
.timeline .box {
    position: relative;
    z-index: 1;
    margin-bottom: 0px;
}
.timeline .box.left {
    text-align: right;
    margin-right: calc(50% + 40px);
}
.timeline .box.right {
    text-align: left;
    margin-left: calc(50% + 40px);
}
/** ヘッダー(日付)部分 */
.timeline .box .yearmonth {
    position: relative;
    display: inline-block;
    margin-bottom: 5px;
    letter-spacing: 2px;
    color: white;
	color: #0B318F;
	font-size: 26px;
}
.wareki{
			font-size: 70%;
		}
/*アニメーション用ボックス*/
div.animation_lr {
    opacity: 0;
  transform: translateX(-30px);
  transition: 2s ease;
}
div.animation_rl {
    opacity: 0;
  transform: translateX(30px);
  transition: 2s ease;
}

/** 年表の点 */
.timeline .box.right .yearmonth::after,
.timeline .box.left .yearmonth::after {
    display: block;
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    top: 0; bottom: 0; right: calc(100% + 26px);
    margin: auto;
    border: 4px solid #F5AC16;
    border-radius: 16px;
    background: #F5AC16;
}
.timeline .box.left .yearmonth::after {
    left: calc(100% + 26px); right: initial;
}
.ayumi_text{
			margin-top: 50px;
			margin-left: auto;
			margin-right: auto;
			text-align: center;
			font-size: 30px;
	line-height: 180%;
		}
/*下矢印*/
.arrow {
  position: relative;
    width: 0;
  height: 0;
  border-right: 10px solid transparent;
  border-top: 20px solid #0B318F;
  border-left: 10px solid transparent;
  margin: 0 auto;
	animation-name: arrow;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}


@keyframes arrow {
  0% {
    transform: translateY(0);
  }
  60% {
    transform: translateY(30px);
  }
  0%, 60%, 100% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
}

/*経営理念*/
.philosophy{
 display: flex;
  justify-content: center;
		}
.philosophy img{
			width: 100%;
			height: auto;

		}
.philosophy span{
			display: block;
			text-align: right;

		}


/*福利厚生*/
.border_title {
        border: 1px solid #ffb102;    	/* 内側の線になる一本線の枠線をひく*/
    	margin: 4px;            	/* 外側の線の場所をつくる */
    	position: relative;        	/* 外側の線の場所を調整する時の基準点になるようにする    */
		display: inline-block;
		padding: 20px;
		font-size: 22pt;
		color: #f5ac16;
    }
     
    .border_title::before {
    	content: '';            	/* 擬似要素に実体を持たせる */
    	width: calc(100% + 6px);    /* 外側の線になる要素の幅を指定する*/
    	height: calc(100% + 6px);   /* 外側の線になる要素の高さを指定する */
    	border: 3px solid #e99214;    	/* 外側の線になる一本線の枠線をひく*/
    	position: absolute;        	/* 外側の線の位置を自由に動かせるようにする */
    	top: -5px;            		/* 外側の線の位置を、内側の線から上に3pxずらす */
    	left: -5px;            		/* 外側の線の位置を、内側の線から左に3pxずらす*/
    }	
	
ul.list_bcircle {
        list-style:  none;
	margin-top: 30px;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
        padding: 0;
	font-size: 18px;

    }
     
ul.list_bcircle li{
	padding-top: 20px;
	padding-right: 20px;
		}
ul.list_bcircle li:before {
        content:  "";     /* 空の要素作成 */
        width:  15px;               /* 幅指定 */
        height:  15px;              /* 高さ指定 */
        display:  inline-block;     /* インラインブロックにする */
        background-color: #3E3A39;  /* 背景色指定 */
        border-radius:  50%;        /* 要素を丸くする */
        position:  relative;        /* 位置調整 */
        top: 0;                  /* 位置調整 */
        margin-right: 5px;          /* 余白指定 */
    }
	
.orange_linearea{
	border-bottom: solid 1px #f5ac16;
	border-top: solid 1px #f5ac16;
	margin-top: 50px;
	margin-bottom: 50px;
	padding-top: 50px;
	padding-bottom: 50px;
		}
.support_textarea{
	width: 60%;
		}
.support_imgarea{
	width: 40%;
		}
.support_imgarea img{
	width: 100%;
		}
.welfare_title{
	background-color: #7d7d7d;
	color: #FFFFFF;
	padding-left: 15px;
	padding-bottom: 10px;
	padding-top: 10px;
	font-size: 18px;
		}
.welfare_day{
	font-size: 70%;
	margin-left: 2em;
		}
.welfare_photearea{
		width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
	background:linear-gradient(180deg,#efefef 0%,#efefef 30%,#FFFFFF 30%, #FFFFFF 31%, #efefef 31%, #efefef 38%, #FFFFFF 38% ,#FFFFFF 43% ,#efefef 43%, #efefef 48%, #FFFFFF 48%, #FFFFFF 50%, #efefef 50%, #efefef 52%, #FFFFFF 52%, #FFFFFF 100%);
		}
.welfare_phote{
	width: 40%;
	margin-left: auto;
	margin-right: auto;
		}
.welfare_phote img{
	width: 100%;
	margin-left: 5px;
	margin-right: 5px;
		}


/*製造ライン*/
.production_line_area{
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
		}
.production_line_maintitle{
	color: #153374;
	font-family: "リュウミン M-KL",Ryumin Medium KL;
		font-size:32px;
	
		}	
.production_line_subtitle{
	color: #FFFFFF;
	background-color: #153374;
	border-left: solid 10px #9F9FA0;
	padding-left: 20px;
	padding-bottom: 10px;
	padding-top: 10px;
	font-size: 20px;
	margin-bottom: 50px;
	margin-top: 70px;
	font-weight:400;
		}
.pl_redtext{
	color: #C4181F;
	font-weight:400;
	font-size: 28px;
		}
		
ol.pl_list {
  list-style: none;
  counter-reset: list-counter; /*list-counterの値が0にリセットされる*/
  padding: 0;
	margin-left: 3em;
	margin-bottom: 50px;
	margin-right: 0;
	margin-top: 0;
}
ol.pl_list li {
  font-size: 16px;
  line-height: 1.5;
  margin: 20px 0;
  padding-left: 30px;
  position: relative;
}
ol.pl_list li:before {
  content: counter(list-counter);/*list-counterの値を挿入*/
  counter-increment: list-counter;/*連番の値が挿入される*/
  border: 1px solid;
  box-sizing: border-box;
  border-radius: 50%;/*円を作る*/
  height: 22px;/*円の高さを指定*/
  width: 22px;/*円の幅を指定*/
  display: flex;/*円と文字が中央になるよう調整*/
  justify-content: center;
  align-items: center;
  position: absolute;/*左端に配置*/
  top: 0;
  left: 0;
  font-size: 85%;/*文字サイズ小さめに調整*/
}
/*——　文字の右にライン　——*/
.pltitle-border-right {
display: flex;
align-items: center;
	font-size: 20px;
	width: 100%;
	font-weight:400;
	margin-bottom: 30px;
}
.pltitle-border-right:after {
border-top: 1px solid #3A3A3A;
content: "";
flex-grow: 1;
}
.pltitle-border-right:after {
margin-left: 1rem;
}
.pl_mbotoom20{
	margin-bottom: 20px;
		}
.pl_orangearea{
	border-radius: 10px;
	background-color: #1469a3;
	color: #FFFFFF;
	text-align: center;
	width: 25%;
	padding: 10px;
	font-size: 18px;
		}
.pl_arrow {
    height: 40px;
    width: calc(75% - 30px);
    background-color: #b9d2e4;
    position:  relative;
	padding-left: 20px;
	line-height: 40px;
	font-size: 90%;
}

.pl_arrow::after {
    content:  '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 0 25px 30px;
    border-color: transparent transparent transparent #b9d2e4;
    position:  absolute;
    top: -11%;
    left: 100%;
}
.pl_imgarea{
	width: 100%;
		}
.pl_imgarea img{
	width: 100%;
	height: auto;
		}
.pl_tyui{
	margin-left: 20px;
		}
		
.pl_flowarea{
	border-top: solid 10px #E3E2E2;
	padding-bottom: 20px;
	padding-top: 20px;
	position: relative;
	margin-bottom: 50px;
		}
.pl_flowtext{
	width: 20%;
	margin-right: 5%;
		}
.pl_flowtextt{
	width: 100%;
	text-align: center;
	padding-bottom: 10px;
	padding-top: 10px;
	background-color: #153374;
	color: #FFFFFF;
	font-size: 20px;
	margin-bottom: 30px;
		}
.pl_flowtextimg{
	width: 100%;
		}
.pl_flowtextimg img{
	width: 100%;
	height: auto;
		}
.pl_flowpfotoarea{
	width: 75%;
		}
.pl_flowpoto{
	width: 48%;
		}
.pl_flowpoto img{
	width: 100%;
	height: auto;
		}

.circle i {
	color:#1469a3;
  position: absolute;
  left: 7%;
  transform: translate(-50%, -50%);
  font-size: 4rem;
  animation: updown 2s infinite ease-in-out;
}

/* アニメーション*/
@keyframes updown {
  0% {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(0, -30px);
  }
  100% {
    transform: translate(0, 0);
  }
}


/*品質への取組み*/
.bg_border {
  width:100%;
	background-image:repeating-linear-gradient(0deg, #86b3e0, #86b3e0 5px, #FFFFFF 5px, #FFFFFF 6px);
	text-align: center;
	padding-bottom: 20px;
	padding-top: 20px;
}
.environment_otitle{
	color: #0d6fae;
  position: relative;
  padding-left: 50px;
	font-size: 22px;
	padding-bottom: 10px;
	margin-top: 30px;
		}
.environment_otitle:before{
  content: "―";
  left: 0;
  position: absolute;
	font-size: 40px;
		}

.environment_naiyo{
	padding-left: 50px;
	padding-right: 50px;
	margin-bottom: 50px;
		}
ol.environment_list{
	margin: 0;
	padding-left: 65px;
	padding-right: 50px;
		}	
ol.environment_list li{
	margin-bottom: 30px;
		}
.quality_box{
	margin-bottom: 30px;
	margin-top: 30px;
		}
.quality_bluebox{
	background-color: #f4f8fc;
	border: dotted 2px #0d6fae;
	padding: 10px;
	border-radius: 10px;
	margin-top: 10px;	
		}
dl.quality_list{
	display: flex;
        flex-wrap: wrap;
	margin-top: 20px;
	margin-bottom: 50px;
	width: 100%;
		}
dt.qlist_k:nth-of-type(odd), dd.qlist_n:nth-of-type(odd){
background: #86b3e0;
	border-bottom: solid 2px #FFFFFF;
}
dt.qlist_k:nth-of-type(even), dd.qlist_n:nth-of-type(even){
background: #e6f0f9;
	border-bottom: solid 2px #FFFFFF;
}
dt.qlist_k{
	width: 7em;
	padding-bottom: 5px;
	padding-left: 20px;
	padding-top: 5px;
	margin: 0;
		}
dd.qlist_n{
	width: calc(100% - 7em);
	padding-bottom: 5px;
	padding-top: 5px;
	margin: 0;
		}

.quality_img{
	width: 45%;
	margin-right: 10%;
	margin-bottom: 20px;
}
.quality_img:nth-of-type(even){
	width: 45%;
	margin-right: 0;
	margin-bottom: 20px;
}
.quality_img img{
	width: 100%;
	height: auto;
}
p.quality_imgtitle{
	background: rgb(112,153,208);
background: linear-gradient(0deg, rgba(112,153,208,1) 0%, rgba(0,64,152,1) 40%, rgba(0,64,152,1) 80%, rgba(112,153,208,1) 100%);
	text-align: center;
	color: #FFFFFF;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
}


/*環境への取り組み*/
.pattern-horizontal-lines{
background-image:repeating-linear-gradient(0deg, #f4f8fc, #f4f8fc 10px, #bdd5ee 10px, #bdd5ee 12px);
	padding-bottom: 30px;
	padding-top: 50px;
		}
.iso_title{
		width: 70%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
		}
.iso_area{
	width: 70%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 100px;
		}
.iso_img{
	width: 40%;
		}
.iso_img img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
		}
.iso_text{
			border-left: solid 5px #86b3e0;
	padding-left: 20px;
		}
dl.iso_day{
	margin: 0;
		}
dl.iso_day dt{
  float: left;
	text-align:justify;
text-align-last:justify;
	width: 100px;
}


dl.iso_day dd{
	margin-left: 100px;
		}
dl.iso_day dd::before{
  content: "："
}

.environment_bluewaku{
	border: solid 2px #86b3e0;
	border-radius: 10px;
	padding: 20px;
	margin-top: 50px;
		}	
.environment_bluetitle2{
    position: relative;
    width: 100%;
    padding: 20px 0;
    color: #0d6fae;
    font-size: 22px;
    text-align: center;
		}
		
.environment_bluetitle2::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 1px;
    margin: 0 auto;
    text-align: center;
    background-image: -webkit-linear-gradient(left, transparent, #86b3e0 25%, #86b3e0 75%, transparent);
    background-image: linear-gradient(to right, transparent, #86b3e0 25%, #86b3e0 75%, transparent);
    background-position: center;
    background-repeat: no-repeat;
}
.environment_haisuitext{
	width: calc(70% - 60px);
	margin-right: 40px;
	margin-left: 20px;
	margin-top: 20px;
		}
.environment_haisuitext p{
	margin-bottom: 10px;
		}
.environment_haisuiimg{
	width: calc(30% - 20px);
	margin-top: 20px;
	margin-right: 20px
		}
.environment_haisuiimg img{
	width: 100%;
	height: auto;
		}

/*事業内容*/
.jigyo_w50{
	width: 50%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
	margin-top: 30px;
		}
	
.jigyo_bggray{
	background-color: #e3e2e2;
	margin-bottom: 50px;
	margin-top: 50px;
	padding-top: 50px;
	padding-bottom: 30px;
		}
.jigyou_linetitle {
    position: relative;
    width: 70%;
    margin: 50px auto;
    padding: 20px 0;
    font-size: 22px;
    text-align: center;
}
.jigyou_linetitle::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 1px;
    margin: 0 auto;
    text-align: center;
    background-image: -webkit-linear-gradient(left, transparent, #b4b4b4 25%, #b4b4b4 75%, transparent);
    background-image: linear-gradient(to right, transparent, #b4b4b4 25%, #b4b4b4 75%, transparent);
    background-position: center;
    background-repeat: no-repeat;
}
.jigyou_imgarea{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	 justify-content: space-around;
		}
.jigyou_img{
	width: 30%;
	text-align: center;
	font-size: 80%;
		}	
.jigyou_img img{
	width: 100%;
	height: auto;
		}

/*私たちが描く未来*/
.future_mainimg{
	width: 100%;
		}
.future_mainimg img{
	width: 100%;
	height: auto;
		}
.future_title{
	color: #002B69;
	text-align: center;
	font-family: "リュウミン M-KL",Ryumin Medium KL;
	font-size:32px;
	margin-bottom: 30px;
	margin-top: 30px;
	line-height: 180%;
		}

.question{
	color: #FFB100;
	border-bottom: solid 1px #FFB100;
  position: relative;
  padding-left: 50px;
	font-size: 20px;
	padding-bottom: 10px;
	margin-top: 30px;
		}
.question:before{
  content: "―";
  left: 0;
  position: absolute;
		}
dl.futurelist{
	width: 100%;
		}	
dl.futurelist dt{
	float: left;
	width: 50px;
	padding-top: 10px;
		}
dl.futurelist dd{
	margin-left: 50px;
	padding-top: 10px;
		}
.f_textarea{
	width: 50%;
		}
.f_photearear{
	padding-top: 30px;
	padding-left: 30px;
	width: 50%;
		}
.f_photearear img{
	width: 100%;
		}
.f_photearear p{
	text-align: center;
	font-size: 80%;
		}
.f_photeareal{
	padding-top: 30px;
	padding-right: 30px;
	width: 50%;
		}
.f_photeareal img{
	width: 100%;
		}
.f_photeareal p{
	font-size: 80%;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
		}

.project_area {
  position: relative;
	width: 100%;
	padding-top: 50px;
	padding-bottom: 50px;
}
.project_area:after {
  content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 400px 400px 0 0;
border-color: #F7F8F8 transparent transparent transparent;
	position: absolute;
  top: 0;
  left: 0;
	z-index: -100;
}
.project_area:before {
  content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 400px 400px;
border-color: transparent transparent #F7F8F8 transparent;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: -100;
}
	
.project_orangetitle{
	background-color: #FFB100;
	width: 80%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 30px;
	padding-top: 30px;
	font-size: 43px;
		}
.project_orangelinetitle{
	width: 80%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 30px;
	padding-top: 30px;
	font-size: 43px;
	border-bottom: solid 2px #FFB100;
	border-top: solid 2px #FFB100;
	line-height: 180%;
		}
.project_areain{
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 20px;
	margin-bottom: 30px;
	margin-top: 50px;
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;
		}
		
ul.list_wrap {
	list-style:  none;
	margin:  0;
	padding: 0;
	
    }
ul.list_wrap li{
	margin-bottom: 10px;
	position: relative;
	 padding-left: 28px;
	
		}
ul.list_wrap li:before {
	content:  "";
	width:  20px;
	height:  20px;
	display:  inline-block;
	background-color: #3A3A3A;
	border-radius:  50%;
	position: absolute;
	left: 0;
	top: 3px;
    }
ol.circle_no{
	list-style: none;
	margin: 0;
	padding: 0;
		}
ol.circle_no li:before{
	content: none;
		}	
.setumei{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
		}


/*SDGs*/
.sdgs_mainarea{
	background-color: #EFEFEF;
	width: 100%;
	padding: 2%;
		}
.sdgs_wbg{
	background-color: #FFFFFF;
	margin-bottom: 50px;
		}
.sdgs_area{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 30px;
		}	
	
.sdgs_linetitle {
  position: relative;
  text-align: center;
	font-size: 20px;
	margin-bottom: 30px;
}
.sdgs_linetitle span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  background-color: #fff;
  text-align: left;
}
.sdgs_linetitle::before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #ccc;
}
.sdgs_gtitle{
	background-color: #727171;
	color: #FFFFFF;
	font-size: 30px;
	padding: 20px;
	border-radius: 34px;
	width: 60%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 50px;
	margin-bottom: 30px;
	text-align: center;
		}
.sdgs_torikumi{
		display: flex;
			}

.sdgs_torikumilogo{
	width: 300px;
	padding-bottom: 30px;
	padding-right: 30px;
	padding-top: 30px;
	margin-bottom: 50px;
	border-right: solid 1px #3A3A3A;
		}
.sdgs_torikumilistarea{
	width: calc(100% - 300px);
}
.sdgs_torikumilogo img{
	width: 100%;
	height: auto;
		}
ul.sdgs_list{
	margin-top: 0;
	margin-left: 1em;
	padding-top: 30px;
	list-style:disc;

}

ul.sdgs_list li{
	margin-left: 2em;


		}
ul.sdgs_list li:first-of-type{
	list-style: none;
	margin-left: 0;
		}
.sdgs_tirikumiimg2{
	width: 49%;
		}
.sdgs_tirikumiimg2 img{
	width: 100%;
	height: auto;
		}
.sdgs_tirikumiimg3{
	width: calc(98% / 3);
	margin-right: 1%;
	margin-top: 1%;
		}
.sdgs_tirikumiimg3:nth-child(3n){
	width: calc(98% / 3);
	margin-right: 0;
	margin-top: 1%;
		}
.sdgs_tirikumiimg3 img{
	width: 100%;
	height: auto;
		}
.sdgs_tirikumiimg4{
	width: 60%;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 20px;
	
		}
.sdgs_tirikumiimg4 img{
	width: 100%;
	height: auto;
		}
.sdgs_tirikumiimg5{
	width: 35%;
	margin-top: 20px;
	margin-bottom: 20px;
	
		}
.sdgs_tirikumiimg5 img{
	width: 100%;
	height: auto;
		}

.sdgs_tirikumiimg6{
		width: 66%;
	margin-right: 1%;
	margin-top: 1%;
	text-align: center;
}
.sdgs_tirikumiimg6 img{
	width: 100%;
	height: auto;
}
.sdgs_tirikumiimg7{
		width: 33%;
	margin-top: 1%;
}
.sdgs_tirikumiimg7 img{
	width: 100%;
	height: auto;
}

/*私たちが作る「電機」高圧*/
.e_maintitlearea{
	background-image: url("images/e_maintitleareaimg.png");
	background-repeat: no-repeat;
	background-position: center; 
	height: 240px;
  display: flex;
  justify-content: center;
  align-items: center;

}

.e-mtitlecenter{
			width: 100%;
			text-align: center;
		}
.e_maintitle{
			font-size: 30px;
			text-align: center;
			border-bottom: solid 2px #1469a3;
			border-top: solid 2px #1469a3;
	padding-bottom: 30px;
	padding-top: 30px;
	margin-bottom: 20px;

	
		}
.title-border{
			margin-bottom: 30px;
		}
.title-border-right {
display: flex;
align-items: center;
	color: #1469a3;
	font-size: 24px;
	width: 100%;
	font-weight: bold;

}
.title-border-right:after {
border-top: 1px solid #1469a3;
content: "";
flex-grow: 1;
}
.title-border-right:after {
margin-left: 1rem;
}
.electric p{
			margin-bottom: 30px;
			
		}
p.tsmall{
			font-size: 11px;
			border-bottom: solid 1px #3A3A3A;
	display: inline-block;
		}
.title_point{
			width: 80px;
			margin-right: 20px;
		}
.title_point img{
			width: 100%;
			height: auto;
		}



.e_subtitle {
position: relative;
	color: #1469a3;
	font-size: 20px;
}
.e_naiyotext{
	margin-bottom: 20px;
}
.e_link{
	color: #ca5519;
}
.electric_imgarea{
			width: 25%;
	margin-left: 5%;
	float: right;
		}
.electric_imgarea img{
			width: 100%;
	height: auto;
		}
.electric_imgarealeft{
			width: 15%;
	margin-right: 5%;
	float: left;
		}
.electric_imgarealeft img{
			width: 100%;
	height: auto;
		}

.e_bgcy{
	display: inline-block;
	background-color: #dde8f4;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
	margin-bottom: 10px;
}
.e_setumei{
	padding-left: 2em;
	margin-bottom: 20px;
}
table.e_table{
	border-collapse:collapse;
	width: 60%;
}
table.e_table td, th{
	padding: 0;
			text-align: center;
	border:1px solid #231815;
}
.e_table_bgc{
	background-color: #dde8f4;
}
.e_table_bgblue{
	background-color: #2e6fab;
	color: #FFFFFF;
}

/*採用情報*/
/*全体の背景*/
.recruit_bg{
	background-color: #f7f8f8;
}

.rc_title{
	text-align: center;
	border-bottom: solid 2px #1469a3;
	font-size: 22px;
	padding-bottom: 30px;
	margin-bottom: 50px;
		}

.recruit_mainbg {
	position: relative;
	padding: 4px 20px 4px 40px;
	background: #FFFFFF;
	padding-bottom: 80px;
	padding-top: 80px;
	padding-left: 200px;
	padding-right: 200px;
	margin-bottom: 50px;
	z-index:1;

}
.recruit_mainbg:before {
	position: absolute;
	content: '';
	left: 0px;
	top: 0px;
	width: 0;
	height: 0;
	border: none;
	border-left: solid 180px #f7f8f8;/*bodyのカラーと同じ色に*/
	border-bottom: solid 80px transparent;
	z-index: 2;
}
.recruit_mainbg:after {
		position: absolute;
	content: '';
	right: 0px;
	bottom: 0px;
	width: 0;
	height: 0;
	border: none;
	border-left: solid 180px transparent;/*bodyのカラーと同じ色に*/
	border-bottom: solid 80px #f7f8f8;
	z-index: 2;

}		
		
		
.recruit_infowaku{
	background-color: #FFFFFF;
	text-align: center;
	padding-bottom: 50px;
	padding-top: 50px;
	padding-left: 200px;
	padding-right: 200px;
	margin-bottom: 100px;
		}	
.square{
	position: relative;
	width: 20%;
	border: solid 2px #1469a3;
	margin-right: 10%;
	margin-top: 50px;
}
.square:last-child{
	margin-right: 0;
}
.square:before {
  content: "";
  display: block;
  padding-top: 100%;
}
.square p{
	width: 100%;
	 position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
		}
.re_orengtitle_left{
	position: relative;
	background-color: #1469a3;
	color: #FFFFFF;
	padding-bottom: 10px;
	padding-top: 10px;
	padding-left: 30px;
	width: 75%;
		}
 
.re_orengtitle_left::after {
position: absolute;
content: '';
top: 50%;
left: 15px;
transform: translateY(-50%);
width: 5px;
height: 25px;
background-color: #FFFFFF;
}
.re_orengtitle_right{
	background-color: #59839b;
	color: #FFFFFF;
	text-align: center;
	width: 25%;
		display: flex;
	align-items: center;
	justify-content: center;
		}
dl.re_orangelist{
	  display: flex;
  flex-wrap: wrap;
  width: 100%;
	padding: 0;
	margin: 30px;
		}
dl.re_orangelist dt {
  width: 20%;
	color: #1469a3;
	font-weight: bold;
		margin: 0;
	padding: 0;
}
dl.re_orangelist dd {
  width: 80%;
		margin: 0;
	padding: 0;
}

.re_saiyohyo dl {
display: flex;
flex-flow: row wrap;
width: 100%;
	margin: 0;
	padding: 0;
}
.re_saiyohyo dt {
flex-basis: 15%;
padding: 20px;
	margin: 0;
background-color: #e3e2e2;
border-top: 1px solid #7f8080;
	text-align: center;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
	
}
.re_saiyohyo dt:last-of-type{
	border-bottom: 1px solid #7f8080;
		}
.re_saiyohyo dd {
flex-basis: 85%;
padding: 20px;
	margin: 0;
background-color: #fff;
border-top: 1px solid #7f8080;
}
.re_saiyohyo dd:last-of-type {
border-bottom: 1px solid #7f8080;
}
ul.nomark{
	list-style: none;
		}
.re_activityeng{
	color: #1469a3;
	font-family: "リュウミン M-KL",Ryumin Medium KL;
	font-size: 40px;
	margin-bottom: 10px;
		}
.re_activitymaintitle{
	color: #FFFFFF;
	background-color: #1469a3;
	font-weight: bold;
	text-align: center;
	padding-bottom: 10px;
	padding-top: 10px;
	font-size: 22px;
	margin-bottom: 20px;
		}
		
ul.re_imglist{
	list-style: none;
	margin-bottom: 50px;
	margin-top: 50px;
	margin-left: 0;
	margin-right: 0;
	padding: 0;
		}		
ul.re_imglist li{
	width: calc(94% / 4);
	margin-right: 2%;
	margin-bottom: 2%;
}
ul.re_imglist li:nth-child(4n){
	width: calc(94% / 4);
	margin-right: 0%;
	margin-bottom: 2%;
}
ul.re_imglist li img{
	width: 100%;
	height: auto;
	color: #1469a3;
		}
ul.re_imglist p{
	font-size: 80%;

		}

.meister_event_title {
  position: relative;
  text-align: center;
}
.meister_event_title span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  background-color: #fff;
  text-align: left;
	color: #1469a3;
}
.meister_event_title::before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #1469a3;
}
.ol-align-center{
    display: flex;
    align-items: center;
    flex-direction: column;
  }
ol.sloganlist{
	  list-style-type: none;
  counter-reset: number 0;
		}


ol.sloganlist li::before {
  counter-increment: number 1;
  content: counter(number) ;
	margin-right: 10px;
}

/*youtube*/
.youtube_area{
	width: 60%;
	margin-left: auto;
	margin-right: auto;
}
.youtube-ratio iframe {
  width: 100%;
	height: auto;
  aspect-ratio: 16 / 9;
}

/**/
.panel {
	max-width:960px;
	text-align:center;
	position:relative;
	margin:auto;
		}

.orange button.orange4waku {
	color:#1469a3;
	background:transparent;
	border-width:2px;
	border-style: solid;
	border-color:#1469a3;
	position:relative;
	margin:1em;
	display:inline-block;
	padding:0.75em 2em;
	transition:all 0.3s ease-in-out;
	text-align:center;
	font-weight:bold;
	font-size: 24px;
		}
.orange button.orange4waku:before, .orange button.orange4waku:after  {
		content:'';
	display:block;
	position:absolute;
	box-sizing:border-box;
	border-style:solid;
	width:1em;
	height:1em;
	transition:all 0.3s ease-in-out;
	border-color:#1469a3;
		}
		
.orange button.orange4waku:before {
	top:-6px;
	left:-6px;
	border-width:2px 0 0 2px;
	z-index:5;
	border-color:#1469a3;
		}
.orange button.orange4waku:after {
	bottom:-6px;
	right:-6px;
	border-width:0 2px 2px 0;
	border-color:#1469a3;
		}

.orange button.orange4waku:hover {
	color:#fff;
	background-color:#1469a3;
	border-color:#1469a3;
		}
.orange button.orange4waku:hover:before, button.orange4waku:hover:after {
	width:calc(100% + 12px);
  height:calc(100% + 12px);
	border-color:#fff;
		}
.orange .panel {
	max-width:960px;
	text-align:center;
	position:relative;
	margin:auto;
		}



.stripe_box {
    background: repeating-linear-gradient(-45deg, #eb222f, #eb222f 5px, white 5px, white 10px);
    padding: 5px;
	margin-bottom: 50px;
}
.stripe_box_inner {
    background-color: white;
    padding: 20px;
}	
/*ここから旧ボタン*/
button.for_entry{
	margin-top: 30px;
	display:block;
		width: 50%;
	margin-left: auto;
	margin-right: auto;
  background:#eb222f;
  color:#fff;
  border:none;
  position:relative;
  height:60px;
  font-size:1.6em;
  padding:0 2em;
  cursor:pointer;
  transition:800ms ease all;
  outline:none;
}
button.for_entry:hover{
  background:#fff;
  color:#eb222f;
}
button.for_entry:before,button.for_entry:after{
  content:'';
  position:absolute;
  top:0;
  right:0;
  height:2px;
  width:0;
  background: #eb222f;
  transition:400ms ease all;
}
button.for_entry:after{
  right:inherit;
  top:inherit;
  left:0;
  bottom:0;
}
button.for_entry:hover:before,button.for_entry:hover:after{
  width:100%;
  transition:800ms ease all;
}
/*ここまで*/

.recruit_subtitle{
	text-align: center;
	color: #1469a3;
			font-family: "リュウミン M-KL",Ryumin Medium KL;
		font-size:28px;
	margin-top: 100px;
	margin-bottom: 50px;
	line-height: 200%;
		}		
.mynavi_logo{
	width: 300px;
	margin-left: 30px;
		}
.mynavi_logo img{
	width: 100%;
	height: auto;
		}


/*プライバシーポリシー*/
.privacy_policytitle{
	background-color: #00467b;
	color: #FFFFFF;
	padding-bottom: 10px;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 10px;
	margin-bottom: 20px;
	margin-top: 20px;
		}
ol.privacy{
	margin-left: 0;
	padding-left: 0;
}
ol.privacy li {
	list-style-type: none;
	counter-increment: cnt;
}
 
ol.privacy li::before {
	content: "(" counter(cnt) ") ";
}


ol.privacy_maru  {
  position: relative;
  margin: 0;
  padding: 0;

}
ol.privacy_maru li  {
  list-style: none;
  list-style-position: outside;
  margin: 0;
  padding-left: 1.25em;
}
ol.privacy_maru li span {
  position: absolute;
  left: 0;
  margin: 0;
}
.privacy_adress{
			padding-left: 2em;
		}


.privacy_seitei {
  max-width: 1800px;
	text-align: right;
  margin: 0 auto;
  padding: 10px 30px;
}

.privacy_seitei p {
  display: inline-block;
  text-align: left;
}

/*商品ラインナップ*/

/*新商品*/
.f-con{
	display: flex;
	
		}
.newproduct_title{
	width: 30%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 1%;
	border-right: solid 5px #1469a3;
	}
.newproduct_newpro{
	border-bottom: solid 2px #1469a3;
	font-size: 32px;
		}
span.newproduct_eng{
	color: #5E5E5E;
	font-size: 90%;
	display: inline-block;
	margin-left: 20px;
		}
.newproduct_looparea{
	width: 69%;
		}
h3.newproduct_name{
		}
h3.newproduct_name::before{
	  content: '\f101';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
	margin-right: 20px;
		}
span.newproduct_hinban{
	display: inline-block;
	margin-left: 20px;
	font-size: 80%;
		}


ul.list_triangle {
		width:fit-content;
    padding: 0px;
		margin-left: auto;
		margin-right: auto;
		margin-top: 50px;
		margin-bottom: 50px;
    list-style: none;
}

.list_triangle > li {
    position: relative;
    padding: 0px 0px 0px 1em;
	color: #1469a3;
	
}
.list_triangle > li::before {
    position: absolute;
    top: 50%;
    left: 0px;
    transform: translateY(-50%);
    width: 0px;
    height: 0px;
    border: 0.3em solid transparent;
    border-left: 0.4em solid #1469a3;
    content: "";
}
		
	ul.list_triangleorange {
		width:fit-content;
    padding: 0px;
		margin-top: 50px;
		margin-bottom: 50px;
    list-style: none;
}

.list_triangleorange > li {
    position: relative;
    padding: 0px 0px 0px 1em;
	color: #ca5519;
	
}
.list_triangleorange > li::before {
    position: absolute;
    top: 50%;
    left: 0px;
    transform: translateY(-50%);
    width: 0px;
    height: 0px;
    border: 0.3em solid transparent;
    border-left: 0.4em solid #ca5519;
    content: "";
}
ul.list_disc{
	list-style-type: disc;
		}
.lineup_area{
	padding-bottom: 20px;
	padding-top: 20px;
		}
.lineup_lefttext{
	float: left;
	width: 68%;
		}
.lineup_lefttext2{
	float: left;
	width: 36%;
		}
.lineup_righttext{
	float: right;
	width: 68%;
		}
.lineup_leftimg{
	float: left;
	width: 30%;
	margin-right: 2%;
	text-align: center;
		}
.lineup_leftimg img{
	width: 100%;
	height: auto;

		}
.lineup_rightimg{
	float: right;
	width: 30%;
	margin-left: 2%;
	text-align: center;
		}
.lineup_rightimg img{
	width: 100%;
	height: auto;
		}
.lineup_centerimg{
	width: 100%;
	margin-top: 20px;
		}
.lineup_centerimg img{
	width: 100%;
	height: auto;
		}
.right_arrow {
    height: 10px;
    width: 20px;
    background-color: #0d6fae;
    position:  relative;
}

.right_arrow::after {
    content:  '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 10px 15px;
    border-color: transparent transparent transparent #0d6fae;
    position:  absolute;
    top: -50%;
    left: 100%;
}
.lineup_ecore{
	width: 49%;
		}
.lineup_ecireimg{
	width: 44%;
	text-align: center;
		}
.lineup_ecireimg img{
	width: 100%;
	height: auto;
		}
.lineup_ecireimg2{
	width: 49%;
		}
.lineup_ecireimg2 img{
	width: 100%;
	height: auto;
		}
.lineup_ecireimg3{
	width: 32%;
		}
.lineup_ecireimg3 img{
	width: 100%;
	height: auto;
		}
.lineup_amuarea{
	padding-left: 30px;
	padding-right: 30px;
}
.lineup_amuimg{
	width: 40%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	margin-top: 20px;
		}
.lineup_amuimg img{
	width: 100%;
	height: auto;
		}
.lineup_amuimg4{
	width: calc(97% / 4);
	margin-right: 1%;
	margin-bottom: 10px;
		}
.lineup_amuimg4:nth-of-type(4n){
	width: calc(97% / 4);
	margin-right: 0;
	margin-bottom: 10px;
}
.lineup_amuimg4 img{
	width: 100%;
	height: auto;
		}

/*カタログ*/
.catalog_area{
	width: calc(85% / 4);
	margin-right: 5%;
	margin-bottom: 50px;
		}
.catalog_area:nth-child(4n){
	width: calc(85% / 4);
	margin-right: 0;
	margin-bottom: 50px;
		}
.catalog_area p{
	margin-top: 10px;
		}
.catalog_photoarea{
	width: 50%;
	margin-left: auto;
	margin-right: auto;
	border: solid 1px #cccccc;
		}
.catalog_photoarea img{
	width: 100%;
	height: auto;
		}

/*808mera*/
.y808mera_gtitlearea{
	border-bottom: solid 1px #026636;
	}
.y808mera_gtitle{
	color: #026636;
		}
.y808mera_bodertitle{
	width: 80%;
	border-bottom: solid 4px #000000;
	border-top: solid 4px #000000;
	text-align: center;
	margin-bottom: 50px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 50px;
	padding-top: 50px;
	}
.y808mera_leftarea{
	width: 48%;
	margin-right: 2%;
	}
.y808mera_rightarea{
	width: 48%;
	margin-left: 2%;
	}
.y808mara_bottgtitie{
	color: #026636;
	text-align: center;
	border-bottom: solid 1px #026636;
	margin-bottom: 10px;
	}
.y808mera_photo01{
	width: 100%;
	}
.y808mera_photo01 img{
	width: 100%;
	height: auto
	}
.y808mera_photo02{
	width: 49%;
	}
.y808mera_photo02 img{
	width: 100%;
	}
.y808mera_photo03{
	width: clac(98% / 3);
	}
.y808mera_photo03 img{
	width: 100%;
	height: auto;
	}
.y808mera_yarea{
	background-color: #ffe67a;
	padding: 20px;
	border-radius: 10px;
	}
.y808mera_greentitle{
		background-color: #026636;
		color: #FFFFFF;
		text-align: center;
	font-size:clamp( 15px, 3vw, 18px) ;
	padding: 10px;
	}
dl.y808mera_tokutyo{
	display: flex;
	flex-wrap: wrap;
  width: 100%;
	align-items: center;
	}
dl.y808mera_tokutyo dt{
	border: solid 1px #026636;
	color: #026636;
	background-color: #FFFFFF;
	width: 160px;
	height: 60px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: 10px;
	font-size:clamp( 15px, 3vw, 18px) ;
	}
dl.y808mera_tokutyo dd{
	width: calc(100% - 172px);
	margin-left: 10px;
	
	}
.plantimgrea{
	width: 40px;
	margin-left: 10px;
	margin-right: 10px;
		}
.plantimgrea img{
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
.y808mera_w48area{
	width: 48%;
	}
.y808mera_w60area{
	width: 60%;
	margin-left: auto;
	margin-right: auto;
	}
	
.y808mera_voicewaku{
	border: solid 1px #da9c30;
	background-color: #FFFFFF;
	padding: 20px;
	border-radius: 10px;
	}
.y808mera_voiceimgarea{
	width: 30%;
	}
.y808mera_voicetextarea{
	width: 68%;
	margin-left: 2%;
	}
.y808mera_voiceimgarea img{
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
.voicearrow_box{
    position:relative;
	display: inline-block;
    background:#EB6100;
	padding-left: 10px;
	padding-right: 10px;
    color:#FFFFFF;
    border-radius:10px;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
}
.voicearrow_box:after{
    border: solid transparent;
    content:'';
    height:0;
    width:0;
    pointer-events:none;
    position:absolute;
    border-color: rgba(235, 97, 0, 0);
    border-top-width:8px;
    border-bottom-width:8px;
    border-left-width:10px;
    border-right-width:10px;
    margin-top: -10px;
    border-right-color:#EB6100;
    right:100%;
    top:50%;
}
.y808mera_flowertitle{
	background:#ddd url(images/808mera_flowerbg.jpg) no-repeat center center;
background-size:cover;
	}
.y808mera_flowerbg{
	background:#ffffff url(images/808mera_flowerbg2.jpg) no-repeat center center;
background-size:cover;
	}
.y808mera_purpletitle{
	background: rgb(192,0,129);
background: linear-gradient(90deg, rgba(192,0,129,0) 0%, rgba(192,0,129,1) 8%, rgba(192,0,129,1) 92%, rgba(192,0,129,0) 100%);
	}
.y808mera_purpleimgarea{
	width: 100px;
	margin: 20px;
	}
.y808mera_purpleimgarea img{
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
.y808mera_purpletextarea{
	margin: 20px;
	text-align: center;
	color: #FFFFFF;
	}
.y808mera_purplewaku{
	border: solid 2px #a40b5d;
	background-color: #FFFFFF;
	color: #a40b5d;
	display: inline-block;
	padding: 20px;
	text-align: center;
	 border-radius:30px;
	}
.y808mera_flowerimg3{
	width: calc(98% / 3);
	}
.y808mera_flowerimg3 img{
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
.y808mera_flowersetumei3{
	display: flex;
	align-items: center;
	width: calc((100% - 2px) / 3);
	border-right: solid 1px #231815;
	}
.y808mera_flowersetumei3:nth-child(3n){
	display: flex;
	align-items: center;
	width: calc((100% - 2px) / 3);
	border: none;
	}
.y808mera_setumeiimgarea{
		width: 10%;
	margin: 10px 50px 10px 20px;
	}
.y808mera_setumeiimgarea img{
	width: 100%;
	height: auto;
	vertical-align: middle;
	}
.y808mera_textred{
	color: #e5004f;
	}
.y808mera_textblue{
	color: #005ead;
	}
.y808mera_textorange{
	color: #f39500;
	}
.y808mera_textyellow{
	color: #fff799;
	}
.y808mera_pbgtitle{
	background-color: #a40b5d;
	color: #FFFFFF;
	text-align: center;
	width: 80%;
		margin-left: auto;
	margin-right: auto;
	padding: 10px;
	border-radius:30px;
	}
.y808mera_uline{
	border-bottom: solid 1px #231815;
	width: 60%;
	margin-left: auto;
	margin-right: auto;
	padding: 10px 10px 10px 50px;
	}
.y808mera_bwaku{
	border: solid 1px #231815;
	background-color: #FFFFFF;
	margin-top: 20px;
	padding: 20px;
	}
.y808mera_wakugreen{
	border: solid 1px #026636;
	background-color: #ffffff;
	padding-bottom: 30px;
	padding-top: 30px;
		
	}
.y808mera_violetbg{
	background-color: #f3ebf4;
	}

/****************************************

カスタム投稿　共通スタイル

 *****************************************/
/*検索*/
.serchfor{
	border-bottom: solid 1px #cccccc;
	padding-bottom: 30px;
	margin-bottom: 50px;
}
.serchformarea{
	display: flex;
	flex-diretion: row;
	justify-content: space-around;
		}
.serch_koumoku{
	border: solid 1px #CCCCCC;
	width: 22%;
	margin: 0;
	padding: 0;
		}	
.serch_title{
	background-color: #004097;
	color: #FFFFFF;
	padding-bottom: 10px;
	padding-top: 10px;
	text-align: center;
		}
.serch_mado{
	margin: 0;
	padding: 20px;
	line-height: 0;
		}
.postform{
	display: inline-block;
	background-color: #FFFFFF;
	width: 100%;
	margin: 0;
	padding: 10px;
		}
.sbtn,
a.sbtn,
button.sbtn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #ffffff;
  border-radius: 0.5rem;
	margin-top: 50px;
}
.btn-blue,
a.btn-blue {
  color: #fff;
  background-color: #686868;
}
.btn-blue:hover,
a.btn-blue:hover {
  color: #fff;
  background: #004097;
}	

.fa-position-left {
  position: absolute;
  top: calc(50% - .5em);
  left: 1rem;
}
/*タクソノミーのアーカイブ*/
dl.taxonomylist{
	  display: flex;
  flex-wrap: wrap;
	align-items: center;
}
dl.taxonomylist dt{
	width: 12%;
	margin-bottom: 20px;
	color: #ffffff;
}
dl.taxonomylist dd{
	width: 80%;
		margin-bottom: 10px;
	
}
span.results{
	background-color: #4775b4;
	padding: 5px;
}
span.lineup{
	background-color: #47b4b3;
	padding: 5px;
}


/*実績・ラインナップ用*/
.cleft_block{
	float: left;
	width: 78%;
	margin-right: 2%;
}
.cright_block{
	float: right;
	width: 20%;
	
	
}



/*ページ送り*/ 
.pagenavi{
	margin-top:20px;
	margin-bottom:50px;
	text-align:right;
	}
.nav-below{
	text-align:right;
	margin-right: 20px;
	padding-bottom:50px;
	}
.nav-below a{
	text-decoration: none;
	}
.nav-front{
	text-align:right;
	margin-right: 20px;
	padding-bottom:20px;
	}

/*FontAwesomeのアイコンサイズ*/
.fa-angle-double-right:before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: '\f101';
		}
.fa-angle-double-righta:after{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: '\f101';
	margin-left: 10px;
		}

/*商品ラインナップ　アーカイブ*/
.tbl-lineup{
	width: 100%;
	border-collapse: collapse ;
		}
th.w10{
	width: 10%;
}
th.w15{
	width: 15%;
}
th.w20{
	width: 20%;
}
th.w30{
	width: 30%;
}

.tbl-lineup th ,td{
	border: solid 1px #ccc;
	padding-bottom: 20px;
	padding-top: 20px;
	padding-left: 10px;
	padding-right: 10px;
		}
tr.thead{
	background-color: #dde8f4;
		}
		
.tbl_photo{
	width: 100px;
	margin-left: auto;
	margin-right: auto;
		}
.tbl_photo img{
	width: 100px;
	height: 100px;
	object-fit: contain;
		}






/****************************************

製品　スタイル

****************************************/

.termlist{
	margin-left: 20px;

}
.pd_catlist{width: calc(94% / 3);
	margin-bottom: 30px;
	margin-right: 3%;
}
.pd_catlist:nth-of-type(3n){width: calc(94% / 3);
	margin-bottom: 30px;
	margin-right: 0;
}

/*実績　４列*/
.pd_catlist4{width: calc(91% / 4);
	margin-bottom: 30px;
	margin-right: 3%;
}
.pd_catlist4:nth-of-type(4n){width: calc(91% / 4);
	margin-bottom: 30px;
	margin-right: 0;
}

.pd_picarea{
	width: 40%;
	margin-bottom: 10px;
}
.pd_picarea img{
	width: 100%;
	height: auto;
}
.pd_catesetumei{
	width: 55%;
	padding-left: 5%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.pd_catesetumei h2{
	border-bottom: solid 1px #3E3A39;
	font-size: 14px;
	width: 100%;
	text-align: center;
	margin: 0;
}
.pd_catesetumei p{
	font-size: 80%;
}

.pd_imgphotoarea{
	width: 40%;
	margin-right: 10%;
}
.pd_imgphotoarea img{
	width: 100%;
	height: auto;
}
.pd_setumeiarea{
	width: 50%;
}
.pd_shiyoulist{
	margin-bottom: 20px;
}
.pd_shiyoulist img{
	vertical-align: middle;
}
span.koushin{
	padding-left: 10px;
	font-size: 80%;
}

.pd_testlistarea{
	width:  calc(90% / 6);
	height: auto;
	margin-top: 30px;
	margin-right: 2%;
	
}
.pd_testlistarea:nth-of-type(6n){
	width:  calc(90% / 6);
	height: auto;
	margin-top: 30px;
	margin-right: 0;
}

.pd_testlistarea p{
	font-size: 80%;
}
.trimming_area{
	  position: relative;
  width: 100%;
  padding-top: 75%;
  margin: 0 auto;
}
.trimming_area img{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  object-fit: cover;

}
/****************************************

納入実績　スタイル

****************************************/
.tbl-results{
	width: 100%;
	border-collapse: collapse ;
		}
.tbl-results th ,td{
	border-bottom: solid 1px #cccccc;
	padding-bottom: 20px;
	padding-top: 20px;
		}
.archive_resultsimg{
	width: calc((100% - 6px)/4);
}
.archive_resultsimg img{
	width: 100%;
	height: auto;
}

.results_mainimgarea{
	width: 60%;
		}
.results_mainimgarea img{
			width: 100%;
			height: auto;
		}
.results_maingaiyo{
	width: 35%;
	margin-left: 5%;
	}
.results-ico div{
  display: flex;
  justify-content:flex-start;
  border-bottom: 1px dashed #c7c7c7;
}
.results-ico div::before{
  content: "■";
}
.results-ico dt {
  flex-basis: 100px;
  font-weight: 900;
}
.results-ico dd {
  margin-left: 0;
  flex-basis: calc(100% - 100px);
}
.results-ico div::before,
.results-ico dt,
.results-ico dd{
  padding: 3px 4px;
}




span.results_tplace{
	margin-left: 20px;
	font-size: 90%;
		}
/*納入実績用スライド*/
.swiper_area{
	width: 80%;
}
.swiper{
	height: 2200px;
		}
/* スライダーの高さ指定*/
.swiper-wrapper {
  width: 100%;
}
.swiper-slide{
	  width: 100%;
	  aspect-ratio: 4 / 3;
		position: relative;
	overflow: hidden;

}

.slider-caption {
  padding: 50px 0px;
  margin: 0;
  line-height: 1.5em;
  color: #ffffff;
}


/*納入実績詳細ページ用スライド*/
.swiper-container {
  width: 100%;
	overflow: hidden;

}
.swiper-container img{
width: 100%;
	height: auto;
	}
.swiper-slide img{
		position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: auto;
	height: 100%;
	
}


.thumb-list {
  width: 100%;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  }

li.thumb-item {
  list-style: none;
  width: calc(95% / 6);
	margin-right: 1%;
	margin-bottom: 1%;
	margin-top: 1%;
	aspect-ratio: 4 / 3;
			position: relative;
	overflow: hidden;
	background-color: #EFEFEF;
}
li.thumb-item:nth-child(6n){
  list-style: none;
  width: calc(95% / 6);
	margin-right: 0;
	margin-bottom: 1%;
	margin-top: 1%;
	aspect-ratio: 4 / 3;
			position: relative;
	overflow: hidden;
	background-color: #EFEFEF;
}

li.thumb-item img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: auto;
	height: 100%;
	}

/*エコリメイク*/
.ecore_area{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
		}
.ecore_beforeafter{
	background-color: #f2f5f9;
	text-align: center;
	border-radius: 10px;
	padding: 20px;
	display: inline-block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
	font-size:clamp( 18px, 3vw, 22px) ;
	
		}
.ecore_text{
	background-color: #f2f5f9;
	border: solid 1px #022b6a;
	color: #022b6a;
	text-align: center;
		padding: 20px;
	display: inline-block;
		margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	font-size:clamp( 16px, 3vw, 18px) ;
		}	
	

/****************************************

トピックス　スタイル

****************************************/
/*アーカイブ*/
.a_topicsre{
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-start;
	margin-bottom: 50px;
}
.a_topicscon{
	width: calc(100% - 200px);
	margin-left: 20px;
}
/****************************************

お問合せ mw wp form

 *****************************************/
table.form-table {
  border-collapse: collapse;
  border-spacing: 0;
  width:100%;
}



input[type="submit"],
input[type="text"],
input[type="email"],
textarea{
    padding: 0.5em;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
    font-size: 15px;
    border: 1px solid #ccc;
	width: 100%;
	-webkit-appearance: none;
}
input[type="text"][size="20"] {
    width: 100px;
}
input[type="text"][size="10"] {
    width: 50px;
}

select{
    padding: 0.5em;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
    font-size: 15px;
    border: 1px solid #ccc;
}

#zip,#zip1,#zip2{
	    padding: 0.5em;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
    font-size: 15px;
    border: 1px solid #ccc;
	}

input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus {
  background: #e9f5fb;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

textarea[name="content"] {
  display: inline-block;
  width: 100%;
  height: 200px;
}

input::placeholder,
textarea::placeholder {
  color: #ccc;
}

::-webkit-input-placeholder {
  color: #ccc;
  opacity: 1;
}

::-moz-placeholder {
  color: #ccc;
  opacity: 1;
}

:-ms-input-placeholder {
  color: #ccc;
  opacity: 1;
}
.form-table tr{
	border-bottom: none;
	border-top: none;

}
.form-table tr.boder {
	border-top: solid 1px #bcc2d8;

}
.form-table tr.boder:last-child {
	border-top: solid 1px #bcc2d8;
	border-bottom: solid 1px #bcc2d8;

}

.form-table th,
.form-table td {
  padding: 20px;
}

.form-table th {
  background: #e8ebf2;
  padding-left: 50px;
  text-align: left;
  width: 30%;
}

/*――「送信ボタン」デザイン――*/
 
.submit-btn input {
background-color:#8f9abe;
border:0;
color:#ffffff;
font-size:1.3em;
font-weight:bolder;
margin:0 auto;
padding: 10px 35px;
border-radius: 3px;
cursor: pointer;
text-align:center;
}
 
.submit-btn {
text-align:center;
margin-top:20px;
　cursor: pointer;
width:50%;
margin-left:auto;
margin-right:auto;
}
 
.submit-btn input:hover {
	background: #20367d;
	color: #FFFFFF;
　cursor: pointer;
}

/*「必須」文字デザイン*/
.required{
font-size:.8em;
padding: 5px;
color: #E50012;
margin-left:10px;
margin-right: 5px;
}

/*確認画面時に非表示*/
.mw_wp_form_confirm .input-show {
  display: none;
}
.mw_wp_form_complete .input-show {
  display: none;
}

/*reCAPTCHA*/
.recaptcha_setumei{
	font-size: 80%;
	text-align: right;
}
.grecaptcha-badge { visibility: hidden; }


/* =Tablet (Landscape　横)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 1199px) {
*:focus {
outline: none;
}
.wrapper{
	width:100%;
	overflow:hidden;
	padding: 0;
	margin: 0;
	}
	#sp-wrap{
	width:100%;
	overflow: hidden;
	padding-left:20px;
	padding-right:20px;
}
	
.site-header{
    position:fixed;
    top:0;
    width:100%;
    height:60px;
    z-index:10;
}
	
.contentarea{
	margin-top:60px;
	margin-bottom:50px;
}


	
/*ロゴエリア*/
.logo_area{
	float:left;
	width:220px;
	padding:0;
	margin: 0;
}
	
	
.instagram_logoarea{
	display: none;
		}
	
.instagram_splogoarea{
	display: block;
	width: 30px;
	position: absolute;
	right: 60px;
	top: 15px;
	}
.instagram_splogoarea img{
	width: 100%;
	height: auto;
	}	

/*メニューエリア*/



.nav{
	width:100%;

	}
.nav > ul > li{
margin-left:10px;
	}
	

/*FontAwesomeのアイコンサイズ*/
.fa-building:before{
	font-size: 3em;
		}
.fa-camera:before{
	font-size: 3em;
}
.fa-heart:before{
	font-size: 3em;
}
.fa-users:before{
	font-size: 3em;
}
.fa-child:before{
	font-size: 3em;
}
	
.parallax {
  width: 100%;
  height: 300px;
}

	
	/*製造ライン*/
.production_line_area{
	width: 100%;
		}
/*採用情報*/
	button.for_entry{
		width: 80%;
		padding: 0;
}
/*検索*/

.serch_koumoku{
	width: 23%;
		}
	
/*実績・ラインナップ用*/
.cleft_block{
	float: left;
	width: 68%;
	margin-right: 2%;
}
.cright_block{
	float: right;
	width: 30%;
	
	
}
	
/*納入実績用スライド*/
.swiper_area{
	width: 100%;
}
.swiper{
	height: 1800px;
		}
	
/*商品ラインナップ*/
.lineup_lefttext2{
	float: none;
	width: 100%;
		}

.newproduct_newpro{
	font-size: 22px;
		}


	
}


/* =Tablet (Portraint　縦)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 937px) {


}


/* =SmartPhone (Landscape　横)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
	html,body {
	background-color: #Fff;
	margin: 0px;
	padding: 0px;
		width:100%;
	-webkit-text-size-adjust: 100%;
}
	
/*スマホの時に改行*/
.sma{
	display: block;
}
	
.contentarea{
	margin-top:0;
	padding-top: 0;
}

.logo_area{
	display:none;
}

	
.site-header{
		position:inherit;
    top:0;
    width:100%;
	height:50px;
    z-index:1000;
	min-width:inherit;
	

}


/*背景動画*/
#moviearea{
	width:100%;
    overflow: hidden;
	height: auto;

	}

.main-movie{
	display:none;

	}
.sp_mainbg{
	display:block;
    width:100%;
	margin: auto;
}
#video01{
	width: 100%;
	height:auto;
	}	
	
/*TVCMへ*/
.sptvcm{
	display:block;
	margin-bottom: 20px;
	text-align: center;
	font-size: 90%;
	border-bottom: solid 1px #3A3A3A;
}
.spnewproduct{
	display:block;
	margin-bottom: 20px;
	text-align: center;
	font-size: 90%;
	border-bottom: solid 1px #3A3A3A;
}
.sprecruitmovie{
	display:block;
	margin-bottom: 20px;
	text-align: center;
	font-size: 90%;
	border-bottom: solid 1px #3A3A3A;
}
.sprecruitsite{
	display:block;
	margin-bottom: 20px;
	text-align: center;
	font-size: 90%;
	border-bottom: solid 1px #3A3A3A;
}
		
	
/****************************************

top　セクションエリア

 *****************************************/

/*会社案内*/
.section-about{
	margin-top: 30px;
	width: calc(96% /3);
	margin-right: 0;
	margin-left: 1%;
	text-align: center;
}
.section-about:nth-of-type(3n){
	margin-top: 30px;
	width: calc(96% /3);
	margin-right: 1%;
	margin-left: 1%;
}
.section-about:nth-of-type(5n){
	margin-top: 30px;
	width: calc(96% /3);
	margin-right: 1%;
	margin-left: 1%;
}

.photo-area{
	width: calc((100% - 2px)/ 3);
}
.photo-area:nth-of-type(5n){
	width: calc((100% - 2px)/ 3);
	margin-right: 1px;

}
.photo-area:nth-of-type(3n){
	width: calc((100% - 2px)/ 3);
	margin-right: 0;
}


.our-team-area{
		width: calc((100% - 1px)/ 2);
	margin-right: 1px;
}
.our-team-area:nth-of-type(2n){
		width: calc((100% - 1px)/ 2);
	margin-right: 0;
}

/*808mera*/
.top_808meraarea{
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}
	

/****************************************

Typography

 *****************************************/

h1{
	font-size:20px;

  }

h2.white{
	font-size:20px;

	
}  
h2{
	font-size:20px;

}

/*メニューエリア*/

.ba{
	display:none;
}
/****************************************

トップページ　スタイル

****************************************/

/* img */

.aligncenter {
  display: block;
  margin: 0 auto;
}
.alignright {
	float: none;
  display: block;
  margin: 0 auto;
}
.alignleft {
	float:none;
  display: block;
  margin: 0 auto;
}
img {
    max-width: 100%;
    height:auto;
}
	
/****************************************

top トピックス

****************************************/
.top_topicsarea{
	width: 100%;
	margin-bottom: 50px;
	margin-right: 0;
	}
.top_topicsarea:nth-child(2n){
	width: 100%;
	margin-bottom: 50px;
	margin-right: 0%;
	}
	
.top_topicstext{
	width: 100%;
	padding-left: 20px;
	padding-right: 20px;
	margin: 0;
	}
.top_topicsimg{
	width: 200px;
	height: 150px;
	margin-left: auto;
	margin-right: auto;
	}
/****************************************

工事実績　スタイル

****************************************/
  .tbl-results {
    width: 100%;
  }
  .tbl-results .thead {
    display: none;
  }
  .tbl-results tr {
    width: 100%;
  }
  .tbl-results td {
    display: block;
    text-align: left;
    width: 100%;
  }
  .tbl-results td:first-child {
    background: #e8ebf2;
    font-weight: bold;
    text-align: center;
  }
  .tbl-results td:before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
	  font-size: 70%;
    margin-right: 10px;
  }
/****************************************

お問合せ

mw wp form

 *****************************************/
 
.form-table th,
.form-table td {
  display: block;
  width: 100%;
  border-bottom: none;
}
.form-table td {
	padding-left:0;
	padding-right:0;

}

.form-table th {
	padding-bottom:10px;
	padding-top:10px;

}
.submit-btn {
width:80%;

}
 
/*会社概要*/
/*会社案内　親ページ用*/
.shisetu_photo{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	}
	.companytable th {
	display: block;
	width: 100%;
}
.companytable td {
	display: block;
	width: 100%;
}
dl.companynaiyo{
	margin:0;
	padding:0;
	}
dl.companynaiyo dt{

	float: none;
	width: 100%;
	}
dl.companynaiyo dd{
	margin-left: 2%;
	}
.company_photo{
	width: 80%;

}
/*社会貢献*/
.sk_logo{
	width: 100%;
	text-align: center;
}
.sk_logo img{
	vertical-align: top;
	width: 30%;
}
.sk_textarea{
	width: 100%;
	margin-left: 0;
	margin-top: 10px;
}	
/** 社会貢献年表 */
/** 年表の縦線 */
.sktimeline::before {

    top: 0; bottom: 0; left: 0;
}

/** 年表ボックス */

.sktimeline .box2.left2 {
	text-align: left;
	font-size: 32pt;
	width: 100%;
	margin-left: 30px;

}
.sktimeline .box2.right2 {
    text-align: left;
	width: 100%;
	margin-left: 0;
}
.wareki2{
	display: inline-block;
	margin-left: 10px;
	padding: 0;
		}

.sknaiyou {
    box-sizing: border-box;
	width: calc(100% -50px);
	margin-left: 30px;
	margin-top: 100px;

	
}


.skphotoarea{
	display: block;
	text-align: center;

	
		}


/** 年表の点 */
.skircle::after{
    display: block;
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
	top: 0;
	left: -33px;
    margin: auto;
    border: 1px solid #004981;
    border-radius: 6px;
    background: #004981;
}
	
/*共立電機製作所の歩み*/

/*左用*/
dl.naiyoulistleft{
	overflow: visible;
	float: none;
		}
dl.naiyoulistleft dt{
	float: left;
			color: #0B318F;
			width: 3em;
		}


/** 年表 */
/** 年表の縦線 */
.timeline::before {

    top: 0; bottom: 0; left: 15px;
    margin: 0;
    content: "";

}
	
@keyframes extend {
    from { transform: scaleY(0) }
    to { transform: scaleY(1) }
	}
	

/** 年表ボックス */

.timeline .box.left {
    text-align: left;
    margin-left: 40px;
	margin-bottom: 20px;
	width: 90%;
}
.timeline .box.right {
    text-align: left;
    margin-left: 40px;
	margin-bottom: 20px;
	width: 90%;
}

/*アニメーション用ボックス*/
div.animation_lr {
    opacity: 0;
  transform: translateX(30px);
  transition: 2s ease;
}
div.animation_rl {
    opacity: 0;
  transform: translateX(30px);
  transition: 2s ease;
}

/** 年表の点 */
.timeline .box.right .yearmonth::after,
.timeline .box.left .yearmonth::after {
    display: block;
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    top: 0; bottom: 0; right: calc(100% + 8px);
    margin: auto;
    border: 4px solid #F5AC16;
    border-radius: 16px;
    background: #F5AC16;
}
.timeline .box.left .yearmonth::after {
    left: initial; right: calc(100% + 8px);
}
.ayumi_text{
			margin-top: 50px;
			margin-left: auto;
			margin-right: auto;
			text-align: center;
			font-size: 22px;
	line-height: 150%;
		}

	
	
	
/*採用情報*/
.recruit_subtitle{
		font-size:22px;
	margin-top: 0px;
	margin-bottom: 50px;
		}
.mynavi_youkou{
	width: 100%;
	margin: 0;
	text-align: center;
	}
.mynavi_logo{
	width: 100%;
	margin: 0;
		}

/*全体の背景*/


.rc_title{
	text-align: center;
	border-bottom: solid 2px #FFB100;
	font-size: 22px;
	padding-bottom: 30px;
	margin-bottom: 50px;
		}

.recruit_mainbg {
	padding-bottom: 80px;
	padding-top: 80px;
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 50px;


}
.recruit_mainbg:before {
	border-left: solid 60px #f7f8f8;/*bodyのカラーと同じ色に*/
	border-bottom: solid 40px transparent;

}
.recruit_mainbg:after {
	border-left: solid 60px transparent;/*bodyのカラーと同じ色に*/
	border-bottom: solid 40px #f7f8f8;

}		
		
		
.recruit_infowaku{
	padding-left: 10px;
	padding-right: 10px;
		}	
.square{
	position: relative;
	width: 30%;
	border: solid 2px #1469a3;
	margin-right: 2%;
	margin-top: 50px;
}
.square:last-child{
	margin-right: 0;
}

.re_orengtitle_left{
	width: 50%;
		}
.re_orengtitle_right{
	width: 50%;
		}
dl.re_orangelist dt {
  width: 100%;
}
dl.re_orangelist dd {
  width: 100%;
}

.re_saiyohyo dl {
flex-flow: column;
}

	
ul.re_imglist{
	list-style: none;
	margin-bottom: 50px;
	margin-top: 50px;
	margin-left: 0;
	margin-right: 0;
	padding: 0;
		}		
ul.re_imglist li{
	width: calc(94% / 2);
	margin-right: 2%;
	margin-bottom: 2%;
}
ul.re_imglist li:nth-child(2n){
	width: calc(94% / 2);
	margin-right: 0%;
	margin-bottom: 2%;
}


	
	}
	
	
	
	


/* =SmartPhone (Portraint　縦)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 480px) {



.googlemap{
	width: 100%;
}
iframe {
  width: 100%;
  aspect-ratio: 16/9; 
}

#copyright{
	text-align: center;
	font-size:80%;
	color: #828282;
	margin-top: 50px;

}
	
	
/****************************************

Footer

 *****************************************/
#footerarea{
	background-color: #3a3a3a;
	padding: 0;
	margin: 0;
	}
.footer_menuarea{
	display: block;
	background-color: #3a3a3a;
	margin: 0;
	padding-bottom: 20px;
	padding-top: 20px;

}
.footer_add{
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	}
.footer_grouparea{
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	}

/*右寄せ→左へ変更*/
.footer-containerr{
	display:flex;
	flex-wrap:wrap;
	justify-content: flex-start;
	align-items: flex-start;
	}

p#copyright{
	background-color: #616161;
	text-align: center;
	margin: 0;
}


.parallax {
  width: 100%;
  height: 150px;
}
	
.front_contextarea{
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}


/****************************************

editor

 *****************************************/

                             
/* img */

.alignright {
	float:none;
	margin:0;
}
.alignleft {
	float:none;
	margin:0;
}

/*top商品ラインナップの検索*/
	.top_forserchtext{
	width: 100%;
}
.top_forserch{
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
/****************************************

トピックス　スタイル

****************************************/
/*top お知らせ*/
.top_newsline{
	border: none;
	padding: 0;
	margin: 0;

}
.top_newsarea{
	display: block;
	padding:20px;
	width: 100%;

	}
.top_newstitle{
	width:100%;
	text-align: center;
	margin-bottom: 20px;

	}
.infoday2{
	margin-right:30px;
}
.c_infolist{
	width:100%;
	margin-left: 20px;
	margin-right: 20px;
padding:0;
	display: block;
}
.c_infolist dt {
  width: 100%;
  margin-bottom:8px;
}

.c_infolist dd {
  width: 100%;
	margin-left: 0;
	padding-left: 0;
  margin-bottom:12px;
}	

/*アーカイブ*/
.a_topicsre{
	display: block;
	margin-bottom: 50px;
}
.a_topicscon{
	width: 100%;
	margin-left: 20px;
	margin-right: 20px;
}
	
/*リクルートバナー*/
.top_recruitimgarea{
width: 95%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 20px;
	padding-top: 20px;
}
	
/*挨拶写真*/
.kaityou_width{
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
.kaityou_photo{
	float: none;
	width: 85%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 10px;
}

	
/*社長あいさつ*/
.greetings_photo{
	float: none;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
		}
.greeting_text{
	float: none;
	width: 100%;
	
}	
/*福利厚生*/
.border_title {
		font-size: 20pt;
    }
     
	
ul.list_bcircle {
        list-style:  none;
	margin-top: 30px;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
        padding: 0;
	font-size: 18px;

    }
     
.welfare_day{
	margin-left: 0;
		}	
.support_textarea{
	width: 100%;
		}
.support_imgarea{
	width: 100%;
		}

.welfare_phote{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
		}
	
/*事業内容*/
.jigyo_w50{
	width:80%;
		}
	
.jigyou_imgarea{
	display: block;
		}
.jigyou_img{
	width: 100%;
		}
	
/*私たちがつくる電機*/
.electric_imgarea{
			width: 90%;
	margin-left: auto;
	margin-right: auto;
	float: none;
		}
.electric_imgarealeft{
			width: 90%;
	margin-left: auto;
	margin-right: auto;
	float: none;
		}
table.e_table{
	width: 100%;
}

/*製造ライン*/
.production_line_maintitle{
		font-size:22px;
	line-height: 150%;
	
		}	

		
ol.pl_list {
	margin-left: 1em;
}

.pl_mbotoom20{
	margin-bottom: 20px;
		}
.pl_orangearea{
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	background-color: #1469a3;
	color: #FFFFFF;
	text-align: center;
	width: 100%;
	padding: 10px;
	font-size: 18px;
		}
.pl_arrow {
	height: auto;
    width: 100%;
    position:  relative;
	padding: 20px;
	line-height: inherit;
}

.pl_arrow::after {
content: none;
}

.pl_tyui{
	margin-bottom: 20px;
		}
		
.pl_flowarea{
	border-top: solid 10px #E3E2E2;
	padding-bottom: 20px;
	padding-top: 20px;
	position: relative;
	margin-bottom: 50px;
		}
.pl_flowtext{
	width: 100%;
	margin-right: 0;
		}
.pl_flowtextt{
	width: 100%;
	text-align: center;
	padding-bottom: 10px;
	padding-top: 10px;
	background-color: #153374;
	color: #FFFFFF;
	font-size: 20px;
	margin-bottom: 0;
		}
.pl_flowtextimg{
	width: 60%;
	margin-left: auto;
	margin-right: auto;
		}

.pl_flowpfotoarea{
	width: 100%;
		}
.pl_flowpoto{
	width: 100%;
		}

.circle i {
	color:#1469a3;
  position: absolute;
  bottom: -60px;
  left: 40%;
  transform: translate(-50%, -50%);
  font-size: 4rem;
  animation: updown 2s infinite ease-in-out;
}
/*品質への取り組み*/
.quality_img{
	width: 100%;
	margin-right: 0;
}
.quality_img:nth-of-type(even){
	width: 100%;

}
	
/*環境への取り組み*/
.environment_naiyo{
	padding-left: 25px;
	padding-right: 0;
		}
ol.environment_list{
	margin: 0;
	padding-left: 25px;
	padding-right: 0;
		}	
	
.iso_title{
		width: 90%;
		}
.iso_area{
	width: 90%;
	margin-bottom: 50px;
		}
.iso_img{
	width: 100%;
	margin-bottom: 20px;
		}

.iso_text{
			border-left: solid 5px #FFB100;
	padding-left: 20px;
		}
dl.iso_day{
	margin: 0;
		}
dl.iso_day dt{
  float: left;
	text-align:justify;
text-align-last:justify;
	width: 80px;
}


dl.iso_day dd{
	margin-left: 80px;
		}
dl.iso_day dd::before{
  content: "："
}
	
	
	.environment_haisuitext{
	width: 100%;
	margin-right: 0;
	margin-left: 0;
	margin-top: 20px;
		}
.environment_haisuiimg{
	width: 100%;
	margin-top: 20px;
	margin-left: 0;
	margin-right: 0;
		}
	
/*私たちが描く未来*/
.future_title{
	font-size:30px;
	line-height: 180%;
		}
.f_textarea{
	width: 100%;
		}
.f_photearear{
	padding-top: 30px;
	padding-left: 30px;
	width: 100%;
		}	
.f_photeareal{
	padding-right: 0;
	width: 100%;
		}

/*SDGs*/

.sdgs_gtitle{
	font-size: 24px;
	width: 80%;
		}
.sdgs_torikumi{
	display: block;
			}
.sdgs_torikumititle{
	font-size: 22px;
	margin-bottom: 20px;
		}
.sdgs_torikumilogo{
	width: 100%;
	padding: 20px;
	margin-bottom: 0;
	border-right: none;

		}
ul.sdgs_list{
	margin-top: 0;
	margin-left: 1em;
	padding-top: 30px;
	width: 100%;
	}
.sdgs_torikumilistarea{
	width: 100%;
}

/*4のみ対応*/
.sdgs_no4{
	width: 100%;
}

.sdgs_tirikumiimg2{
	width: 100%;
		}
.sdgs_tirikumiimg3{
	width: 100%;
	margin-right: 0;
		}
.sdgs_tirikumiimg3:nth-child(3n){
	width: 100%;

		}
.sdgs_tirikumiimg4{
	width: 100%;
	margin-top: 0;
		}
.sdgs_tirikumiimg5{
	width: 100%;
	margin-top: 20px;
	margin-bottom: 20px;
	
		}
.sdgs_tirikumiimg6{
		width: 100%;
	margin-right: 0;
	margin-bottom: 20px;

}

.sdgs_tirikumiimg7{
		width: 100%;
}
	
/*検索*/
.serchformarea{
	display: block;
		}
.serch_koumoku{
	width: 100%;
		}
	
/*実績・ラインナップ用*/
.cleft_block{
	float: none;
	width: 100%;
	margin-right: 0;
}
.cright_block{
	float: none;
	width: 100%;
	
	
}
	
/*納入実績用スライド*/
.swiper{
	height: 400px;
		}

/*納入実績アーカイブ*/	
.pd_testlistarea{
	width:  calc(90% / 3);
	height: auto;
	margin-top: 30px;
	margin-right: 2%;
	
}
.pd_testlistarea:nth-of-type(3n){
	width:  calc(90% / 3);
	height: auto;
	margin-top: 30px;
	margin-right: 0;
}
/*納入実績*/
.results_mainimgarea{
	width: 100%;
		}
.results_maingaiyo{
	width: 100%;
	margin-left: 0;
	}
	
/*エコリメイク*/
.ecore_area{
	width: 100%;
		}
.ecore_beforeafter{
	border-radius: 5px;
	padding: 10px;
	font-size:80% ;
	
		}
.ecore_text{
	border-radius: 5px;
	padding: 10px;
	font-size:80% ;
		}
.lineup_ecireimg{
	width: calc((100% - 20px) / 2);
	text-align: center;
		}
	
/*商品ラインナップ*/
/*新商品*/
.f-con{
	display: block;

		}
.newproduct_title{
	width: 100%;
	margin: 0;
	border: none;
	margin-bottom: 20px;
	}

span.newproduct_eng{
	font-size: 80%;
		}
.newproduct_looparea{
	width: 100%;
		}
h3.newproduct_name{
	margin-bottom: 10px;
		}
	
.pd_imgphotoarea{
	width: 100%;
	margin-right: 0;
}
.pd_setumeiarea{
	width: 100%;
}	
	
	
	
.orange button.orange4waku {
	padding:0.75em;
	font-size: 20px;
		}
.tbl-lineup {
    width: 100%;
  }
  .tbl-lineup .thead {
    display: none;
  }
  .tbl-lineup tr {
    width: 100%;
  }
  .tbl-lineup td {
    display: block;
    text-align: left;
    width: 100%;
  }
  .tbl-lineup td:first-child {
    background: #e8ebf2;
    font-weight: bold;
    text-align: center;
  }
  .tbl-lineup td:before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
	  font-size: 70%;
    margin-right: 10px;
  }
.lineup_lefttext{
	float: none;
	width: 100%;
		}
.lineup_rightimg{
	float: none;
	width: 100%;
	margin-left: 0;
	margin-bottom: 1%;
	margin-top: 1%;
	text-align: center;
		}
.lineup_righttext{
	float: none;
	width: 100%;
		}
.lineup_leftimg{
	float: none;
	width: 100%;
	margin-left: 0;
	margin-bottom: 1%;
	margin-top: 1%;
		}
.lineup_ecireimg3{
	width: 100%;
	margin-bottom: 1%;
	margin-top: 1%;
		}
.lineup_ecore{
	width: 100%;
		}
.lineup_amuimg4{
	width: calc(97% / 2);
	margin-right: 1%;
	margin-bottom: 10px;
		}
.lineup_amuimg4:nth-of-type(2n){
	width: calc(97% / 2);
	margin-right: 0;
	margin-bottom: 10px;
}
/*カタログ*/
.catalog_area{
	width: calc(95% / 2);
	margin-right: 5%;
	margin-bottom: 50px;
		}
.catalog_area:nth-child(2n){
	width: calc(95% / 2);
	margin-right: 0;
	margin-bottom: 30px;
		}
	
/*808mera*/

.y808mera_leftarea{
	width: 100%;
	margin-right: 0;
	}
.y808mera_rightarea{
	width: 100%;
	margin-left: 0;
	}
.y808mera_purplewaku{
	margin-bottom: 20px;
	}
.y808mera_flowerimg3{
	width: 100%;
	}

.y808mera_flowersetumei3{
	display: flex;
	align-items: center;
	width: 100%;
	border-bottom: solid 1px #231815;
	border-right: none;
	}
.y808mera_flowersetumei3:nth-child(3n){
	display: flex;
	align-items: center;
	width: 100%;
	border-bottom: solid 1px #231815;
	border-right: none;
	}
.y808mera_setumeiimgarea{
		width: 20%;
	margin: 10px 20px 10px 20px;
	}
.y808mera_w48area{
	width: 100%;
	}
.y808mera_w60area{
	width: 100%;
	}

/*youtube*/
.youtube_area{
	width: 100%;
}


	
	
}