@charset "utf-8";

p.btn{
	text-align: left;
}
p.btn>a{
	display: inline-block;
	width: 57%;
	padding: 0 40px;
	font-size: 1.5rem;
	line-height: 36px;
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	color: #fff;
	font-weight: bold;
	background: #8c857b;
	text-align: right;
	position: relative;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
p.btn>a:after{
	position: absolute;
	top: 50%;
	right: 20px;
	display: block;
	content: '';
	width: 12px;
	height: 12px;
	margin-top: -6px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
p.btn>a>span{
	display: inline-block;
	min-width: 200px;
	text-align: left;
}
p.btn>a:hover{
	text-decoration: none;
	opacity: 0.7;
}

 #visual{
	/*min-height: 860px;*/
	position: relative;
	z-index: 1;
	overflow: hidden;
	height:100vh;
}
 #visual:after{
	display: none;
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}
  #visual>h1{
	/*opacity: 0;*/
	line-height: 0;
	text-align: center;
	/*padding: 400px 0 189px;*/
	position: absolute;
	z-index: 99;
    top: 50%;
    left: 50%;
    width: 100%;
    color: #fff;
    transform: translateY(-50%) translateX(-50%)
}
   #visual>h1>img{
	width: 183px;
	height: auto;
}
   #visual .main_imgBox {
      height: 100vh;
      overflow: hidden;
      position: relative;
}
   #visual .main_img {
      z-index:10;
      opacity: 0;
      width: 100%;
      height: 100vh;
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      position: absolute;
      left: 0;
      top: 0;
    -webkit-animation: anime 36s 0s infinite;
      animation: anime 36s 0s infinite;
 }

   #visual .main_img:nth-of-type(2) {
      -webkit-animation-delay: 6s;
      animation-delay: 6s; }

   #visual .main_img:nth-of-type(3) {
      -webkit-animation-delay: 12s;
      animation-delay: 12s; }

   #visual .main_img:nth-of-type(4) {
      -webkit-animation-delay: 18s;
      animation-delay: 18s; }

   #visual .main_img:nth-of-type(5) {
      -webkit-animation-delay: 24s;
      animation-delay: 24s; }

   #visual .main_img:nth-of-type(6) {
      -webkit-animation-delay: 30s;
      animation-delay: 30s; }

@keyframes anime {
  0% {
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
        transform: scale(1.2) ;
         z-index:9;
    }
    100% { opacity: 0 }
}


/*#visual>.flexslider {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 1;
}


#visual >video{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	z-index: 1;

}
#visual>.flexslider .slides img {
	width:auto;
	height:100vh;
	object-fit: cover;
}*/



#visual .scroll {
    color         : #fff;
    font-size     : 14px;
	font-weight: bold;
    writing-mode  : vertical-rl;
    position      : absolute;
    bottom        : 5%;
    left          : 50%;
    transform     : translateX(-50%) translateY(-50%);
	z-index: 999;
}
#visual .scroll::after {
      content         : '';
      display         : block;
      position        : absolute;
      right           : 50%;
      bottom          : -120px;
      transform       : translateX(-50%);
      width           : 1px;
      height          : 110px;
      background-color: #fff;
	  z-index: 999;
    }


#visual .scroll::after {
  animation: scroll 3s cubic-bezier(1, 0, 0, 1) infinite;
}
@keyframes scroll {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}
/*@media screen and (max-width:1244.9px){
	#visual .flexslider{
		width: auto;
		height: 850px;
	}
	#visual>video{
		width: auto;
		height: 800px;
	}
}*/

#top{
	background: #fff;
	padding: 20px 0 50px;
	margin: 0 auto;
	text-align: center;
	position: relative;
	z-index: 2;
}
#top h2{
	font-size: 2.5rem;
	line-height: 120%;
	margin: 0 auto 30px;
	font-weight: bold;
	letter-spacing: 6px;
	color: #666666;
}
#top p.tx{
	font-size: 1.8rem;
	line-height: 31px;
	margin: 0 auto 30px;
	letter-spacing: 4px;
	color: #979696;
}
#top p.img{
	line-height: 0;
	margin: 0 auto;
}
#top p.img img{
	/*width: 223px;*/
	height: auto;



}
#nps{
	
	padding: 20px 0 50px;
	margin: 0 auto;
	text-align: center;
	position: relative;
	z-index: 2;
    border-radius: 10px;
}
#nps h2{
	font-size: 2.5rem;
	line-height: 120%;
	margin: 0 auto 30px;
	font-weight: bold;
	letter-spacing: 6px;
	color: #666666;
}
#nps .column {
    display: block;
    letter-spacing: -0.4em;
    /* text-align: left; */
    line-height: 0;
    margin: 0 auto ;
    padding:2% 1%;
    position: relative;
    /*background: url(../img/index/about_img1.png) no-repeat bottom right #f8f6f2;*/
    background:#f8f6f2;
}

#nps .img_box {
    display: inline-block;
    letter-spacing: normal;
    vertical-align: top;
    margin: 0 auto;
    line-height: 0;
    width: 48%;
}
/*#nps .img_box img{
    width:100%;
}*/
#nps p.tx{
	font-size: 1.5rem;
	line-height: 20px;
	margin: 0 auto 30px;
	letter-spacing: 4px;
	color: #979696;
}
#nps .text{
    display: inline-block;
    vertical-align: top;
    width: 35%;
    margin: 0 10px;
}
#nps .text p{
    font-size: 1.45rem;
    line-height: 20px;
    text-align: left;
    letter-spacing: 2px;
}

    
#nps .text p.tx_s {
    font-size: 1.3rem;
    text-align: right !important;
    padding: 2%;
}

#nps .title_img{
    margin: -90px auto 30px;
}
#nps .bn_img{
    max-width:1000px;
	width:100%;
	/*margin-top: 50px;
    margin-left: 80px;*/
    margin: 0 auto;
}
#nps .bn_img img{
	width:90%;
}

#nps span{
    font-size: 1.9rem;
    line-height: 28px;
    margin: 0 auto 10px;
    font-weight: bold;
    color: #768862;
}
#event{
	/*background: #e8eeeb;*/
	background:	#e6e2da;
	padding: 35px 0 20px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
