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

/*========== nav ==========*/

nav {
	padding-top		: 2px;
	padding-bottom	: 1px;
	background		: url(../img/bg_top_slider01.png) no-repeat center bottom;
}

/*========== slider ==========*/

#slider {
	width	: auto;
	position: relative;
	z-index	: 0;
}

#slideImg01 {
	margin	: 0 auto;
	position: absolute;
	top		: 0;
	left	: 0;
	z-index	: 2;
}

#slideImg02 {
	height		: 71px;
	margin-left	: -840px;
	text-align	: center;
	position	: absolute;
	bottom		: 0;
	left		: 50%;
	z-index		: 2;
}

@media screen and (max-width: 767px) {
	#slideImg02 {
		display: none;
	}
}

/*========== mainBlock ==========*/

#mainBlock {
	width:auto;
	margin	: -41px auto 0 auto;
}

section {
	width	: 1080px;
	margin	: 0 auto;
	overflow: hidden;
}

#contentsBlock {
	width:auto;
	float:none !important;
}

@media screen and (max-width: 767px) {
	#mainBlock {
		margin	: 0 auto;
	}
	section {
		width	: 100%;
		padding:  0 15px;
		box-sizing: border-box;
	}
}

/*----- SDGs -----*/
#SDGs {
	margin-top		: -30px;
	padding-bottom	: 36px;
}
#SDGs > h2{
    position: relative;
    margin: 10px 0;
    padding: 0 50px;
	text-align: center;
}
#SDGs > h2 span{
	margin: 0 auto;
}
#SDGs div{
	margin: 0 50px;
}
#SDGs .txtArea{
	text-align: left;
	margin-top: 20px;
	margin-bottom: 20px;
}

#SDGs .scroll_txt{
	display: none;
}
#SDGs .scroll table td{
	padding: 10px;
}
#SDGs .scroll table tbody tr:nth-child(2) td div{
	display: flex;
	justify-content: center;
	align-items: center;
}
#SDGs .scroll table tbody tr:nth-child(2) td:nth-child(2) div figure:first-child{
	margin-right: 10px;
}

@media screen and (max-width: 767px){
	#SDGs {
		margin-top: 20px;
	}
	#SDGs>h2 {
		position: relative;
		padding: 0;
		display: flex;
		align-items: center;
	}
	#SDGs>h2:before,
	#SDGs>h2:after {
		content: "";
		height: 1px;
		flex-grow: 1;
		background-color: #4b3d2d;
		width: auto;
		position: relative;
		border: none;
	}
	#SDGs>h2.h04 span img {
		max-width: 500px;
	}
	#SDGs>figure {
		max-width: 85%;
		margin: 0 auto;
	}
	#SDGs div {
		margin: 0 auto;
	}

	#SDGs .scroll{
		overflow: auto;
	}
	#SDGs .scroll table.tableStyle01{
		table-layout: auto;
		width: 600px;
	}
	#SDGs .scroll table tbody tr:nth-child(2) td div figure{
		max-width: 58px;
	}
}

@media screen and (max-width: 630px){
	#SDGs .txtArea{
		margin-bottom: 25px;
	}
	#SDGs .scroll_txt{
		display: block;
		text-align: left;
		margin-bottom: 5px;
	}
}

/*----- sec01 -----*/

#sec01 {
	position		: relative;
	padding-bottom	: 36px;
	background		: url(../common/img/bg/bg_common_001.jpg) no-repeat 50px 13px,
					  url(../common/img/bg/bg_common_002.jpg) no-repeat 976px 3px,
					  url(../common/img/bg/bg_common_003.jpg) no-repeat 0 395px,
					  url(../common/img/bg/bg_common_004.jpg) no-repeat 945px 426px;
	z-index			: 6;
}

.topHn {
	clear			: left;
	overflow		: hidden;
	margin-bottom	: 2px;
}

	.topHn h2,
	.topHn p {
		float	: left;
	}
	
	.topHn h2 {
		margin	: 0 10px 0 160px !important;
	}
	.topHn p.spStyle {
		display: none;
	}

