/*
Template:twentynineteen
Theme Name:edgewaters
*/

/**************************************************
 Reset
**************************************************/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
l,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
table,
input,
textarea,
select,
option,
button {
  font-size: 100%;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
menu,
nav,
section,
main {
  display: block;
}

input,
textarea {
  margin: 0;
  padding: 0;
}

ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption,
th {
  text-align: left;
}

:focus {
  outline: 0;
}

img,
a img {
  border: none;
}

a {
  outline: 0;
  cursor: pointer;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

h1,h2,h3,h4{
	font-weight:300;
}

.sp{
	display: block;
}

.pc{
	display: none;
}

@charset "UTF-8";
/**************************************************
 Base style
**************************************************/
body {
  color: #444;
  font-family: YuGothic,'Yu Gothic','ヒラギノ角ゴシック','Hiragino Sans',sans-serif;
  font-size: 1em;
	margin: 0;
	background: #FFF;
}

body, a, a:hover, a:visited {
  color: #444;
}






/*-------------------------------
common area
-------------------------------*/

/*----- header -----*/

header{
	width:100%;
	position: fixed;
	z-index: 999;
	background:#000000;
}

.header{
	display: flex;
	padding: 10px 0;
	width:90%;
	margin: 0 auto;
}

.header img{
	display: block;
	height:25px;
	padding: 5px 0;
}

.nav-button{
	display: block;
	cursor: pointer;
	margin-left: auto;
}

.nav-wrap{
	position: fixed;
	left: 0;
	top: 0;
	display: none;
	z-index: 10;
	background-color: rgba(0,0,0,0.7);
	width: 100%;
	height: 100%;
}

.nav-wrap .nav{
	height: 100%;
	position: relative;
	overflow-x: hidden;
	overflow-y: auto;
}

.nav li{
	display: block;
	margin: 2em;
}

.nav li a{
	color: #FFF;
	font-size: 1em;
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	
}



.nav-wrap.open {
  display: block;
}
.nav-wrap.close {
  display: none;
}

.nav-button,.nav-button span {
	display: inline-block;
	transition: all 1s;
	box-sizing: border-box;
}
.nav-button {
	z-index: 20;
	position: relative;
	width: 35px;
	height: 30px;
	margin-top:2px;
}
.nav-button span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #fff;
}
.nav-button span:nth-of-type(1) {
	top: 0;
}
.nav-button span:nth-of-type(2) {
	top: 14px;
}
.nav-button span:nth-of-type(3) {
	bottom: 0;
}
  .nav-button.active span:nth-of-type(1) {
    -webkit-transform: translateY(14px) rotate(-45deg);
    transform: translateY(14px) rotate(-45deg);
  }
  .nav-button.active span:nth-of-type(2) {
    opacity: 0;
  }
  .nav-button.active span:nth-of-type(3) {
    -webkit-transform: translateY(-14px) rotate(45deg);
    transform: translateY(-14px) rotate(45deg);
}

.head_color{
	background: rgba(0,0,0,0.7);
}
	 
/*----- footer -----*/

footer{
	width:100%;
	padding:70px 0 0px;
	background:#000000;
	color: #FFF;
}

footer img{
	display: block;
	width:200px;
	margin: 0 auto 30px;
}


footer h4{
	font-size: 1.2em;
	width:80%;
	max-width:1000px;
	text-align: left;
	margin: 0 auto 10px;
	border-bottom: 1px solid #FFF;
}

footer ul{
	width:200px;
	margin: 0 auto;
	max-width:1000px;
}


footer ul li a{
	display: block;
}

.footer a{
	color: #FFF;
}



.ft_list{
	width:80%;
	margin: 60px auto 0;
	text-align: right;
}

.copyright{
	color: #aaa;
	background: #222;
	text-align: center;
	font-size: 0.7em;
	margin-top: 20px;
	padding: 10px;
}

/*------common tablet------------*/


@media only screen and (min-width:600px) {

	.sp{
		display: none;
	}
	
	.pc{
		display: block;
	}
	
/*----- header -----*/

	.header{
		max-width: 1080px;
		padding:0;
	}
	
	.header img{
		margin-top: 8px;
	}
	
	.nav-button{
		display: none;
	}
	
	.nav-wrap{
		display: flex;
		position: static;
		background: none;
	}
	
	.nav-wrap .nav{
		height: auto;
		width:auto;
		position: static;
		margin-left: auto;
	}
	
	.nav-wrap ul{
		display: flex;
		margin-left: auto;
	}
	
	.nav li{
		width:auto;
		margin: 0;
		padding: 0 15px;
		text-align: center;
	}
	
	.nav li a{
		line-height: 3;
	}
	
	.nav .cbtn{
		background: #fff;
		color: #000000;
		padding: 0px 20px;
		width:100px;
		display: block;
	}
	
	.nav li a:hover{
		transition: 0.8s;
		color: #0099FF;
	}
	
/*---- footer ----*/
	
	footer ul{
	display: flex;
		width:100%;
		max-width: 800px;
		padding: 40px 0 0;
}
	
	footer ul li{
		width: 200px;
		margin: 0 auto;
		text-align: center;
	}
	
	footer a:hover{
		transition: 0.8s;
		color: #0099FF;
	}
	
	.ft_list{
		max-width:800px;
	}
	
	.ft_list li{
		margin: 0 0 0 auto;
	}
	

}

	



/*---------common btn--------*/
.container {
  position: absolute;
}

.for_cardsim {
	top:auto;
	bottom:30px;
	left: 0;
	right: 0;
	margin: auto;
}

.formv,.forsub{
	position: static !important;
}


/* GENERAL BUTTON STYLING */
.container a,
.container a::after {
  -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
    transition: all 0.3s;
}

.container a {
  background: #000000;
  border: 1px solid #000000;
  color: #fff;
  display: block;
  font-size: 0.9em;
  padding: 0.8em 2.8em;
  position: relative;
  text-transform: uppercase;
	margin: 0 auto;
	width:100px;
	text-align: center;
}

.container a::before,
.container a::after {
  background: #000000;
  content: '';
  position: absolute;
	z-index: -1;
}

.container a:hover {
  color: #fff;
	z-index: 0;
}

.forsub a {
  border: 1px solid #fff;
	width:160px;
	margin: 30px auto 0;
}

.forsub a::before,
.forsub a::after {
	background: #ccc;
	content: '';
	position: absolute;
	z-index: -1;
}

.forsub a:hover {
  color: #FFF;
	border: 1px solid #0099FF;
	z-index: 0;
}


/* BUTTON 2 */
.btn-2::after {
  height: 100%;
  left: 0;
  top: 0;
  width: 0;
}

.btn-2:hover:after {
  width: 100%;
	background: #0099FF;
}

/* BUTTON 3 */
.btn-3{
	width: auto !important;
	max-width: 200px;
}

.btn-3::after {
  height: 100%;
  left: 0;
  top: 0;
  width: 0;
}

.btn-3:hover:after {
  width: 100%;
	background: #0099FF;
}







/*---common end-------*/




/*-------fadein.js----*/

.fadein {
    opacity : 0;
    transform : translate(0, 50px);
    transition : all 1500ms;
}

.fadein-l {
    opacity : 0.0;
    transform : translate( -50px,0);
    transition : all 1500ms;
    }

.fadein-r {
    opacity : 0.0;
    transform : translate( 50px,0);
    transition : all 1500ms;
    }

.scroll-in {
    opacity : 1;
    transform : translate(0, 0);
    }




/*--------top-----------*/


/*--------mv------------*/

.mvposi{
	margin: 10px auto 0;
}

.under_mv{
	height:100px;
	background: url("image/top/under_mainvisual.jpg");
	background-size: cover;
	margin-bottom: 5px;
}


/*mini title area-------*/

.wrapper_ma{
	width: 100%;
	background: #000000;
}

.minititle_area{
	width:90%;
	max-width:900px;
	margin: 0 auto;
}

.in_minititle_area{
	width:95%;
	margin: 0 auto;
	display: flex;
	padding: 10px 0;
	color: #FFF;
}


.in_minititle_area .left{
	line-height: 2.2;
	font-size: 1em;
	text-align: left;
	width:20%;
	margin: 0;
	text-align: center;
}

.in_minititle_area .right{
	width:80%;
	margin: 0;
}


.right p{
	font-size: 0.8em;
	width:90%;
	margin: 0 auto;
}




/*------ block3 -----*/

.block3{
	padding: 50px 0 50px;
}




.block3 img{
	display: block;
	width:100px;
	height: 100px;
	margin: 0 auto 15px;
	text-align: center;
}

.block3 h3{
	width:100%;
	text-align: center;
	font-size: 1.2em;
}

.block3 h4{
	font-size: 1em;
	width:100%;
	text-align: center;
}

.in_flex3{
	width:70%;
	margin: 0px auto 50px;
	display: block;
}

.in_flex3:nth-last-child(1){
	margin-bottom: 0;
}

.in_flex3 h4{
	margin-bottom:5px;
}

.in_flex3 p{
	font-size: 0.8em;
}

.checklist{
	display: flex;	
	max-width:280px;
	margin: 10px auto 0;
	text-align: left;
}

.checklist img{
		display: block;
	width:25px;
	height: 25px;
	margin: 0 10px 0;
} 

.checklist p{
	font-size: 0.85em;
	color: #333;
	line-height: 2em;
}


.arrow1{
width: 15px;
height: 15px;
border: 3px solid;
border-color:  transparent transparent #ccc #ccc;
transform: rotate(-45deg);
	margin:0 auto 30px;;
}


/*-----cardsim------*/

.company{
	background: url("image/top/company.jpg");
}

.service{
	background: url("image/top/service.jpg");
}

.product{
	background: url("image/top/product.jpg");
}

.company,.service,.product{
	height: 300px;
	width: 70%;
	max-width: 260px;
	background-size: cover;
	background-position: center;
}

.cardsim{
	background: rgba(0,0,0,0.1);
	height: 100%;
	position: relative;
	color: #FFF;
}



.cardsim h4{
	font-size: 1.4em;
	position: absolute;
	top:30px;
	font-family:  "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
}


.cardsim p{
	position: absolute;
	top:60px;
	left: 0;
	right: 0;
	bottom: auto;
	margin: auto;
	width:80%;
	text-align: center;
}

/*------ sub -------*/


/*-------sub mv---------*/


.top{
	background: url("image/top/mainvisual.jpg");
	margin-bottom: 3px;
}


.top_mv{
	position: relative;
	display: block;
	width:100%;
	height: 350px;
	background-size: cover;
	background-position: center;
}

.top_inbox{
	position: absolute;
	top:0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 50px;
	margin: auto;
}

.top_inbox img{
	width:220px;
	margin: 10px auto;
	display: block;
}

.top_inbox p{
	display:none;
}




/*----sub ------*/

.top_common{
	background: url(image/sub/common.jpg);
}

.top_contact{
	background: url(image/sub/contact.jpg);
}

.top_product{
	background: url(image/product/mv_product.jpg);
}

.top_service{
	background: url("image/service/mainvisual.jpg");
}

.top_company{
	background: url("image/company/mainvisual.jpg");
}

.top_recruit{
	background: url("https://thear.co.jp/wp-content/uploads/2021/07/recruit.jpg");
}

.sub_mv{
	position: relative;
	display: block;
	width:100%;
	height: 450px;
	max-height: 90vh;
	background-size: cover;
	background-position: center;
	padding-top:40px;
}

.top_company{
	background-position: right;
}

.in_sub_mv{
	position: absolute;
	left: 0;
	bottom: 30px;
	background: #FFF;
	padding: 10px 15px;
}

.sub_mv h1{
	font-size: 1.2em;
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	font-style: italic;
	text-align: right;
}


.sub_mv h2{
	font-size: 1em;
	font-family: YuGothic,'Yu Gothic','ヒラギノ角ゴシック','Hiragino Sans',sans-serif;
	text-align: right;
}


/*----sub leftandright------*/

.sub_thear{
	background: url("image/product/thear_wall_sp.jpg");
}

.sub_goods{
	background: url(image/product/goods_sp.jpg);
}

.sub_equipment{
	background: url("image/product/equipment_sp.jpg");
}

.sub_superray{
	background: url("image/product/superray.jpg");
}

.sub_sales{
	background: url("image/service/sales.jpg");
}

.sub_development{
	background: url("image/service/development.jpg");
}

.sub_maintenance{
	background: url("image/service/maintenance.jpg");
}

.sub_products{
	background: url("image/service/alumi_products2.jpg");
}

.sub_resins{
	background: url("image/service/resin.jpg");
}

.sub_image{
	position: relative;
	display: block;
	width:250px;
	height: 250px;
	background-size: cover;
	background-position: center;
	margin: 20px auto;
}

.max-w-12{
	max-width:1600px;
	width: 90%;
	margin: 0 auto;
}

.ovlap_area{
	padding: 30px 0;
}


.in_ovlap{
	width:90%;
	margin: 0 auto;
}


.in_ovlap h2{
	position: relative;
	display: inline-block;
	margin: 0 auto 30px;
	text-align: center;
	font-size: 1em;
	width:100%;
	color: #000000;
	font-weight: 700;
}
.in_ovlap h2:before {
	content: '';
	position: absolute;
	bottom: -15px;
	display: inline-block;
	width: 60px;
	height: 1px;
	left: 50%;
	-moz-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	background-color: #999;
}

.in_ovlap h4{
	text-align: center;
	margin: 0 auto 10px;
	font-size: 1.1em;
	width:100%;
	color: #000000;
	font-weight: 600;
}

.in_ovlap p{
	font-size: 0.9em;
	width:85%;
	margin: 0 auto 15px;
}

.in_ovlap ul{
	list-style: none;
	width:90%;
	max-width: 350px;
	margin: 0 auto 10px;
}

.in_ovlap ul li{
	position: relative;
	padding: 3px 0 3px 30px;
	font-size: 0.9em;
}

.in_ovlap ul li::before{
	content: '';
	display: block;
	width: 15px;
	height: 1px;
	background: #777;
	position: absolute;
	top: 12px;
	left: 5px;
}

.in_ovlap img{
	width:100px;
	display: block;
	margin: 30px auto 20px;
}



/*--------sub minititle------------*/


.title_normal{
	width:100%;
	padding: 30px 0;
}

.title_normal h2{
	text-align: center;
	font-size: 1.4em;
	color: #000000;
	font-family: 'Times New Roman','Yu Mincho Light','YuMincho','Yu Mincho','游明朝体',sans-serif;
	margin-bottom: 5px;
	letter-spacing: 2px;
}

.title_normal h3{
	text-align: center;
	font-size: 0.9em;
	margin-bottom: 5px;
}

.title_normal p{
	width:100%;
	text-align: center;
	color: #000;
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体',sans-serif;
}



.white h2,.white p{
	color: #FFF;
}

.back_white{
	background: #FFF;
}

.pb10{
	padding-bottom: 1px;
}




/*--------flex list border------------*/

.flex_list_border{
	width:80%;
	margin: 0 auto 50px;
}

.flex_list_border ul{
	width:100%;
	margin-bottom: 80px;
}

.flex_list_border ul li{
	font-size: 0.8em;
	padding: 0px 10px 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #ccc;
}

.flex_list_border h3 {
	width:95%;
	padding: 0.25em 0.5em;/*上下 左右の余白*/
	color: #494949;/*文字色*/
	background: transparent;/*背景透明に*/
	border-left: solid 4px #ccc;/*左線*/
	margin: 0 auto 20px;
}

.flex_list_border img{
	width:80%;
	margin: 0 auto;
}

.flex_list_border .left{
	text-align: left;
	color: #888;
	font-size: 1.1em;
}

.flex_list_border .right{
	width:100%;
	padding: 5px 0;
}


/*-----list block------*/

.listblock li{
	display: block;
	background: #FFF;
	color: #666;
	border-bottom: 0px solid #FFF !important;
	margin: 5px;
	padding: 5px 10px !important;
	width:auto;
}



/*--------w_link_unit------------*/

.w_link_unit{
	padding: 30px 0 70px;
}

.edgewaters{
	background: url("image/common/edgewaters.jpg");
}

.thear{
	background: url("image/common/thear.jpg");
}

.prototech{
	background: url("image/common/prototech.jpg");
}

.in_wlink{
	height:150px; 
	width: 80%;
	display: block;
	background-size: cover;
	background-position: center;
	position: relative;
	margin: 20px auto;
}

.cover_black{
	background: rgba(0,0,0,0.5);
	height: 100%;
	width:100%;
	transition: 0.3s;
}

.cover_black:hover{
	background: rgba(0,0,0,0.2);
}

.in_wlink img{
	position: absolute;
	width: 150px;
	top:38%;
	bottom: auto;
	left: 0;
	right: 0;
	margin: auto;
}

.in_wlink p{
	color: #FFF;
	text-align: center;
	position: absolute;
	left: 0;
	right: 0;
	bottom: auto;
	margin: auto;
}

.in_wlink .top_contents{
	top:25%;
	font-size: 0.6em;
}

.in_wlink .bottom_contents{
	top:65%;
	font-size: 0.8em;
}


/*---- over view ----*/

.overview{
	width:80%;
	max-width: 600px;
	margin: 70px auto 20px;
}

.overview h3{
	font-size: 1.5em;
	text-align: center;
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	color: #000000;
	margin-bottom: 10px;
}

.overview h4{
	font-size: 1em;
	text-align: center;
}

.overview p{
	font-size: 0.8em;
	margin-top: 20px;
}

.center_align{
	text-align: center;
}


/*-----company-----*/

/*----css parallax----*/

/*固定する背景*/
.parallax-base {
  box-sizing: border-box;
  color: #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
}
.parallax-bg {
}

.parallax-bg2 {
  background-image: url("image/company/torihikisaki.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}


/*------pr card area--------*/



.pr_area{
	padding: 10px 0;
	margin-bottom: 30px;
}

.ceo{
	background: url("image/company/ceo.jpg");
	background-position:center;
}

.keireki{
	background: url("image/company/keireki.jpg");
}

.in_pr_area{
	position: relative;
	height: 700px;
	margin: 0 auto;
	width:300px;
}

.pr_area .card_img{
	position: absolute;
	height: 220px;
	width:180px;
	background-size: cover;
	top:0;
	bottom: 0;
	left:0;
	right: auto;
}

.content{
	width:250px;
	margin: 5px auto 0;
	padding: 25px;
	font-size: 0.85em;
	background: #efefef;
	color: #666;
}

.content p{
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
}

.content p span{
		font-size: 1.15em;
		font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	}

.content_l{
	width:250px;
	margin: 30px auto 0;
	padding: 25px;
	font-size: 0.85em;
	background: #FFF;
	color: #666;
}

.content_l li{
	width:90%;
	border-bottom: 1px solid #ccc;
	padding: 5px 5%;
}


.listblock li p{
	display: block;
	border-left: 2px solid #ccc;
	padding: 0 10px;
}

.pr_title{
	width:150px;
	padding: 15px;
	position: absolute;
	background: #efefef;
	color: #333;
	top:150px;
	bottom: auto;
	left: auto;
	right: 0;
}

.pr_title h2{
	font-size: 1.2em;
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
}

.pr_title p{
	font-size: 1em;
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
}

.pr_carrer{
	width:90%;
	padding: 15px 5%;
	position: absolute;
	background: #efefef;
	top:auto;
	bottom: 0px;
	left: 0;
	right: 0;
	margin: auto;
}

.pr_carrer p{
	font-size: 0.9em;
	margin-bottom: 5px;
	color: #666;
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
}

.pr_carrer ul{
	font-size: 0.6em;
	color: #333;
}

.rondom_order{
	text-align: right;
	width:90%;
	margin: -60px auto 50px;
	font-size: 0.8em;
}


/*----- flex img ------*/

.flex_img{
	width:100%;
	max-width:1000px;
	margin: 20px auto 50px;
	display: flex;
	flex-wrap: wrap;
}

.flex_img .in_flex_img{
	width:100%;
	margin:0 auto 10px;
}

.flex_img img{
	width:100%;
	object-fit: cover;
	display: block;
	margin: 0 auto 20px;
}

.flex_img p,.flex_img h4{
	width:80%;
	margin: 20px auto 10px;
	text-align:center;
}

.flex_img .container{
	width:85%;
	margin: 0 auto;
}

.flex_img .container a{
	margin: 30px auto 0;
}



.double img{
	object-fit: contain;
	width:45%;
	height: 150px;
	margin: 0 auto;
}




/*--- privacy ------*/

.privacy{
	width:80%;
	max-width: 1200px;
	margin: 0px auto ;
	padding:50px 0px 100px;
}

.privacy p,.privacy ul{
	text-align: left;
	font-size: 0.8em;
	padding: 0px 0 20px;
}


.privacy ul li{
	width:95%;
	list-style: square;
	margin-left: 5%;
}

.privacy h3{
	text-align: left;
	width:100%;
	border-bottom: 1px solid #ccc;
	margin: 5px 0;
}


.sample02 {
width : 100%;
font-size : 24px;
text-align : center;
overflow : hidden;
}
.sample02 ul{
margin:0;
display : inline-block;
padding-left: 100%;
white-space : nowrap;
line-height : 1em;
animation : scrollSample02 30s linear infinite;
}
.sample02 ul li {
    display: inline;
    margin: 0 500px 0 0;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 0.8em;
    background: #000;
    font-weight: 100;
    color: #ffffff;
}

.wrapper_ma {
    display: none;
}

@keyframes scrollSample02{
	from   { transform: translate(0%);} 
	99%,to { transform: translate(-100%);}
}

#news_bg {
    display: none;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.50);
    z-index: 3;
}
#news {
    position: absolute;
    left: 60px;
    bottom: 110px;
    width: calc(100% - 400px);
    opacity: 0;
    z-index: 3;
}
#news > div {
    position: relative;
}
#news h2 {
    box-sizing: border-box;
    position: absolute;
    padding: 10px 0;
    width: 80px;
    background: #ffffff;
    text-align: center;
    color: #333;
    z-index: 1;
}
#news .ticker {
    background: rgba(0,0,0,0.8);
    padding: 10px 70px 10px 100px;
    transition: opacity 0.3s ease-out;
}
#news .ticker .inner {
    position: relative;
    margin: 0;
    padding: 0;
}
#news .ticker time {
    position: absolute;
    left: 0;
    width: 100px;
    color: #fff;
}
#news .ticker time::after {
    display: block;
    position: absolute;
    top: 5px;
    right: 0;
    width: 1px;
    height: 16px;
    background: rgba(255,255,255,0.50);
    content: '';
}
#news .ticker .inner div {
    position: relative;
    box-sizing: border-box;
    display: block;
    margin: 0 0 0 120px;
    overflow: hidden;
}
#news .ticker .inner div p {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    font-weight: bold;
    white-space: nowrap;
    color: #fff;
}
#news .btn_toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    width: 50px;
    height: 100%;
    cursor: pointer;
}
#news .btn_toggle::before {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60%;
    margin: auto;
    border-left: dotted 2px #fff;
    content: '';
}
#news .btn_toggle::after {
    display: block;
    position: absolute;
    top: 6px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 7px;
    height: 7px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(-45deg);
    content: '';
    transition: top 0.1s ease-in;
}
#news .btn_toggle:hover::after {
    top: 0;
}
#news.act .ticker {
    pointer-events: none;
    opacity: 0;
    top: 94px;
}
#news.act .btn_toggle {
    /*height: calc(100% - 2px);*/
    height: 48px;
    top: 45px;
    background: rgba(0,0,0,0.8);
}
#news.act h2 {
    top: 48px;
}
#news.act .btn_toggle::before {
    display: none;
}
#news.act .btn_toggle::after {
    top: -3px;
    transform: rotate(135deg);
}
#news.act .btn_toggle:hover::after {
    top: 3px;
}
#news .list {
    display: none;
    box-sizing: border-box;
    padding: 50px 50px 35px 50px;
    color: #fff;
    background: rgba(0,0,0,0.8);
}
#news .list li {
    margin-bottom: 1em;
}
#news time {
    float: left;
    width: 100px;
}
#news .list p {
    position: relative;
    box-sizing: border-box;
    float: left;
    width: calc(100% - 100px);
    padding: 0 0 0 20px;
    font-weight: bold;
}
#news .list p a {
    color: #FFF!important;
}
#news .list p a:hover {
    text-decoration: underline;
}
#news .list p::after {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background: rgba(255,255,255,0.50);
    content: '';
}
#news .news_index.btn_link a {
    width: 125px;
    background: #FFF;
    font-size: 1.6rem;
    height: 48px;
    line-height: 48px;
    padding: 0 20px;
    font-weight: bold;
    left: 82px;
    top: 48px;
    opacity: 0;
    display: none;
}
#news .news_index.btn_link a:hover {
    background: #F5DA44;
    transition: .3s;
}
#news .news_index.btn_link a b {
    right: 20px;
}
#news .news_index.btn_link a::before {
    content: none;
}

