﻿@charset "utf-8";


/*-------------------------------------------------
共通設定
-------------------------------------------------*/
* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

body, tr, td, th, p, div, dd, dt, li, a {
    color: #000;
    font-family:'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    text-decoration: none;
}



img {
    border: 0 none;
    margin: 0;
    padding: 0;
    vertical-align: bottom;
}

.clear {
    clear: both;
}

html {
    overflow-y: scroll;
}


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


a:hover {
    text-decoration: none;
}
a img{
	opacity:1;
}
a:hover img{
	opacity:0.5;
}

/*=========display=========*/

.I_block { display: inline-block; }

/*-------------------------------------------------
文字
-------------------------------------------------*/
/**/
.a_right{ text-align:right;}
.a_right_p{ padding-left:700px; font-size:12px; margin-top:-50px; letter-spacing:1px;}
.a_right_p img{ margin-bottom:5px;}
.a_center{ text-align:center;}
.a_left{ text-align:left;}

/*===============================================
●style.css 画面の横幅が769px以上
===============================================*/
@media print, screen and (min-width: 769px){


body{min-width:1000px;/*viewportと同じピクセル数がのぞましい*/}
.sp{display:none;}
.pc{display:block;}
img{max-width:100%;height:auto;}



/*-------------------------------------------------
レイアウト
-------------------------------------------------*/
body{ 
	text-align:center;
	font-size:83%;
	line-height:1.4;
	color:#4A4A4A;
/*	background: url(../../images/base/body_bg_top.gif) top center repeat-x;*/
	font-family:'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
	_padding-left:1px;
	padding-bottom:0px;
	}

body.top_bg_top{ background:url(../../images/base/body_bg_top.gif) top center repeat-x;} 
body.top_bg_second{ background:url(../../images/base/body_bg_second.gif) top center repeat-x;} 


/*headerの背景別指定(製品紹介ページのみタイトル画像「長」)*/
.box_top_bg_second_s{ background:url(../images/base/body_bg_second.gif) top center repeat-x; text-align:center;}
.box_top_bg_second_l{ background:url(../images/base/body_bg_second_l.gif) top center repeat-x;}

/*-------------------------------------------------
TOP画像バック
-------------------------------------------------*/
.bg_top_image{ background:url(../../images/top/bg_top_main.jpg) top center no-repeat; width:100%; margin:0 auto; text-align:center;}

.frame1000{ width:1000px; margin:0 auto; text-align:left;}


/*-------------------------------------------------
header
-------------------------------------------------*/
#header{ width:1000px; height:83px;background:url(../../images/base/header_bg.gif) top center no-repeat;}

#header .header_logo{ position:relative; float:left; width:250px; height:75px; text-justify: auto; font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;}
#header .header_logo img{ position:absolute; z-index:100; top:0px; left:0px;}
#header .header_logo h1{ position:absolute; z-index:1000; top:7px; left:65px; font-size:12px; letter-spacing:0.4em; font-weight:bold; color:#368539;}

#header .header_c{ float:left; width:483px; height:75px;}
#header .header_c h1{ height:20px;/* color:#898989;*/ font-size:10px; letter-spacing:1px;}
#header .header_c img{ float:right; margin-right:61px; margin-top:3px;}
#header .header_r{float: right;width: 171px;height:75px;}
#header .header_r p{ text-align:right; height:20px; margin-bottom:0px; color:#FF6600; font-size:10px; letter-spacing:1px;}
#header .header_r p a{ color:#696969; text-decoration:none;}
#header .header_r p a:hover{ color:#696969; border-bottom:1px solid;}
#header .header_r ul{ width:267px; height:55px;}
#header .header_r ul.header_btn_01 li{ background:url(http://www.ecosmile-e.co.jp/images/base/header_btn_02.gif) center top no-repeat;width:171px; height:55px;}
#header .header_r ul.header_btn_01 li a{ display:block;_display:inherit}
#header .header_r ul.header_btn_01 li a:hover{ display:block;}
#header .header_r ul.header_btn_01 li a:hover img{ visibility:hidden;}
#header .header_r ul.header_btn_01 li:hover img{ visibility:hidden;}

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


#footer{ clear:both; background: url(../../images/base/footer_bg.gif) center bottom no-repeat; height:300px; text-align:center; margin:20px auto;}
#footer p{ margin:0 auto;}
#footer p.footer_navi{ text-align:center; height:260px; font-size:10px; letter-spacing:1px;}
#footer p.footer_navi a{ color:#4A4A4A; text-decoration:none;}
#footer p.footer_navi a:hover{ border-bottom:1px solid;}
#footer p.copy_r{ text-align:right; color:#429239;font-size: 10px;}




/*-------------------------------------------------------------
main_navi（メニューボタン）
-------------------------------------------------------------*/
#main_navi{ height:50px;}
#main_navi ul{padding-top:2px;}
#main_navi ul li{ float:left; height:45px; margin-right:5px;}

/*#main_navi ul li a{height:45px;display:block;}*/
#main_navi ul li a{display:block;_display:inherit;}
#main_navi ul li a:hover{ display:block;}
#main_navi ul li a:hover img{ visibility:hidden;}
#main_navi ul li:hover img{ visibility:hidden;}

#main_navi ul li.navi_home{ background:url(../../images/base/navi/01_home_02.gif) center top no-repeat; width:70px;}
#main_navi ul li.navi_product{ background:url(../../images/base/navi/02_product_02.gif) center top no-repeat; width:88px;}
#main_navi ul li.navi_flow{ background:url(../../images/base/navi/03_flow_02.gif) center top no-repeat; width:88px;}
#main_navi ul li.navi_description{ background:url(../../images/base/navi/04_description_02.gif) center top no-repeat; width:88px;}
#main_navi ul li.navi_example{ background:url(../../images/base/navi/05_example_02.gif) center top no-repeat; width:88px;}
#main_navi ul li.navi_indemnity{ background:url(../../images/base/navi/06_indemnity_02.gif) center top no-repeat; width:88px;}
#main_navi ul li.navi_qa{ background:url(../../images/base/navi/07_qa_02.gif) center top no-repeat; width:88px;}
#main_navi ul li.navi_action{ background:url(../../images/base/navi/08_action_02.gif) center top no-repeat; width:88px;}
#main_navi ul li.navi_company{ background:url(../../images/base/navi/09_company_02.gif) center top no-repeat; width:88px;margin-right:0px;}
#main_navi ul li.navi_powerplant{ background:url(../../images/base/navi/10_powerplant_02.gif) center top no-repeat; width:88px;}
#main_navi ul li.navi_mente{ background:url(../../images/base/navi/11_mente_02.gif) center top no-repeat; width:88px;}


/*20180910改修*/
#main_navi_pd{ width: 100%; padding-bottom: 3px; background: url(../../images/base/navi/gn_line_01.gif) left bottom repeat-x; height: 42px; margin-bottom: 5px;}
#main_navi_pd a{ text-decoration: none; font-size: 1.1em;}
#main_navi_pd ul{ font-weight: bold;}
#main_navi_pd ul li{ position: relative; float: left; border-left: 1px solid #e5e5e5; border-right: 1px solid #fff; background:url(../../images/base/navi/gn_bg_01.gif) left top repeat-x; }
#main_navi_pd ul li a{ display: block; margin: 0; width: 230px; height: 42px;color: #000; line-height: 2.7; text-align: center;}
#main_navi_pd ul li.btn_gn_home a{ background: url(../../images/base/navi/gn_home_01.png) center 14px no-repeat; width: 70px; text-indent: -9999px;}
#main_navi_pd ul li.btn_gn_home a:hover{ background: url(../../images/base/navi/gn_home_02.png) center 14px no-repeat; background-color: #159a18;}
#main_navi_pd ul li ul{ position: absolute; top: 43px; left: 0; z-index: 1000; width: 100%; margin: 0; padding: 0;}
#main_navi_pd ul li ul li{ width: 100%; height: 0; border: none; -webkit-transition: all 0.2s ease;-moz-transition: all 0.2s ease;transition: all  0.2s ease; overflow: hidden; *zoom:1;}
#main_navi_pd ul li ul li a{ background: #0e7c11; color: #FFF; margin-bottom: 1px;}

#main_navi_pd ul > li:hover > a { background:#159a18; color: #fff;}
#main_navi_pd ul > li:hover li:hover > a {  background: #ff5d03; color: #fff;}
#main_navi_pd ul > li:hover > ul > li { overflow: visible; height: 32px; margin-bottom: 11px;}






/*-----------------------------------------------------------------
テーブル用BOX
-----------------------------------------------------------------*/
.box_t_01{ margin:10px 10px 20px 10px;}
.box_t_01 table{font-size:1em; width:980px; border-collapse:collapse;}
.box_t_01 table th{ border-bottom:solid 1px #CCCCCC; padding:5px 15px; line-height:1.4;}
.box_t_01 table td{ border-bottom:solid 1px #CCCCCC; padding:5px 15px;line-height:1.4;}
.box_t_01 table td .f_right_photo{ float:right; padding-top:10px; padding-bottom:10px;}
.box_t_01 table td dl{ margin-bottom:10px;}
.box_t_01 table td p.mb_no{ margin-bottom:0px;}
.box_t_01 table td dl dt{}
.box_t_01 table td dl dd{ margin-left:5em; margin-top:-1.4em;}

.box_t_02{ margin:10px 10px 20px 10px;}
.box_t_02 table{font-size:1em; width:500px; border-collapse:collapse; margin-bottom:10px; background:#DDF3DA;}
.box_t_02 table th{ border:solid 1px #CCCCCC; padding:5px 15px; line-height:1.4; text-align:center;}
.box_t_02 table th.hosyouhinmoku{ padding:0px; width:133px;}
.box_t_02 table td{ border:solid 1px #CCCCCC; padding:5px 15px;line-height:1.4; text-align:center;}

.box_t_03{ margin:10px 10px 20px 10px;}
.box_t_03 table{ width:980px; margin-bottom:20px; font-size:1em; border-collapse:collapse; border:1px solid #666666;}
.box_t_03 table p.text_sub{ padding:5px 0px 0px 0px;/* background:#D7ECEC;*/ color:#999999;}
.box_t_03 table th{ background:#E5E5E5; padding:10px 20px; border:1px solid #666666;}
.box_t_03 table td{ padding:10px 10px; border:1px solid #666666;}







/*固定ボタン*/

.btn_kotei_powerplant{ position:fixed; right:0px;  z-index:100;}
.btn_kotei_powerplant a{}
.btn_kotei_powerplant a:hover img{opacity: 0.5; filter: alpha(opacity=50); -moz-opacity: 0.5;}







/*トップへもどる*/
p.back_top{ text-align:right;padding:20px 0px 20px 0px; clear:both;}

p.link_contents_top{ text-align:right; margin-top:-3em; padding-right:10px; padding-bottom:5px;}
























}


/*===============================================
●smart.css  画面の横幅が768pxまで
===============================================*/
@media screen and (max-width:768px){


body{-webkit-text-size-adjust: 100%;}
.sp{display:block;}
.pc{display:none;}
img{max-width:100%;height:auto;}
a{display:block;}



body, tr, td, th, p, div, dd, dt, li, a {
	font-size:0.95em;
}



/*-------------------------------------------------
header
-------------------------------------------------*/
#header{}
#header .h_inner h1{
	left:65px; 
	font-size:0.7em; 

	font-weight:bold; 
	color:#368539;
}

#header .h_inner h2{
	max-width: 150px;
	margin:0 0 0 0;	
}

#header .h_inner{
overflow:hidden;
}
#header .head_left{
	float:left;

}


#header .head_right{

}

#header .head_right .tel{
	font-size:2.0em;
	font-weight:bold;
	line-height:0.8em;

}

#header .head_right .txt{
	font-size:0.4em;
}

/*-------------------------------------------------
   CLEARFIX ELEMENTS
-------------------------------------------------*/

    #menuList {
        display: none;
    }
 
    #rwdMenuWrap {
        width: 51%;
        float:right;
    }
 
    #rwdMenuWrap #switchBtnArea {
        width: 100%;
        height: 60px;
        background: #fff;
        position: relative;
    }
 
    #rwdMenuWrap #switchBtnArea #switchBtn {
        top: 10px;
        right: 10px;
        width: 40px;
        height: 40px;
        display: block;
        background: #a7a7a7;
        position: absolute;
        border-radius: 5px;
    }
 
    #rwdMenuWrap #switchBtnArea #switchBtn span {
        left: 20%;
        width: 60%;
        height: 4px;
        display: block;
        position: absolute;
        background-color: #fff;
        border-radius: 5px;
        transition: all 0.2s linear;
    }
    #rwdMenuWrap #switchBtnArea #switchBtn span:nth-of-type(1) {
        top: 10px;
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    #rwdMenuWrap #switchBtnArea #switchBtn span:nth-of-type(2) {
        top: 18px;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    #rwdMenuWrap #switchBtnArea #switchBtn span:nth-of-type(3) {
        bottom: 10px;
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
 
    #rwdMenuWrap #switchBtnArea #switchBtn.btnClose span:nth-of-type(1) {
        top: 18px;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    #rwdMenuWrap #switchBtnArea #switchBtn.btnClose span:nth-of-type(2) {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    #rwdMenuWrap #switchBtnArea #switchBtn.btnClose span:nth-of-type(3) {
        bottom: 18px;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
 
    #rwdMenuWrap ul {
        width: 100%;
        display: none;
		position:absolute;
		padding: 0;
		box-shadow: 0px 7px 7px rgba(0,0,0,0.3);
		z-index: 999;
    }
 
    #rwdMenuWrap ul li {
        width: 100%;
        border-bottom: #aaa 1px solid;
        font-size:0.8em;
    }
 
    #rwdMenuWrap ul li a {
        padding: 15px 20px;
        text-align: left;
        display: block;
        background: #ebebeb;
        position: relative;
		color: #000000;
    }
 
    #rwdMenuWrap ul li a:after {
        content: '';
        margin-top: -4px;
        top: 50%;
        left: 46%;
        width: 8px;
        height: 8px;
        color: #888;
        font-size: 1em;
        font-weight: bold;
        line-height: 1.2em;
        display: block;
        position: absolute;
        border-top: 2px solid #b0b0b0;
        border-right: 2px solid #b0b0b0;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
 
    #contents {
        width: 100%;
    }
 
    #contents p {
        padding: 0 20px 2em 20px;
    }

 
