@charset "utf-8";

/**
 *
 * TopPage
 *
 */

/*===============================================
●index.css 画面の横幅が641px以上
===============================================*/
@media screen and (min-width: 641px){
img{
    max-width: 100%;
    height: auto;
    width /***/:auto;　;
}
/* MAIN VISUAL */
.main-visual {
	position: relative;
	width: 960px;
	margin: 15px auto;
	box-sizing: border-box;
}

.main-visual-swiper {
	width: 100%;
	box-sizing: border-box;

	position: relative;
}
.main-visual-swiper .swiper-slide {
	line-height: 0;
}
.main-visual-swiper .swiper-slide > img {
	width: 100%;
}
.main-visual-swiper .swiper-slide:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	background: rgba(0,0,0,0.3);
}
.main-visual-content {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}
.main-visual-content .main-visual-title {
	color: white;
	padding-top: 140px;
	text-align: center;
	font-size: 40px;
	margin-bottom: 50px;
	position: relative;
	z-index: 3;
	line-height: 1.4em;
	font-weight: normal;
}
.main-visual-content-2 .main-visual-p {
	color: white;
	text-align: center;
	font-size: 28px;
	position: relative;
	z-index: 3;
}
.main-visual-content-2 .main-visual-circle {
	display: flex;
	justify-content: flex-start;
	position: absolute;
	left: 50px;
	bottom: 30px;
	z-index: 3;
}
.main-visual-content-2 .main-visual-circle img {
	width: 108px;
	margin-right: 10px;
}
.main-visual-content-2 .main-visual-ul {
	position: absolute;
	right: 50px;
	bottom: 30px;
	z-index: 3;
}
.main-visual-content-2 .main-visual-ul > li {
	color: #37250d;
	font-size: 28px;
	line-height: 1.4em;
	text-shadow: 
	white 2px 0px 2px, white -2px 0px 2px,
	white 0px -2px 2px, white -2px 0px 2px,
	white 2px 2px 2px, white -2px 2px 2px,
	white 2px -2px 2px, white -2px -2px 2px,
	white 1px 2px 2px, white -1px 2px 2px,
	white 1px -2px 2px, white -1px -2px 2px,
	white 2px 1px 2px, white -2px 1px 2px,
	white 2px -1px 2px, white -2px -1px 2px,
	white 1px 1px 2px, white -1px 1px 2px,
	white 1px -1px 2px, white -1px -1px 2px;
}
.main-visual-content-2 .main-visual-ul > li:before {
	content: "●";
}
.main-visual-content-2 .main-visual-ul > li span {
	font-size: 28px;
	color: #ff4c4c;
	text-decoration: underline;
}
.main-visual-content-2 {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	z-index: 3;
	padding-top: 290px;
}
.main-slider {
	box-sizing: border-box;
	padding-top: 20px;
	height: 319px;
	position: relative;
	z-index: 0;
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	background: url(/img/bg-slider.jpg) 0 0 repeat-x;
	margin-top: -8px;
}

.main-slider .bx-wrapper {
	background: none !important;
	left: auto !important;
	box-shadow: none !important;
	border: none !important;
	margin-bottom: 50px !important;
}
.main-slider li {
	height: 280px;
}
.main-slider .slider-img {
	position: absolute;
	top: 0px;
	right: 0px;
}
.main-slider .slider-title {
	font-size: 38px;
	color: #37250E;
	text-shadow:
        0 1px 0 #fff,
        1px 0 0 #fff,
        0 -1px 0 #fff,
        -1px 0 0 #fff,
        -1px -1px 0 #fff,
        1px -1px 0 #fff,
        -1px 1px 0 #fff,
        1px 1px 0 #fff
        ;
        line-height: 1.42em;
        font-weight: normal;
        padding-top: 25px;
        margin-bottom: 15px;
        margin-left: 20px;
        text-align: left;
}
.main-slider p {
	margin-left: 20px;
	font-size: 16px;
	color: #000000;
	line-height: 1.42em;
	text-align: left;
}

