@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&subset=japanese');

h3.top_ttl {
	font-family: din-condensed, sans-serif;
	font-weight: 700;
    font-style: normal;
}
@media sreen and (min-width:1025px) {
	h3.top_ttl {
		font-size:20px;
	}
}
@media screen and (min-width:768px) and (max-width:1024px) {
	h3.top_ttl {
		font-size:1.8em;
	}
}
@media screen and (max-width:767px) {
	h3.top_ttl {
		font-size:3em;
	}
}

/*-----------------------------------------
  #main01
------------------------------------------*/
/*+++++----- for PC -----+++++*/
#main01 li .e_ttl {
	font-family:'EB Garamond', serif;
}
#main01 li a {
	display:block;
}
#main01 li a .e_ttl {
	text-decoration:underline;
}
#main01 li a:hover .e_ttl {
	text-decoration:none;
}
@media screen and (min-width:1025px) {
	#main01 {
		overflow:hidden;
		margin-bottom:50px;
	}
	#main01 li {
		width:340px;
		float:left;
		margin-right:15px;
		font-size:14px;
	}
	#main01 li a:hover {
		color:rgba(0,0,0,0.5);
	}
	#main01 li:nth-of-type(3) {
		margin-right:0;
	}
	#main01 figure {
		margin-bottom:5px;
		overflow:hidden;
	}
	#main01 .e_ttl {
		font-size:16px;
		margin-bottom:5px;
	}
	#main01 a figure img {
		transition: transform 0.5s linear;
		-webkit-transition:-webkit-transform 0.5s linear;
	}
	#main01 a:hover figure img {
		transform: scale(1.2);
		-webkit-transform:scale(1.2);
	}
}

/*+++++----- for tablet -----+++++**/
@media screen and (min-width:768px) and (max-width:1024px) {
	#main01 {
		overflow:hidden;
		margin-bottom:3em;
	}
	#main01 li {
		font-size:0.6em;
		width:32%;
		margin-right:1.9%;
		float:left;
	}
	#main01 li:nth-of-type(3) {
		margin-right:0;
	}
	#main01 .e_ttl {
		font-size:1.2em;
		margin-bottom:0.2em;
	}
	#main01 li figure {
		margin-bottom:0.2em;
	}
}

/*+++++----- for SP -----+++++*/
@media screen and (max-width:767px) {
	#main01 {
		margin-bottom:3em;
	}
	#main01 figure {
		margin-bottom:0.4em;
	}
	#main01 .e_ttl {
		font-size:1.6em;
		margin-bottom:0.4em;
	}
	#main01 li {
		margin-bottom:1.6em;
	}
}



