@charset "UTF-8";



/* class
----------------------------------------------- */
.en{font-family: 'Poppins', sans-serif;font-weight: 400;}

a.hEffect{}
a.hEffect:hover{ opacity: .8;}

img.size-full{ max-width: 100%; height: auto;}

.illust{ border: solid 0px #c00;}
.illust.parallax{ border: solid 0px #c00;}
.post-header{ display:block; clear: both; width: 100%; overflow: hidden; height: 0; }

.tLeft{ text-align:left;}

.ex{ font-size: 0.8em;}

.btn{ display: block; height: 80px; 
	display: flex;
    align-items: center;
    justify-content: center;
    border: solid 2px #fff;
    margin: auto;
    
    }
.btn .text{}

.btnCenter{ width: 350px; margin: auto;}

.frontArrowRight{ padding-left: 55px;}
.frontArrowRight:before{ content: ''; display: inline-block; width: 42px; height: 24px; position: absolute; top: 50%; left: 0; transform: translate(0,-50%); background: url(./img/common/arrow_more.svg) center center no-repeat; background-size: contain; }


.grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-auto-rows: auto;
	grid-gap: 50px;
	padding: 0;
	margin: auto;
}
.grid.col_3{grid-template-columns: 1fr 1fr 1fr;}
.grid.col_2{grid-template-columns: 1fr 1fr;}
.grid.col_1{grid-template-columns: 1fr;}
.grid.sp_col_2{	grid-template-columns: 1fr 1fr;}

.grid .center {	display: grid;	align-items: center;}
.gridItem {}

img.full{width:100%; height: auto;}


.bgBtn{ display: inline-block; height: 3em; line-height: 3em; text-align: center; margin: 2em 0; padding: 0 2em; color: #fff !important; background: #333;text-decoration: none !important; border-radius: 5px;transition: all 250ms cubic-bezier(.50, .0, .50, 1);}
.bgBtn:hover{ background: #c00; color: #fff !important;}

ul.list{ margin-bottom: 2em;}
ul.list li{ padding-left: 1.5em; margin-bottom: 0.5em;}
ul.list li:before{ content: '・'; display: inline-block; position: absolute; top: 0em; left: 0.3em;}

ul.kome li:before{ content: '※';}

ol.list{ margin-bottom: 2em; list-style: decimal;padding-left: 1.3em;}
ol.list li{padding-left: 0.2em; margin-bottom: 0.5em;}


ol.countup{ margin-bottom: 2em; list-style: none;padding-left: 1.3em; padding-top: 1em; counter-reset: item;}
ol.countup li{padding-left: 0em; margin-bottom: 0.8em; position: relative;}

ol.countup li:before {
  counter-increment: item;
  content: counter(item)'）';
  /* 以下は自由に装飾... */
  position: absolute; 
  top: 0.0em;
  left: -1.5em;
}



.anim{transition: all 250ms cubic-bezier(.50, .0, .50, 1);}

.entryList dl{grid-template-columns: auto 1fr; grid-gap: 20px; margin-bottom: 20px;}
.entryList dl dt{white-space: nowrap;background: #f2f2f2;}
.entryList dl dd{ background: #f2f2f2;}

.wfull{ width: 100%; height: auto;}
.hfull{ width: auto; height: 100%;}

.yellowBG{ background-color: #ffee11;}
.skyBG{ background-color: #b2dce6;}

.btnTextContact{}
.btnTextContact span{ display: none;}
.btnTextContact:after{ content: '';  display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-54%,-50%); width: 100%; height: 24px; background: url(./img/contact/btn_contact.svg) center center no-repeat; background-size: contain;}



.btnTextViewmore{}
.btnTextViewmore span{ display: none;}
.btnTextViewmore:after{ content: '';  display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-54%,-50%); width: 100%; height: 24px; background: url(./img/common/btn_viewmore.svg) center center no-repeat; background-size: contain;}


.btnTextMore{}
.btnTextMore span{ display: none;}
.btnTextMore:after{ content: '';  display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-54%,-50%); width: 100%; height: 24px; background: url(./img/common/btn_more.svg) center center no-repeat; background-size: contain;}




/* class
----------------------------------------------- */

.arrowMore:after{ content:''; display: block; width: 53px; height: 15px; position: absolute; right: 10px; top: 50%; transform: translate(0,-50%); background: url(./img/common/arrow_more_long.svg) right center no-repeat; 
transition: all 200ms cubic-bezier(.50,.0,.50,1);
}

.entryList article.entry a:hover .arrowMore:after{ 
	width: 63px;
right: 0px;
	
}


.arrowBack:before{ content:''; display: block; width: 53px; height: 15px;  background: url(./img/common/arrow_more_long.svg) right center no-repeat;
    position: absolute;
    left: 75px;
    top: 50%;
	 transform: translate(0,-50%) rotate(-180deg);
	transition: all 200ms cubic-bezier(.50,.0,.50,1);
}

.spacer{ display: block;}
.spacer.h200{ width: 100%; height: 200px;}




/* entryBoxList
----------------------------------------------- */
.entryBoxList{ text-align: left; padding-bottom: 50px;    grid-gap:9% 6%; padding-top: 20px;}
.entryBoxList .item{ width: 100%; height: 100%; grid-gap: 10px;   position: relative; padding-bottom: 40px;}

	.entryBoxList .item.noneMore{ padding-bottom: 0px;}

.entryBoxList .item .thumb{padding-top: 58.3%; }
.entryBoxList .item .meta{  border-top: solid 1px var(--color-news); padding-top: 20px;}
.entryBoxList .item .meta .date{font-size: 0.9em;}
.entryBoxList .item .meta .date .y{display: inline-block; margin-right: 0.5em;}
.entryBoxList .item .meta .date .md{font-size: 1.2em;}
.entryBoxList .item .meta .category{font-size: 0.8em; background: var(--color-news-light); display: inline-block; width:auto; min-width:120px; padding:3px 20px; line-height: 1; text-align: center; margin-bottom: 10px;}
.entryBoxList .item:not(.noneMore) .meta .title{ font-size: 1em; margin-bottom: 50px; line-height: 1.6;}
.entryBoxList .item.noneMore .meta .title{margin-bottom: 0px;}

.entryBoxList .item .btnItem{ position: absolute; bottom: 0; right: 0; margin: 0; width: auto; height: 44px; border: 0;}


.entryBoxList .item:not(.noneMore):before{ content: '';  display: block; position: absolute; bottom: 50px; left: 0; width: 100%; height: 0;border-bottom: solid 1px var(--color-news); }






.entryBoxList .item.works .meta{  border-color: var(--color-works);}
.entryBoxList .item.works .meta .category{ background:  var(--color-works-light);}
.entryBoxList .item.works:before{border-color: var(--color-works); }

.entryBoxList .item.media .meta{  border-color: var(--color-media);}
.entryBoxList .item.media .meta .category{ background:  var(--color-media-light);}
.entryBoxList .item.media:before{border-color: var(--color-media); }

.entryBoxList .item.talk .meta{  border-color: var(--color-talk);}
.entryBoxList .item.talk .meta .category{ background:  var(--color-talk-light);}
.entryBoxList .item.talk:before{border-color: var(--color-talk); }


.entryBoxList.boxLInk .item{    padding-bottom: 45px;}
.entryBoxList.boxLInk .item .meta{  border-top-width: 0; padding-top: 15px;}
.entryBoxList.boxLInk .item .meta .title{ line-height:1;}




.btnItem{ width: 350px; height: 80px; margin: 0 auto 50px auto; box-sizing: border-box; text-align: center; display: grid; align-items: center; cursor: pointer;}
.btnItem.frame{ border: solid 2px #fff; margin-top: 50px;}
.btnItem.bg{ background-color: var(--color-key); color: #fff;}
.btnItem .wrap{ height: 24px; }
	
.btnItem .contents{ display: inline-block; padding-left: 60px; padding-right: 20px; line-height: 0; font-size: 0; line-height: 0; }
.btnItem .arrow {  display: inline-block; width: 42px; height: 24px; position: absolute; top: 0; left: 0; overflow: hidden;}

.btnItem .arrow:after{ content: '';width: 42px; height: 24px; position: absolute; top: 0; left: 0;transition: all 300ms cubic-bezier(.50,.0,.50,1);}
	.btnItem .arrowR:after{ background: url(./img/common/arrow_r_black.svg) center center no-repeat; background-size: contain;}
	.btnItem .arrowL:after{ background: url(./img/common/arrow_l_black.svg) center center no-repeat; background-size: contain;}
	.btnItem.bg .arrowR:after{ background: url(./img/common/arrow_r_white.svg) center center no-repeat; background-size: contain;}
	.btnItem.bg .arrowL:after{ background: url(./img/common/arrow_l_white.svg) center center no-repeat; background-size: contain;}
	

.btnItem .text{ display: inline-block; line-height: 24px;  font-size: 1rem; overflow: hidden;} 
	.btnItem.more .text{ width:72px; background: url(./img/common/btn_viewmore.svg) center center no-repeat; background-size: contain; height: 0; padding-top: 24px; } 
	.btnItem.contact .text{ width:144px; background: url(./img/common/btn_contact.svg) center center no-repeat; background-size: contain; height: 0; padding-top: 24px; } 
	.btnItem.motto .text{ width:116px; background: url(./img/common/btn_motto.svg) center center no-repeat; background-size: contain; height: 0; padding-top:24px; } 
	.btnItem.send .text{ width:214px; background: url(./img/common/btn_send.svg) center center no-repeat; background-size: contain; height: 0; padding-top:24px; } 



   




.btnItem.markOnly{ width: 80px;}
.btnItem.markOnly .contents{ padding: 0;}
.btnItem.markOnly .arrow{ position: relative;}

.btnItem:hover{ opacity: .75}
.btnItem:hover .arrowR:after{
	animation-name: arrow_move_anim_r;
    animation-timing-function:ease;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-duration: 0.4s;
 }
.btnItem:hover .arrowL:after{
	animation-name: arrow_move_anim_l;
    animation-timing-function:ease;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-duration: 0.4s;
 }

.hoverEffect{transition: opacity 300ms cubic-bezier(.50,.0,.50,1); }
.hoverEffect:hover{ opacity: .75}

@keyframes arrow_move_anim_r {
	0% { }
	50% { transform: translate(100%,0);}
	51% { opacity: 0;}
	52% { opacity: 0; transform: translate(-100%,0);}
	53% { opacity: 1; }
	100% {  transform: translate(0,0);}
}
@keyframes arrow_move_anim_l {
	0% { }
	50% { transform: translate(-100%,0);}
	51% { opacity: 0;}
	52% { opacity: 0; transform: translate(100%,0);}
	53% { opacity: 1; }
	100% {  transform: translate(0,0);}
}



/* swiper
----------------------------------------------- */

 .slick-container {
      width: 100%;
      position: relative;

    }
    .slick-slide {

    }

.slick-list{ }
.slick-slider{ margin-bottom: 0;}
.slick-slide{ border: solid 0px #f30; outline: 0;}
.slick-slide .item{border: solid 0px #369;  outline: 0;}

.slick-dots {

}

.slick-slide {

		 /*filter: blur(7px);*/
}

.slick-current {

		 /*filter: blur(0);*/
	}




/* media
----------------------------------------------- */
.onlyPC{ display:inline-block !important;}
.onlyPC_Block{ display:block !important;}
.onlySP{ display:none !important;}
.onlySP_Block{ display:none !important;}

@media screen and (max-width: 1000px) {	
.entryBoxList{    padding-top: 10px;}
}


@media screen and (max-width: 750px) {	
	
	.onlyPC{ display:none !important;}
	.onlySP{ display:inline-block !important;}

.onlyPC_Block{ display:none !important;}
.onlySP_Block{ display:block !important;}
		
		
	.btnItem{ width:100%; height:13vw; margin: 50px auto 50px auto; }
	.btnItem.frame{}
	.btnItem.bg{ }
	.btnItem .wrap{ height: 5.2vw; }
		
	.btnItem .contents{ padding-left: 8.6vw; }
	.btnItem .arrow,
	.btnItem .arrow:after{    width: 6vw;   height: 4.2vw;}
	
	.btnItem .text{ line-height: 4.2vw;  font-size: 1rem; } 
		.btnItem.more .text{ width:13vw; padding-top: 4.2vw; } 
		.btnItem.contact .text{ width:22vw; padding-top: 4.2vw; } 
		.btnItem.motto .text{ width:18vw; padding-top:4.2vw; } 
		.btnItem.send .text{ width:28vw;  padding-top:4.2vw; } 

	.entryBoxList .item{    padding-bottom: 8vw;}
	.entryBoxList .item:not(.noneMore):before{ bottom: 8vw;}
	.entryBoxList .item .meta .date .y,
	.entryBoxList .item .meta .date .md{ font-size: 0.9em;}
	.entryBoxList .item .meta .category{ min-width: 22vw}
	
	.entryBoxList.boxLInk .item{    padding-bottom: 8vw;}
	.entryBoxList.boxLInk .item .meta{  border-top-width: 2px; padding-top: 3vw;}
	.entryBoxList.boxLInk .item .meta .title{ line-height:1;}

}