@charset "utf-8";

ul li {
	margin-left: 0;
	list-style: none;
}

/*
************************************************************************
*スタッフギャラリー
************************************************************************
*/

.price-block
{
    font-size: 1.4rem;
    padding: 30px;
    border-radius: 0.5em;
    border: 1px solid #e3e3e3;
}
.price-block .caption
{
    color: #666666
}
.price
{
    /*margin-bottom: 1em;*/
}
.price > .number
{
    font-size: 2.4rem;
    line-height: 1.97;
    font-weight: 500;
    margin-left: 0.5em;
}
.price > .yen
{
    font-size: 1.6rem;
    line-height: 2.96;
    font-weight: 500;
}
.price > .lm{
	margin-left:2em;
}
.staff-link-title {
	font-size: 1.3em;
	font-weight: bold;
	margin: 10px 0;
}
.staff-link-title:before {
	content: "";
	display: inline-block;
	width: 30px;
	height: 30px;
	margin-right: 5px;
	vertical-align: -7px;
	background-size: cover;
}
.staff-link-title.pg:before {
	background-image: url(../../../_img/icon/feature-18.svg);
}
.staff-link-title.hm:before {
	background-image: url(../../../_img/icon/feature-06.svg);
}
.staff-link
{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    justify-content:flex-start;

    margin:-1em;
}
.staff-link > .staff-link-item
{
    width:calc(25% - 2em);
    margin:1em;
}
.staff-link > .staff-link-item:hover
{
    text-decoration:none;
}
.staff-link > .staff-link-item .image
{
    border-radius:0.5em;
    border-radius:0.5em;
    overflow:hidden;
}
.staff-link > .staff-link-item .title
{
    margin-top:1.0em;
    line-height:1;
}
.staff-link > .staff-link-item .title:after
{
    content:"";

    display:inline-block;

    width:0.5em;
    height:0.5em;

    border-right:1px solid #000000;
    border-bottom:1px solid #000000;

    transform:rotate(45deg) skew(5deg, 5deg);

    margin-left:0.75em;
    margin-bottom:0.3em;
}
.staff-link > .staff-link-item .title > span
{
    font-size:1.8rem;
    /*font-weight:bold;*/
}
.staff-link > .staff-link-item .title > span.sub
{
    font-size: 1.2rem;
    line-height: 1.5;
    vertical-align: text-bottom;
}



.staff-comment
{
}
.staff-comment .image_wrapper
{
	width:48%;
	float: left;
}
.staff-comment .image img {
	border-radius: 0.5em;
}
.staff-comment .link-tag ul {
	width: 100%;
	display: flex;
	justify-content: center;
	margin: 40px 0 0 -10px;
}
.staff-comment .link-tag ul li{
	
}
.staff-comment .link-tag ul li.inst-mov{
	margin-right:10px;
}
.staff-comment .link-tag ul li a{
	width:100%;
	background-color: #000;
	color:#fff;
	font-size: 0.8em;
	font-weight: bold;
	text-decoration: none;
	
	content: "";
	display: inline-block;
	background-repeat: no-repeat;
	padding: 5px 10px 5px 35px;
	border-radius: 100px;
	transition-duration: 0.3s;
	transition-property: all;
	transition-timing-function: ease;
}
.staff-comment .link-tag ul li a:hover{
	background-color: #e33688;
}
.staff-comment .link-tag ul li.inst-mov a{
	letter-spacing: -0.05em;
	
	background-image: url(../../../_img/icon/movie.svg);
	background-size: 19px;
	background-position: 10px 50%;
}
.staff-comment .link-tag ul li.inst a{
	background-image: url(../../../_img/icon/instagram.svg);
	background-size: 19px;
	background-position: 10px 50%;
}
.staff-comment .text
{
    width:51%;
    padding-left: 2em;
    font-size: 1.4rem;
    float: right;
    box-sizing: border-box;
}
.staff-comment .text .title
{
    font-size: 2.8rem;
    font-weight: bold;
    line-height: 1.0;
    margin-bottom: 0.8em;
}
.staff-comment .text .copy{
	font-family: 'Zen Kurenaido', sans-serif;
	font-size: 1.5em;
	/*font-weight: bold;*/
	line-height: 1.2;
	margin-bottom: 15px;
}
.staff-comment .text .sub
{
    font-weight: normal;
    font-size: 2.0rem;
    line-height: 1.5;
    vertical-align: text-bottom;
}
.staff-comment .text .sub-title
{
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 1.0;
    margin-top: 1.5em;
    margin-bottom: 1em;
}
.sns{
	font-size: 0.9em;
	font-weight: bold;
	color: #fff;
	line-height: 1;
	
	position: absolute;
	right: 0;
	top: 0;
}
.sns > a{
	background-color: #000;
	border-radius: 100px;
	padding: 7px 12px;
	display: inline-block;
	vertical-align: -3px;
	color: #fff;
	transition-duration: 0.3s;
	transition-property: all;
	transition-timing-function: ease;
}
.sns > a.instagram:hover
{
    background-color: #e33688;
    text-decoration: none;
}
.sns > a.private:hover
{
    background-color: #2095aa;
    text-decoration: none;
}
.sns > a.instagram + a.private
{
    margin-left: 10px;
}
.sns > a.instagram:before
{
    content: "";
    display: inline-block;
    background-image: url(../../../_img/icon/instagram.svg);
    width: 16px;
    height: 16px;
    background-position: 0 50%;
    background-repeat: no-repeat;
    margin-right: 0.5em;
}
.staff-comment .text hr{
	border-color: #000;
}
.staff-comment .text ul.description{
	margin-top: 2em;
	line-height: 1.7;
	list-style: none;
}
.staff-comment .text ul.description .indQ,
.staff-comment .text ul.description .question{
	display: inline;
	font-weight: 600;
}
.staff-comment .text ul.description .answer {
	margin-left: 3em;
}
.staff-comment .text ul.description .indQ {
	font-size: 1.3em;
	margin-right: 0.5em;
	vertical-align: -1.5px;
}
.staff-comment .text ul.description li {
	margin-left: 0;
	margin-bottom: 20px;
}
.staff-comment .text .remarksTag {
	display: inline-block;
	color: #666;
	font-size: 0.8em;
	border: 1px #aaa solid;
	padding: 1px 7px;
}
.staff-collection .title
{
    font-size: 2.4rem;
    font-weight: bold;
    margin-top: 1.5em;
    margin-bottom: 1em;
    line-height: 1;
}