/*-----------------------------------------
  #main02
------------------------------------------*/
/*+++++----- for PC -----+++++*/
@media screen and (min-width:1025px) {
	#main02 {
		overflow:hidden;
		margin-bottom:50px;
	}
	#main02 .sp_contents {
		width:610px;
		float:left;
	}
	#main02 .sp_contents .ttl_btn {
		overflow:hidden;
		margin-bottom:30px;
	}
	#main02 .sp_contents h3.top_ttl {
		float:left;
		margin:5px 30px 0px 0px;
	}
	#main02 .sp_contents .ttl_btn .btn {
		float:left;
	}
	#main02 .sp_contents ul {
		overflow:hidden;
	}
	#main02 .sp_contents li {
		float:left;
		margin:0 10px 10px 0px;
		font-size:14px;
		width:300px;
	}
	#main02 .sp_contents li:nth-of-type(even) {
		margin-right:0;
	}
	#main02 .sp_contents li figure {
		margin-bottom:5px;
	}
	#main02 .top_voice {
		width:430px;
		float:right;
	}
	#main02 .top_voice .ttl_btn {
		overflow:hidden;
		margin-bottom:30px;
	}
	#main02 .top_voice  h3.top_ttl {
		float:left;
		margin:5px 30px 0px 0px;
	}
	#main02 .top_voice .ttl_btn .btn {
		float:left;
	}
	#main02 .top_voice .voice_content {
		background:#000;
		padding:25px 45px;
		position:relative;
	}
	#main02 .bx-wrapper a.bx-prev {
		left:-10%;
		top:40%;
		height:100%;
		background:url(../images/top/voice_prev.png) no-repeat;
		background-size:20%;
	}
	#main02 .bx-wrapper a.bx-next {
		right:-23%;
		top:40%;
		height:100%;
		background:url(../images/top/voice_next.png) no-repeat;
		background-size:20%;
	}
	#main02 .top_voice .bx-wrapper .bx-viewport {
		overflow:hidden;
	}
	#main02 .top_voice ul.voice_slider {
		width:1000% !important;
	}
	#main02 .top_voice li figure {
		width:240px;
		float:left;
	}
	#main02 .top_voice li .right_text {
		width:80px;
		float:right;
		margin-top:10px;
	}
	#main02 .top_voice .address {
		font-weight:bold;
		margin-bottom:20px;
		font-size:14px;
	}
	#main02 .top_voice a .address {
		color:#fff;
		text-decoration:underline;
	}
	#main02 .top_voice a:hover .address {
		color:rgba(255,255,255,0.5);
		text-decoration:none;
	}
	#main02 .top_voice .name {
		font-size:12px;
		line-height:1.5;
	}
	#main02 .top_voice a .name {
		color:#b2b2b2;
	}
}

/*+++++----- for tablet -----+++++**/
@media screen and (min-width:768px) and (max-width:1024px) {
	#main02 {
		overflow:hidden;
		margin-bottom:3em;
	}
	#main02 h3.top_ttl {
		margin-bottom:0.3em;
	}
	#main02 .sp_contents {
		width:73%;
		float:left;
	}
	#main02 .sp_contents li {
		width:48%;
		float:left;
		margin:0 2% 0.6em 0;
		font-size:0.6em;
	}
	#main02 .sp_contents li:nth-of-type(even) {
		margin-right:0;
	}
	#main02 li figure {
		margin-bottom:0.4em;
	}
	#main02 .voice_ban {
		float:right;
		width:26%;
		margin-top:2.3em;
	}
}

/*+++++----- for SP -----+++++*/
@media screen and (max-width:767px) {
	#main02 {
		margin-bottom:3em;
		font-size:0.8em;
	}
	#main02 a {
		text-decoration:underline;
	}
	#main02 .sp_contents {
		background:#f2f1f1;
		padding:2.5em 0;
		margin-bottom:3em;
	}
	#main02 h3.top_ttl {
		text-align:center;
		margin-bottom:0.7em;
	}
	#main02 ul {
		width:85%;
		margin:0 auto;
		overflow:hidden;
	}
	#main02 li {
		width:47%;
		float:left;
		margin:0 3% 1em 0;
	}
	#main02 li:nth-of-type(even) {
		margin-right:0;
	}
	#main02 li figure {
		margin-bottom:0.4em;
	}
	#main02 .voice_ban {
		width:85%;
		margin:0 auto;
	}
	#main02 .voice_ban figure {
		margin-bottom:0.4em;
	}
}