#event h2{
	color: #1E0405;
	font-size: 4.2rem;
	line-height: 24px;
	margin: 0 auto 20px;
	text-align: center;
	/*font-family: 'EB Garamond', serif;*/
	font-weight: normal;
	letter-spacing: 6px;
}
#event p.tx{
	font-size: 1.5rem;
	line-height: 140%;
	margin: 0 auto 50px;
	text-align: center;
	letter-spacing: 4px;
}
#event p.tx2{
	font-size: 1.5rem;
	line-height: 140%;
	margin: 0 auto 20px;
	text-align: center;
}
#event p.tx3{
	font-size: 1.5rem;
	line-height: 140%;
	margin: 0 auto;
	text-align: center;
	font-weight: bold;
}
#event>p.btn{
	margin: 0 auto 20px;
}
#event>p.btn a{
	background-color: #8f7c50;
}
#event ul.event{
	display: block;
	letter-spacing: -0.4em;
	/*text-align: left;*/
	line-height: 0;
	margin: 0 auto 45px;
}
#event ul.event>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 30%;
	margin: 0 30px 0 0;
}
#event ul.event>li:last-child{
	margin-right: 0;
}
#event ul.event>li>p.img{
	line-height: 0;
	margin: 0 auto;
	position: relative;
}
#event ul.event>li.end>p.img:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../img/index/end.svg) left center no-repeat;
    background-size: 80% auto;
    background-position: center;
}
#event ul.event>li>.text{
	background: #fff;
	/*padding: 15px 15px 30px;*/
    padding: 15px 15px 23px;
}
#event ul.event>li>.text>p{
	font-size: 1.5rem;
	line-height: 120%;
	text-align: center;
	margin: 0 auto 16px;
	font-weight: bold;
}
#event ul.event>li>.text>table{
	margin: 0 0 20px;
	width: auto !important;
}
#event ul.event>li>.text>table th{
	font-size: 1.4rem;
	line-height: 24px;
	text-align: left;
	color: #666;
	vertical-align: top;
	font-weight: normal;
	width:20%;
}
#event ul.event>li>.text>table td{
	font-size: 1.4rem;
	line-height: 24px;
	text-align: left;
	color: #666;
	vertical-align: top;
	font-weight: normal;
	width:80%;
}
#event ul.event>li>.text>table th:after{
	content: '：';
}
#event ul.event>li>.text>ul{
	display: block;
	line-height: 0;
	margin: 0 auto;
}
#event ul.event>li>.text>ul>li{
	display: block;
	font-size: 1.4rem;
	text-align: left;
	line-height: 24px;
	color: #666;
	margin: 0 auto;
	padding: 0 0 0 25px;
	background: url(../img/index/check.svg) 0 6px no-repeat;
	background-size: 18px auto;
}


#works{
	background: #fff;
	padding: 50px 0 70px;
	position: relative;
	z-index: 2;
}

#works>.inner:before{
	content: '';
	width: 114px;
	height: 146px;
	background: url(../img/index/works_img01.svg) 0 0 no-repeat;
	background-size: 114px auto;
	position: absolute;
	top: -60px;
	right: 140px;
}
#works h2{
	display: inline-block;
	margin: 0 auto 50px;
	line-height: 0;
	text-align: center;
	color: #1E0405;
	position: relative;
	padding: 0 90px 18px 0;

}
#works h2>span{
	display: inline-block;
	font-size: 4.2rem;
	line-height: 52px;
	margin: 0 auto;
	text-align: center;
	font-family: 'kepler-std-semicondensed-dis', serif;
	font-weight: normal;
	letter-spacing: 0;
	padding: 0 35px 0 40px;
	background: url(../img/index/works_h2_bg.svg) 10px center no-repeat;
	background-size: 24px auto;
	border: 1px solid #979696;
	position: relative;
	z-index: 2;

}
#works h2>small{
	display: inline-block;
	font-size: 1.5rem;
	color: #1E0405;
	line-height: 37px;
	background: #bbc2a9;
	padding: 0 20px 0 75px;
	position: absolute;
	bottom: 0;
	right: -30px;
	z-index: 1;
}
#works p.tex{
	font-size: 1.4rem;
	line-height: 26px;
	color: #666;
	text-align: center;
	margin: 0 auto 40px;
	letter-spacing: 4px;
}
#works p.btn a{
	background: #768862;
	}
#works .images{
	display: block;
	letter-spacing: -0.4em;
	/*text-align: left;*/
	line-height: 0;
	margin: 0 auto 42px;
}
#works .images>.flexslider{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 493px;
	border: none;
	margin: 0 40px 0 0;
}
#works .images>.flexslider:after{
	content: '';
	width: 100%;
	height: 100%;
	/*background: #d9d7e0;*/
	background: #bbc2a9;
	position: absolute;
	top: 70px;
	left: 25px;
	z-index: 1;
}
#works .images>.flexslider>.flex-viewport{
	z-index: 2;
}
#works .images .flex-direction-nav a{
	width: 36px;
	height: 36px;
	opacity: 1;
}
#works .images .flex-direction-nav a:before{
	content: none;
}
#works .images .flex-direction-nav .flex-prev{
	background: url(../img/index/slide_prev.svg) 0 0 no-repeat;
	background-size: auto 36px;
	left: 10px;
}
#works .images .flex-direction-nav .flex-next{
	background: url(../img/index/slide_next.svg) right top no-repeat;
	background-size: auto 36px;
	right: 10px;
}
#works .images>ul.img{
	display: inline-block;
	vertical-align: top;
	width: 620px;
}
#works .images>ul.img>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 300px;
	margin: 0 5px 2px 0;
}
#works .images>ul.img>li:nth-child(2n){
	margin-right: 0;
}
#works .images>ul.img>li>a{
	color: #666;
}
#works .images>ul.img>li .img{
	display: block;
	line-height: 0;
	margin: 0 auto 7px;
	width: 300px;
}
#works .images>ul.img>li .txt{
	display: block;
	font-size: 1.3rem;
	/*text-align: left;*/
	line-height: 120%;
	color: #666;
}
#works .images>ul.img>li .txt>a{
	color: #666;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
#works .images>ul.img>li .txt>a:hover{
	text-decoration: none;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}


#about{
	background: #f8f6f2;
	padding: 60px 0 70px;
	position: relative;
	z-index: 2;
}
#about .inner{
	width:960px;
}
#about h2{
	color: #1E0405;
	font-size: 4.2rem;
	line-height: 24px;
	margin: 0 auto 20px;
	text-align: center;
	font-family: 'kepler-std-semicondensed-dis', serif;
	font-weight: normal;
	letter-spacing: 0;
}
#about h2>span{
	display: inline-block;
	background: url(../img/index/about_h2_bg.svg) 20px 0 no-repeat;
	background-size: 34px auto;
	padding: 12px 0 12px 70px;
}
#about p.tx{
	font-size: 1.5rem;
	line-height: 140%;
	margin: 0 auto 50px;
	text-align: center;
	letter-spacing: 4px;
}
#about .about{
	line-height: 0;
	position: relative;
}
#about .about>.image{
	position: absolute;
	top: 80px;
	right: 610px;
	z-index: 2;
}
#about .about>.image>.img{
	line-height: 0;
}
#about .about>.image>.profile{
	position: absolute;
	bottom: -150px;
	right: -30px;
}
#about .about>.image>.profile>img{
	display: block;
}
#about .about>.image>.profile>span{
	display: inline-block;
	font-size: 1.4rem;
	line-height: 120%;
	padding: 4px 0 0;
	margin: 0 auto;
	text-align: left;
	color: #666;
	font-weight: 500;
}
#about .about>.text{
	width: 550px;
	padding: 0;
	margin: 0 0 0 auto;
}
#about .about>.text:before{
	content: '';
	width: 830px;
	height: 8px;
	background: #aab3ff;
	position: absolute;
	top: 0;
	right: -90px;
	z-index: 2;
}
#about .about>.text:after{
	content: '';
	width: 8px;
	height: 465px;
	background: #ef806a;
	position: absolute;
	top: -48px;
	right: -44px;
	z-index: 2;
	mix-blend-mode: multiply;
}
#about .about>.text>p.tex{
	font-size: 1.4rem;
	line-height: 29px;
	position: relative;
	margin: 0 auto;
	padding: 50px 0 30px;
	text-align: left;
}
#about .about>.text>p.tex:before{
	content: '';
	width: 780px;
	height: 100%;
	background: #fff;
	position: absolute;
	top: 0;
	right: -64px;
	z-index: 1;
}
#about .about>.text>p.tex>span{
	display: block;
	position: relative;
	z-index: 2;
	color: #666;
}
#about .about>.text>p.btns{
	text-align: center;
	line-height: 0;
	margin: 0 auto 20px;
}
#about .about>.text>p.btns>a{
	display: inline-block;
	line-height: 0;
	padding: 0;
	background: none;
}
#about .about>.text>p.btns>a>img{
	width: 489px;
	height: auto;
}
#about .about>.text>ul{
	display: block;
	letter-spacing: -0.4em;
	/*text-align: left;*/
	line-height: 0;
	margin: 20px auto 10px;
}
#about .about>.text>ul>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 270px;
    margin: 0 5px 12px 0;
}
#about .about>.text>ul>li:nth-child(2n){
	margin-right: 0;
}
#about .about>.text>ul>li>a{
	display: block;
	color: #666;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