.main-slider .bx-prev {
	background: url(/img/prev.png) 0 0 no-repeat !important;
	left: -80px !important;	
	margin-top: -16px !important;
}
.main-slider .bx-next {
	background: url(/img/next.png) 0 0 no-repeat !important;
	right: -80px !important;	
	margin-top: -16px !important;
}
.main-slider .slider-bottom {
	position: absolute;
	left: 20px;
	bottom: 105px;
}
.main-slider li a {
	display: block;
}
.main-slider li a:hover {
	text-decoration: none;
}
#bx-pager {
	text-align: center;
	position: relative;
	z-index: 20;
}
#bx-pager a {
	margin-left: 10px;
	margin-right: 10px;
	display: inline-block;
	line-height: 0;
}
#bx-pager a.active {
	border: 2px solid #BEB59D;
}
.main-slider .catch {
	position: absolute;
	right: 30px;
	bottom: 23px;
	font-size: 27px;
	color: #37250E;
	line-height: 1.3em;
	text-shadow: 
	white 2px 0px 2px, white -2px 0px 2px,
	white 0px -2px 2px, white -2px 0px 2px,
	white 2px 2px 2px, white -2px 2px 2px,
	white 2px -2px 2px, white -2px -2px 2px,
	white 1px 2px 2px, white -1px 2px 2px,
	white 1px -2px 2px, white -1px -2px 2px,
	white 2px 1px 2px, white -2px 1px 2px,
	white 2px -1px 2px, white -2px -1px 2px,
	white 1px 1px 2px, white -1px 1px 2px,
	white 1px -1px 2px, white -1px -1px 2px;
	z-index: 10;
}
.main-slider .catch span {
	border-bottom: 2px solid #ff4d4d;
	color: #ff4d4d;
	font-size: 27px;
}


.main-slider-inner {
	background: url(/img/slider-1.jpg) left top no-repeat;
	height: 280px;
	position: relative;
}
.main-slider p.inner-p {
	position: absolute;
	left: 20px;
	top: 120px;
	width: 400px;
	font-size: 16px;
	z-index: 10;
}
.main-slider-inner h2 {
	position: absolute;
	left: 20px;
	top: 20px;
}
.main-slider-inner ul {
	top: 220px;
	left: 20px;
	position: absolute;
	max-width: 80%;
}
.main-slider-inner ul li {
	display: inline-block;	
	margin-right: 10px;
}
.main-slider-inner ul li img {
	border: 3px solid rgba(98,79,162,0);
}
.main-slider-inner ul li img:hover {
	border: 3px solid rgba(255,255,255,1);
}
.flexslider {

	margin: 0px auto !important;
	background: none !important;
}
.flexslider .slides {
	margin: 0px auto !important;

}
.flexslider li {

}
.flexslider li a {
/*	display: block;
	text-align: center;
	width: 100%;
	height: 100%;*/
}
.flex-control-thumbs {
	margin-top: 40px !important;
}
.flex-control-thumbs li {
	width: auto !important;
}
.flex-control-nav li {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	float: none !important;
	margin-right: 10px !important;
	height: 50px !important;
}
.flex-control-nav li img {
	border: 3px solid rgba(98,79,162,0);	
}
.flex-control-nav li img.flex-active {
	border: 3px solid rgba(157,139,79,1) !important;	
}
.flex-control-nav li img:hover {
	border: 3px solid rgba(255,255,255,1);		
}
.flexslider .slides li {
position: relative;
}
.flexslider .slides li a {
	line-height: 0px;	
}
.flexslider .slides img {
	width: auto !important;
	height: auto !important;
	display: inline !important;

}
.flex-control-thumbs img {
	width: auto !important;
	height: auto !important;
}

.flex-direction-nav {
	position: absolute;
left: 0px;
top: 35%;
width: 100%;
}
.flex-direction-nav li {
	height: 32px !important;
}
.flex-direction-nav a {
	top: 25% !important;
	opacity: 1 !important;
	transition: none !important;
}
.flex-direction-nav a:hover {
	
}
.flex-direction-nav .flex-next {
	right: -70px !important;
}
.flex-direction-nav .flex-prev {
	left: -70px !important;
}




.title-main {
	text-align: center;
	font-size: 22px;
	color: #51432B;
	padding: 30px 0px 20px;
	font-weight: normal;
}


.list-feature {
	
}
.list-feature > li {
	width: 306px;
	float: left;
	margin-right: 21px;
	margin-bottom: 20px;
}
.list-feature > li:nth-child(3n) {
	margin-right: 0;
}
.feature {
	background: url(/img/feature.jpg) 0 0 no-repeat;
	position: relative;

}
.feature > a:hover {
	color: inherit !important;
	text-decoration: underline;
}
.feature .feature-pic {
	position: absolute;
	top: 14px;
	right: 13px;
}
.feature .feature-text {
	height: 52px;
	font-size: 20px;
	padding: 25px;
	line-height: 1.3em;
}
.feature-caption {
	font-size: 12px;
	padding: 5px 12px;
	line-height: 1.3em;
}

}
/*===============================================
●index.css  画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:640px){
img{
    max-width: 100%;
    height: auto;
    width /***/:auto;　;
}

/* MAIN VISUAL */
.main-visual {
	position: relative;
	width: 100%;
	margin: 0px auto 20px;
	box-sizing: border-box;
}