.worryBox {
	width			: 427px;
	height			: 160px;
	margin-bottom	: 20px;
	float			: left;
}

	.worryBox>h3 {
		margin		: 25px 0 13px 127px;
		padding-left: 15px;
		font-size	: 16px;
		color		: #f87104;
		line-height	: 43px;
	}
	
		.worryBox>h3 span {
			margin-left	: -25px;
		}
		
	.worryBox>p {
		width		: 235px;
		margin-left	: 180px;
		text-align	: left;
	}

	#worry01 { background: url(../img/p_top_001.png) no-repeat 0 0; margin-left: 59px;}
	#worry02 { background: url(../img/p_top_002.png) no-repeat 0 0; margin-left: 50px;}
	#worry03 { background: url(../img/p_top_003.png) no-repeat 0 0; margin-left: 139px;}
	#worry04 { background: url(../img/p_top_004.png) no-repeat 0 0; margin-left: 51px;}
	#worry05 { background: url(../img/p_top_005.png) no-repeat 0 0; margin-left: 59px;}
	#worry06 { background: url(../img/p_top_006.png) no-repeat 0 0; margin-left: 51px;}

	.hn01 { background:url(../common/img/hn/hn_001.png) no-repeat 0 0; text-align:left;}
	.hn02 { background:url(../common/img/hn/hn_002.png) no-repeat 0 0; text-align:left;}
	.hn03 { background:url(../common/img/hn/hn_003.png) no-repeat 0 0; text-align:left;}



@media screen and (max-width: 767px) {
	#sec01 {
		position		: relative;
		margin-top		: 20px;
		background		: none;
		z-index			: 6;
	}
	.topHn {
		display			: block;
		margin-bottom	: 20px;
	}
	.topHn h2 {
		margin		: 0 0 0 0 !important;
		padding		: 0 0 0 0 !important;
		line-height	: 1;
	}
	.topHn p.pcStyle {
		display	: none;
	}
	.topHn p.spStyle {
		display		: block;
		margin-top	: 5px;
	}
	.topHn p.spStyle img {
		max-width: 230px;
		width: 100%;
	}
	.topHn h2,
	.topHn p {
		float	: none;
	}

	.worryBox {
		width			: 100%;
		min-height		: 160px;
		height			: auto;
		margin-bottom	: 20px;
		float			: left;
	}
	.worryBox>h3 {
		margin		: 0;
		padding-left: 15px;
		font-size	: 16px;
		color		: #f87104;
		line-height	: 43px;
	}
	.worryBox>p {
		width: calc(100% - 38%);
		margin-left: 38%;
		text-align: left;
		padding-top: 5%;
		min-height: 32vw;
	}
	#worry01 { background: url(../img/p_top_001.png) no-repeat 0 90%; margin-left: 0; background-size: 35% auto;}
	#worry02 { background: url(../img/p_top_002.png) no-repeat 0 90%; margin-left: 0; background-size: 35% auto;}
	#worry03 { background: url(../img/p_top_003.png) no-repeat 0 90%; margin-left: 0; background-size: 35% auto;}
	#worry04 { background: url(../img/p_top_004.png) no-repeat 0 90%; margin-left: 0; background-size: 35% auto;}
	#worry05 { background: url(../img/p_top_005.png) no-repeat 0 90%; margin-left: 0; background-size: 35% auto;}
	#worry06 { background: url(../img/p_top_006.png) no-repeat 0 90%; margin-left: 0; background-size: 35% auto; margin-bottom: 0;}
}
/*----- sec02 -----*/

#sec02 {
	margin-bottom	: 6px;
	padding			: 0 0 10px 0;
}

  #sec02>h2 {
    position	: relative;
    margin		: 12px 0 25px 0;
	padding		: 0 50px;
  }
  
	  h2.h04 {
		margin-top	: 0;
		border-bottom: none !important;
	  }
	  
		  h2.h04:before {
			width		: 980px;
			height		: 1px;
			position	: absolute;
			top			: 50%;
			content		: "";
			display		: block;
			border-top	: solid 1px #4b3d2d;
			z-index		: 1;
		  }
	  
	  h2.h04 span {
		margin		: 0 0 0 415px;
		position	: relative;
		padding		: 0 20px;
		background	: #fff9eb;
		z-index		: 5;
	  }

table {
	margin	: 0 auto 13px auto;
}

	table th {
		width		: 245px;
		text-align	: center;
	}
	
	table td {
		padding			: 5px 12px;
		text-align		: left;
		vertical-align	: top;
	}

.table02 {
	width	: 980px;
}

.table02 {
	width	: 760px;
}

#sec02 div.spStyle{
	display: none;
}

@media screen and (max-width: 767px) {
	#sec02 {
		padding: 0 15px;
	}
	#sec02>h2 {
	  position		: relative;
	  padding		: 0;
	  display		: flex;
	  align-items	: center;
	}
	h2.h04 span {
		margin		: 0 auto;
		padding		: 0 10px;
	}
	h2.h04 span img {
		max-width: 90px;
		width: 100%;
	}
	#sec02>h2:before,
	#sec02>h2:after {
		content: "";
		height: 1px;
		flex-grow: 1;
		background-color: #4b3d2d;
		width: auto;
		position: relative;
		border: none;
	}
	#sec02 table{
		display: none;
	}
	#sec02 div.spStyle{
		display: block;
	}
	#sec02 div.spStyle ul{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#sec02 div.spStyle ul li{
		max-width: calc((100% / 2) - 10px);
		width: 100%;
		margin-bottom: 20px;
	}
	#sec02 div.spStyle ul li figure{
		margin-bottom: 10px;
	}
	#sec02 div.spStyle ul li p{
		text-align: left;
	}
}