#about .about>.text>ul>li>a:hover{
	text-decoration: none;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#about .about>.text>ul>li>a>span{
	display: block;
	color: #666;
}
#about .about>.text>ul>li .img{
	margin: 0 auto 10px;
	padding: 0;
	text-align: center;
}
#about .about>.text>ul>li .img img{
	width: 97px;
	height: auto;
}
#about .about>.text>ul>li .tit{
	color: #1E0405;
	font-size: 1.5rem;
	font-weight: bold;
	line-height: 120%;
	padding: 5px 0 6px;
	margin: 0 0 30px 10px;
	/*border-bottom: 1px solid #8c857b;
	position: relative;*/
    width: 210px;
}
.arrow {
    position: relative;
    display: inline-block;
    padding: 0 20px;
    color: #8c857b;
    text-decoration: none;
    outline: none;
}
.arrow::before {
    content: '';
    position: absolute;
    bottom: -4.5px;
    left: 15%;
    width: 85%;
    height: 1px;
    border-bottom: 1px solid #333;
    transition: all .3s;
}
.arrow::after {
    content: '';
    position: absolute;
    top: 23.5px;
    right: -2px;
    width: 25px;
    height: 1px;
    border-top: 1px solid #333;
    -webkit-transform: rotate( 45deg);
    transform: rotate( 45deg);
    transition: all .3s;
}
.arrow:hover::before{
    left:20%;
}

.arrow:hover::after{
    right:-5.5%;
}
/*about .about>.text>ul>li .tit.arrow::after{
	position: absolute;
	top: 20px;
	right: -2px;
	display: block;
	content: '';
	width: 24px;
	height: 1px;
	border-top: 1px solid #8c857b;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transition: all .3s;
}*/
#about .about>.text>ul>li .tx{
	font-size: 1.3rem;
	line-height: 16px;
}

#buttons h2 {
    color: #1E0405;
    font-size: 4.2rem;
    line-height: 24px;
    margin: 0 auto 30px;
	padding-left: 10px;
    text-align: center;
    font-family: 'kepler-std-semicondensed-dis', serif;
    letter-spacing: 0px;
}
#buttons p.txt {
	color: #1E0405;
    font-size: 1.4rem;
    line-height: 120%;
    margin: 0 auto 50px;
    text-align: center;
    letter-spacing: 2px;
	font-weight: bold;
}
#buttons{
	background: url(../img/index/buttons_bg.jpg) center top no-repeat;
	background-attachment: fixed;
	background-size: cover;
	padding: 110px 0 130px;
	position: relative;
	z-index: 2;
}


#buttons_01{
	background: url(../img/index/buttons_bg01.jpg) center top no-repeat;
	background-attachment: fixed;
	background-size: cover;
	padding: 150px 0 170px;
	position: relative;
	z-index: 2;
}
html#tablet #buttons,
html#tablet #buttons_01{
	background-attachment: scroll;
}
#buttons ul{
	width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto 50px;
	justify-content: center;
	align-items: center;
}
#buttons_01 ul{
	display: block;
	letter-spacing: -0.4em;

	line-height: 0;
}
#buttons ul>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 28%;
	margin: 0 30px 40px 0;
    justify-content: space-between;
    position: relative;

}
#buttons_01 ul>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 450px;
	margin: 0 60px 0 0;
}

#buttons_01 ul>li:last-child{
	margin-right: 0;
}
#buttons h2>img {
    display: inline-block;
    vertical-align: text-top;
    height: auto;
    margin: 0 auto;
}
#buttons ul>li{
	display: block;
	border-radius: 5px;
	background: rgba(30,4,5,0.7);
	padding: 5px;
	color: #fff;
	text-align: left;
	position: relative;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
#buttons_01 ul>li>a{
	display: block;
	border-radius: 5px;
	background: #fff;
	opacity: 0.9;
	padding: 15px;
	color: #1E0405;
	text-align: left;
	position: relative;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

#buttons_01 ul>li>a:hover{
	text-decoration: none;
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}
#buttons_01 ul>li:first-child>a:after{
	content: '';
	width: 70px;
	height: 75px;
	background: url(../img/index/buttons_img01.png) 0 0 no-repeat;
	position: absolute;
	top: 60px;
	right: 35px;
}
#buttons ul>li h2{
	color: #fff;
	font-size: 3.2rem;
	font-family: 'kepler-std-semicondensed-dis', serif;
	line-height: 120%;
	margin: 0 auto;
	/*border-bottom: 1px solid #8c857b;*/
	padding: 0 ;
	text-align: center;
	font-weight: normal;
}
#buttons_01 ul>li h2{
	color: #1E0405;
	font-size: 3.2rem;
	font-family: 'kepler-std-semicondensed-dis', serif;
	line-height: 120%;
	margin: 0 auto 10px;
	border-bottom: 1px solid #8c857b;
	padding: 0 0 25px;
	text-align: center;
	font-weight: normal;
}
#buttons ul>li h2>small{
	display: block;
	font-size: 2.0rem;
	line-height: 120%;
	padding: 2%;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: bold;
	color: #1E0405;
  background: #fff;
	border-radius: 5px;

}
#buttons_01 ul>li h2>small{
	display: block;
	font-size: 2.0rem;
	line-height: 120%;
	margin: 10px auto 0;
	padding: 2%;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: bold;
	color: #1E0405;
    background: #fff;
}
#buttons ul>li p.tx,
#buttons_01 ul>li p.tx{
	font-size: 1.35rem;
	line-height: 20px;
	text-align: left;
	margin: 0 auto;
	padding: 2%;
	letter-spacing: 2px;
}
#buttons ul>li p.link,
#buttons_01 ul>li p.link{
	text-align: right;
	font-size: 1.5rem;
	line-height: 20px;
	color: #8c857b;
	padding: 0 15px 0 0;
	position: relative;
	font-weight: bold;
}
#buttons ul>li p.link:after,
#buttons_01 ul>li p.link:after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 6px;
	border-color: transparent transparent transparent #8c857b;
	position: absolute;
	top: 6px;
	right: 0;
}