#bnr_simulator {
    position: absolute;
    bottom: 30px;
    right: 60px;
    opacity: 0;
    z-index: 3;
}
#bnr_simulator figure {
    position: relative;
}
#bnr_simulator figure::after {
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 20px;
    height: 20px;
    background-size: 5px auto;
    transform: rotate(180deg);
    content: '';
    transition: background 0.1s ease-in;
}
#bnr_simulator a:hover figure::after {
    background-position: 40% 50%;
}
#bnr_simulator .badge {
    position: absolute;
    top: -40px;
    right: -40px;
}
#bnr_simulator .badge p {
    position: absolute;
    width: 100%;
    top: 30px;
    font-size: 0.5rem;
    line-height: 1.2;
    text-align: center;
}
#bnr_simulator .badge img {
    transition: transform 0.1s ease-in;
}
#bnr_simulator a:hover .badge img {
    transform: scale(1.1);
}

.nav {

    height: 2rem;
}

ul.nav li ul {
    flex-flow: column;
}

/*全てのリスト・リンク共通*/
.nav li {
    list-style: none;
    position: relative;
}
.nav li a {
    display: block;
    text-decoration: none;
    width: 100%;
}

/*子階層以降共通*/
.nav li li {
    height: 0;
    overflow: hidden;
    transition: .5s;
}
.nav li li a {
    border-top: 1px solid #eee;
    height: 2rem;
    line-height: 2rem;
    text-align: center;
}
.nav li:hover > ul > li {
    height: 2rem;
    overflow: visible;
}

