@charset "utf-8";



@media screen and (max-width:799px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
    /*SP*/
}

#overflow{
	overflow: hidden;
}

/*--------------------------------------------
    Splash
--------------------------------------------*/
#splash{
	background:#000;
	width: 100%;
	height:100vh;
	position:absolute;
	top:0;
	left:0;
	z-index: 1000;
	/* animation-name: splash;
	animation-duration: 2s;
	animation-timing-function: linear;
	animation-delay: 4.5s;
	animation-fill-mode: both; */
}
/* @keyframes splash {
	0% {opacity:1;}
	50% {opacity:1;}
	90% {opacity:0; z-index:1000;}
	100% {opacity:0; z-index:0;}
} */
.splash{
	display: none;
}
#splash img{
	animation-duration: 2s;
	animation-timing-function: linear;
	animation-delay: 1s;
	animation-name: splash_logo;
	animation-fill-mode: both;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	width: 20%;
	transform: translate(-50%,-50%);
    margin-left: 3%;
    max-width: 200px;
}
@keyframes splash_logo {
	0% {opacity:0;}
	90% {opacity:1;}
	100% {opacity:0;}
}

@media screen and (max-width:799px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
	/*SP*/
	#splash img{
		width: 40%;
		margin-left: 5%;
	}
}


/*--------------------------------------------
    Slider
--------------------------------------------*/
#slide_wrap{
	position: relative;
	overflow: hidden;
}
#slide_wrap .slide_item{
	opacity: 0;
	transform: scale(1.1);
	transition: opacity 2s linear, transform 7.5s linear;
	position: relative;
	z-index: 1;
	width: 100vw;
    height: 100vh;
    background-size: cover;
}
#slide_wrap .slide_item.zoomOut{
	transform: scale(1);
}	
#slide_wrap .slide_item:not(:first-child){
	position: absolute;
	top: 0;
	left : 0;
}
#slide_wrap .slide_item.show_{
	opacity: 1;
}
#slide_wrap .slide_item.zoomUp.play_{
	transform: scale(1);
}
#slide_wrap .slide_item.zoomOut.play_{
	transform: scale(1.1);
}
#slide_wrap .slide_item.leftRight.play_{
	transform: scale(1.1) translate(-5%,0);
}
#slide_wrap .slide_item.rightLeft.play_{
	transform: scale(1.1) translate(5%,0);
}
#slide_wrap .slide_item img{
	display: block;
}
.slider00{
	background-image: url(../img/img_slide00.jpg);
}
.slider01{
	background-image: url(../img/img_slide01.jpg);
}
.slider02{
	background-image: url(../img/img_slide02.jpg);
}
.slider03{
	background-image: url(../img/img_slide03.jpg);
}
.slider04{
	background-image: url(../img/img_slide04.jpg);
}
.main_logo{
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	width: 20%;
	transform: translate(-50%,-50%);
	filter: drop-shadow(0px 0px 10px rgba(0,0,0,0.6));
    margin-left: 3%;
    max-width: 200px;
}
.slide-img img{
	display: block;
}

@media screen and (max-width:799px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
    /*SP*/
    .main_logo{
		width: 40%;
	    margin-left: 5%;
	}
	#slide_wrap .slide_item.leftRight,
	#slide_wrap .slide_item.rightLeft{
		transform: scale(1.2);
	}	
	#slide_wrap .slide_item.leftRight.play_{
		transform: scale(1.2) translate(-10%,0);
	}
	#slide_wrap .slide_item.rightLeft.play_{
		transform: scale(1.2) translate(10%,0);
	}
	.slider00{
		background-image: url(../img/img_slide00s.jpg);
		background-position: center;
	}
	.slider01{
		background-image: url(../img/img_slide01s.jpg);
		background-position: center;
	}
	.slider02{
		background-image: url(../img/img_slide02s.jpg);
		background-position: center;
	}
	.slider03{
		background-image: url(../img/img_slide03s.jpg);
		background-position: center;
	}
	.slider04{
		background-image: url(../img/img_slide04s.jpg);
		background-position: center;
	}
}

