@charset "utf-8";
@import url(cmn.css);
@import url(base.css);

/* ==========================================================================
	MAIN
	========================================================================== */
header {
	margin-bottom: 40px;
}

.main {
	padding-bottom: 50px;
}
.main .txt {
	float: left;
	width: 35%;
	text-align: center;
	margin-top: 50px;
}
.main .txt h2 {
	font-size: 340%;
	font-weight: normal;
	line-height: 125%;
	margin-bottom: 30px;
}
.main .txt h3 {
	font-size: 120%;
	font-weight: normal;
	line-height: 160%;
}
.main .slider {
	float: right;
	width: 65%;
}
.main .slider img {
	border-radius: 20px;
}
.slider {
    width: 100%;
    margin: 0 auto;
}

.slick-slide img {
	display: block;
  width: 85%;
	margin: 0 auto;
}
.slick-prev:before,
.slick-next:before {
  color: black!important;
}
.slick-current {
  opacity: 1;
}
.slick-arrow:before{
  content:""!important;
  width: 50px!important;
  height: 50px!important;
  position: absolute;
  top: 0;
  left: 0;
}

.slick-next:before{
  background: url("../images/index-images/arrow01.png") 50% 50% no-repeat;
  background-size: 40px!important;
}

.slick-prev:before{
  background: url("../images/index-images/arrow02.png") 50% 50% no-repeat!important;
  background-size: 40px!important;
}
.main .slick-prev,
.main .slick-next
{
	width: 50px;
	height: 50px;
}
.main .slick-prev
{
    left: 0;
}
.main .slick-next
{
    right: 0;
}

/* ==========================================================================
	CONTENTS
	========================================================================== */

/*SERVICE*/

.service li {
	position: relative;
	padding-bottom: 40px;
}
.service li .link-cmn01 {
	position: absolute;
	bottom: 0;
}
.service li img {
	display: block;
	border-radius: 20px;
	margin-bottom: 15px;
}
.service li h3 {
	text-align: center;
	font-size: 140%;
	margin-bottom: 20px;
}

/*GALLERY*/

.gra {
	background: linear-gradient(0deg,#fffddb 0%,#fffddb 50%,#fff 50%,#fff 100%);
}
.gallery {
	padding-bottom: 70px;
}
.gallery .img {
	float: left;
	width: 50%;
}
.gallery .txt {
	float: right;
	width: 45%;
}
.gallery .txt h3 {
	font-size: 150%;
	padding-top: 40px;
}
.gallery .txt p {
	margin-bottom: 60px;
}

/*NEWS*/

.blog-list .ul-4column {
	margin-bottom: 40px;
}

/* ==========================================================================
	PC 1025px -
	========================================================================== */

@media screen and (min-width: 1025px){


}


/* ==========================================================================
	TABLET - 1024px
	========================================================================== */

@media screen and (max-width:1024px){


/*MAIN*/

.main {
	padding-bottom: 50px;
}
.main .txt {
	float: none;
	width: 100%;
	margin-top: 50px;
}
.main .txt h2 {
	font-size: 280%;
	line-height: 125%;
}
.main .txt h3 {
	font-size: 100%;
}
.main .slider {
	float: none;
	width: 95%;
}

.slick-arrow:before{
  width: 20px!important;
  height: 30px!important;
}

.slick-next:before{
  background: url("../images/index-images/arrow01.png") 50% 50% no-repeat;
  background-size: 20px!important;
}

.slick-prev:before{
  background: url("../images/index-images/arrow02.png") 50% 50% no-repeat!important;
  background-size: 20px!important;
}
.main .slick-prev,
.main .slick-next
{
	width: 20px;
	height: 30px;
}

/*SERVICE*/

.service li h3 {
	font-size: 120%;
}

/*GALLERY*/

.gallery .txt h3 {
	font-size: 120%;
	padding-top: 0;
}
.gallery .txt p {
	margin-bottom: 40px;
}
.gallery .txt .bt-cmn01 {
	width: 100%!important;
}

/*NEWS*/

.blog-list .ul-4column {
	width: 105%;
	margin-bottom: 40px;
}
.blog-list .ul-4column li {
	width: 45%;
	margin: 0 5% 30px 0;
}

}

/* ==========================================================================
	SP - 640px
	========================================================================== */

@media screen and (max-width: 640px) {

/*MAIN*/

.main {
	padding-bottom: 40px;
}
.main .txt {
	margin-top: 40px;
}
.main .txt h2 {
	font-size: 240%;
	line-height: 110%;
	margin-bottom: 20px;
}
.main .slider {
	width: 98%;
}

/*SERVICE*/

.service li {
	padding-bottom: 30px;
}
.service li img {
	margin-bottom: 10px;
}

/*GALLERY*/

.gallery {
	padding-bottom: 40px;
}
.gallery .img {
	float: none;
	width: 100%;
	margin-bottom: 30px;
}
.gallery .txt {
	float: none;
	width: 100%;
}
.gallery .txt h3 {
	font-size: 120%;
	padding-top: 0;
}
.gallery .txt p {
	margin-bottom: 30px;
}
.gallery .txt .bt-cmn01 {
	width: 80%!important;
}

/*NEWS*/

.blog-list .ul-4column {
	margin-bottom: 40px;
}

}