.flex_list_border.recruittable .right {
    padding: 10px 5% 10px;
}

.flex_list_border.recruittable ul li {
    font-size: 0.8em;
    padding: 15px 10px 5px;
    margin-bottom: 0px!important;
    border-bottom: 0px solid #ccc!important;
    height: 4rem;
}


@media only screen and (min-width:800px) {

	/*--------sub minititle------------*/


	.title_normal{
		padding: 60px 0;
	}
	
	
	/*--- button ---*/
	
	.forsub a {
		width:160px;
		margin: 30px auto 0 0;
	}
	
	/*----css parallax----*/

	/*固定する背景*/
	.parallax-base {
	  box-sizing: border-box;
	  color: #FFF;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}
	.parallax-bg {
	}

	.parallax-bg2 {
	  background-image: url("image/company/torihikisaki.jpg");
	  background-attachment: fixed;
	  background-position: center;
	  background-size: cover;
	  background-repeat: no-repeat;
	}

	/*スクロールするコンテンツ*/
	.scrollbox {
		width:100%;
		margin: 0 auto;
	}
	
	
	/*---------top-----------*/
	
	.top{
		height: 80vh;
	}
	
	.top_inbox{
		width: 80%;
	}

	.top_inbox img{
		width:480px;
		display: block;
		text-align: left;
		margin-right: auto;
		margin-left: 10%;
	}

	.top_inbox p{
		display:block;
		font-size: 0.9em;
		text-align: left;
		max-width: 600px;
		color: #012B41;
		margin:10px 0 0 135px;
	}
	
	.under_mv{
		height:250px;
		margin-bottom: 5px;
	}

	
	.mvposi{
		
	}


	/*-----block3-------*/
	
	
	.block3{
		padding: 100px 0 0;
	}
	
	.block3 h3{
		font-size: 1.5em;
	}
	
	.block3 p{
		width:90%;
		margin: 0 auto;
	}
	
	.block3 img{
		width:150px;
		height: 150px;
		margin: 0 auto 15px;
	}
	
	.flex_3{
		display: flex;
		flex-wrap: wrap;
		width:90%;
		margin: 0 auto 70px;
		max-width: 1000px;
	}
	
	.in_flex3{
		width:33%;
		max-width:300px;
		margin: 0 auto 0;
	}
	
	.in_flex3 .pwid{
		margin: 30px auto 0;
		max-width: 200px;
		font-size: 1em;
	}

	.company,.service,.product{
		height: 350px;
	}


	
	/*-----sub------*/

	
	.sub_mv{
		height: 650px;
	}
	
	.sub_mr_bottom{
		margin-bottom: 100px;
	}
	
	.in_sub_mv{
		bottom: 60px;
		padding: 15px 30px 15px 18%;
	}

	.sub_mv h1{
		font-size: 2em;
	}


	.sub_mv h2{
	}
	
	
	

	
	/*----sub leftandright------*/
	
	.sub_thear{
		background: url("image/product/thear_wall.jpg");
	}

	.sub_goods{
		background: url(image/product/goods.jpg);
	}

	.sub_equipment{
		background: url("image/product/equipment.jpg");
	}


	.contain{
		background-size: contain !important;
		background-repeat: no-repeat;
		width:50% !important;
		height: 600px !important;
	}
	
	.backnone{
		background: none !important;
	}
	
	
	.ovlap_area{
		position: relative;
		height: 550px;
		padding: 0;
		margin-bottom: 100px;
	}
	
	.sub_image{
		width:80%;
		height: 550px;
		position: absolute;
		background-size: cover;
	}
	
	
	.in_ovlap{
		width:50%;
		position: absolute;
		height: 350px;
		background: rgba(250,250,250,0.8);
	}
	
	.in_ovlap h4{
		text-align: left;
	}
	
	.middle{
		height: 100%;
		width:100%;
		position: relative;
	}
	
	.in_middle{
		width:90%;
		position: absolute;
		top: 50%;
  		left: 50%;
  		-webkit-transform: translate(-50%, -50%); /* Safari用 */
  		transform: translate(-50%, -50%);
	}
	
	.high{
		height: 450px;
	}
	
	.narrow{
		height: 200px;
	}
	
	.a_left{
		left: 0;
		right: auto;
		top: 0;
		bottom: 0;
		margin: auto;
		background-position: left;
	}
	
	.a_right{
		right: 0;
		left: auto;
		top: 0;
		bottom: 0;
		margin: auto;
		background-position: right;
	}
	
	.navy{
		background: #000132;
		color: #FFF;
		background-position: right;
	}
	
	.in_ovlap h2{
		text-align: left;
		margin: 0 auto 10px;
		padding: 0;
		font-size: 1.3em;
	}
	.in_ovlap h2:before {
		display: none;
	}

	.in_ovlap p{
		font-size: 1em;
		margin-bottom: 0;
		width:100%;
	}

	.in_ovlap ul{
		width:100%;
		max-width: 100%;
	}
	
	.in_ovlap ul li{
		font-size: 1em;
	}
	
	.in_ovlap img{
		margin: 0 auto 20px 0;
		width:150px;
	}
	
	.m15{
		padding-bottom: 15px;
	}

	
/*--------flex list border------------*/

	.flex_list_border{
		width:80%;
		max-width:800px;
		margin: 0 auto 0;
	}

	.flex_list_border ul{
		width:100%;
	}

	.flex_list_border ul li{
		font-size: 1em;
		padding: 10px 40px;
		border-bottom: 0px;
		display: flex;
	}
	
	.flex_list_border .left{
		width:30%;
		border-bottom: 4px solid #ccc;
		text-align: center;
		padding:  10px 0;
		font-size: 1em;
	}
	
	.flex_list_border .right{
		width:60%;
		padding: 10px 5% 30px;
		border-bottom: 1px solid #ccc;
	}
	
	
	/*-----list block------*/

	.listblock{
		display: flex;
		flex-wrap: wrap;
	}
	
	.listblock li{
		display: block;
		width:40%; 
		padding: 10px !important;
		border-bottom: 0px solid #FFF !important;
		margin: 5px auto 15px 5%;
	}


	
	/*--------w_link_unit------------*/

	.w_link_unit{
		padding:  0 0 100px;
		display: flex;
		margin: 0 auto;
		max-width: 1000px;
	}

	.edgewaters{
		background: url("image/common/edgewaters.jpg");
	}

	.thear{
		background: url("image/common/thear.jpg");
	}

	.in_wlink{
		max-width: 400px;
		background-size: cover;
		background-position:center;
}



	.in_wlink img{
		position: absolute;
		width: 150px;
		margin: auto;
	}

	.in_wlink p{
		color: #FFF;
		font-size: 0.7em;
		text-align: center;
		position: absolute;
		margin: auto;
	}
	
	
	/*---company------*/
	
	/*----pr area-----*/
	
	.back_pr{
		padding: 0 0 50px;
	}
	
	.pr_area{
		display: flex;
		width:100%;
		min-width: 600px;
		max-width: 1000px;
		margin: 0 auto;
		padding: 0;
	}
	
	.flex_r{
		flex-direction: row-reverse;
	}
	
	.in_pr_area{
		position: relative;
		height: 1000px;
		width:30%;
		min-width: 250px;
		max-width: 400px;
	}
	
	.pr_left{
		margin: 0 0 0 auto;
	}
	
	
	.in_pr_area .card_img{
		height: 450px;
		width:300px;
	}

	.pr_title{
	width:170px;
	padding: 15px;
	position: absolute;
	color: #666;
	top:330px;
	bottom: auto;
	left: auto;
	right: -25px;
}
	
	.pr_carrer{
		position: absolute;
		bottom: -50px;
		min-width: 270px;
		}
	
	.pr_carrer ul{
		width:100%;
		max-width: 270px;
	}
	
	.pr_carrer ul li{
		max-width: 270px;
		margin-bottom: 2px;
	}

	.content{
		width:50%;
		height: 850px;
		margin: 100px auto 0;
		position: relative;
	}
	
.memberbox {
    width: 100%;
    margin: 0;
    height: 260px;
}
	
p.recruittabletext {
    padding: 0 50px 30px;
}
	
	.content_l{
		width:50%;
		height: 480px;
		margin: 30px auto 0 0;
		position: relative;
	}
	
	.content p,.content_l ul{
		display:block;
		width:80%;
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%); /* Safari用 */
		transform: translate(-50%, -50%);
	}
	
	.content p{
		min-width: 330px;
		width:90%;
		font-size: 1.1em;
	}
	
	.content p span{
		font-size: 1.4em;
	}
	
	
	
	.pr_area ul{
		width:350px;
	}
	
	/*---- over view ----*/
	
	.overview{
		margin-bottom: 100px;
	}
	
	
	/*----- flex img ------*/

	.flex_img{
		width:80%;
		margin: 20px auto 100px;
	}

	
	.flex_img .in_flex_img{
		width:29%;
		margin: 0 2% 20px 2%;
}
	
	.flex_img .in_flex_img img{
		height:220px;
		object-fit:cover;
	}

	
	
	.double img{
		object-fit: contain;
		width:45%;
		height: 150px;
		margin: -30px auto;
	}
	
	.double{
		max-width: 800px;
		padding-right: 80px;
	}
	


	
	
}