/* ------------------------------
   CLEARFIX ELEMENTS
------------------------------ */
#menuList > ul:before,
#menuList > ul:after {
    content: " ";
    display: table;
}
#menuList > ul:after {clear: both;}
#menuList > ul {*zoom: 1;}


/*-------------------------------------------------
footer
-------------------------------------------------*/
/*#footer{ clear:both; background: url(../../images/base/footer_bg.gif) center bottom no-repeat; height:300px; text-align:center;}
#footer p{ margin:0 auto;}
#footer p.footer_navi{ text-align:center; height:260px; font-size:77%; letter-spacing:1px;}
#footer p.footer_navi a{ color:#4A4A4A; text-decoration:none;}
#footer p.footer_navi a:hover{ border-bottom:1px solid;}*/
#footer p.copy_r{
	text-align:center;
	color:#429239;
	font-size:0.8em;
	padding: 2px 0;
}
#footer .f_logo{
	max-width: 230px;
	margin:auto;
}

/*トップへもどる*/
p.back_top{ text-align:center; clear:both;}














}


/*-----------------------------------------------------------------
2022.02/footerボタン×3追加
-----------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	#sp_bottom_menu{ position: fixed; bottom: -5px; left: 0; z-index: 9999;}
	#sp_bottom_menu ul{}
	#sp_bottom_menu ul li{ float: left; width: 33.333%;}
	#sp_bottom_menu ul li a{ display: block;}
}
@media screen and (min-width: 768px) {
	#sp_bottom_menu{ display: none;}
}