/*--------------------------------------------
    News
--------------------------------------------*/
#news{
	padding:5rem 0;
	/* background:#FAFAFA; */
}
#news .box{
	align-items: flex-start;
    position:relative;
}
#news .news_title{
	letter-spacing: 0.5rem;
	border:1px solid #000;
	display: inline-block;
	padding:4rem 1rem 4rem 1.5rem;
	margin-right: 8%;
	width: 12%;	
	text-align: center;
}
#news #feeds{
	width:65%;
}
#news #feeds li{
    list-style-type: none;
    margin-bottom: 1rem;
}
#news #feeds li .date{
	display: inline-block;
    font-size: 1.4rem;
}
#news #feeds li a{
    margin-left: 3rem;
    color:#333;
}
#news .blogFeed dl{
	width:100%
}
#news .blogFeed dd{
	width:20%;
	font-weight:bold;
}
#news .more_news a{
    width: 12%;
    position: absolute;
    bottom: 1rem;
    right: 0;
    font-size:1.4rem;
    color: #000;
}
#news .more_news a::after {
    content: "";
    display: inline-block;
    background: url(../../common/img/img_arrow_k.svg);
    width: 22px;
    height: 4px;
    position: absolute;
    right: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    transition: 0.3s;
}
#news .more_news a:hover::after {
    right: 0rem;
}

@media screen and (max-width:799px) {
	/*SP-Tablet*/
	#news .news_title {
		width: 17%;
	}
	#news #feeds{
		width:75%;
	}
	#news .blogFeed dd{
		width:25%
	}
}
@media screen and (max-width:479px) {
	/*SP*/
	#news{
		padding:5rem 0;
		font-size:1.4rem;
	}
	#news .box{
	}
	#news .news_title{
        padding: 2rem 3rem;
        width: auto;
		margin-left: auto;
		margin-right: auto;
	}
	#news #feeds {
		width:90%;
		margin-left: 5%;
		margin-top: 3rem;
	}
	#news .blogFeed dd{
		width:100%
	}
	#news .blogFeed dt{
		margin-bottom:0.5rem;
	}
    #news #feeds li .date{
        display: block;
        font-size:1.2rem;
    }
    #news #feeds li a{
        margin-left: 0;
    }
}

/*--------------------------------------------
    Read
--------------------------------------------*/
#read {
	background:url(../img/bg_lead.png);
	position: relative;
}
#read .calligraphy{
	position: absolute;
}
#read .read_wrap{
	/* background: linear-gradient(to right,#fff, #fff 49%, #000 50%, #000); */
	padding: 15rem 0;
}
#read .flex{
	vertical-align: middle;
	justify-content: space-between;
}
#read .read_wrap .flex img{
    width: 50%;
    max-width: 500px;
    margin-left: calc( 50% - 500px);
}
#read .read_text{
    width: 50%;
    display: flex;
    flex-wrap: wrap;
	justify-content: left;
    align-items: center;
    background: #000;
}
#read .vertical{
	color:#fff;
	line-height:4;
	margin-left: 10rem;
}

@media screen and (max-width:799px) {
	/*SP-Tablet*/
	#read img {
		margin-left: 0;
	}
}
@media screen and (max-width:479px) {
	/*SP*/
	#read .flex{
		align-items: flex-start;
		position: relative;
		margin-left: 5%;
		margin-right: 5%;
	}
	#read .read_wrap .flex img {
		width: 80%;
		margin-left:0;
	}
	#read .read_text {
		width: 80%;
		display: block;
		margin-top: -4rem;
		padding: 2rem;
		margin-left: auto;
	}
	#read .vertical {
		line-height: 3;
		margin: 0 auto;
	}
}