@media only screen and (min-width:850px) {



	
	
}




@media only screen and (min-width:1000px) {
	
	.sub_mv{
	height: 800px;
}


	.a_left{
		padding-left: 10%;
	}	
	
	.a_right{
		padding-right: 5%;
		padding-left: 5%;
	}
	
	.in_ovlap{
		width:40%;
	}
	
		.ovlap_area{
		height: 700px;
	}
	
	.sub_image{
		width:55%;
		height: 700px;
	}

}

	


/*-------------------------------
contact area
-------------------------------*/
form{
	width: 100%;
	padding-top: 30px;
}

.inquiry{
	margin: 0 auto;
	max-width: 1000px;
}

.inquiry tr{
	width: 100%;
}

.cflex{
	display: flex;
	color: #888;
}

.hissu{
	width: 50px;
	background: #E67F47;
	color: #FFF;
	border-radius: 3px;
	text-align: center;
	margin-left: 10px;
}

.inquiry th{
	width: 25%;
	padding: 15px 0 15px 30px;
	font-size: 16px;
	font-weight: 200;
}

.inquiry td{
	width: 70%;
	max-width: 100px;
}



.inquiry input{
	width: 90%;
	font-size: 16px;
	line-height: 1;
	padding: 7px 0 5px 15px;
	border:solid 1px #888;
	border-radius: 5px;
	-webkit-appearance : none;
	-webkit-tap-highlight-color : rgba(0,0,0,0);
}