/*----- sec03 -----*/

#sec03 {
	padding	: 0 0 30px 0;
}

#sec03_2 {
	padding	: 0 0 60px 0;
}

#tel,#blank {
	position	: relative;
	width		: 880px;
	margin		: 0 auto;
}

#tel span,
#blank span {
	position: absolute;
	top		: 60px;
	left	: 268px;
}


.mainFooter {
	clear			: both;
	position		: relative;
	width			: 880px;
	margin			: 0 auto 30px auto;
	border			: 7px solid #e5d3c9;
	background-color: #fff;
	box-sizing		: border-box;
    display			: flex;
    justify-content	: space-between;
    float			: none !important;
}

#sec03_2 .mainFooter {
	margin			: 0 auto ;
}

.mainFooter div.left {
	width: calc(100% - 305px);
}

.mainFooter div.left p {
	color		: #4c3c2d;
	font-weight	: bold;
}

.mainFooter div.left p.title {
	font-size: 18px;
	margin: 1em auto;
	line-height: 1;
}

.mainFooter div.left p.title br.spStyle {
	display: none;
}

.mainFooter div.left div.flex {
	display: flex;
	margin-left: 20px;
}

.mainFooter div.left div.flex div.txtArea {
	margin-top: 3px;
	margin-right: 15px;
}
.mainFooter div.left div.flex div.txtArea p:first-child {
	font-size: 28px;
	line-height: 1.2;
}
.mainFooter div.left div.flex div.txtArea p:first-child img {
	margin-right: 3px;
}
.mainFooter div.left div.flex div.txtArea p:last-child {
	font-weight: normal;
	font-size: 12px;
}
.mainFooter figure.spStyle {
	display: none;
}


@media screen and (max-width: 767px) {
	#tel,#blank {
		width		: 100%;
	}

	#sec03 {
		padding	: 0 15px;
	}
	
	#sec03_2 {
		padding	: 0 15px 30px 15px;
	}

	.mainFooter figure.pcStyle {
		display: none;
	}
	.mainFooter figure.spStyle {
		display: block;
		margin: 15px auto;
	}
	.mainFooter div.left p.title br.spStyle {
		display: block;
	}
	.mainFooter {
		max-width	: 350px;
		width		: 100%;
		display		: block;
	}
	.mainFooter img {
		max-width: 100%;
		height: auto;
	}
	.mainFooter div.left {
		width: 100%;
		float: none !important;
	}
	.mainFooter div.left p.title {
		margin: 1em auto 0.5em;
	}
	.mainFooter div.left div.flex {
		display: block;
		margin-left: 0;
	}
	.mainFooter div.left div.flex div.txtArea {
		float: none !important;
	}
	.mainFooter div.left div.flex div.txtArea p:last-child {
		margin: 5px auto;
	}
}

/*----- sec04 -----*/

#sec04 {
	width			: 984px;
	border-top		: 1px dotted #bfbbb0;
	margin			: 40px auto;
	padding			: 20px 0;
}

	#sec04 iframe {
		margin	: 20px;
	}



@media screen and (max-width: 767px) {
	#sec04 {
		width			: 100%;
		margin			: 0 auto;
	}
}

#contentsBlock > .slider-wrapper{
	display: none !important;
}

@media screen and (max-width: 767px) {
	img{
		max-width: 100%;
		height: auto;
	}

	#contentsBlock {
		padding: 0;
	}
	#slider{
		display: none !important;
	}

	
	#contentsBlock > .slider-wrapper{
		display: block !important;
	}
	.bx-controls{
		width: 100%;
		position: absolute;
		top: 50%;
		left: 0%;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
	}
	.slider-wrapper {
		overflow: hidden;
	}
	
	.slider {
		position: relative;
		left: 5vw; /* (100vw - SlideWidth) / 2 */
		overflow: visible !important;
	}
	
	.slide {
		width: 90vw !important;
		height: 100%;
	}
	
	.slide p {
		margin-left: auto;
		margin-right: auto;
		padding: 6px;
	}
	
	.slide p img {
		width: 100%;
		height: auto;
	}
	
	/* bxSlider */
	.bx-wrapper {
		box-shadow: none;
		border: none;
		margin: 0;
		position: relative;
	}
}