/*--------------------------------------------
    Guide
--------------------------------------------*/
#guide{
	overflow: hidden;
}
#guide .guide_bg{
	position:relative;
	height:600px;
	/* transition:0.3s; */
	overflow:hidden;
	pointer-events: none;
}
#guide .guide_bg::before{
	content:"";
	display:inline-block;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:50vh;
	min-height:600px;
	transition:0.3s;
}
#guide .guide_bg:hover::before{
	/* filter: brightness(80%); */
	/* transform:scale(1.03); */
	/* filter:blur(10px); */
	filter: contrast(150%);
}
#guide .know::before{
	background:url(../img/bg_guide_know.jpg) no-repeat;
	background-size: cover;
	background-position:center;
}
#guide .left .gradation{
    left: 0;
}
#guide .right .gradation{
    right: 0;
}
#guide .know_gradation{
    width: 50%;
    background: linear-gradient(to right,#fff, #88bcff 60%, #2e71b7);
    position: absolute;
    mix-blend-mode: multiply;
    height: 100%;
}
#guide .tea::before{
	background:url(../img/bg_guide_tea.jpg) no-repeat;
	background-size: cover;
	background-position:center;
}
#guide .tea_gradation{
    width: 50%;
    background: linear-gradient(to right,#5c1803, #aa3200 40%, #fff);
    position: absolute;
    mix-blend-mode: multiply;
    height: 100%;
}
#guide .around::before{
	background:url(../img/bg_guide_around.jpg) no-repeat;
	background-size: cover;
	background-position:center;
}
#guide .around_gradation{
    width: 50%;
    background: linear-gradient(to right,#fff, #00aa00 60%, #003c00);
    position: absolute;
    mix-blend-mode: multiply;
    height: 100%;
}
#guide .proud::before{
	background:url(../img/bg_guide_proud.jpg) no-repeat;
	background-size: cover;
	background-position:center;
}
#guide .proud_gradation{
    width: 50%;
    background: linear-gradient(to right,#532000, #bb8106 40%, #fff);
    position: absolute;
    mix-blend-mode: multiply;
    height: 100%;
}
#guide .experience::before{
	background:url(../img/bg_guide_experience.jpg) no-repeat;
	background-size: cover;
	background-position:center;
}
#guide .experience_gradation{
    width: 50%;
    background: linear-gradient(to right,#fff, #0087aa 60%, #000040);
    position: absolute;
    mix-blend-mode: multiply;
    height: 100%;
}
#guide .pray::before{
	background:url(../img/bg_guide_pray.jpg) no-repeat;
	background-size: cover;
	background-position:center;
}
#guide .pray_gradation{
    width: 50%;
    background: linear-gradient(to right,#532000, #bb8106 40%, #fff);
    position: absolute;
    mix-blend-mode: multiply;
    height: 100%;
}
#guide .contents{
    display: inline-block;
    text-align: center;
    position: absolute;
    transform: translateY(-50%);
}
#guide .left .contents{
    top: 50%;
    left: 10%;
}
#guide .right .contents{
    top: 50%;
    right: 10%;
}
#guide .contents img{
	margin-bottom:3rem;
}
#guide .know .contents img{
	width:45%;
	max-width: 84px;
}
#guide .tea .contents img{
	width:45%;
	/* max-width: 105px; */
	max-width: 70px;
}
#guide .around .contents img{
	width:45%;
	max-width: 71px;
}
#guide .proud .contents img{
	width:45%;
	max-width: 82px;
}
#guide .experience .contents img{
	width:45%;
	max-width: 99px;
}
#guide .pray .contents img{
	width:35%;
	max-width: 80px;
}
#guide .contents li{
	color: #fff;
    line-height:3;
    letter-spacing: 0.5rem;
}
#guide .contents .more{
    margin-top: 4rem;
    padding: 0.5rem 7rem;
    background: #fff;
    line-height: 2;
    letter-spacing: 0.5rem;
    pointer-events: auto;
    border: 1px solid #fff;
    font-size: 1.4rem;
}
#guide .fadein_left {
	filter: grayscale(100%);
}
#guide .fadein_left.effect-scroll {
	filter: grayscale(0);
}
#guide .fadein_right {
	filter: grayscale(100%);
}
#guide .fadein_right.effect-scroll {
	filter: grayscale(0);
}