#select select {
	width: 70%;
	padding: 5px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
	background: #FFF;
	background: url(image/arrow01.png) right 100% no-repeat;
	background-size: 20px, 100%;
}

#radio input{
	width:10px;
	height:10px;
	padding:3px;
	color: #aaa;
}

#radio input:checked{
	background:#00c1f1;
}

.mwform-radio-field-text{
	font-size: 16px;
	line-height: 1;
}

.inquiry textarea{
	width: 90%;
	height: 100px;
	font-size: 16px;
	padding: 15px 0 8px 15px;
	border:solid 1px #888;
	border-radius: 5px;
	-webkit-appearance : none;
	-webkit-tap-highlight-color : rgba(0,0,0,0);
}

.inquiry input:focus,.inquiry textarea:focus {
    border:solid 1px #8d785a;
}
	
.form_text{
		font-size: 12px;
		line-height: 1.3;
		padding: 8px 0px;
	}

.entry_btn{
	text-align: center;
	padding: 30px 0;
}

.entry_btn input{
	background: #E67F47;
	color: #fff;
	border: none;
	padding: 10px 30px;
	border-radius: 5px;
	-webkit-appearance : none;
	-webkit-tap-highlight-color : rgba(0,0,0,0);
}

.entry_btn input:hover{
	cursor: pointer;
	background: #F68F57;
	transition:0.3s;
}

