/* ------ base ----- */
body{
color: #575757;
margin: 0;
font-family: "Times New Roman", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "メイリオ", Meiryo, serif;
font-size: 14px;
}

.main{
opacity:0;
}


a{
color:#06C;
}
a:hover{
color:#418DD9;
}


/*ヘッダーPCメニュー
---------------------------------------------------------------------------*/
header{
width: 100%;
height: 80px;
position: fixed;
z-index: 9999;
background-color: #fff;
padding-top: 15px;
}

@media(max-width:768px){
header{
display:none;
}
}


.header_inner{
max-width: 1100px;
margin: 0 auto;
}

.header_logo{
float: left;
width: 25%;
padding: 0;
top: 10px;
left:10px;
position: relative;
}

.header_logo img{
width:100%;
}

.news_txt{
	float:left;
width:450px;
padding:10px 0 0 20px;
margin-left:25px;
font-weight:bold;
}

.menu_box{
float: left;
width: 50%;
margin-left: 25%;
padding-top:15px;
}

.menu_box span{
padding-left:10px;
}


#menu{
	display: table;
	table-layout: fixed;
	width: 100%;
	list-style: none;
}

.menu1{
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	color: #b0ab87;
	font-size: 14px;
}

.menu1 a{
	color: #575757;
	text-decoration:none;
	padding:15px;
	display:block!important;
}

.menu1 a:hover{
	color: #7bc1a5;
	text-decoration: none;
}


ul.child{
	display: none;
	position: absolute;
	width:200px;
	z-index:9999;
	list-style:none;
	padding:10px 0 0 0;
}

ul.child li a{
	border-bottom: 1px solid #D3D3D3;
	padding: 20px 0px 20px 0px;
	display: block;
	width:180px;
	background-color: rgb(53, 53, 53);
	border-left:none;
	border-bottom:1px solid #4C4C4C;
}
ul.child li a:hover{
	background-color:#444;
}

/*スマホ用ヘッダーメニュー
---------------------------------------------------------------------------*/
.side-open .site,
.side-open .overlay {
	-webkit-transform: translate3d(0%, 0, 0);
	transform: translate3d(0%, 0, 0);
}

@media(max-width:768px){
.side-open .site,
.side-open .overlay {
	-webkit-transform: translate3d(-50%, 0, 0);
	transform: translate3d(-50%, 0, 0);
}
}

@media(max-width:480px){
.side-open .site,
.side-open .overlay {
	-webkit-transform: translate3d(-70%, 0, 0);
	transform: translate3d(-70%, 0, 0);
}
}

/* --------------------------------------------------- btn */
.btn__box {
	position: relative;
	text-align: center;
	z-index: 1;
}

.btn__box a {
	display: block;
	width: 198px;
	height: 38px;
	margin: 0 auto;
	line-height: 40px;
	font-size: 13px;
	color: #1a1e24;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
	border: 1px solid #1a1e24;
}

.btn__box a:hover {
	color: #fff !important;
	background: #1a1e24;
}

.btn__box--svg {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 214px;
	height: 54px;
	margin: auto;
	z-index: -1;
}