.sample-slide
{

}
.sample-slide ul
{
    margin:0px;
    padding:0px;
    list-style:none;
    margin-left:-0.5em;
    margin-right:-0.5em;
}
.sample-slide ul li
{
    float:left;

    margin:0px;
    padding:0px;

    width:calc(20% - 1em);
    margin-left:0.5em;
    margin-right:0.5em;
}
.sample-slide ul li img
{
    border-radius:0.5em;
}
.sample-slide .slick-prev,
.sample-slide .slick-next
{
    z-index:100;
    font-size:inherit;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 30px;
    height: 30px;

    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.sample-slide .slick-prev:hover,
.sample-slide .slick-prev:focus,
.sample-slide .slick-next:hover,
.sample-slide .slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}
.sample-slide .slick-prev:hover:before,
.sample-slide .slick-prev:focus:before,
.sample-slide .slick-next:hover:before,
.sample-slide .slick-next:focus:before
{
    opacity: 1;
}
.sample-slide .slick-prev.slick-disabled:before,
.sample-slide .slick-next.slick-disabled:before
{
    opacity: .25;
}
.sample-slide .slick-prev:before,
.sample-slide .slick-next:before
{
    content:'';
    display:block;

    width: 30px;
    height: 30px;

    border-radius:100%;
    border:1px solid rgba(0,0,0,1.0);
    background-color:rgba(0,0,0,1.0);

    opacity: 1.00;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.sample-slide .slick-prev:hover:before,
.sample-slide .slick-next:hover:before
{
    opacity: 0.75;
}
.sample-slide .slick-prev:after,
.sample-slide .slick-next:after
{
    content:'';
    display:block;
    position: absolute;

    top:50%;
    left:50%;

    width: 8px;
    height: 8px;

    border:0px solid rgba(0,0,0,0.0);
    border-right:1px solid rgba(255,255,255,1.0);
    border-bottom:1px solid rgba(255,255,255,1.0);

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.sample-slide .slick-prev
{
    left:calc(0% - 15px + 0.5em);
}
.sample-slide .slick-prev:after
{
	transform:translate(-25%, -50%) rotate(135deg) skew(5deg, 5deg);
}

.sample-slide .slick-next
{
    right:calc(0% - 15px + 0.5em);
}
.sample-slide .slick-next:after
{
	transform:translate(-75%, -50%) rotate(-45deg) skew(5deg, 5deg);
}
.gallery-link {
	text-align: right;
}

/* == ブレークポイント ==========================================================*/
@media screen and (max-width: 1100px) {
    .sample-slide ul li
    {
        width:calc(25% - 1em);
    }
}
/* == スマートフォンサイズ ======================================================*/
@media screen and (max-width: 767px) {
	.price-block
    {
        font-size: 2.2rem;
        padding: 4vw 3.33vw;
    }
    .price-block .caption
    {
    }
    .price
    {
    }
    .price > .number
    {
        font-size: 4.0rem;
        margin-left: 0.5em;
    }
    .price > .yen
    {
        font-size: 2.8rem;
    }
	.price > .lm {
		display: inline-block;
		margin-left: 0;
	}
	.row > hr
	{
		margin-top: 6.66666vw;
	}
    .staff-link
    {
        margin:-0.75em;
    }
    .staff-link > .staff-link-item
    {
        width:calc(50% - 1.5em);
        margin:0.75em;
    }
    .staff-link > .staff-link-item:hover
    {
    }
    .staff-link > .staff-link-item .image
    {
    }
    .staff-link > .staff-link-item .title
    {
        margin-top:1.0em;
        line-height:1;
    }
	.staff-link > .staff-link-item .title:after
	{
	    margin-left:0.75em;
	    margin-bottom:0.3em;
	}
    .staff-link > .staff-link-item .title > span
    {
        font-size:2.6rem;
        /*font-weight:bold;*/
    }
    .staff-link > .staff-link-item .title > span.sub
    {
        font-size: 2.0rem;
    }


    .staff-list > .staff-list-item
    {
        width:calc(45% - 1em);
        margin:1em;
    }
    .staff-list > .staff-list-item-before
    {
        margin-right: 0;
    }
    .staff-list > .staff-list-item-after
    {
        margin-left: 0;
    }
    .staff-list > .staff-list-item-arrow
    {
        width:calc(10%);
        background-image: url(../../../_img/icon/arrow-sp.svg);
        background-position: 50% 40%;
        background-repeat: no-repeat;
        background-size: 31px auto;
        margin: 0;
    }
    .staff-list > .staff-list-item .title > span
    {
        font-size:2.2rem;
    }
	.sns {
		font-size: 1.7rem;
		margin-top: 8.5px;
	}
	.sns > a{
		padding: 6px 10px;
		vertical-align: -4px;
	}
	.sns > a.instagram + a.private
    {
        margin-left: auto;
        margin-top: 2vw;
    }
    .sns > a.instagram:before
    {
        width: 4vw;
        height: 4vw;
    }
	
    .staff-comment
    {
        margin:0em;
    }
    .staff-comment .image_wrapper
    {
        width:100%;
        float: none;
        margin: 0;
    }
	.staff-comment .link-tag ul {
		margin: 20px 0;
	}
    .staff-comment .text
    {
        width: 100%;
        float: none;
        margin: 0;
        padding: 0;
        font-size: 2.4rem;
        margin-bottom: 1.5em;
    }
	.staff-comment .title-sub {
		margin-top: .8em;
	}
    .staff-comment .text .title{
		font-size: 4.0rem;
	}
	.staff-comment .text .copy{
		font-size: 1.3em;
	}
	.staff-comment .text .sub{
		font-size: 2.8rem;
	}
	.staff-comment .text .remarksTag {
		font-size: 0.75em;
		padding: 2px 7px;
	}
	.staff-collection .title{
		font-size: 3.2rem;
		margin-top: 0.5em;
	}
    .sample-slide
    {

    }
    .sample-slide ul
    {
        margin:0px;
        padding:0px;
        list-style:none;
        margin-left:-0.5em;
        margin-right:-0.5em;
    }
    .sample-slide ul li
    {
        float:left;

        margin:0px;
        padding:0px;

        width:calc(50% - 1em);
        margin-left:0.5em;
        margin-right:0.5em;
    }
    .sample-slide ul li img
    {
        border-radius:0.5em;
    }
    
	.sample-slide .slick-prev,
	.sample-slide .slick-next
	{
	    width: 6.6vw;
	    height: 6.6vw;
	}
	.sample-slide .slick-prev:hover,
	.sample-slide .slick-prev:focus,
	.sample-slide .slick-next:hover,
	.sample-slide .slick-next:focus
	{
	}
	.sample-slide .slick-prev:hover:before,
	.sample-slide .slick-prev:focus:before,
	.sample-slide .slick-next:hover:before,
	.sample-slide .slick-next:focus:before
	{
	    opacity: .6;
	}
	.sample-slide .slick-prev.slick-disabled:before,
	.sample-slide .slick-next.slick-disabled:before
	{
	}
	.sample-slide .slick-prev:before,
	.sample-slide .slick-next:before
	{
	    width: 6.6vw;
	    height: 6.6vw;

	    border-radius:100%;
	    border:1px solid rgba(0,0,0,1.0);
	    background-color:rgba(0,0,0,1.0);
	    opacity: 1.00;
	}
	.sample-slide .slick-prev:after,
	.sample-slide .slick-next:after
	{
	    width: 2.0vw;
	    height: 2.0vw;
	    
	    border:0px solid rgba(0,0,0,0.0);
	    border-right:1px solid rgba(255,255,255,1.0);
	    border-bottom:1px solid rgba(255,255,255,1.0);
	}

	.sample-slide .slick-prev
	{
	    left:calc(0% - 3.3vw + 0.5em);
	}
	.sample-slide .slick-prev:after
	{
		transform:translate(-25%, -50%) rotate(135deg) skew(10deg, 10deg);
	}

	.sample-slide .slick-next
	{
	    right:calc(0% - 3.3vw + 0.5em);
	}
	.sample-slide .slick-next:after
	{
		transform:translate(-75%, -50%) rotate(-45deg) skew(10deg, 10deg);
	}
	.gallery-link {
		text-align: center;
	}
}