.ctext{
	background: #FFF;
	color: #888;
	font-size: 16px;
	padding: 20px 0 0;
	
}

.ctext p{
	width: 80%;
	max-width: 700px;
	margin: 0 auto;
	line-height: 1.3;
}
	
	.ctext a{
		color: #0078c9;
	}

	
.newsblock {
    margin: 40px auto;
}

.news_container {
width: 90%;
max-width:1000px;
margin: 50px auto;
}
.news_title {
color: #000000;
text-align: center;
font-size: 20px;
font-weight: bold;
}
.news_list {
margin: 20px 0;
border-top: 1px dashed #000000;
}
.news_list li {
padding: 15px 5px;
border-bottom: 1px dashed #000000;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.date {
font-size: 16px;
margin-right: 10px;
}

.news_text a {
color: #333;
}
.news_btn {
text-align: center;
margin-top: 50px;
}
.news_btn a {
color: #000000;
}
.btn {
color: #75b46e;
padding: 10px 50px;
background: #fff;
border: 2px solid #000000;
border-radius: 50px;
transition: all 0.5s;
}
.btn:hover {
color: #fff;
background: #000000;
}

@media screen and (max-width: 559px) {
.news_container {
width: 90%;
padding: 0 20px;
}
.news_text a {
display: block;
margin-top: 10px;
text-overflow: ellipsis;
overflow: hidden;
}
}

