@charset "UTF-8";

html{font-size:100%;line-height:1.5em;-webkit-overflow-scrolling:touch;overflow-scrolling:touch;}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
html{
/* 	font-family:bookmania, "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; */
	font-family:'Lato',"游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}
html.is--fixed{position:fixed;}

body{color:#000;background-color:#f8f8f8;font-feature-settings:"palt";}
body.is--offScroll{overflow:hidden;}
main{position:relative;width:100vw;}
a{color:#000;text-decoration:none;}

/* Lazyload */
.lazyload{opacity:0;}
/* .lazyloading{opacity:0;} */
.lazyloaded{opacity:1;transition:opacity .5s ease-out;background-size:cover;}

object{pointer-events:none;}


/* font / Flash of unstyled text */
/* html{visibility:hidden;} */
/* html.wf-active{visibility:visible;} */
.wf-loading{opacity:0;}
.wf-active{opacity:1;}

::selection{background-color:#dadada;color:#FFF;}

/*　--------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------


common


-------------------------------------------------- */
.c-imageWrap{position:relative;width:100%;height:auto;text-align:center;opacity:0;transition:all 1s ease-out;}
.c-imageContainer{width:100%;height:auto;display:inline-block;vertical-align:bottom;}
.c-imageContainer--bg{width:100%;height:100%;background-size:cover;background-repeat:no-repeat;}

.c-infoWrap{position:relative;width:100%;height:auto;text-align:center;opacity:0;transition:all 1s ease-out;}
.c-infoText--open{font-size:5vw;margin:120px 0;}

.c-headerWrap>.p-text{font-weight:normal;}

.is--opening .c-imageWrap,
.is--opening.c-imageWrap{opacity:1;}
.is--opening .c-infoWrap,
.is--opening.c-infoWrap{opacity:1;}

.is--bgcolor__ffffff{background-color:#FFF;}
.is--bgcolor__f0f0f0{background-color:#f0f0f0;}

/* ////////////// */
/* button          */
/* ////////////// */
.c-button{position:relative;padding:14px 20px 14px 32px;width:100%;background-color:#FFF;display:flex;justify-content:center;align-items:center;text-decoration:none;cursor:pointer;box-sizing:border-box;border:4px solid #000;  transition:all .1s ease-in-out;}
.c-button::before{}
.c-button::after{}

.c-button--r_arw{flex-direction:row-reverse;}
.c-button--r_arw::before{content:'';position:relative;width:12px;height:12px;margin:0 12px;transform:rotate(45deg);border-top:1px solid #111;border-right:1px solid #111;display:inline-block;z-index:99; transition:all .1s cubic-bezier(0.23, 1.27, 1, 0.65);}
/* .c-button--r_arw::after{content:'';position:absolute;left:0;width:0;height:100%;background-color:#63b501;display:inline-block;z-index:1; transition:all .1s cubic-bezier(0.23, 1.27, 1, 0.65);} */

.c-button p{position:relative;padding:6px 0;color:#111;font-size:18px;line-height:1.4;letter-spacing:0.05em;display:inline-block;z-index:2; transition:all .1s ease-in-out;}
.c-button p span{position:absolute;top:50%;right:-20px;width:10px;height:1px;transform:translateY(-50%);background-color:#111;display:inline-block; transition:all .1s cubic-bezier(0.23, 1.27, 1, 0.65);}

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

	.c-button:hover{padding:12px 18px 12px 30px;border:6px solid #e62b26;}

	.c-button--r_arw:hover{}
	.c-button--r_arw:hover::before{margin:0 4px 0 20px;border-top:1px solid #e62b26;border-right:1px solid #e62b26;}
/* 	.c-button--r_arw:hover::after{width:100%;background-color:#dadada;} */

	.c-button:hover p{color:#e62b26;}
	.c-button:hover p span{width:18px;right:-28px;background-color:#63b501;}
}
@media screen and (max-width:768px){
	.c-button p{font-size:14px;}
}



/* ////////////// */
/* table          */
/* ////////////// */
.c-table{}
.c-table tr{}
.c-table th,
.c-table td{padding:1em 1em 1em 0;font-size:16px;line-height:2.5;letter-spacing:0.05em;font-weight:normal;text-align:justify;}
.c-table td>div{display:flex;justify-content:flex-start;}
.c-table td span.p-title{min-width:30px;}
.c-table td small{font-size:12px;}
.c-table th{}
.c-table td{}

@media screen and (max-width:768px){
	.c-table th{min-width:120px;font-size:14px;}
	.c-table td span.p-title{font-size:14px;font-weight:bold;}
	.c-table td>div{flex-direction:column;margin-bottom:20px;}
	.c-table td .is--sp{margin-top:-20px;}
}
@media screen and (max-width:560px){
	.c-table th,
	.c-table td{width:100%;display:block; line-height:1.4;}
	.c-table th{padding-bottom:0.5em;font-size:14px;font-weight:bold;}
	.c-table td{padding:0em 0 1.5em 0;line-height:1.8;}
}


/*　--------------------------------------------------
------------------------------------------------------


loading


-------------------------------------------------- */
.c-pageloadingWrap{position:fixed;top:0;left:0;width:100%;height:100%;background:#f0f0f0;text-align:center;display:flex;justify-content:center;align-items:center;z-index:9999;}
.c-pageloadingContainer{}
.ball-clip-rotate > div{border:2px solid #000;border-bottom-color:transparent;}

/*　--------------------------------------------------
------------------------------------------------------


OPENING


-------------------------------------------------- */
.c-tltle--animation{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#FFF;display:block;z-index:999;}
.c-tltle--animation svg{position:absolute;top:50%;left:50%;width:100px;height:100px;transform:translate(-50%,-50%);box-sizing:border-box;opacity:0;}
.is--opening.c-tltle--animation svg{stroke:#000;fill:#FFF;stroke-opacity:0;stroke-width:1;stroke-dasharray:1100;animation:line 1.5s ease-in 0s forwards; opacity:1;}
/* .c-tltle--animation svg .st00{stroke:#000;fill:#000;fill-opacity:0;stroke-width:.1;stroke-dasharray:10;animation:line2 2s ease-in 0s forwards;} */

@keyframes line{
	0%{stroke-dashoffset:1100;stroke-opacity:0;}
	100%{stroke-dashoffset:0;stroke-opacity:1;}
}
@keyframes line2{
	0%{stroke-dashoffset:10;fill-opacity:0;}
/* 	70%{fill-opacity:0;} */
/* 	90%{fill-opacity:1;stroke-width:0.1;} */
	100%{stroke-dashoffset:0;stroke-width:0.1;fill-opacity:1;}
}


/*　--------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------


Header


-------------------------------------------------- */
.l-header{position:absolute;top:0;left:0;width:12vw;height:12vw;background-color:#000;z-index:11; transform:translateX(-100%);transition:opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1),transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);}
.l-header > .l-container{position:relative;width:100%;height:100%;padding:0;box-sizing:border-box;}

.l-header .c-logoWrap{position:absolute;top:47%;left:50%;display:block;opacity:0;z-index:11; transform:translate(-60%,-50%);cursor:pointer;  transition:all .8s ease-out;}
.l-header .c-logoContainer{width:56px;height:auto;display:inline-block;}

/* OP */
.is--opening.l-header{opacity:1;transform:translateX(0); transition-delay:0s;}
.is--opening.l-header .c-logoWrap{opacity:1;transform:translate(-50%,-50%); transition-delay:0.5s;}

@media screen and (min-width:768px){
	.c-logoWrap:hover{opacity:0.5;}
	.l-header .c-logoContainer{width:6vw;}
}
@media screen and (max-width:768px){
	.l-header .c-logoContainer{width:5vw;}
}



/*　--------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------


Gloval Menu (gm)


-------------------------------------------------- */
.l-gm{position:fixed;top:0;right:0;display:block;z-index:10;}
.l-gm>.l-container{position:relative;width:100%;height:100%;display:block;}

body.is--offScroll .l-gm{width:100%;height:100%;}


#navTgl{display:none;}

.nav-open,
.nav-close{position:fixed;top:40px;cursor:pointer;display:block;z-index:102; opacity:0;display:none;}

.nav-open{right:4vw;width:27px;height:calc(6px + 6px + 4px);transition:left .4s, transform 1s cubic-bezier(0.215, 0.61, 0.355, 1);}
/* .nav-open span, */
.nav-open::before,
.nav-open::after{content:"";position:absolute;top:0;left:0;width:100%;border-bottom:2px solid #000;transition:all .6s cubic-bezier(0.215, 0.61, 0.355, 1);}
.nav-open::before{transform:translateY(0);}
.nav-open::after{transform:translateY(12px);}

.nav-close{top:0;left:0;width:100%;height:100%;pointer-events:none;;transform:translateX(100%); z-index:2;}
.nav-close::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;transition:transform .4s cubic-bezier(0, 0.99, 0.23, 0.97);transform:translateX(100%);display:block;opacity:0.9;}
.nav-close::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;transition:transform .2s cubic-bezier(0, 0.99, 0.23, 0.97);transition-delay:0.2s;transform:translateX(100%);}
.nav-close::after{/* background-image:url('../images/mv-image@x2.jpg');background-size:covber; */}


.is--colorChange .nav-open::before,
.is--colorChange .nav-open::after{border-bottom:2px solid #666;}


.l-gm .c-lists{position:relative;top:19px;right:calc(4vw - 1vw); z-index:101; display:flex;flex-grow:1;flex-wrap:wrap;justify-content:space-between;align-items:center;}
.l-gm .c-item{position:relative;margin:8px 0 8px 1em;text-align:center;background-color:#F8F8F8;opacity:0;transform:translateX(20%);display:inline-block; transition:all 0.3s ease-out;}
.l-gm .c-item::before{content:'';position:absolute;top:50%;left:0;width:0;height:1px;background-color:#FF0;transition:all .2s cubic-bezier(0, 0.99, 0.23, 0.97);transform:translate(-100%,-50%);display:block;z-index:-1;}
.l-gm .c-item .c-itemContainer{width:auto;padding:10px 1vw;color:#111;font-size:14px;font-weight:normal;letter-spacing:0.1em;line-height:1.4;box-sizing:border-box;text-align:right;background-color:transparent;display:inline-block;}


/* OP */
.is--opening.l-gm .c-item{transform:translateX(0);opacity:1; transition-delay:.20s;}
.is--opening.l-gm .c-item:nth-child(1){transition-delay:.20s;}
.is--opening.l-gm .c-item:nth-child(2){transition-delay:.25s;}
.is--opening.l-gm .c-item:nth-child(3){transition-delay:.30s;}
.is--opening.l-gm .c-item:nth-child(4){transition-delay:.35s;}
.is--opening.l-gm .c-item:nth-child(5){transition-delay:.40s;}
.is--opening.l-gm .c-item:nth-child(6){transition-delay:.45s;}


#navTgl:checked + .nav-open{top:40px;right:4vw;}
/* 	#navTgl:checked + .nav-open span, */
#navTgl:checked + .nav-open::before,
#navTgl:checked + .nav-open::after{left:0;border-bottom:2px solid #FFF;}
/* 	#navTgl:checked + .nav-open span{transform:scaleX(0);color:#111;} */
#navTgl:checked + .nav-open::before{transform:rotate(45deg);}
#navTgl:checked + .nav-open::after{transform:rotate(-45deg);}
#navTgl:checked ~ .nav-close{pointer-events:auto;transform:translateX(0);}
#navTgl:checked ~ .nav-close::before{background-color:#999;transform:translateX(0);opacity:.4;}
#navTgl:checked ~ .nav-close::after{background-color:#000;transform:translateX(0);opacity:1; opacity:.9;}

#navTgl:checked ~ .c-lists{top:50%;right:0;transform:translateY(-50%);justify-content:center;opacity:1;display:flex; transition:opacity 0.4s ease-out;transition-delay:.5s;}
#navTgl:checked ~ .c-lists .c-item{opacity:1;display:block;}

@media screen and (min-width:860px){
	.nav-open:hover{transition:width .2s ease-out;}
	.nav-open:hover::before,
	.nav-open:hover::after{border-bottom:1px solid #DDD;transition:border-bottom .2s ease-out,transform .4s cubic-bezier(0.02, 0.97, 0.36, 1);}
	.nav-open:hover::before{transform:translateY(3px);}
	.nav-open:hover::after{transform:translateY(9px);}

	.l-gm .c-item:hover{}
	.l-gm .c-item:hover::before{width:80%;left:10%;transform:translate(0%,-50%);background-color:#e62b26;}
	.l-gm .c-item:hover .c-itemContainer{color:#e62b26;}
}
@media screen and (min-width:860px){
	.l-gm .c-item.is--active::before{width:80%;left:10%;transform:translate(0%,-50%);background-color:#e62b26;}
	.l-gm .c-item.is--active .c-itemContainer{color:#e62b26;}
}
@media screen and (max-width:860px){
	.nav-open,
	.nav-close{opacity:1;display:block;}
	.nav-open{top:calc((12vw - (6px + 6px + 4px) ) / 2);}
	.nav-close{top:0;}
	#navTgl:checked + .nav-open{top:calc((12vw - (6px + 6px + 4px) ) / 2 + 1vw);}

	.l-gm{width:20vw;height:100px;}
	.l-gm .c-lists{opacity:0;}
	.l-gm .c-item{margin:0;background-color:transparent;text-align:center; opacity:0;display:none;}
	.l-gm .c-item .c-itemContainer{width:70vw;padding:3vh 0; color:#FFF;font-size:3vw;text-align:center;}
}
@media screen and (max-width:560px){
	.nav-open{width:6vw;}
	.l-gm .c-item .c-itemContainer{font-size:18px;}
}
@media screen and (max-width:360px){
	.l-gm .c-item .c-itemContainer{font-size:18px;}
}


/*　--------------------------------------------------
------------------------------------------------------


WORKS Navgation

-------------------------------------------------- */
.c-itemContainer--subnavWrap{position:absolute;padding-top:calc(1em);width:60vw;pointer-events:none; display:flex;flex-wrap:wrap;justify-content:flex-start;}
.c-itemContainer--subnavContainer{padding:10px 1vw;font-size:12px;font-style:italic;font-weight:normal; background-color:#FFF;transform:translateY(-.2em); opacity:0;transition:all 0.4s ease-out;}
.c-itemContainer--subnavContainer::before{content:'';position:absolute;top:50%;left:0;width:0;height:1px;background-color:#FF0;transition:all .2s cubic-bezier(0, 0.99, 0.23, 0.97);transform:translate(-100%,-50%);display:block;z-index:-1;}

@media screen and (min-width:860px){
	.l-gm .c-item:hover .c-itemContainer--subnavWrap{pointer-events:visible;}
	.l-gm .c-item:hover .c-itemContainer--subnavContainer{ opacity:1;transform:translateY(0px);}

	.c-itemContainer--subnavContainer:hover{color:#e62b26;}
	.c-itemContainer--subnavContainer:hover::before{width:80%;left:10%;transform:translate(0%,-50%);background-color:#e62b26;}
}
@media screen and (max-width:860px){
	.c-itemContainer--subnavWrap{position:relative;top:0;width:100%;padding-top:0;margin-top:-.5em; flex-direction:row;display:block;}
	.c-itemContainer--subnavContainer{padding:.7em;color:#FFF;font-size:14px; display:inline-block; opacity:1;transform:translateY(0px);background-color:transparent;}
}

/*　--------------------------------------------------
------------------------------------------------------


Main
-l-mc
-floating


-------------------------------------------------- */
.l-mc{}

@media screen and (max-width:768px){
	.is--page .l-mc{padding-top:120px;}
}
@media screen and (max-width:560px){
	.is--page .l-mc{padding-top:100px;}
}
@media screen and (max-width:360px){
	.is--page .l-mc{padding-top:60px;}
}

.c-floating--text{position:fixed;top:50%;left:1vw;height:auto;transform:translate(-100%,-50%) rotate(-90deg);transform-origin:top left;text-align:center;z-index:99; transition:all .8s ease-out;}
.c-floating--text .p-text{font-size:10px;font-weight:lighter;font-style:italic;letter-spacing:0.2em;}

.is--fixed.c-floating{transform:translate(0,-50%) rotate(-90deg); transition:all 0.3s ease-out;}

@media screen and (max-width:560px){
	.c-floating--text{right:calc(4vw - 1vw);}
	.c-floating--text .p-text{font-size:10px;}
}



/*　--------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------


Main Visual


-------------------------------------------------- */
.l-mv{}
.l-mv>.l-container{position:relative;width:100%;max-width:1400px;height:auto;padding:0;margin:200px auto 0;box-sizing:border-box;}

.l-mv .c-header{position:relative;top:0;left:0;width:100%;;margin-bottom:30px;padding:0;z-index:1; transition:all .4s ease-out;}
.l-mv .c-headerWrap{display:flex;flex-direction:column;}
.l-mv .c-headerWrap .p-title{/* margin:3vw 0 .5em; */padding:1em calc(4vw + .5em) .5em calc(4vw + 1em);font-size:56px;font-weight:normal;line-height:1.8;letter-spacing:.03em;box-sizing:border-box;text-align:justify;display:block;}
.l-mv .c-headerWrap .p-title small{padding-left:1em;font-size:14px;letter-spacing:0.1em;font-weight:bold;vertical-align:middle;}
.l-mv .c-headerWrap .p-text{color:#f8f8f8;padding:4em 4vw 2em;font-size:1.8vw;letter-spacing:0.06em;line-height:1.8;text-align:center;}
.l-mv .c-headerWrap .p-text::before{content:'';position:absolute;top:2.5em;left:1em;width:1px;height:1px;background-color:#e62b26;transform-origin:top left;transform:rotate(-30deg);display:inline-block;z-index:99; opacity:0;transition:all .4s ease-out;}
.l-mv .c-headerWrap .p-text em{color:#f8f8f8;font-size:2.5vw;line-height:1.8;font-weight:bold; transition:all .4s ease-out;}

.l-mv .c-imageWrap{position:absolute;width:30%;height:auto;right:0;transform:translate(10%,-50%);background-color:#FFF;box-sizing:border-box;display:inline-block;overflow:hidden;z-index:2; opacity:0;transition:opacity 1.2s ease-out, transform .8s cubic-bezier(0.01, 0.76, 0.58, 1);}
.l-mv .c-imageContainer{position:relative;left:50%;width:auto;height:100%;transform:translateX(-40%);display:inline-block; transition:all 10s ease-out;}

.l-mv .is--opening.c-header{background-color:transparent; transition-delay:1.3s;}
.l-mv .is--opening .c-headerWrap .p-text{color:#000; transition-delay:1.3s;}
.l-mv .is--opening .c-headerWrap .p-text::before{width:5vw;opacity:1; transition-delay:0.6s;}
.l-mv .is--opening .c-headerWrap .p-text em{color:#000; transition-delay:1.3s;}
.l-mv .is--opening .c-headerWrap .p-text:nth-child(2){transition-delay:1.7s;}
.l-mv .is--opening .c-headerWrap .p-text:nth-child(2) em{transition-delay:1.7s;}

.l-mv .is--opening .c-headerWrap .p-text::after{transition-delay:0.9s;}
.l-mv .is--opening .c-headerWrap .p-text:nth-child(2)::after{transition-delay:1.3s;}

.l-mv .is--opening .c-imageWrap{opacity:1;transform:translate(10%,-50%); transition-delay:1.8s;}
.l-mv .is--opening .c-imageContainer{transform:translateX(-50%); transition-delay:1.8s;}

@media screen and (min-width:1400px){
	.l-mv .c-headerWrap .p-text{padding:3em 4vw 3em;font-size:18px;}
	.l-mv .c-headerWrap .p-text::before{top:3.5em;}
	.l-mv .c-headerWrap .p-text em{font-size:38px;}
}

@media screen and (max-width:860px){
	.l-mv>.l-container{margin:100px 0 0;}
	.l-mv .c-header{position:relative;top:0;}
	.l-mv .c-headerWrap .p-text{font-size:16px;}
	.l-mv .c-headerWrap .p-text em{font-size:24px;}
	.l-mv .c-headerWrap .p-text br.pc{display:none;}
}

@media screen and (max-width:560px){
	.l-mv>.l-container{margin:58px 0 0;}
/* 	.l-mv .c-headerWrap .p-text{font-size:calc(5vw);text-align:justify;} */
/* 	.l-mv .c-headerWrap .p-text em{font-size:calc(1.618vw * 5);line-height:1.4;} */
	.l-mv .c-headerWrap .p-text{font-size:14px;}
	.l-mv .c-headerWrap .p-text em{font-size:18px;}
	.l-mv .c-headerWrap .p-text em br{display:none;}

	.l-mv .is--opening .c-headerWrap .p-text::before{width:20vw;top:2.5em;left:1em;}
}



/*　--------------------------------------------------
------------------------------------------------------


Works


-------------------------------------------------- */
.l-works{position:relative;}
.l-works>.l-container{}

.l-works .c-lists{position:relative;margin-bottom:120px;}
.l-works .c-item{position:relative;width:72%;padding:0;margin:120px 14% 0; display:flex;flex-direction:column;}
.l-works .c-item .p-title{margin-bottom:0.86em;font-size:24px;letter-spacing:0.05em;line-height:1.4;text-align:justify;}
.l-works .c-item .c-imageWrap{margin-bottom:15px;}
.l-works .c-item .c-imageContainer{}
.l-works .c-item .c-thumbs{margin-bottom:0;display:flex;flex-wrap:wrap; opacity:0;transition:opacity .2s ease-out;}
.l-works .c-item .c-thumbs .c-imageWrap{width:calc( (100% - (10px * (7 - 1))) / 7);height:auto;margin:10px 10px 0 0;display:inline-block;cursor:pointer;overflow:hidden; transition:opacity .2s ease-out;}
.l-works .c-item .c-thumbs .c-imageWrap:nth-child(7n){margin-right:0;}
.l-works .c-item .c-thumbs .c-imageContainer{}
.l-works .c-item .c-infoWrap{position:absolute;bottom:0;left:-1em;transform:rotate(-90deg);transform-origin:bottom left;text-align:left; display:flex;align-items:flex-end;}
.l-works .c-item .c-infoWrap .p-text--date{font-size:16px;letter-spacing:0.01em;font-style:italic;}
.l-works .c-item .c-infoWrap .p-text--client{padding-left:2em; font-size:10px;letter-spacing:0.1em;}
.l-works .c-item .c-infoWrap .p-text--cate{padding:0 5px;margin-left:2em; font-size:10px;letter-spacing:0.1em;color:#FFF;}
.l-works .c-item .c-infoWrap .p-text--cate span{padding:0 5px 2px;color:#FFF;background:#e62b26;}
.l-works .c-item .c-infoWrap .p-text--cate span a {color:#FFF;}

.l-works .slick-counter{position:absolute;right:-1em;margin-top:-.5em;font-size:38px;font-weight:lighter; display:flex;justify-content:center;align-items:center; opacity:0;animation:slick-counter 1s ease-out 1.8s 1 normal forwards;transition-delay:0.8s;}
.l-works .slick-counter .current,
.l-works .slick-counter .total{color:#000;font-weight:normal;font-style:italic;}
.l-works .slick-counter .current{margin-top:-10px; font-size:10px;}
.l-works .slick-counter .total{margin-bottom:-10px; font-size:10px;}

.l-works .c-buttonWrap{width:72%;margin:0 auto;opacity:0;transition:all .2s ease-out;}

/*
.l-works .is--opening.c-header{opacity:1;}
.l-works .is--opening .c-headerWrap .p-title{color:#000; transition-delay:.8s;}
*/
.l-works .is--opening.c-item .p-title{color:#000;}
.l-works .is--opening.c-item .c-thumbs{opacity:1; transition-delay:0.8s;}
.l-works .is--opening.c-buttonWrap{opacity:1;}

.l-works .c-item .c-thumbs .c-imageWrap.is--active{opacity:0.5;}
.l-works .c-item--thumbs{height:100%;}


.is--page .l-works .c-item:first-child{margin-top:0;}


@keyframes slick-counter {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@media screen and (min-width:769px){
	.l-works .c-item .c-thumbs .c-imageWrap:hover{opacity:0.5;transition-delay:0;}
}
@media screen and (max-width:768px){
}
@media screen and (max-width:560px){
	.l-works>.l-container::before,
	.l-works>.l-container::after{width:calc(100vw - 24vw);}
	.l-works>.l-container::after{border-left:calc((100vw - 24vw) / 2) solid #f8f8f8;border-right:calc((100vw - 24vw) / 2) solid transparent;}

	.l-works .c-item{width:70vw;padding:0;margin:60px 15vw 0;}
	.l-works .c-item .p-title{font-size:18px;}
	.l-works .c-item .c-thumbs .c-imageWrap{width:calc( (100% - (6px * (4 - 1))) / 4);margin:6px 6px 0 0;}
	.l-works .c-item .c-thumbs .c-imageWrap:nth-child(7n){margin-right:6px;}
	.l-works .c-item .c-thumbs .c-imageWrap:nth-child(4n){margin-right:0;}

	.l-works .slick-counter{right:-1.5em;font-size:21px;}
}

/*　--------------------------------------------------
------------------------------------------------------


Works
　- page


-------------------------------------------------- */
.l-works .c-lists--archives{position:relative; width:92%;margin:0 4%;display:flex;flex-wrap:wrap; opacity:0;transition:all 0.4s ease-out;}
.l-works .c-item--archives{position:relative;margin-left:20px; color:#000;font-size:14px;letter-spacing:0.1em;font-style:italic;line-height:2.5;display:inline-block; cursor:pointer;transition:all 0.2s ease-out;}
.l-works .c-item--archives:nth-child(1){margin-left:0;}
.l-works .c-item--archives::before{content:'';position:absolute;top:70%;left:40%;width:80%;height:1px;background-color:#000;transform:translate(-80%,-50%) rotate(-45deg); opacity:0;transition:all 0.2s ease-out;}
.l-works .c-item--archives::after{content:'|';position:relative;padding-left:20px;}

.l-works .c-lists--archives.is--opening{opacity:1; transition-delay:0.4s;}

.l-works .c-item--archives.is--active{color:#e62b26;}
.l-works .c-item--archives.is--active::before{top:50%;left:50%;background-color:#e62b26;opacity:1;}
.l-works .c-item--archives.is--active::after{color:#000;}

.l-works .c-item--title{cursor:default;}

@media screen and (min-width:769px){
	.l-works .c-item--archives:hover{color:#e62b26;}
	.l-works .c-item--archives:hover::before{top:50%;left:50%;background-color:#e62b26;opacity:1;}
	.l-works .c-item--archives:hover::after{color:#000;}

	.l-works .c-item--archives.c-item--title:hover{color:#000;}
	.l-works .c-item--archives.c-item--title:hover::before{background-color:transparent;opacity:0;}
	.l-works .c-item--archives.c-item--title:hover::after{color:#000;}
}
@media screen and (max-width:560px){
	.l-works .c-item--archives{margin-left:10px;font-size:13px;}
	.l-works .c-item--archives::after{padding-left:10px;}
}


/*　--------------------------------------------------
------------------------------------------------------



Works Lists
　- TOP


-------------------------------------------------- */
.l-works__lists{}
.l-main_content.l-works__lists>.l-container{max-width:100vw;}

.l-works__lists .c-lists{left:0; width:100vw;margin:2em 0 120px;padding:0 4vw; display:flex;flex-wrap:wrap;}
.l-works__lists .c-item{width:calc((96%) / 3 );max-height:100vh;height:calc((92vw) / 3 * 2 / 3 + 4em);padding:0;margin:0 2% 0 0;cursor:pointer; display:flex;flex-direction:column; transition:all 0.4s ease-out;}
.l-works__lists .c-item:nth-child(3n){margin:0;}
.l-works__lists .c-item .c-imageWrap{margin-bottom:0; display:flex;}
.l-works__lists .c-item .c-imageContainer{}
.l-works__lists .c-item .c-infoWrap{position:absolute;top:0;bottom:inherit;left:0;width:100%;height:100%;padding:1em 1em .5em;background-color:rgb(0,0,0,0.9);transform:rotate(0);transform-origin:none;box-sizing:border-box; justify-content:flex-end;align-items:flex-end; opacity:0;transition:opacity 0.4s ease-out;transition-delay:0s!important;}
.l-works__lists .c-item .c-infoWrap .p-title{position:absolute;top:50%;right:1em;width:calc(100% - 2em);transform:translateY(-50%); color:#FFF;font-size:16.18px;letter-spacing:0.01em;text-align:right;}
.l-works__lists .c-item .c-infoWrap .p-text--cate{color:#FFF;font-size:10px;letter-spacing:0.01em;font-style:italic;white-space: nowrap;}
.l-works__lists .c-item .c-infoWrap .p-text--cate span {padding:0 5px 2px;color:#FFF;background:#e62b26;white-space:nowrap;}
.l-works__lists .c-item .c-infoWrap .p-text--cate span a {color:#FFF;}
.l-works__lists .c-item .c-infoWrap .p-text--date{color:#FFF;padding-left:1em;font-size:10px;letter-spacing:0.01em;font-style:italic;}
.l-works__lists .c-item .c-infoWrap .p-text--client{color:#FFF;padding-left:1em; font-size:10px;text-align: right;}

/* .l-works__lists .c-item--thumbs.is--off{height:0;opacity:0;transition:all 0.4s ease-out;} */
.l-works__lists .c-item--thumbs.is--off{position:absolute;transform:scale(0);opacity:0;transition:all 0.2s ease-out;}
.l-works__lists .c-item--thumbs.is--on {position:relative;transform:scale(1);opacity:1;transition:all 0.4s ease-out;}

.l-works__lists .is--opening .t-animation-A{transition-delay:0.4s;}
.l-works__lists .is--opening .t-animation-A::after{transition-delay:0s;}

@media screen and (min-width:860px){
	.l-works__lists .c-item:hover .c-infoWrap{opacity:1;}
}
@media screen and (max-width:860px){
	.l-works__lists .c-item{width:calc(88vw / 2 );height:auto;margin:0 2vw 0 0;}
	.l-works__lists .c-item:nth-child(3n){margin:0 2vw 0 0;}
	.l-works__lists .c-item:nth-child(2n){margin:0;}
	.l-works__lists .c-item .c-imageWrap{width:100%;height:calc(92vw / 2 * 2 / 3)!important;}
	.l-works__lists .c-item .c-infoWrap{position:relative;top:0;bottom:inherit;left:0;height:auto;padding:.5em 0 1em 1em;background-color:#FFF; opacity:1;flex-direction:column;}
	.l-works__lists .c-item .c-infoWrap .p-title{position:relative;top:inherit;right:0;width:100%);color:#000;transform:translateY(0);}
	.l-works__lists .c-item .c-infoWrap .p-text--date{color:#000;padding-bottom:.1618em;}
	.l-works__lists .c-item .c-infoWrap .p-text--client{color:#000;}
}

/*　--------------------------------------------------
------------------------------------------------------


Company Profle


-------------------------------------------------- */
.l-company{position:relative;}
.l-company>.l-container{}

.l-company .c-headerWrap .p-text--link{position:absolute;bottom:1em;right:0; color:#000;font-size:14px; opacity:0;transition:opacity 0.2s ease-out;}

.l-company .is--opening .c-headerWrap .p-text--link{opacity:1;transition-delay:.8s;}

.googlemaps{position:relative;height:0;padding-bottom:56.25%;margin:1em 0 2em;overflow:hidden;display:block;}
.googlemaps iframe{position:absolute;left:0;top:0;height:100%;width:100%;}
.googlemaps iframe,
.googlemaps object,
.googlemaps embed {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
}

@media screen and (min-width:860px){
	.l-company .c-headerWrap .p-text--link:hover{color:#e62b26;}
/* 	.l-company .c-headerWrap .p-text--link:hover::before{width:80%;left:10%;transform:translate(0%,-50%);background-color:#e62b26;} */
}

/*　--------------------------------------------------
------------------------------------------------------


FINANCIAL REPORT


-------------------------------------------------- */
.l-report{position:relative;}
.l-report>.l-container{}

.l-report .c-lists{position:relative; width:92%;margin:0 4%;display:flex;flex-wrap:wrap;justify-content:space-between; opacity:0;transition:all 0.4s ease-out;}
.l-report .c-item{position:relative;width:calc(96% / 3);margin-bottom:2em;}
.l-report .c-item a{display:flex;align-items:center; opacity:0;transition:all 0.2s ease-out;}
.l-report .c-item .p-title{width:180px;margin-right:1em;color:#000;font-size:21px;letter-spacing:0.01em;line-height:1;transition:all 0.2s ease-out;}
.l-report .c-item .p-title small{font-size:12px;}
.l-report .c-item object{width:52px;height:auto;}

.l-report .is--opening.c-lists{opacity:1;}
.l-report .is--opening .c-item::after{transition-delay:0.8s;}
.l-report .is--opening .c-item a{opacity:1;transition-delay:1.2s;}


@media screen and (min-width:769px){
	.l-report .c-item:hover .p-title{color:#e62b26;}
}
@media screen and (max-width:960px){
	.l-report .c-item .p-title{width:140px;margin-right:1em;font-size:16px;}
	.l-report .c-item object{width:38px;}
}
@media screen and (max-width:768px){
	.l-report .c-item{width:calc(96% / 2)}
	.l-report .c-item .p-title{width:180px;font-size:21px;}
	.l-report .c-item object{width:38px;}
}
@media screen and (max-width:600px){
/* 	.l-report .c-item{width:100%;} */
	.l-report .c-item a{justify-content:center;}
/* 	.l-report .c-item .p-title{width:140px;margin-right:1em;font-size:14px;line-height:1.2;} */

	.l-report .c-item .p-title{width:calc(85% - 1em);font-size:14px;line-height:1.4;}
	.l-report .c-item .p-title small{font-size:10px;}
	.l-report .c-item object{width:20%;}
}
@media screen and (max-width:380px){
	.l-report .c-item .p-title{width:calc(90% - 1em);margin-right:.5em;font-size:12px;line-height:1.4;}
	.l-report .c-item .p-title small{font-size:10px;}
	.l-report .c-item object{width:18%;}
}
.l-report .p-title span {
	font-size: 30px;
}
@media screen and (max-width:940px){
	.l-report .p-title span {
		display: block;
	}
}

/*　--------------------------------------------------
------------------------------------------------------


RECRUIT


-------------------------------------------------- */
.l-recruit{position:relative;}
.l-recruit>.l-container{}

.l-recruit .c-table td .c-textWrap--recruit{flex-direction:column;padding-top:1em;}
.l-recruit .c-table td .c-textWrap--recruit .p-title{font-weight:bold;width:100%;}

.l-recruit-2{}
.l-recruit-2>.l-container{}
.l-recruit-2 .c-titleWrap{padding:2em 0 4em;font-size:24px;font-weight:bold;letter-spacing:0.1em;text-align:center;}
.l-recruit-2 .c-block{position:relative;width:100%;padding:0 4%;box-sizing:border-box;display:flex;flex-wrap:wrap;justify-content:space-between;align-content:flex-start;}
.l-recruit-2 .c-blockWrap{position:relative;padding:8vw 4vw;width:48%;border:1px solid #dadada; display:flex;flex-direction:column;align-content:flex-start;opacity:0;transition:all 0.6s ease-out;}
.l-recruit-2 .c-blockWrap .p-title{margin:0 0 1em;font-size:28px;letter-spacing:0.1em;text-align:center;}
.l-recruit-2 .c-blockWrap .c-blockContainer{width:100%; text-align:center;}
.l-recruit-2 .c-blockWrap .c-blockContainer .p-text{padding:20px;color:#FFF;font-size:18px;letter-spacing:.05em;background-color:#000; transition:all .2s ease-out;}

.l-recruit-2 .c-buttonWrap{max-width:680px;width:100%;padding:0 4%;margin:3em auto;box-sizing:border-box;}

.l-recruit-2 .c-blockWrap.is--opening{opacity:1;transition-delay:.4s;}

@media screen and (min-width:769px){
	.l-recruit-2 .c-blockWrap .c-blockContainer .p-text:hover{background-color:#e62b26;}
}
@media screen and (max-width:560px){
	.l-recruit-2 .c-titleWrap{font-size:4vw;}
	.l-recruit-2 .c-blockWrap{width:100%;margin-bottom:3em;}
}

/*　--------------------------------------------------
------------------------------------------------------


TOPICS


-------------------------------------------------- */
.l-topics{position:relative;}
.l-topics>.l-container{}

.l-topics .c-lists{position:relative;width:100%;padding:0 4%;box-sizing:border-box;}
.l-topics .c-item{position:relative;padding-bottom:5em;display:flex;align-items:center;}
.l-topics .c-item .c-imageWrap,
.l-topics .c-item .c-infoWrap{width:48%;}
.l-topics .c-item .c-imageContainer{width:100%;height:auto;}
.l-topics .c-item .c-infoWrap{left:-4%;}
.l-topics .c-item .c-infoWrap .p-title{margin-bottom:1em;font-size:24px;}
.l-topics .c-item .c-infoWrap .c-button{}

.l-topics .c-item:nth-child(2n){flex-direction:row-reverse;}
.l-topics .c-item:nth-child(2n) .c-infoWrap{left:inherit;right:-4%;}

@media screen and (max-width:769px){
	.l-topics .c-item .c-infoWrap .p-title{font-size:18px;}
}
@media screen and (max-width:560px){
	.l-topics .c-item,
	.l-topics .c-item:nth-child(2n){flex-direction:column;}
	.l-topics .c-item .c-infoWrap,
	.l-topics .c-item:nth-child(2n) .c-infoWrap{left:inherit;right:inherit;}
	.l-topics .c-item .c-imageWrap{margin-bottom:2em;}
	.l-topics .c-item .c-imageWrap,
	.l-topics .c-item .c-infoWrap{width:100%;}
	.l-topics .c-item .c-infoWrap .p-title{margin:1.5em 0 3em;}
}

/*　--------------------------------------------------
------------------------------------------------------


CONTACT
PRIVACY



-------------------------------------------------- */
.l-temp{position:relative;}
.l-temp>.l-container{}

.l-temp .c-titleWrap{position:relative;width:92%;margin:0 4% 2em; opacity:0;transition:all 0.4s ease-out;}
.l-temp .c-titleWrap .p-title{font-size:28px;letter-spacing:0.1em;}

.l-temp .c-textWrap{position:relative;width:92%;margin:0 4% 2em; opacity:0;transition:all 0.4s ease-out;}
.l-temp .c-textWrap .p-title{padding-bottom:.5em;margin-bottom:1em;font-size:18px;border-bottom:2px solid #000;display:inline-block;box-sizing:border-box;}
.l-temp .c-textWrap .p-text{color:#000;font-size:16px;letter-spacing:0.05em;line-height:1.8;text-align:justify;}
.l-temp .c-textWrap .p-text--link{padding:1em 0;color:#e62b26;text-decoration:underline;display:block;}
.l-temp .c-textWrap .p-text>.p-text--link{padding:0;display:inline-block;}
.l-temp .c-textWrap .c-imageContainer{width:auto;margin:20px 0;}

.l-temp .c-textWrap--contact{margin:30px 4% 0;border:1px solid #dadada;padding:40px 4vw;box-sizing:border-box;}
.l-temp .c-textWrap--contact>.p-text{padding-bottom:1em;}

.l-temp .is--opening.c-titleWrap,
.l-temp .is--opening.c-textWrap{opacity:1;}

.l-temp .c-textWrap .p-text.l-right{margin-top:4em; text-align:right;}

@media screen and (min-width:769px){
	.l-temp .c-textWrap .p-text--link:hover{opacity:0.5;}
}
/*　--------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------


COMMON


-------------------------------------------------- */
.t-animation-A{position:relative;color:#FFF;line-height:1.4;overflow:hidden;display:inline-block; transition:all .4s ease-out;}
.t-animation-A::after{content:'';position:absolute;top:0;left:0;width:1px;height:100%;transform:translateX(-100%);background-color:#000;display:inline-block; transition:all .9s cubic-bezier(0.97, 0.6, 0, 1);}

.is--opening .t-animation-A{color:#000; transition-delay:0.8s;}
.is--opening .t-animation-A::after{width:100%;left:100%;transform:translateX(0); transition-delay:0.4s;}

.l-main_content>.l-container{width:100%;max-width:1400px;height:auto;padding:0 0 120px;margin:240px auto 0;}
.l-main_content>.l-container::before,
.l-main_content>.l-container::after{content:'';position:absolute;top:0;left:0;width:calc(100vw - 12vw);width:100vw;height:100%;background-color:#FFF;z-index:-1;}
.l-main_content>.l-container::after{height:100px;border-top:100px solid #f8f8f8;border-left:calc((100vw - 0vw) / 2) solid #f8f8f8;border-bottom:100px solid transparent;border-right:calc((100vw - 0vw) / 2) solid transparent;}

.l-main_content .c-header{position:relative;top:0;left:0;width:92%;padding:0;margin:3em 4% 6em;border-bottom:1px solid #dadada;display:inline-block;z-index:2; opacity:0;transition:all .2s ease-out;}
.l-main_content .c-headerWrap{padding-bottom:1em;}
.l-main_content .c-headerWrap .p-title{color:#f8f8f8;font-size:62px;letter-spacing:0.1em;}
.l-main_content .c-headerWrap .p-title .is--year{margin-left:.489em;font-size:69%;font-weight:lighter;font-style:italic;}
.l-main_content .is--opening.c-header{opacity:1;}
.l-main_content .is--opening .c-headerWrap .p-title{color:#000; transition-delay:.8s;}

.c-tableWrap{position:relative;max-width:1400px;width:calc(100% - 8%);margin:0 auto;padding:60px 0 120px; opacity:0;transition:all 2s ease-out;}
.c-tableWrap .c-table{position:relative;width:100%;border-bottom:none;box-sizing:border-box;z-index:1;}
.c-tableWrap .c-table th{width:180px; display:flex;align-items:center;justify-content:space-between;}
.c-tableWrap .c-table th span{position:relative;max-width:140px;margin-right:.5em;line-height:1.4;display:inline-block; flex-shrink:0;}
.c-tableWrap .c-table th::after{content:'';position:relative;width:100%;height:1px;background-color:#dadada;display:inline-block;}
.c-tableWrap .c-table td span{width:100%;}
.c-tableWrap .c-table td .p-title{position:relative;width:200px;}
.c-tableWrap .c-table td .p-title--recruit{position:relative;width:100%;}
.c-tableWrap .c-table td  a{color:#e62b26;text-decoration:underline;}

.p-border--d{position:relative;margin:60px 4%;width:92%;height:1px;border-bottom:dashed 1px #dadada;}

.is--opening.c-tableWrap{opacity:1;}


@media screen and (max-width:768px){
	.l-main_content>.l-container{margin:0;padding:0 0 80px;}
	.l-main_content .c-header{margin:3em 4% 3em;}

	.c-tableWrap{padding:20px 4vw 60px}
	.c-tableWrap .c-table th{width:5.5em;}
}
@media screen and (max-width:560px){
	.l-main_content>.l-container{margin:0;padding:0 0 40px;}
	.l-main_content .c-headerWrap .p-title{font-size:48px;}
	.l-main_content .c-headerWrap .p-title .is--year{margin-left:0	em;font-size:110%;display:block;}

	.c-tableWrap .c-table th{width:100%;}
	.c-tableWrap .c-table th::after{height:0;}
	.c-tableWrap .c-table th span{max-width:100%;padding-bottom:0.5em;margin-bottom:0.5em;border-bottom:2px solid #000;}

}

/*　--------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------
------------------------------------------------------


footer


-------------------------------------------------- */
.l-footer{position:relative;background-color:#000;}
.l-footer > .l-container{position:relative;width:100%;padding:60px 4vw;text-align:center;box-sizing:border-box;}
.l-footer .p-text--address{margin:35px 0;color:#FFF;font-size:12px;letter-spacing:0.1em;line-height:1.8;}
.l-footer .p-cp{color:#666;font-size:8px;letter-spacing:0.1em;}

.l-footer .c-logoContainer{position:relative;width:56px;height:auto;display:inline-block;}

.l-footer .c-lists{position:relative;margin:35px 0;display:flex;justify-content:center;}
.l-footer .c-item{margin:0 .5em;transition:all .2s ease-out;}
.l-footer .c-itemContainer{position:relative;color:#FFF;font-size:12px; display:inline-block;}

.l-footer .c-lists--sns{margin:35px 0 0;display:flex;justify-content:center;]}
.l-footer .c-lists--sns .c-itemContainer{width:36px;height:auto;}

@media screen and (min-width:768px){
	.l-footer .c-item:hover{opacity:0.5;}
}
@media screen and (max-width:768px){
	.l-footer .p-text--address{font-size:11px;}
}



@media (orientation: landscape) {
/*
  .container {
    flex-direction: column;
  }
*/
}
@media (orientation: portrait) {
/*
  .container {
    flex-direction: row;
  }
*/
}

.embed-container {
    position: relative;
    max-width: 100%;
    height: auto;
    overflow: hidden;
}
.embed-inner {
    position: relative;
    padding-bottom: 66.6666%;
}
.embed-container iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}