/*-----------------------------------------
  #main03
------------------------------------------*/
#main03 ul {
	width:1000% !important;
}
#main03 ul.slider li {
	float:left;
}
#main03 .bx-wrapper .bx-viewport {
	overflow:hidden;
}
#main03 .bx-caption {
	text-align:center;
	overflow:hidden;
}
#main03 a .bx-caption {
	color:#fff;
}
#main03 a .bx-caption .more {
	text-decoration:underline;
}
#main03 a:hover .bx-caption .more {
	text-decoration:none;
}
/*+++++----- for PC -----+++++*/
@media screen and (min-width:1025px) {
	#main03 {
		margin-bottom:50px;
	}
	#main03 h3.top_ttl {
		margin-bottom:20px;
	}
	#main03 .bx-wrapper a.bx-prev {
		left:5%;
		top:35%;
		height:100%;
		background:url(../images/top/slider_prev.jpg) no-repeat;
		background-size:10%;
	}
	#main03 .bx-wrapper a.bx-next {
		right:-8%;
		top:35%;
		height:100%;
		background:url(../images/top/slider_next.jpg) no-repeat;
		background-size:10%;
	}
	#main03 .bx-caption .caption_inner {
		width:70%;
		margin:0 auto;
		position:relative;
	}
	#main03 .bx-caption {
		padding:1.5em 0;
	}
	#main03 .bx-caption .logo {
		width:50%;
		float:left;
		margin-right:4em;
	}
	#main03 .bx-caption .address {
		float:left;
		margin-top:0.5em;
		font-size:0.8em;
		font-weight:bold;
	}
	#main03 .bx-caption .more {
		position:absolute;
		right:0;
		top:3em;
		font-size:0.6em;
	}
}
/*+++++----- 追加 -----+++++**/

.banner_area {
	margin: 30px auto 90px;
	text-align: center;
	max-width: 1000px;
	padding: 30px;
	border: solid 1px #000;
	}
.banner_area img {
	width: 100%;
	}
@media screen and (max-width:1024px) {
.banner_area {
	margin: 30px auto 90px;
	text-align: center;
	max-width: 90%;
	padding: 30px;
	border: solid 1px #000;
	}
/*+++++----- for tablet -----+++++**/
@media screen and (min-width:768px) and (max-width:1024px) {
	#main03 {
		margin-bottom:3em;
	}
	#main03 h3.top_ttl {
		margin-bottom:0.3em;
	}
	#main03 .bx-wrapper a.bx-prev {
		left:5%;
		top:40%;
		background:url(../images/top/slide_prev.jpg) no-repeat;
		background-size:20%;
		height:100%;
	}
	#main03 .bx-wrapper a.bx-next {
		right:-8%;
		top:40%;
		height:100%;
		background:url(../images/top/slide_next.jpg) no-repeat;
		background-size:20%;
	}
	#main03 .bx-caption .caption_inner {
		width:85%;
		margin:0 auto;
		position:relative;
	}
	#main03 .bx-caption {
		padding:1.5em 0;
	}
	#main03 .bx-caption .logo {
		width:50%;
		float:left;
		margin-right:4em;
	}
	#main03 .bx-caption .address {
		float:left;
		margin-top:0.5em;
		font-size:0.8em;
		font-weight:bold;
	}
	#main03 .bx-caption .more {
		position:absolute;
		right:0;
		top:3em;
		font-size:0.6em;
	}
}

/*+++++----- for SP -----+++++*/
@media screen and (max-width:767px) {
	#main03 h3.top_ttl {
		margin-bottom:0.3em;
	}
	#main03 .bx-wrapper a.bx-prev {
		left:5%;
		top:35%;
		background:url(../images/top/mob_slideprev.jpg) no-repeat;
		background-size:40%;
	}
	#main03 .bx-wrapper a.bx-next {
		right:-8%;
		top:35%;
		background:url(../images/top/mob_slidenext.jpg) no-repeat;
		background-size:40%;
	}
	#main03 .bx-caption .caption_inner {
		width:80%;
		margin:0 auto;
		position:relative;
	}
	#main03 .bx-caption {
		padding:1.6em 0 6em 0;
	}
	#main03 .bx-caption .address {
		font-size:1.2em;
		text-align:left;
		font-weight:bold;
	}
	#main03 .bx-caption .more {
		position:absolute;
		right:0;
		bottom:-5em;
		font-size:1em;
	}
	#main03 .bx-caption .logo {
		width:70%;
		margin-bottom:3%;
	}
}