.btn__box--svg rect {
	fill: transparent;
	stroke: #1a1e24;
	stroke-width: 1px;
	stroke-dasharray: 242px;
	stroke-dashoffset: 256px;
	-webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

.btn__box a:hover + .btn__box--svg rect {
	stroke-width: 2px;
	stroke-dasharray: 600px;
	stroke-dashoffset: 0;
}

/* --------------------------------------------------- side menu */
.sp_header_wrap{
display:none;
}

@media(max-width:768px){
.sp_header_wrap{
display:block;
width: 100%;
position: fixed;
padding: 0;
height: 80px;
z-index: 999999;
background-color: #FFF;
box-shadow: 0px 1px 10px rgba(0,0,0,0.3);
}

}

.header_logo_sp{
position: absolute;
z-index: 99999;
margin-left: 2%;
margin-top:1%;
margin-bottom:2px;
top: 25%;
}

.header_logo_sp img {
    width: 250px;
    padding-right: 2%;
}

.news_txt{
display:block;
	width:100%;
	padding:10px 0 5px 0;
	height:20px;
	font-weight:bold;
}

.side-menu {
display:none;
}

@media(max-width:768px){
.side-menu {
	margin-top:2%;
display:block;
	position: fixed;
	top: 0;
	right: -50%;
	box-sizing: border-box;
	width: 50%;
	height: 100%;
	padding-top: 80px;
	padding-bottom: 50px;
	text-align: left;
	font-size: 15px;
	background: RGBA(87, 87, 87, 0.9);
	z-index: -999;
-webkit-transition: all .5s ease;
transition: all .5s ease;
opacity:0;
overflow-x: hidden;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
}
}


@media(max-width:480px){
.side-menu {
	right: -70%;
	width: 70%;
}
}

.side-menu_on {
z-index: 999;
-webkit-transition: all .5s ease;
transition: all .5s ease;
opacity:1;
overflow-y: auto;
right: 0;
}

.site_on {
position:fixed;
overflow-y:hidden;
}

.side-menu__ul {
	width: 100%;
	height: 100%;
	display: block;
	overflow: auto;
}

.side-menu__ul span {
padding-left:10px;
}

.side-menu__ul--child {
	display: none;
}

.active .side-menu__ul--child {
	display: block;
}

.side-menu__ul li a {
border-top: 1px solid #848484;
}

.side-menu__ul--child li a {
	display: block;
	padding: 8px 0 8px 32px;
	color: #ccc;
border-top: 1px solid #848484;
}

.side-menu__ul > li > a,
.side-menu__ul > li h5 {
	display: block;
	padding: 10px 0 10px 20px;
	color: #fff;
}

.side-menu__ul h5 {
	font-weight:normal;
	cursor: pointer;
	-webkit-transition: all .5s;
	transition: all .5s;
}

.side-menu__ul > li > h5:after {
	content: ' +';
	color: #ffd800;
	font-size: 20px;
}

.side-menu__ul > li.active h5:after {
	content: ' -';
}

.side-menu__ul > li > h5:hover,
.side-menu__ul > li a:hover {
	background: #6b6b6b;
	color: #fff;
}

/* --------------------------------------------------- ellipsis btn */
.side-menu-btn {
	position: absolute;
	top: 6px;
	right: 20px;
	width: 40px;
	height: 40px;
	padding: 5px;
	cursor: pointer;
	z-index: 4;
	margin-top:20px;
}

.ellipsis-v {
	position: relative;
	display: block;
	cursor: pointer;
	width: 30px;
	height: 30px;
}

.ellipsis-v .point {
	position: absolute;
	left: 0;
	right: 0;
	display: block;
	width: 35px;
	height: 4px;
	margin: auto;
	background: #3db9a5;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.ellipsis-v .point.top {
	top: 0;
}

.ellipsis-v .point.mid {
	top: 0;
	bottom: 0;
}

.ellipsis-v .point.bot {
	bottom: 0;
}

.side-menu-btn:hover .top {
	-webkit-transform: translateY(-2px);
	-ms-transform: translateY(-2px);
	transform: translateY(-2px);
}

.side-menu-btn:hover .bot {
	-webkit-transform: translateY(2px);
	-ms-transform: translateY(2px);
	transform: translateY(2px);
}

.side-open .side-menu-btn:hover .top,
.side-open .top {
	width: 41px;
	height: 2px;
	background: #3db9a5;
	-webkit-transform-origin: left top;
	-ms-transform-origin: left top;
	transform-origin: left top;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.side-open .mid {
	opacity: 0;
}

.side-open .side-menu-btn:hover .bot,
.side-open .bot {
	width: 41px;
	height: 2px;
	background: #3db9a5;
	-webkit-transform-origin: left bottom;
	-ms-transform-origin: left bottom;
	transform-origin: left bottom;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.side-open .side-menu-btn:hover .bot,
.side-open .side-menu-btn:hover .top {
	background: #ccc;
}


/*メイン
---------------------------------------------------------------------------*/

#wrapper{
min-height: calc(100vh - 680px);
padding-top:50px;
}


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

.top_image{
width: 100%;
background-image: url("../images/main_visual.jpg");
background-position: center 50%;
background-repeat: no-repeat;
background-size: cover;
height:600px;
}

.top_image2{
width: 100%;
background-image: url("../images/main_visual2.jpg");
background-position: center 50%;
background-repeat: no-repeat;
background-size: cover;
}

.top_image3{
width: 100%;
background-image: url("../images/main_visual3.jpg");
background-position: center 50%;
background-repeat: no-repeat;
background-size: cover;
}

#logo_anime1 {
    z-index: 1;
    top: 0;
    left: 0;
    opacity: 0;
}

#logo_anime1 img {
width:100%;
max-width:1100px;
margin:0 auto;
}