.main-visual-swiper {
	width: 100%;
	box-sizing: border-box;

	position: relative;
}
.main-visual-swiper .swiper-slide {
	line-height: 0;
}
.main-visual-swiper .swiper-slide > img {
	width: 100%;
	height: calc(100vh - 70px - 57px);
	object-fit: cover;
}
.main-visual-swiper .swiper-slide:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	background: rgba(0,0,0,0.3);
}
.main-visual-content {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}
.main-visual-content .main-visual-title {
	color: white;
	padding-top: 50px;
	text-align: center;
	font-size: 20px;
	line-height: 1.4em;
	margin-bottom: 70px;
	position: relative;
	z-index: 3;
}
.main-visual-content-2 .main-visual-p {
	color: white;
	text-align: center;
	font-size: 16px;
	position: relative;
	z-index: 3;
}
.main-visual-content-2 .main-visual-circle {
	display: flex;
	justify-content: center;
	position: absolute;
	left: 0px;
	bottom: 30px;
	z-index: 3;
	width: 100%;
	text-align: center;
}
.main-visual-content-2 .main-visual-circle img {
	width: 67px;
	margin: 0 5px;
}
.main-visual-content-2 .main-visual-ul {
	position: absolute;
	right: 50px;
	bottom: 30px;
	z-index: 3;
	display: none;
}
.main-visual-content-2 .main-visual-ul > li {
	color: #37250d;
	font-size: 28px;
	text-shadow: 
	white 2px 0px 2px, white -2px 0px 2px,
	white 0px -2px 2px, white -2px 0px 2px,
	white 2px 2px 2px, white -2px 2px 2px,
	white 2px -2px 2px, white -2px -2px 2px,
	white 1px 2px 2px, white -1px 2px 2px,
	white 1px -2px 2px, white -1px -2px 2px,
	white 2px 1px 2px, white -2px 1px 2px,
	white 2px -1px 2px, white -2px -1px 2px,
	white 1px 1px 2px, white -1px 1px 2px,
	white 1px -1px 2px, white -1px -1px 2px;
}
.main-visual-content-2 .main-visual-ul > li:before {
	content: "●";
}
.main-visual-content-2 .main-visual-ul > li span {
	font-size: 28px;
	color: #ff4c4c;
	text-decoration: underline;
}
.main-visual-content-2 {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	z-index: 3;
	padding-top: 120px;
}

.main-slider {
	box-sizing: border-box;
	/*padding-top: 20px;*/
	position: relative;
	z-index: 0;
	margin-left: auto;
	margin-right: auto;
	/*background: url(/img/bg-slider.jpg) 0 0 repeat-x;*/
}

.main-slider .bx-wrapper {
	background: none !important;
	left: auto !important;
	box-shadow: none !important;
	border: none !important;
	margin-bottom: 0px !important;
}
.slides li {

}
@media screen and (max-width:320px){
	.slides li {

	}
	.slider-bottom {
		bottom: 85px !important;
		width: 150px !important;
	}
}
.main-slider .slider-img {
	position: absolute;
	top: 0px;
	right: 0px;
}
.main-slider .slider-title {
	font-size: 18px;
	color: #37250E;
	text-shadow:
        0 1px 0 #fff,
        1px 0 0 #fff,
        0 -1px 0 #fff,
        -1px 0 0 #fff,
        -1px -1px 0 #fff,
        1px -1px 0 #fff,
        -1px 1px 0 #fff,
        1px 1px 0 #fff
        ;
        line-height: 1.42em;
        font-weight: normal;
        padding-top: 10px;
        margin-bottom: 10px;
        margin-left: 10px;
        position: relative;
        z-index: 10;
}
.main-slider p {
	margin-bottom: 70px;
	margin-left: 10px;
	font-size: 12px;
	color: #000000;
	line-height: 1.42em;
        position: relative;
        z-index: 10;
        text-shadow:
        0 1px 0 #fff,
        1px 0 0 #fff,
        0 -1px 0 #fff,
        -1px 0 0 #fff,
        -1px -1px 0 #fff,
        1px -1px 0 #fff,
        -1px 1px 0 #fff,
        1px 1px 0 #fff
        ;
}