.blog_flex {
    padding: 45px;
    max-width: 1070px;
    margin: 0 auto;
}

h1.entry-title {
    border-left: 5px solid #000000;
    padding: 0 0 0 10px;
    font-size: 24px;
    margin-bottom: 15px;
    line-height: 100%;
}

.postdateposition {
    text-align: right;
    margin-bottom: 30px;
}

.blog_flex p {
    line-height: 2em;
}

.archives_midashi {
    margin-bottom: 20px;
}

.top_recruit.sub_mv.top_archives {
    height: 200px;
}

.archiveslist {
    margin-bottom: 10px;
}


@media only screen and (min-width:320px) and (max-width:600px) {

/*-------contact-----------------------*/
form{
	width: 100%;
	padding-top: 30px;
}

.inquiry{
	margin: 0 auto;
	max-width: 500px;
}

.inquiry tr{
	width: 100%;
}

.cflex{
	display: flex;
	color: #888;
}

.hissu{
	width: 50px;
	background: #E67F47;
	padding-top:2px;
	color: #FFF;
	border-radius: 3px;
	text-align: center;
	margin-left: 10px;
}

.inquiry th{
	width: 25%;
	padding: 15px 0 15px 30px;
	font-size: 16px;
	font-weight: 200;
}

.inquiry td{
	width: 70%;
	max-width: 100px;
}

.inquiry input{
	width: 90%;
	font-size: 16px;
	line-height: 1;
	padding: 7px 0 5px 15px;
	border:solid 1px #888;
	border-radius: 5px;
	-webkit-appearance : none;
	-webkit-tap-highlight-color : rgba(0,0,0,0);
}

#radio input{
	width:10px;
	height:10px;
	padding:3px;
}