@media(max-width:768px){
#logo_anime1 img {
max-width: 500px;
margin:0 ;
}

.top_image{
height:450px;
}


}



.sub_concept{
max-width:1100px;
margin:0 auto;
overflow:hidden;
}

.top_info h2,.sub_concept h2,.top_content_wrap h2{
font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
color: #3db9a5;
font-size: 30px;
font-weight: normal;
text-align: center;
border-bottom: 1px solid lightgray;
padding: 30px;
margin-top:30px;
margin-bottom: 60px;
letter-spacing: 0.05em;
line-height:1.3em;
}

.equipment_inner h2,.profile_inner h2{
font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
color: #3db9a5;
font-size: 30px;
font-weight: normal;
text-align: center;
border-bottom: 1px solid lightgray;
padding: 30px;
margin-top:30px;
margin-bottom: 30px;
letter-spacing: 0.05em;
line-height:1.3em;
}

.top_info {
    max-width: 1100px;
    margin: 0 auto;
    overflow: hidden;
}

.info_box {
	max-width: 1020px;
    margin: 0 auto 50px;
    overflow: hidden;
	padding: 40px;
	background: #eefcfaad;
}

.news-list{
  list-style: none outside;
  margin: 0;
  padding: 0;
}

.news-list .item a{
  display: flex;
  flex-wrap: wrap;
  flex-wrap: nowrap;
  text-decoration: none;
  color: #575757;
  border-bottom: 1px dotted #CCC;
  padding: 20px 20px;
}

.news-list .item a:hover{
  color: #7bc1a5;
}




.news-list .item:first-child a{
  border-top: 1px dotted #CCC;
}
.news-list .item .date{
  margin: 0;
  min-width: 120px;
  font-size: 16px;
  color: #999;
  padding: 0 20px 0 0;
}
.news-list .item .title{
  margin: 0;
  width: 100%;
  line-height: 1.6em;
}
.news-list .item a:hover .title{
  color: #000;
}

@media screen and (max-width: 767px){
.info_box {
	max-width: 100%;
    margin: 0 30px 50px;
    overflow: hidden;
	padding: 20px;
	background: #eff9f8;
}

.news-list .item a{
  flex-wrap: wrap;
}
.news-list .item .date{
  min-width: 100px;
}
.news-list .item .title{
  margin-top: 10px;
}
}




.sub_concept_box{
width:33.3%;
float:left;
padding:0 30px 30px 30px;
box-sizing:border-box;
}

.sub_concept_box img{
width:100%;
}

.sub_concept_box h3{
font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
font-size: 21px;
padding: 20px 0 15px 0;
text-align:center;
}

.sub_concept_box .txt{
font-size:14px;
line-height:1.7em;
}


@media(max-width:768px){
.sub_concept_box{
width:100%;
float:none;
padding:0 20px 30px 20px;
}
.sub_concept_box h3{
font-size: 18px;
padding: 0px 0 15px 0;
}
.tab_box_l{
width: 40%;
display: table-cell;
}
.tab_box_r{
width: 60%;
display: table-cell;
vertical-align: middle;
padding: 0 0 0 4%;
}
}

@media(max-width:480px){
.sub_concept_box{
padding:0 20px 50px 20px;
}
.sub_concept_box h3{
font-size: 18px;
padding: 15px 0 15px 0;
}
.tab_box_l{
width: 100%;
display: block;
}
.tab_box_r{
width: 100%;
display: block;
padding: 0;
}
}

/*TOP_content
---------------------------------------------------------------------------*/
.top_content_wrap{
padding-bottom:60px;
}

.top_content_inner{
max-width:1100px;
margin:0 auto;
overflow:hidden;
line-height: 1.7em;
}


.box_left_table{
width:50%;
display: table-cell;
vertical-align: middle;
padding:0 20px 0 20px;
}