#voice{
	background: #fff;
	padding: 65px 0 60px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	overflow: hidden;
}
#voice:after{
	content: '';
	width: 161px;
	height: 170px;
	background: url(../img/index/voice_bg.svg) 0 0 no-repeat;
	background-size: 161px auto;
	position: absolute;
	bottom: -20px;
	right: 23%;
}
#voice h2{
	color: #1E0405;
	font-size: 4.2rem;
	line-height: 24px;
	margin: 0 auto 20px;
	text-align: center;
	font-family: 'kepler-std-semicondensed-dis', serif;
	font-weight: normal;
	letter-spacing: 0px;
}
#voice p.btn a{
	background: #768862;
	}
#voice p.txt{
	font-size: 1.5rem;
	line-height: 140%;
	margin: 0 auto 60px;
	text-align: center;
	letter-spacing: 4px;
}
#voice p.tx{
	font-size: 1.5rem;
	line-height: 140%;
	margin: 10px auto 50px;
	text-align: center;
	letter-spacing: 2px;
}
#voice ul{
	display: block;
	letter-spacing: -0.4em;
	/*text-align: left;*/
	line-height: 0;
	margin: 0 auto 80px;
}
#voice ul>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 30%;
	margin: 0 30px 0 0;
	position: relative;
}
#voice ul>li:last-child{
	margin-right: 0;
}
#voice ul>li:before{
	content: '';
	width: 300px;
	height: 300px;
	position: absolute;
	z-index: 0;
}
#voice ul>li:nth-child(1):before{

	top: -90px;
	left: -70px;
}
#voice ul>li:nth-child(2):before{

	top: 60px;
	left: -120px;
	width: 360px;
	height: 360px;
}
#voice ul>li:nth-child(3):before{

	top: -80px;
	right: -90px;
	width: 200px;
	height: 200px;
}
#voice ul>li p.img{
	line-height: 0;
	margin: 0 auto 15px;
	position: relative;
	z-index: 1;
}
#voice ul>li p.tx{
	font-size: 1.4rem;
	line-height: 120%;
	margin: 0 auto 8px;
	letter-spacing: 0;
	position: relative;
	z-index: 1;
}
#voice ul>li p.link{
	text-align: center;
	position: relative;
	z-index: 1;
}
#voice ul>li p.link>a{
	display: inline-block;
	font-size: 1.5rem;
	line-height: 20px;
	color: #bbc2a9;
	padding: 0 15px 0 0;
	position: relative;
	font-weight: bold;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
#voice ul>li p.link>a:after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 6px;
	border-color: transparent transparent transparent #bbc2a9;
	position: absolute;
	top: 6px;
	right: 0;
}
#voice ul>li p.link>a:hover{
	text-decoration: none;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

#instagram{
	/*background: -moz-linear-gradient(left,  rgba(255,231,255,1) 0%, rgba(237,255,255,1) 100%); /* FF3.6-15 */
	/*background: -webkit-linear-gradient(left,  rgba(255,231,255,1) 0%,rgba(237,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	/*background: linear-gradient(to right,  rgba(255,231,255,1) 0%,rgba(237,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffe7ff', endColorstr='#edffff',GradientType=1 ); /* IE6-9 */
	background: #dddddd;
	padding: 50px 0 60px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
#instagram h2{
	color: #1E0405;
	font-size: 4.2rem;
	line-height: 24px;
	margin: 0 auto 50px;
	text-align: center;
	font-family: 'kepler-std-semicondensed-dis', serif;
	font-weight: normal;
	letter-spacing: 0px;
}
#instagram >p.btn a {
    background-color: #98a7a3;
}
#instagram h2>img{
	display: inline-block;
	vertical-align: text-top;
	width: 34px;
	height: auto;
	margin: 9px 30px 0 0;
}
#instagram ul{
	display: block;
	letter-spacing: -0.4em;
	/*text-align: left;*/
	line-height: 0;
	margin: 0 auto 20px;
}
#instagram ul>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 210px;
	margin: 0 40px 40px 0;
}
#instagram ul>li:nth-child(4n){
	margin-right: 0;
}
#instagram ul>li img{
	width: 100%;
	height: 210px;
	object-fit:cover;
}

#news{
	background: #fff;
	padding: 60px 0 70px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
#news h2{
	color: #1E0405;
	font-size: 4.2rem;
	line-height: 24px;
	margin: 0 auto 50px;
	text-align: center;
	font-family: 'kepler-std-semicondensed-dis', serif;
	font-weight: normal;
	letter-spacing: 0px;
}
#news .box{
	width: 790px;
	border: 1px solid #666;
	border-radius: 10px;
	padding: 30px 10px 14px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0 auto;
}
#news .box>ul{
	display: block;
	line-height: 0;
	margin: 0 auto 25px;
}
#news .box>ul>li{
	display: block;
	letter-spacing: -0.4em;
	text-align: left;
	line-height: 0;
	border-bottom: 1px dotted #dcdcdc;
	padding: 12px 0;
}
#news .box>ul>li>span,
#news .box>ul>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	font-size: 1.4rem;
	color: #666;
	line-height: 140%;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
#news .box>ul>li>a:hover{
	text-decoration: none;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#news .box>ul>li>span{
	margin: 0 40px 0 0;
}
#news .box>ul>li{
	max-width: 615px;
	width:100%;
}
#news .box>p.link{
	text-align: right;
}
#news .box>p.link>a{
	display: inline-block;
	font-size: 1.5rem;
	line-height: 20px;
	color: #647da8;
	padding: 0 20px 0 0;
	position: relative;
	font-weight: bold;
}
#news .box>p.link>a:after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent #647da8;
	position: absolute;
	top: 0;
	right: 0;
}