.main-slider .bx-prev {
	background: url(/img/prev.png) 0 0 no-repeat !important;
	left: 10px !important;	
	margin-top: -32px !important;
}
.main-slider .bx-next {
	background: url(/img/next.png) 0 0 no-repeat !important;
	right: 10px !important;	
	margin-top: -32px !important;
}
.main-slider .slider-bottom {
	position: absolute;
	right: 20px;
	bottom: 85px;
	width: 170px;
	z-index: 1000;
}
.main-slider li a {
	display: block;
}
.main-slider li a:hover {
	text-decoration: none;
}
.main-slider .catch {
	position: absolute;
	right: 10px;
	bottom: 37px;
	font-size: 15px;
	color: #37250E;
	line-height: 1.3em;
	text-shadow: 
	white 2px 0px 2px, white -2px 0px 2px,
	white 0px -2px 2px, white -2px 0px 2px,
	white 2px 2px 2px, white -2px 2px 2px,
	white 2px -2px 2px, white -2px -2px 2px,
	white 1px 2px 2px, white -1px 2px 2px,
	white 1px -2px 2px, white -1px -2px 2px,
	white 2px 1px 2px, white -2px 1px 2px,
	white 2px -1px 2px, white -2px -1px 2px,
	white 1px 1px 2px, white -1px 1px 2px,
	white 1px -1px 2px, white -1px -1px 2px;
	z-index: 10;
}
.main-slider .catch span {
	border-bottom: 2px solid #ff4d4d;
	color: #ff4d4d;
	font-size: 15px;
}

#bx-pager {
	text-align: center;
	position: relative;
	z-index: 20;

}
#bx-pager a {
	width: 15%;
	display: inline-block;
	line-height: 0;
	margin-left: 5px;
	margin-right: 5px;
}
#bx-pager a.active {
	border: 2px solid #BEB59D;
}





.main-slider-inner {
	background: url(/img/slider-1-sp.jpg) left top no-repeat;
	padding: 10px;
	position: relative;
}
.main-slider p.inner-p {

	text-shadow: 0 1px 5px #fff, 1px 0 5px #fff, 0 -1px 5px #fff, -1px 0 5px #fff, -1px -1px 5px #fff, 1px -1px 5px #fff, -1px 1px 5px #fff, 1px 1px 5px #fff;
	font-size: 12px;
	z-index: 10;

	padding-right: 20px;

}
.main-slider-inner h2 {

	max-width: 80%;
}

.main-slider-inner ul {


}
.main-slider-inner ul li {
	display: inline-block;	
	margin-right: 0px;
}
.main-slider-inner ul li img {
	width: 55px;
}
.main-slider-inner ul li img:hover {

}


.flexslider .slides li h2 img {

}
.flexslider {

	margin: 0px auto !important;
	background: none !important;
}
.flexslider .slides {
	margin: 0px auto !important;

}
.flexslider li {
	position: relative;
	text-align: left;
}
.flexslider li a {

}
.flexslider li a img {
	max-width: 100%;
}
.flex-control-nav {
	text-align: left;
	position: inherit !important;
	bottom: -60px !important;
	left: 20px;
	z-index: 100;
	margin-top: 20px !important;

}
.flex-direction-nav {
	display: none !important;
}
.flex-control-thumbs {
	margin-bottom: 10px !important;
}
.flex-control-thumbs li {
	width: auto !important;
	float: none !important;
}
.flex-control-nav {
	text-align: center;
	padding-bottom: 10px;
	left: auto !important;
}
.flex-control-nav li {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	margin-right: 5px !important;
}
.flex-control-nav li img {
	border: 3px solid rgba(98,79,162,0);
	width: 50px !important;	
}
.flex-control-nav li img.flex-active {
	border: 3px solid rgba(157,139,79,1) !important;	
}
.flex-control-nav li img:hover {
	border: 3px solid rgba(255,255,255,1);		
}
.flexslider .slides li {

}
.flexslider .slides li a {
	line-height: 0px;	
}
.flexslider .slides img {
	width: auto !important;
	height: auto !important;
	display: inline !important;

}
.flex-control-thumbs img {
	width: auto !important;
	height: auto !important;
}

.title-main {
	text-align: center;
	font-size: 18px;
	color: #51432B;
	padding: 30px 0px 20px;
	line-height: 1.5em;
	font-weight: normal;
}
.main-top-banner {
	margin-top: 80px;
}

.list-feature {
	
}
.list-feature > li {
	margin: 0 auto;
	margin-bottom: 20px;
}

.feature {
	background: url(/img/feature.jpg) 0 0 no-repeat;
	position: relative;
	width: 306px;
	margin: 0 auto;

}
.feature > a:hover {
	color: inherit !important;
	text-decoration: underline;
}
.feature .feature-pic {
	position: absolute;
	top: 14px;
	right: 13px;
}
.feature .feature-text {
	height: 52px;
	font-size: 20px;
	padding: 25px;
	line-height: 1.3em;

}
.feature-caption {
	font-size: 12px;
	padding: 5px 12px;
	line-height: 1.3em;
	width: 306px;
	margin: 0 auto;
	box-sizing: border-box;
}
.feature-p {
	padding: 0 10px;
}

}