@charset "utf-8";

.column_area {
	border-top: 1px solid #181715;
	border-bottom: 1px solid #181715;
}


.bg_main {
	background-color: #dcdcdc;
}



.scrollBox01 {
	overflow: auto;
}

@media screen and (max-width: 767px) {
	.scrollBox01 {
		overflow: auto;
	}
}

.blog_area_top_01 {
	background-color: #fff;
	border: 1px solid #bbbbbb;
	padding: 15px;
	max-height: 240px;
	margin-bottom: 0px;
}

@media screen and (max-width: 767px) {
	.blog_area_top_01 {
		max-height: 200px;
		margin-bottom: 20px;
		padding: 15px;
	}
}

.blog_area_top_02 {
	background-color: #fff;
	padding: 30px;
	max-height: 350px;
	margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
	.blog_area_top_02 {
		max-height: 200px;
		margin-bottom: 30px;
		padding: 0px;
	}
}


.d_box{
	height: 358px;
}
@media screen and (max-width: 767px) {
	.d_box{
		display: none;
	}
}


.d_box + div .txt{
	padding: 2rem;
	border:2px solid #fff;
	color:#fff;
}

.bg_top01 {
	background: url(../img/top/bg_01.jpg) right top no-repeat #fff;
	padding: 60px 0 0;
	-webkit-background-size: auto;
	background-size: auto;
}

.bg_top02 {
	background: url(../img/top/bg_02.jpg) left top no-repeat #fff;
	padding: 60px 0 0;
	-webkit-background-size: auto;
	background-size: auto;
}

.bg_top03 {
	background: url(../img/top/bg_03.jpg) right top no-repeat #fff;
	padding: 60px 0 0;
	-webkit-background-size: auto;
	background-size: auto;
}

.bg_content {
	background: url(../img/common/bg_ptn_01.png) repeat left top;
}

@media screen and (max-width: 767px) {

	.bg_top01,
	.bg_top02,
	.bg_top03 {
		padding: 15px;
		-webkit-background-size: cover;
		background-size: cover;
		background-position: center center;
	}

	.top_u_txt {
		padding-bottom: 20px;
		height: auto;
	}
}


.bg_top_white {
	position: absolute;
	left: 0;
	bottom: 60px;
	max-width: 100%;
	background: rgba(255, 255, 255, 0.8);
	padding: 30px;
	/*	border: #2d2d2d 1px solid;
*/
}

.bg_top_white_1 {
	background: rgba(255, 255, 255, 1);
	padding: 60px 20px;
}

@media screen and (max-width: 767px) {

	.bg_top_white {
		padding: 15px;
		position: relative;
		left: 0;
		bottom: auto;
		top: 0;
	}
}




/*slider css　トップスライダー
-------------------------------------*/
.wideslider_outer {
	position: relative;
	min-height: 370px;
}

.wideslider {
	width: 100%;
	text-align: left;
	position: relative;
	overflow: hidden;
}



@media screen and (max-width : 767px) {
	.wideslider_outer {
		position: relative;
		min-height: auto;
	}

	.wideslider_outer .slide_txt {
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		width: 100%;
		padding: 20px;
		margin: 0;
	}

}

.wideslider ul,
.wideslider ul li {
	float: left;
	display: inline;
	overflow: hidden;
}

.wideslider ul li img {
	width: 100%;
	display: none;
}

.wideslider_base {
	top: 0;
	position: absolute;
}

/*.wideslider > img{
	position: absolute;
	z-index: 100;
	bottom: 150px;
	left: 360px;
}*/
.slider_txt {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 90%;
	background: url(../img/top/slider_txt.png) no-repeat top center / cover;
}

.wideslider_wrap {
	top: 0;
	position: absolute;
	overflow: hidden;
}

.slider_prev,
.slider_next {
	top: 0;
	overflow: hidden;
	position: absolute;
	z-index: 100;
	cursor: pointer;
}

.slider_prev {
	background: url(../img/top/arrow_l.png) no-repeat 10% center;
}

.slider_next {
	background: url(../img/top/arrow_r.png) no-repeat 90% center;
}

.pagination {
	bottom: 23px;
	left: 0;
	width: 100%;
	height: 15px;
	text-align: center;
	position: absolute;
	z-index: 200;
}

.pagination a {
	margin: 0 5px;
	width: 15px;
	height: 15px;
	display: inline-block;
	overflow: hidden;
	background: #fff;
	border: 2px solid #000;
}

.pagination a.active {
	/*filter:alpha(opacity=100)!important;*/
	background-color: #a69acc;
	-moz-opacity: 1 !important;
	opacity: 1 !important;
	border: 0;
}


/* =======================================
		ClearFixElements
======================================= */
.wideslider ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.wideslider ul {
	display: inline-block;
	overflow: hidden;
}


.topslider_outer {
	position: relative;
}

/*bxslider css
-------------------------------------*/
/*bxslider css
-------------------------------------*/

.topslider_outer {
	position: relative;
}


.slide figure img {
	border: 1px solid #000;
	overflow: hidden;
	padding: 5px;
	background-color: #fff;
	margin-bottom: 15px;
}

/**/
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style] {
	width: 100% !important;
}

/* =======================================
		top_exterior
======================================= */
.top_exterior{
	background:url(../img/top/bg_exterior.png) no-repeat top center / cover;
}

.top_exterior .left_area{
	font-size: 5rem;
	font-weight: bold;
}

.top_exterior .left_area span{
	font-size: 7rem;
}

.top_exterior .right_area{
	position: relative;
}

.top_exterior .right_area .button{
	margin-top: 40%;
}
	.top_exterior .f_roboto{
		padding: 2rem;
		background: rgba(255,255,255,.5)
	}

@media screen and (max-width : 767px ) {
	.top_exterior .left_area{
		font-size: 8vw;
	}

	.top_exterior .left_area span{
		font-size: 10vw;
	}

	.top_exterior .f_roboto{
		padding: 2rem;
		background: rgba(255,255,255,.5)
	}
}



.bg_main {
	text-align: left;
}
.bg_main .btn_02{
	width: 400px;
	max-width:100%;
}

@media screen and (max-width : 767px ) {
	.bg_main .btn_02{
		width: 90%;
	}
}

.bg_main figure{
	display: block;
	width: 100%;
	height: 62vh;
	max-height: 371px;
	overflow: hidden;
	background: url(../img/top/flow_img.png) no-repeat center center / cover;
}

.bg_main .txt{
	height: 100%;
	padding: 3rem 0;
}

.bg_main .ttl{
	font-weight: bold;
	font-size: 2.4rem;
}

.bg_main .ttl span{
	display: block;
	color:#a69acc;
	font-size: 1.4rem;
	text-transform: uppercase;
}

.bg_main .s_ttl{
	display: inline-block;
	margin: 1.5rem 0;
	font-size: 2.5rem;
	border-bottom: 2px solid #161616;
	font-weight: bold;
}

.bg_main .left_area{
	justify-content: flex-end;
}

.bg_main .bg_black{
	color:#fff;
}
.bg_main .bg_black .s_ttl{
	border-color: #fff;
}
.bg_main .bg_black figure{
	background: none;
	/*background: url(../img/top/flow_img02.png) no-repeat center center / cover;*/
}