#blog{
	background: #f8f6f2 url(../img/index/blog_bg.png) center top no-repeat;
	padding: 100px 0 120px;
	position: relative;
	z-index: 2;
}
#blog:before{
	content: '';
	width: 100%;
	height: 9px;
	background: #ef806a;
	position: absolute;
	top: 17px;
	left: 0;
	z-index: 2;
	mix-blend-mode: multiply;
}
#blog:after{
	content: '';
	width: 100%;
	height: 9px;
	background: #aab3ff;
	position: absolute;
	top: 38px;
	left: 0;
	z-index: 2;
	mix-blend-mode: multiply;
}
#blog>div:before{
	content: '';
	width: 100%;
	height: 9px;
	background: #ef806a;
	position: absolute;
	bottom: 65px;
	left: 0;
	z-index: 2;
	mix-blend-mode: multiply;
}
#blog>div:after{
	content: '';
	width: 100%;
	height: 9px;
	background: #aab3ff;
	position: absolute;
	bottom: 44px;
	left: 0;
	z-index: 2;
	mix-blend-mode: multiply;
}
#blog h2{
	color: #1E0405;
	font-size: 4.2rem;
	line-height: 24px;
	margin: 0 auto 70px;
	text-align: center;
	font-family: 'kepler-std-semicondensed-dis', serif;
	font-weight: normal;
	letter-spacing: 0px;
}
#blog h2>span{
	display: inline-block;
	line-height: 100%;
	padding: 0 0 0 50px;
	background: url(../img/index/blog_h2_bg.svg) 0 2px no-repeat;
	background-size: 33px auto;
}
#blog ul{
	display: block;
	letter-spacing: -0.4em;
	/*text-align: left;*/
	line-height: 0;
	margin: 0 auto 65px;
}
#blog ul>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 200px;
	margin: 0 30px 0 0;
}
#blog ul>li:last-child{
	margin-right: 0;
}
#blog ul>li>.img{
	line-height: 0;
	margin: 0 auto 15px;
}
#blog ul>li>.tx{
	font-size: 1.4rem;
	line-height: 1.8rem;
	color: #666;
	text-align: left;
	margin: 0 auto 30px;
}
#blog ul>li>p.link{
	text-align: left;
	line-height: 0;
}
#blog ul>li>p.link>a{
	display: inline-block;
	font-size: 1.5rem;
	line-height: 20px;
	color: #8c857b;
	padding: 0 20px 0 0;
	position: relative;
	font-weight: bold;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
#blog ul>li>p.link>a:hover{
	text-decoration: none;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#blog ul>li>p.link>a:after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 6px;
	border-color: transparent transparent transparent #8c857b;
	position: absolute;
	top: 6px;
	right: 0;
}


#access{
	background: url(../img/index/access_bg.jpg) center top no-repeat;
	background-attachment: fixed;
	background-size: cover;
	padding: 90px 0;
	position: relative;
	z-index: 2;
}
html#tablet #access{
	background-attachment: scroll;
}
#access ul{
	display: block;
	letter-spacing: -0.4em;
	/*text-align: left;*/
	line-height: 0;
}
#access ul>li{
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	width: 443px;
	text-align: center;
}
#access ul>li:last-child{
	width: 422px;
	text-align: left;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 10px;
	padding: 24px 40px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin-left: 95px;
}
#access ul>li iframe{
	width: 100%;
	height: 284px;
	border: none;
	margin: 0 auto 15px;
}
#access ul>li a.googlemap{
	display: inline-block;
	font-size: 1.5rem;
	color: #fff;
	background: #696969;
	border: 1px solid #fff;
	/*border-radius: 14px;*/
	line-height: 25px;
	text-align: center;
	padding: 0 90px;
	margin: 0 auto;
	/*font-weight: bold;*/
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
#access ul>li a.googlemap:hover{
	text-decoration: none;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#access ul>li>h2{
	display: inline-block;
	font-size: 2.6rem;
	line-height: 26px;
	margin: 0 auto 14px -40px;
	text-align: center;
	font-family: 'kepler-std-semicondensed-dis', serif;
	font-weight: normal;
	letter-spacing: 4px;
	padding: 0 80px 0 40px;
	background: #696969;
	color: #fff;
}
#access ul>li>p{
	font-size: 1.4rem;
	line-height: 22px;
	color: #666;
	text-align: left;
}
#access ul>li>.add{
	line-height: 26px;
	margin: 0 auto 10px;
}
#access ul>li>.free{
	font-size: 2.9rem;
	font-weight: bolder;
	margin: 0 auto 16px;
}
#access ul>li>.free>span{
	display: inline-block;
	font-size: 1.3rem;
	line-height: 120%;
	padding: 0 10px 0 0;
	font-weight: bolder;
}
#access ul>li>.tel{
	font-size: 1.8rem;
	line-height: 28px;
	font-weight: bold;
	margin: 0 auto 10px;
}
#access ul>li>p a{
	color: #666;
	text-decoration: none;
}


#top p.img{
		position: relative;
		left: 40px;
		opacity: 0;
		transition: .6s ease-out;
	}
#top p.img{
		left: 0;
		top: 40px;
		transition-delay: .1s;
	}
#top[data-object="active"] p.img{
		top: 0;
		left: 0;
		opacity: 1;
	}
#event p.btn{
		position: relative;
		opacity: 0;
		left: -40%;
		transition: .6s ease-out;
	}

#event[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
		transition-delay: 1s;
	}
#works p.btn{
		position: relative;
		left: -40%;
		transition: .6s ease-out;
		opacity: 0;
	}
#works[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
		transition-delay: 1s;
	}

#about .about>.text>p.tex{
		opacity: 0;
		transition: .6s ease-out;
		position: relative;
		left: 40px;
		transition-delay: .5s;
	}
#about .about>.text:before{
		width: 0;
		transition: .6s ease-out;
	}
#about .about>.text:after{
		height: 0;
	    transition: .6s ease-out;
		transition-delay: .2s;

	}
#about p.btn{
		position: relative;
		left: -40%;
		transition: .6s ease-out;
		opacity: 0;
		transition-delay: 1.2s;
	}

#about[data-object="active"] .about>.text:before{
		width: 830px;
	}
#about[data-object="active"] .about>.text:after{
		height: 990px;
	}
#about[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
	}
#about[data-object="active"] h2{
		opacity: 1;
		left: 0;
	}
#about[data-object="active"] p.tx{
		opacity: 1;
		left: 0;
	}
#about[data-object="active"] .about>.image>.img{
		opacity: 1;
		left: 0;
	}


#about[data-object="active"] .about>.text>p.tex{
		opacity: 1;
		left: 0;
	}
#about[data-object="active"] .about>.text>ul>li{
		opacity: 1;
		top: 0;
	}
#about[data-object="active"] .about>.text>p.btns{
		left: 0;
		opacity: 1;
	}

#voice p.btn{
		position: relative;
		left: -40%;
		transition: .6s ease-out;
		opacity: 0;
	}
#voice[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
		transition-delay: .8s;
	}

#instagram p.btn{
		position: relative;
		left: -40%;
		transition: .6s ease-out;
		opacity: 0;
	}
#instagram[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
		transition-delay: .5s;
	}

#blog p.btn{
		position: relative;
		opacity: 0;
		left: -40%;
		transition: .6s ease-out;
	}
#blog[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
		transition-delay: .8s;
	}




@media screen and (max-width:767px){
#visual .main_img {
    /* background-position: 43% center;*/
     background-position: 51%;
 }

#event[data-object="active"] p.btn{
		transition-delay: 2.3s;
	}
#works[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
		transition-delay: 5s;
	}
#works .images>ul.img>li .img{
	    width: 100%;
	}
#about .about>.text>p.tex{
			transition-delay: 1.5s;
		}

#about .about>.text:before{
		width: 0;
		transition: .6s ease-out;
	    transition-delay: 1.2s;
	    right: -20px;
	}