#radio input:checked{
	background:#00c1f1;
}

.mwform-radio-field-text{
	font-size: 16px;
	line-height: 1;
}
	

.inquiry textarea{
	width: 95%;
	height: 100px;
	font-size: 16px;
	padding: 5px 0 8px 15px;
	border:solid 1px #888;
	border-radius: 5px;
	-webkit-appearance : none;
	-webkit-tap-highlight-color : rgba(0,0,0,0);
}

.inquiry input:focus,.inquiry textarea:focus {
    border:solid 1px #8d785a;
}
	
.form_text{
		font-size: 12px;
		line-height: 1.3;
		padding-top: 8px;
	}

.entry_btn{
	text-align: center;
	padding: 30px 0;
}

.entry_btn input{
	background: #E67F47;
	color: #fff;
	border: none;
	padding: 10px 30px;
	border-radius: 5px;
	-webkit-appearance : none;
	-webkit-tap-highlight-color : rgba(0,0,0,0);
}

.entry_btn input:hover{
	cursor: pointer;
	background: #F68F57;
	transition:0.3s;
}

.ctext{
	background: #FFF;
	color: #888;
	font-size: 16px;
	padding: 20px 0 0;
	
}

.ctext p{
	width: 80%;
	max-width: 700px;
	margin: 0 auto;
	line-height: 1.3;
	
}
	
.ctext a{
		color: #0078c9;
	}


	
.inquiry{
	width: 100%;
	margin: 0 auto;	
	
}

.inquiry tr{
	width: 95%;
	padding-right: 15px;
	display: block;
	padding: 0;
	margin: 0;
}
	


.inquiry tr th{
	width: 80%;
	padding: 0 0 5px;
	margin: 0 auto;
	font-size: 16px;
	color: #aaa;
	font-weight: 200;
	display: flex;
}

.inquiry tr td{
	width: 80%;
	max-width: 360px;
	display: block;
	padding: 0 10px 15px;
	margin: 0 auto;
}

.inquiry input{
	width: 100%;
	font-size: 15px;
	line-height: 1;
	padding: 7px 0 5px 5px;
	border:solid 1.5px #ccc;
	border-radius: 5px;
}

.inquiry textarea{
	width: 95%;
	height: 100px;
	font-size: 15px;
	padding: 5px 0 8px 15px;
	border:solid 1.5px #ccc;
	border-radius: 5px;
}

.inquiry input:focus,.inquiry textarea:focus {
    border:solid 1px #8d785a;
}

.entry_btn{
	text-align: center;
	padding: 30px 0;
}

.entry_btn input{
	background: #E67F47;
	color: #fff;
	border: none;
	padding: 10px 30px;
	border-radius: 3px;
}

	
	
}

@media only screen and (max-width:600px) {
div#news {
    width: 98%;
    margin: 0 auto;
}
	
#news {
    position: relative;
    left: 10px;
    bottom: 30px;
    width: calc(100%);
    opacity: 0;
    z-index: 3;
}
div#bnr_simulator img {
    width: 100%;
}
#bnr_simulator {
    position: revert;
    bottom: 30px;
    right: 60px;
    opacity: 0;
    z-index: 3;
}
.nav li {
    list-style: none;
    position: relative;
    height: 20px;
}
.flex_list_border.recruittable .right {
    padding: 5px 0 10px;
}
.title_normal.back_white p {
    padding: 2%;
    width: 96%;
}
.flex_list_border ul {
    width: 100%;
    margin-bottom: 80px;
    padding-bottom: 10px;
}
p.recruittabletext {
    padding: 10px;
}
.flex_list_border {
    width: 90%;
    margin: 0 auto 50px;
}
}