@media screen and (max-width:799px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
	/*SP*/
	#guide .know_gradation,
	#guide .tea_gradation,
	#guide .around_gradation,
	#guide .proud_gradation,
	#guide .experience_gradation,
	#guide .pray_gradation
	{
		width: 100%;
	}
	#guide .left .contents {
		top: 50%;
		left: 0;
		width: 100%;
	}
	#guide .right .contents {
		top: 50%;
		right: 0;
		width: 100%;
	}
}

/*--------------------------------------------
    Calligraphy
--------------------------------------------*/
#calligraphy{
	background:url(../img/bg_calligraphy.png);
	padding: 15rem 0;
}
#calligraphy .flex{
	align-items: flex-end;
}
#calligraphy .calligraphy_image{
	width: 30%;
	text-align: right;
	margin-right: 7%;
}
#calligraphy img{
    max-width: 127px;
}
#calligraphy .calligraphy_text {
}
#calligraphy .calligraphy_text .title{
	font-size: 2.4rem;
	letter-spacing: 0.2rem;
	margin-bottom: 3rem;
}
#calligraphy .calligraphy_text .text{
	line-height: 3;
}

@media screen and (max-width:799px) {
	/*SP-Tablet*/
	#calligraphy .calligraphy_image {
		width: 20%;
		text-align: right;
		margin-right: 5%;
	}
}
@media screen and (max-width:479px) {
	/*SP*/
	#calligraphy .calligraphy_image {
		margin-left: 40%;
		margin-bottom: 3rem;
	}
	#calligraphy .calligraphy_text {
		width: 100%;
		text-align: center;
	}
}


/*--------------------------------------------
    Access
--------------------------------------------*/
#access{
	width:98%;
	height:50rem;
	margin-top:25rem;
	margin-left:1%;
	display: inline-block;
	position:relative;
}
#access .box{
	background-color: #fff;
	text-align: center;
	margin-top: -7rem;
	z-index: 2;
	position: absolute;
	padding: 4rem 0 0 0;
	left: 50%;
	transform: translateX(-50%);
}
#access img{
	width:35%;
	max-width: 108px;
	position:absolute;
    right: 2%;
    top: -32%;
}


@media screen and (max-width:799px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
	/*SP*/
	#access .box {
		margin-top: 0rem;
		position:static;
		left:0;
		transform:translateX(0);
	}
}


/*--------------------------------------------
    Gallery
--------------------------------------------*/

#gallery{
	margin-top:25rem;
	/* background:url(../../common/img/bg_washi.jpg); */
}
#gallery .instagram{
	justify-content:space-between;
}
#gallery .instagram li{
	width:23%;
    margin-bottom: 2%;
}
#gallery .instagram li a{
    width: 100%;
    height: 100%;
    padding-top: 100%;
    display: inline-block;
    background:#333;
}
#gallery .more{
	padding:2rem 10rem;
}
#gallery .more:before{
	content:"";
	display: inline-block;
	width:30px;
	height:30px;
	background:url(../img/icn_insta.svg);
	vertical-align: middle;
	position: absolute;
	left: 2rem;
	top: 50%;
    transform: translateY(-50%);
    transition: 0.3s;
}
.iswg-images{
    line-height: 0;
}
#insta-widget{
	border:none !important;
	background:none !important;
	padding: 0 !important;

}
.iswg-images-item{
	width:20% !important;
	padding: 0 !important;
}


@media screen and (max-width:799px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
	/*SP*/
	.iswg-images-item{
		width:50% !important;
	}
	#gallery .more{
		width:90%;
	}
}