.box_left_table img{
width:100%;
}

.box_right_table{
width:50%;
display: table-cell;
vertical-align: middle;
padding:0 20px 0 20px;
}

.box_right_table p{
font-size:14px;
}


@media(max-width:480px){
.box_left_table{
width:100%;
display: block;
padding:0;
}
.box_right_table{
width:100%;
display: block;
padding:0;
}
.box_right_table p{
padding:10px 20px 10px 20px;
}
}


.about_box{
overflow: hidden;
background-color: rgba(255, 255, 255, 0.85);
padding: 40px 0 40px 0;
}

.about_box h3{
font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
font-size: 26px;
font-weight: normal;
color:#555;
padding: 0 0 2% 2%;
}

.about_box .box_left_float{
width: 54%;
float: left;
padding: 0 2% 0 4%;
}

.box_left_float p{
text-align:right;
}

.box_left_float span{
font-size:26px;
color:#0da2b6;
position: relative;
top: 3px;
}

@media(max-width:768px){
.box_left_float p{
text-align:right;
padding-right:20px;
}
}


.about_box .box_left_float img{
width:100%;
}

.about_box .box_right_float{
width: 34%;
float: left;
padding: 0 4% 0 2%;
}

.about_box .box_right_float p{
font-size:14px;
}


@media(max-width:768px){
.about_box h3{
text-align:center;
padding: 0 0 5% 2%;
}
.about_box .box_left_float{
width: 100%;
float: none;
padding: 0;
}
.about_box .box_right_float{
width: 100%;
float: none;
padding: 2% 5% 0 5%;
box-sizing: border-box;
text-align: center;
}
.about_box .box_left_float img{
padding: 0 5% 0 5%;
box-sizing: border-box;
}
}

.tel{
font-size: 40px;
color: #3db9a5;
}

/*button
---------------------------------------------------------------------------*/
.button1 {
font-family: "Times New Roman", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "メイリオ", Meiryo, serif;
    border: 3px double #ffffff;
    padding: 15px;
    color: #fff;
    background-color: #3db9a5;
    font-size: 14px;
    letter-spacing: 0.1em;
}

.button1:hover {
    background-color: #57d0bc;
}




/*profile
---------------------------------------------------------------------------*/

.profile_image{
width: 100%;
background-image: url("../images/profile_main.jpg");
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
}

#logo_anime2 {
    z-index: 1;
    top: 0;
    left: 0;
    opacity: 0;
}

#logo_anime2 img {
width:100%;
max-width:1100px;
margin:0 auto;
}

@media(max-width:768px){
#logo_anime2 img {
max-width: 500px;
margin:0 ;
}
}


.profile_wrap{
padding-bottom:60px;
}

.profile_inner{
max-width:1100px;
margin:0 auto;
overflow:hidden;
line-height: 1.7em;
}


.profile_inner h3{
text-align:center;
font-weight:normal;
font-size:16px;
padding:0 15px 30px 15px;
}

.profile_inner span{
    color: #000;
    top: 5px;
    position: relative;
}

.profile_box_left_table{
width:50%;
display: table-cell;
vertical-align: top;
padding:0 20px 0 20px;
}

.profile_box_left_table img{
width:100%;
}

.profile_box_right_table{
width:50%;
display: table-cell;
vertical-align: top;
padding:0 20px 0 20px;
}

.profile_box_right_table p{
font-size:14px;
}


@media(max-width:768px){
.profile_box_left_table{
width:80%;
display: block;
padding:0;
margin:0 auto;
}
.profile_box_right_table{
width:80%;
display: block;
padding:15px 20px 0 20px;
margin:0 auto;
}
}

.profile th{
white-space: nowrap;
text-align:left;
padding: 2px 20px 2px 0;
}

.profile_box{
padding:15px 0 0 0;
}




/*equipment
---------------------------------------------------------------------------*/

.equipment_image{
width: 100%;
background-image: url("../images/profile_main.jpg");
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
}

#logo_anime3 {
    z-index: 1;
    top: 0;
    left: 0;
    opacity: 0;
}

#logo_anime3 img {
width:100%;
max-width:1100px;
margin:0 auto;
}

@media(max-width:768px){
#logo_anime3 img {
max-width: 500px;
margin:0 ;
}
}


