@charset "utf-8";
/* CSS Document */

.main-bg {
width:1000px;
margin:0 0 50px 0;
padding:0;
background:url(../img/index/main-bg.jpg) no-repeat 0 0;
overflow: hidden;
}
.main-bg:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .main-bg {
    height: 1em;
    overflow: visible;
}
/**/


.header {
position:relative;
width:1000px;
height:122px;
}

h1 {
float:left;
width:412px;
height:122px;
margin:0px 0;
background:url(../img/index/logo.jpg) no-repeat 0 0;
text-indent:-9998em;
}
h1 a {
width:412px;
height:122px;
margin:0px 0;
padding:0;
background:url(../img/index/logo.jpg) no-repeat 0 0;
display:block;
text-decoration:none;
text-indent:-9998em;
}

.tel {
float:right;
margin:20px 50px;
width:223px;
height:73px;
background:url(../img/base/tel.gif) no-repeat 0 0;
text-indent:-9998em;
}
p.domain {
text-align:right;
margin:50px 50px 0 0;
color:#CCCCCC;
font-size:1.2em;
}





/* ナビ
-----------------------------------*/
.navi-index {
clear:both;
position:relative;
float:right;
width:211px;
margin:310px 160px 0 0;
padding:0;
overflow: hidden;
}
.navi-index:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html .navi-index {
    height: 1em;
    overflow: visible;
}
/**/
.navi-index ul {
margin:0;
padding:0;
list-style:none;
}
.navi-index li {
width:211px;
height:43px;
margin:0;
padding:0;
text-indent:-9998em;
}
.navi-index li a {
width:211px;
height:43px;
margin:0;
padding:0;
display:block;
}
.navi-index li.ni1 {
background:url(../img/index/navi.gif) no-repeat 0 0;
}
.navi-index li.ni1 a {
background:url(../img/index/navi.gif) no-repeat 0 0;
}
.navi-index li.ni1 a:hover {
background:url(../img/index/navi.gif) no-repeat -211px 0;
}
.navi-index li.ni2 {
background:url(../img/index/navi.gif) no-repeat 0px -43px;
}
.navi-index li.ni2 a {
background:url(../img/index/navi.gif) no-repeat 0px -43px;
}
.navi-index li.ni2 a:hover {
background:url(../img/index/navi.gif) no-repeat -211px -43px;
}
.navi-index li.ni3 {
background:url(../img/index/navi.gif) no-repeat 0px -86px;
}
.navi-index li.ni3 a {
background:url(../img/index/navi.gif) no-repeat 0px -86px;
}
.navi-index li.ni3 a:hover {
background:url(../img/index/navi.gif) no-repeat -211px -86px;
}
.navi-index li.ni4 {
background:url(../img/index/navi.gif) no-repeat 0px -129px;
}
.navi-index li.ni4 a {
background:url(../img/index/navi.gif) no-repeat 0px -129px;
}
.navi-index li.ni4 a:hover {
background:url(../img/index/navi.gif) no-repeat -211px -129px;
}
.navi-index p.btn-map {
width:61px;
height:24px;
margin:10px 0 0 20px;
padding:0;
background:url(../img/base/btn-map.jpg) no-repeat 0 0;
text-indent:-9998em;
}
.navi-index p.btn-map a {
width:61px;
height:24px;
margin:0;
padding:0;
background:url(../img/base/btn-map.jpg) no-repeat 0 0;
text-indent:-9998em;
text-decoration:none;
display:block;
}
.navi-index p.btn-map a:hover {
background:url(../img/base/btn-map.jpg) no-repeat 0 -24px;
}


.container-sdgs {
clear: both;
	padding: .5rem 2rem;
	margin: 1rem 0;
	border:#ccc solid 4px;
	border-radius: 2rem;
    opacity: 0; /* 最初は非表示にしておく */
    transition: all 2s; /* 動きを滑らかに */
}
.fadeIn {
    opacity: 1;
}
.container-sdgs h2 {
font-size: 1.2rem;	
margin: 1.0rem 0;
	color: #333;
}
.container-sdgs p {
font-size: 1.0rem;
}