#about .about>.text:after{
		height: 0;
	    transition: .6s ease-out;
		transition-delay: 1.2s;
		top: -32px;
        right: -10px;
	}
#about[data-object="active"] .about>.text:before{
		width: 360px;
	}
#about[data-object="active"] .about>.text:after{
		height: 500px;
	}

#about[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
	    transition-delay: 7.8s;
	}
#instagram[data-object="active"] p.btn{
		opacity: 1;
		left: 0;
		transition-delay: 2s;
	}
}


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

	/*#top h2,
	#top p.tx{
		position: relative;
		left: 40px;
		opacity: 0;
		transition: .6s ease-out;
	}
	#top p.tx{
		transition-delay: .5s;
	}

	#top[data-object="active"] h2,
	#top[data-object="active"] p.tx{
		top: 0;
		left: 0;
		opacity: 1;
	}*/

	/*
	#event h2,
	#event p.tx,
	#event ul.event>li,
	#event p.tx2,
	#event p.tx3,
	*/

	#event ul.event>li{
		left: 0;
		top: 40px;
	}
   /*#event p.btn{
		opacity: 0;
		left: -40%;
	}*/

	#event[data-object="active"] h2{
		left: 0;
		opacity: 1;
	}
	#event[data-object="active"] p.tx{
		left: 0;
		opacity: 1;
		transition-delay: .5s;
	}
	#event[data-object="active"] ul.event>li{
		top: 0;
		opacity: 1;
		transition-delay: 1s;
	}
	#event[data-object="active"] ul.event>li:nth-child(2){
		transition-delay: 1.2s;
	}
	#event[data-object="active"] ul.event>li:nth-child(3){
		transition-delay: 1.4s;
	}
	#event[data-object="active"] p.tx2{
		left: 0;
		opacity: 1;
		transition-delay: 1.6s;
	}

	#event[data-object="active"] p.tx3{
		left: 0;
		opacity: 1;
		transition-delay: 2s;
	}

	/*
	#works h2,
	#works p.tex{
		position: relative;
		opacity: 0;
		left: 40px;
		transition: .6s ease-out;
	}
	#works .images>.flexslider{
		position: relative;
		top: 40px;
		opacity: 0;
		transition: .6s ease-out;
	}
	#works .images>ul.img>li{
		position: relative;
		top: 40px;
		opacity: 0;
		transition: .6s ease-out;
	}
	*/

	#works[data-object="active"] h2{
		opacity: 1;
		left: 0;
	}
	#works[data-object="active"] p.tex{
		opacity: 1;
		left: 0;
		transition-delay: .5s;
	}
	#works[data-object="active"] .images>.flexslider{
		opacity: 1;
		top: 0;
		transition-delay: 1s;
	}
	#works[data-object="active"] .images>ul.img>li{
		opacity: 1;
		top: 0;
		transition-delay: 1.2s;
	}
	#works[data-object="active"] .images>ul.img>li:nth-child(2){
		transition-delay: 1.4s;
	}
	#works[data-object="active"] .images>ul.img>li:nth-child(3){
		transition-delay: 1.6s;
	}
	#works[data-object="active"] .images>ul.img>li:nth-child(4){
		transition-delay: 1.8s;
	}


	/*
	#about h2,
	#about p.tx,
	#about .about>.image>.img,
	#about .about>.image>.profile,
	*/


	/*#about .about>.text>ul>li
	{
		opacity: 0;
		transition: .6s ease-out;
	}
	/*
	#about h2{
		position: relative;
		left: 40px;
	}
	#about p.tx{
		position: relative;
		left: 40px;
		transition-delay: .5s;
	}
	#about .about>.image>.img{
		position: relative;
		left: -40px;
		transition-delay: 1s;
	}
	#about .about>.image>.profile{
		right: -70px;
		transition-delay: 1.5s;
	}
	*/

	#about[data-object="active"] .about>.image>.profile{
			opacity: 1;
			right: -30px;
		}
	/*
	#about .about>.text>ul>li{
		position: relative;
		top: 40px;
		transition-delay: 1.5s;
	}
	#about .about>.text>ul>li:nth-child(2){
		transition-delay: 1.7s;
	}
	#about .about>.text>ul>li:nth-child(3){
		transition-delay: 1.9s;
	}
	#about .about>.text>ul>li:nth-child(4){
		transition-delay: 2.1s;
	}
	#about .about>.text>ul>li:nth-child(5){
		transition-delay: 2.3s;
	}
	#about .about>.text>ul>li:nth-child(6){
		transition-delay: 2.5s;
	}
	*/



	/*
	#buttons ul>li{
		position: relative;
		opacity: 0;
		top: 40px;
		transition: .6s ease-out;
	}
	#buttons[data-object="active"] ul>li{
		top: 0;
		opacity: 1;
	}
	#buttons[data-object="active"] ul>li:last-child{
		transition-delay: .2s;
	}
	*/

	/*
	#voice h2,
	#voice p.tx{
		position: relative;
		opacity: 0;
		left: 40px;
		transition: .6s ease-out;
	}
	#voice ul>li{
		position: relative;
		opacity: 0;
		top: 40px;
		transition: .6s ease-out;
	}
	*/

	#voice[data-object="active"] h2{
		opacity: 1;
		left: 0;
	}
	#voice[data-object="active"] p.tx{
		opacity: 1;
		left: 0;
		transition-delay: .5s;
	}
	#voice[data-object="active"] ul>li{
		top: 0;
		opacity: 1;
		transition-delay: 1s;
	}
	#voice[data-object="active"] ul>li:nth-child(2){
		transition-delay: 1.2s;
	}
	#voice[data-object="active"] ul>li:nth-child(3){
		transition-delay: 1.5s;
	}

	/*
	#instagram h2{
		position: relative;
		opacity: 0;
		left: 40px;
		transition: .6s ease-out;
	}
	#instagram ul>li{
		position: relative;
		opacity: 0;
		top: 40px;
		transition: .6s ease-out;
	}
	*/

	#instagram[data-object="active"] h2{
		opacity: 1;
		left: 0;
	}
	#instagram[data-object="active"] ul>li{
		top: 0;
		opacity: 1;
		transition-delay: .5s;
	}
	#instagram[data-object="active"] ul>li:nth-child(2){
		transition-delay: 1s;
	}
	#instagram[data-object="active"] ul>li:nth-child(3){
		transition-delay: 1.2s;
	}
	#instagram[data-object="active"] ul>li:nth-child(4){
		transition-delay: 1.4s;
	}
	#instagram[data-object="active"] ul>li:nth-child(5){
		transition-delay: 1.6s;
	}
	#instagram[data-object="active"] ul>li:nth-child(6){
		transition-delay: 1.8s;
	}
	#instagram[data-object="active"] ul>li:nth-child(7){
		transition-delay: 2s;
	}
	#instagram[data-object="active"] ul>li:nth-child(8){
		transition-delay: 2.2s;
	}


	/*
	#news h2,
	#news .box>ul>li{
		opacity: 0;
		position: relative;
		left: 40px;
		transition: .6s ease-out;
	}
	#news[data-object="active"] h2,
	#news[data-object="active"] .box>ul>li{
		left: 0;
		opacity: 1;
	}
	#news[data-object="active"] .box>ul>li{
		transition-delay: .5s;
	}
	#news[data-object="active"] .box>ul>li:nth-child(2){
		transition-delay: .7s;
	}
	#news[data-object="active"] .box>ul>li:nth-child(3){
		transition-delay: .9s;
	}
	#news[data-object="active"] .box>ul>li:nth-child(4){
		transition-delay: 1.1s;
	}
	#news[data-object="active"] .box>ul>li:nth-child(5){
		transition-delay: 1.3s;
	}
	*/

	/*
	#blog h2{
		opacity: 0;
		position: relative;
		left: 40px;
		transition: .6s ease-out;
	}
	#blog ul.slides>li{
		opacity: 0;
		position: relative;
		top: 40px;
		transition: .6s ease-out;
	}
	*/

	#blog[data-object="active"] h2{
		left: 0;
		opacity: 1;
	}
	#blog[data-object="active"] ul.slides>li{
		opacity: 1;
		top: 0;
		transition-delay: .5s;
	}
	#blog[data-object="active"] ul.slides>li:nth-child(2){
		transition-delay: .7s;
	}
	#blog[data-object="active"] ul.slides>li:nth-child(3){
		transition-delay: .9s;
	}


	/*
	#access ul>li{
		opacity: 0;
		position: relative;
		top: 40px;
		transition: .6s ease-out;
	}
	#access[data-object="active"] ul>li{
		top: 0;
		opacity: 1;
	}
	#access[data-object="active"] ul>li:last-child{
		transition-delay: .2s;
	}
	*/
}

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

	p.btn>a{
		width: 60%;
		font-size: 1.4rem;
	}
	p.btn>a>span{
		min-width: 1px;
	}
	#visual{
		background: none;
		height: 100vh;
	}
	#visual:after{
		display: none;
	}
	/*#visual>h1{
		opacity: 0;
		padding: 200px 0;
	}*/
	#visual>h1>img{
		width: 150px;
	}
	/*#visual> .flexslider{
		width: auto;
		height: 455px;
	}

	#visual>.flexslider .slides img {
	height: 455px;
    width: 100%;
	object-fit: cover;
}
	#visual>.flexslider .slides > li{
		width: 0px;
    margin-right: 0px;
    float: left;
    display: block;

	}
	#visual>video{
		width : auto;
		height : 455px;
		margin-left: -209px;
	}*/

    #visual .scroll {
        bottom: 18%;
    }
    #visual .scroll::after {
        bottom : -160px;
        height : 130px;
    }

	#top{
		padding: 20px 0;
	}
	#top p.img img {


    }
	#top h2{
		font-size: 2.0rem;
	}
	#top p.tx{
		font-size: 1.5rem;
		line-height: 25px;
	}
    /*#nps .column {
        background: url(../img/index/about_img1.png) no-repeat 80% 60% #f8f6f2;
        background-size: 80%;
    }*/
    #nps h2 {
        font-size: 2.0rem;
        margin: 10px auto 30px;
    }
    #nps .img_box {
        width:100%;
    }
    #nps .title_img {
    margin: -50px auto 0;
}
    #nps .bn_img {
    width: 100%;
    /*margin: 120px auto 20px;*/
    }
    #nps .bn_img img {
    width: 100%;
}
    #nps .text {
        width:90%;
        margin: 10px auto;
    }
    
	#event{
		padding: 5px 0 20px;
	}
	#event h2{
		font-size: 2.6rem;
		margin: 0 auto 10px;
	}
	#event p.tx{
		margin-bottom: 30px;
	}
	#event p.tx2{
		font-size: 1.3rem;
		margin: 0 auto 5px;
	}
	#event p.tx3{
		font-size: 1.4rem;
	}
	#event>p.btn{
		margin: 0 auto;
	}

	#event ul.event{
	   margin: 0 auto;
	}
	#event ul.event>li{
	   width: 100%;
    }
	#works {
		padding-bottom: 40px;
	}
	#works>.inner:before{
		width: 100%;
		background-position-x: right;
		right: 10px;
		top: -80px;

	}

	#works h2{
		margin-bottom: 10px;
	}
	#works h2>span{
		font-size: 3.2rem;
	}
	#works h2>small{
		padding: 0 20px 0 50px;
		right: -10px;
	}
	#works p.tex{
		margin-bottom: 20px;
		font-size: 1.3rem;
		line-height: 20px;
	}
	#works .images{
		margin: 0 -20px ;
		padding: 0;
	}
	#works .images>.flexslider{
		width: 350px;
		margin: 0 auto 50px;
	}
	#works .images>.flexslider:after{
		width: 90%;
		left: 12%;
		top: 8%;
		overflow: hidden;
	}
	#works .images>ul.img{
		width: auto;
		padding: 0 20px;
	}
	#works .images>ul.img>li{
		width: 48%;
		margin: 0 4% 15px 0;
	}

	#about{
		padding: 20px 0 40px;
	}
	#about .inner{
	   width: auto;
       padding: 20px;
   }
	#about p.tx{
		font-size: 1.4rem;
        line-height: 50%;
		margin: 0 auto 20px
	}
	#about h2{
		font-size: 3.0rem;
	}
	#about h2>span{
		background: url(../img/index/about_h2_bg.svg) 10px 0 no-repeat;
		background-size: 26px auto;
		padding: 6px 0 6px 50px;
	}
	#about .about>.image{
		position: relative;
		top: 0;
		left: 0;
		margin: 0 -20px 80px;
	}
	#about .about>.image>.profile{
		bottom: -60px;
		right: 20px;
		text-align: right;
	}
	#about .about>.image>.profile>img{
		margin: 0 0 0 auto;
		width: 170px;
		height: auto;
	}
	#about .about>.image>.profile>span{
		text-align: right;
		padding-right: 20px;
	}
	#about .about>.text{
		width: auto;
		position: relative;
		margin: 30px auto 20px;
	}

	/*#about .about>.text:before{
		width: 100%;
		right: -20px;
		padding: 0 20px;
	}
	#about .about>.text:after{
		top: -30px;
		right: 0;
		height: 500px;
	}*/
	#about .about>.text>p.tex{
		padding: 30px 10px 20px;
		margin: 0 auto 20px;
	}
	#about .about>.text>p.tex:before{
		width: 100%;
		padding: 0 10px;
		right: -20px;
	}
	#about .about>.text>ul>li{
		width: 47%;
		margin: 0 6% 12px 0;
	}
	#about .about>.text>ul>li .tit{
		font-size: 1.3rem;
		padding-left: 0;
		width: auto;
		margin: 0 0 20px;

	}
	#about .about>.text>ul>li .tit:after{
		top: 20px;
	}
	#about .about>.text>ul>li .tx{
		font-size: 1.1rem;
		text-align: left;
		padding-left: 15%;
	}
	#about>.btn>a{
		width: 70%;
	}
    #buttons h2 {
        font-size: 2.4rem;
	}
	#buttons p.txt{
		  margin: 0 auto 20px;
	}
	#buttons,
	#buttons_01{
		padding: 40px 0;
		background-attachment: scroll;
	}

	#buttons ul>li,
	#buttons_01 ul>li{
		display: block;
		width: 100%;
		margin: 0 auto 10px;
		/*padding: 1.2%;*/
	}
	#buttons ul>li:last-child,
	#buttons_01 ul>li:last-child{
		margin-bottom: 0;
	}
	#buttons ul>li>a{
		padding: 5px;
	}
	#buttons_01 ul>li>a{
		padding: 20px 15px 15px;

	}
	#buttons ul>li h2{
		font-size: 2.0rem;
		padding: 0 ;
	}
	#buttons_01 ul>li h2{
		font-size: 3rem;
		padding: 0 0 20px;
	}
	#buttons ul>li p.tx,
	#buttons_01 ul>li p.tx{
		font-size: 1.3rem;
		margin: 0 auto 5px;
		padding: 0 2%;
		line-height: 18px;
		letter-spacing: 1px;
	}
	#buttons_01 ul>li:first-child>a:after{
		top: 20px;
		left: 25px;
	}

	/*#buttons_01 ul>li:first-child p.tx{
		padding-right: 70px;
	}*/
	#buttons ul>li h2>small{
		font-size: 1.7rem;
		margin: 0 auto 0;
		letter-spacing: 2px;
	}
	#buttons_01 ul>li h2>small{
		font-size: 1.2rem;
        line-height: 140%;
		margin: 0 auto 0;
	}

	#voice{
		overflow: hidden;
	}
	#voice:after{
		top: -25px;
		left :20px;
		width: 30%;
		background: url(../img/index/voice_bg.svg) left no-repeat;
	}
	#voice>.inner{
		padding-bottom: 0px;
	}
	#voice h2{
		font-size: 3rem;
		position: relative;
		z-index: 2;
	}
	#voice p.txt {
    font-size: 1.4rem;
    line-height: 50%;
    margin: 0 auto 50px;
	position: relative;
	z-index: 2;
   }
	#voice p.tx{
		position: relative;
		z-index: 2;
		font-size: 1.1rem;
		letter-spacing: 0px;
	}
	#voice ul{
		margin: 0 auto 10px;
	}
	#voice ul>li{
		display: block;
		width: auto;
		margin: 0 auto 60px;
		text-align: center;
	}
	#voice ul>li:nth-child(1):before{
		width: 100%;
		top: -180px;
		left: -160px;
	}
	#voice ul>li:nth-child(2):before{
		top: -15px;
		left: 80px;
		height: 400px;
	}
	#voice ul>li:nth-child(3):before{
		width: 100%;
		top: -20px;
		right: 140px;
		width: 400px;
		height: 460px;
	}

	#instagram{
		padding: 10px 0 40px;
	}
	#instagram h2{
		font-size: 3rem;
		margin-bottom: 20px;
	}
	#instagram h2>img{
		margin: 3px 15px 0 0;
	}
	#instagram ul>li{
		width: 48%;
		margin: 0 4% 20px 0;
	}
	#instagram ul>li:nth-child(2n){
		margin-right: 0;
	}
	#instagram p.btn>a{
		text-align: center;
	}
	#instagram p.btn>a>span{
		padding-left: 70px;
	}

	#news{
		padding: 10px 0;
	}
	#news h2{
		font-size: 3rem;
		margin-bottom: 20px;
	}
	#news .box{
		width: auto;
	    padding: 10px 10px 14px
	}
	#news .box>ul>li{
		display: table;
		letter-spacing: normal;
	}
	#news .box>ul>li>span,
	#news .box>ul>li>a{
		display: table-cell;
		vertical-align: top;
	}
	#news .box>ul>li>span{
		margin: 0 auto;
		padding: 0 20px 0 0;
		white-space: nowrap;
	}

	#blog{
		padding: 0;
		background: #fff;
	}
	#blog:before,
	#blog:after{
		content: none;
	}
	#blog>div{
		padding: 40px 0;
		background: url(../img/index/blog_bg.svg) left top no-repeat, url(../img/index/blog_bg2.svg) right 10px top no-repeat;
		background-size: auto 100%;
	}
	#blog>div:before{
		content: '';
		width: 100%;
		height: 6px;
		background: #ef806a;
		position: absolute;
		top: 26px;
		left: 0;
		z-index: 2;
		mix-blend-mode: multiply;
	}
	#blog>div:after{
		content: '';
		width: 100%;
		height: 6px;
		background: #aab3ff;
		position: absolute;
		top: 38px;
		left: 0;
		z-index: 2;
		mix-blend-mode: multiply;
	}
	#blog>div>div:before{
		content: '';
		width: 100%;
		height: 6px;
		background: #ef806a;
		position: absolute;
		bottom: 6px;
		left: 0;
		z-index: 2;
		mix-blend-mode: multiply;
	}
	#blog>div>div:after{
		content: '';
		width: 100%;
		height: 6px;
		background: #aab3ff;
		position: absolute;
		bottom: 19px;
		left: 0;
		z-index: 2;
		mix-blend-mode: multiply;
	}
	#blog inner{
		width: auto;
		padding: 20px 10px;
	}
	#blog h2{
		font-size: 3rem;
		margin-bottom: 20px;
	}

	#blog .flex-direction-nav{
		margin: 0 auto;
	}
	#blog ul{
		margin-bottom: 10px;
	}
	#blog ul>li>p.link{
		text-align: center;
	}
	#blog ul>li>.tx {
		font-size: 1.2rem;
		margin: 0 20px 10px;
	}
	#blog ul>li>.img{
		width: 50%;
	}
	#blog p.btn>a{
		text-align: center;
	}
	#blog p.btn>a>span{
		padding-left: 70px;
	}
    
	#access{
		padding: 40px 0;
		background-attachment: scroll;
	}
	#access ul>li{
		display: block;
		width: auto;
		margin: 0 auto 40px;
	}
	#access ul>li:last-child{
		width: auto;
		margin: 0 auto;
		padding: 24px 30px;
	}


	#event .sp_slider,
	#blog .sp_slider{
		margin: 0 20px;
	}
	#event .sp_slider .flex-direction-nav a,
	#blog .sp_slider .flex-direction-nav a{
		width: 40px;
		height: 72px;
		margin-top: -35px;
		opacity: 1;
	}
	#event .sp_slider .flex-direction-nav .flex-prev{
		background: url(../img/index/slide_prev_sp.svg) 0 0 no-repeat;
		background-size: 100% auto;
		left: -35px;
	}
	#event .sp_slider .flex-direction-nav .flex-next{
		background: url(../img/index/slide_next_sp.svg) 0 0 no-repeat;
		background-size: 100% auto;
		right: -35px;
	}
	#blog .sp_slider .flex-direction-nav .flex-prev{
		background: url(../img/index/slide_prev.svg) right center no-repeat;
	}
	#blog .sp_slider .flex-direction-nav .flex-next{
		background: url(../img/index/slide_next.svg) right center no-repeat;
	}
}