.equipment_wrap{
padding-bottom:60px;
}

.equipment_inner{
max-width:1100px;
margin:0 auto;
overflow:hidden;
line-height: 1.7em;
}

.equipment_inner h3{
text-align:center;
font-weight:normal;
font-size:16px;
padding:0 15px 30px 15px;
}

.equipment_box{
padding:30px 0 30px 0;
border-bottom:1px dashed lightgray;
}

.equipment_box_left_table{
width:50%;
display: table-cell;
vertical-align: middle;
padding:0 20px 0 20px;
}

.equipment_box_left_table img{
width:100%;
}

.equipment_box_right_table{
width:50%;
display: table-cell;
vertical-align: top;
padding:0 20px 0 20px;
}

.equipment_box_right_table p{
font-size:14px;
}


@media(max-width:768px){
.equipment_box_left_table{
width:80%;
display: block;
padding:0;
margin:0 auto;
}
.equipment_box_right_table{
width:80%;
display: block;
padding:15px 20px 0 20px;
margin:0 auto;
}
}

/*background
---------------------------------------------------------------------------*/
.bg_green {
background-color:#eafffc;
}


.bg_about{
background-image: url("../images/top_content1_bk.jpg");
background-repeat: no-repeat;
background-size:cover;
background-position: center top;
}



/* ------ footer ----- */

.site-footer {
	font-size: 13px;
	text-align: center;
	position: relative;
	z-index: 10;
}

.footer_nav {
	width: 100%;
	height: auto;
	overflow: hidden;
	padding: 50px 0 50px 0;
	background-color: #3db9a5;
	line-height: 1.7em;
}

.footer_nav ul {
	max-width: 1000px;
	margin: 0 auto;
	list-style: none;
}

.footer_nav ul a{
	display: inline-block;
}

.site-footer a {
	color: #FFF;
}

.site-footer a:hover {
	color: #eaeaea;
}

.footer_nav ul li {
	padding: 10px;
}

.site-info {
	margin: 0 auto;
	padding: 10px 0;
	width: 100%;
	background-color: #fff;
	clear: both;
}

.site-info a {
	color: #575757;
}

.site-info a:hover {
	color: gray;
}

@media(max-width:768px){
.site-footer {
	padding-left: 0px;
}
.footer_nav {
	padding: 0;
}
.footer_nav ul a{
	display: block;
}
.footer_nav ul {
	padding: 0;
}
.footer_nav ul li {
	padding: 15px 0 15px 0;
	font-size: 13px;
	background-color: #3db9a5;
	border-top: 1px solid #FFF;
	margin: 0;
}
}



/*マージン
---------------------------------------------------------------------------*/
.pdb30{
padding-bottom:30px;
}


/*PC表示非表示
---------------------------------------------------------------------------*/
.tab_on,.sp_on{
	display:none;
}

@media(max-width:768px){
.tab_on{
	display:block;
}
}

@media(max-width:480px){
.sp_on{
	display:block;
}
}

.tab_none,.sp_none{
display:block;
}

@media(max-width:768px){
.tab_none{
	display:none;
}
}

@media(max-width:480px){
.sp_none{
	display:none;
}
}


div.clear {
clear: both;
}



/*トップへボタン
--------------------------- */
#page-top {
	width:0px;
	height:0px;
	position: fixed;
	right: 80px;
	z-index:9999;
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}

.arrow{
	position: relative;
	display: inline-block;
	padding: 0 0 0 16px;
	color: #E0E0E0;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
}
.arrow::before,
.arrow::after{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}

.posi::before{
	top:-60px;
	width: 50px;
	height: 50px;
background: #868686;
    border-radius: 10px;
}
.posi::after{
	top:-45px;
	left:11px;
	width: 25px;
	height: 25px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

#page-top:hover {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";
}

@media(max-width:768px){
#page-top:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
}


/*アンカーリンクスマホのメニュー高さ分ネガティブマージン
---------------------------------------------------------------------------*/
#link_main {
	position:absolute;
	padding-top:50px;
	margin-top:-50px;
}

@media(max-width:768px){
#link_news,#link_service,#link_about,#link_contact,#link_main {
	position:absolute;
	padding-top:50px;
	margin-top:-50px;
}
}