@charset 'UTF-8';
/*
 * CSS style.css
 */
 

/* ---------------------------------------
share
--------------------------------------- */
.border
{
    padding: 10px;

    background-color: #fff;
    box-shadow: 5px 5px 10px #f5f5f5;
}

.img_box
{
    font-size: 0; 

    position: relative;
}

.img_user
{
    width: 100%;
}

.img_abs_plus
{
    position: absolute;
    right: 0;
    bottom: 0;
}



/*========================================

  .anybox__outer

========================================*/
.anybox__outer
{
    position: fixed;
    z-index: 2010;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    overflow: hidden;

    transition-timing-function: ease; 
    transition-property: opacity;
    text-align: center;
}

.anybox__outer:before
{
    display: inline-block;

    height: 100%;

    content: ''; 
    vertical-align: middle;
}

/*========================================

  .anybox__wrap

========================================*/
.anybox__wrap
{
    position: relative;
    z-index: 2020;

    display: inline-block;

    box-sizing: border-box;
    max-width: 100%; 
    margin: 0 auto;

    text-align: left;
    vertical-align: middle;
}

/*========================================

  .anybox__content

========================================*/
.anybox__content
{
    position: relative;
}

/*========================================

  .anybox__loading

========================================*/
.anybox__loading
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    width: 24px;
    height: 24px;
    margin: auto;

    background-image: url('../img/anybox/loading@2x.gif');
    background-repeat: no-repeat;
    background-size: 100% auto;
}

/*========================================

  .anybox-backdrop

========================================*/
.anybox__backdrop
{
    position: fixed;
    z-index: 2000;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    overflow: hidden;

    transition-timing-function: ease; 
    transition-property: opacity;

    opacity: inherit;
}

/*========================================

  .anybox-image

========================================*/
.anybox__imageWrap
{
    position: relative;

    -webkit-animation: anybox--direction_enter .4s;
            animation: anybox--direction_enter .4s;
}

.anybox--direction_next .anybox__imageWrap
{
    -webkit-animation: anybox--direction_next .4s;
            animation: anybox--direction_next .4s;
}

.anybox--direction_prev .anybox__imageWrap
{
    -webkit-animation: anybox--direction_prev .4s;
            animation: anybox--direction_prev .4s;
}

.anybox__imageInner
{
    line-height: 0; 

    position: relative;

    box-sizing: border-box;
    max-width: 100%;
    margin: 0 auto;
}

.anybox__imageInner:after
{
    position: absolute;
    z-index: -1;
    top: 20px;
    right: 0;
    bottom: 0;
    left: 0;

    display: block;

    content: ''; 

    box-shadow: 0 .2em 1em rgba(0, 0, 0, .6);
}

.anybox__imageItem
{
    display: block;

    box-sizing: border-box;
    width: auto;
    max-width: 100%;
    height: auto; 
    margin: 0 auto;
    padding: 20px 0 0;
}

.anybox__imageCaption
{
    font-size: 13px;
    line-height: 1.2;

    display: block;
    overflow: hidden;

    max-width: 100%;
    margin-top: 10px;

    text-align: right;

    color: #fff;
}
@media (max-width: 640px)
{
    .anybox__imageCaption
    {
        line-height: 1.5; 

        text-align: center;
    }
}

.anybox__imageBlank
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    width: 100%;
    height: 100%;
}

/*========================================

  .anybox-close

========================================*/
.anybox__close
{
    position: absolute;
    z-index: 2030;
    top: -20px;
    right: -10px;

    width: 40px;
    height: 40px;

    cursor: pointer;
    -webkit-transition: opacity .3s;
            transition: opacity .3s;

    background-image: url('../img/anybox/icn_close.svg');
    background-repeat: no-repeat;
    background-position: center center;

            backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.anybox--state_loading .anybox__close
{
    display: none;
}

.anybox__close::-moz-focus-inner
{
    padding: 0;

    border: 0;
}

.anybox__close:hover
{
    opacity: .5;
}

.anybox__close:active
{
    opacity: .8;
}

/*========================================

  .anybox-arrows

========================================*/
.anybox__arrows
{
    position: absolute;
    top: 50%;
    right: 0; 
    left: 0;
}

.anybox--state_loading .anybox__arrows
{
    display: none;
}

.anybox__arrow
{
    position: absolute;
    top: 0;
    bottom: 0;

    overflow: hidden;

    width: 5.2vw;
    max-width: 50px;
    height: 5.2vw;
    max-height: 50px;
    margin: auto;

    cursor: pointer;
    -webkit-transition: opacity .3s;
            transition: opacity .3s;

    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;

            backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.anybox__arrow::-moz-focus-inner
{
    padding: 0;

    border: 0;
}

.anybox__arrow:hover
{
    opacity: .5;
}

.anybox__arrow:active
{
    opacity: .8;
}

.anybox__arrowPrev
{
    left: 0;

    background-image: url('../img/anybox/icn_prev.svg');
}

.anybox__arrowNext
{
    right: 0;

    background-image: url('../img/anybox/icn_next.svg');
}

/*========================================

  animation

========================================*/
/*----------------------------------------
  anybox--direction_enter
----------------------------------------*/
@-webkit-keyframes anybox--direction_enter
{
    from
    {
        -webkit-transform: translate3d(0, -2em, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate3d(0, 0, 0); 

        opacity: 1;
    }
}

@keyframes anybox--direction_enter
{
    from
    {
        -webkit-transform: translate3d(0, -2em, 0);
                transform: translate3d(0, -2em, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0); 

        opacity: 1;
    }
}

/*----------------------------------------
  anybox--direction_next
----------------------------------------*/
@-webkit-keyframes anybox--direction_next
{
    from
    {
        -webkit-transform: translate3d(3em, 0, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate3d(0, 0, 0); 

        opacity: 1;
    }
}

@keyframes anybox--direction_next
{
    from
    {
        -webkit-transform: translate3d(3em, 0, 0);
                transform: translate3d(3em, 0, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0); 

        opacity: 1;
    }
}

/*----------------------------------------
  anybox--direction_prev
----------------------------------------*/
@-webkit-keyframes anybox--direction_prev
{
    from
    {
        -webkit-transform: translate3d(-3em, 0, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate3d(0, 0, 0); 

        opacity: 1;
    }
}

@keyframes anybox--direction_prev
{
    from
    {
        -webkit-transform: translate3d(-3em, 0, 0);
                transform: translate3d(-3em, 0, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0); 

        opacity: 1;
    }
}

/*========================================

  .imgBox

========================================*/
.imgBox
{
    line-height: 0; 

    margin: 50px auto 0;
}

.imgBox + .imgBox
{
    margin-top: 90px;
}

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

.imgBox__caption
{
    font-size: .875rem;
    line-height: 1.4;

    margin-top: 15px;

    text-align: center;

    color: #fff;
}

.imgBox__zoom
{
    line-height: 0; 

    position: relative;

    display: block;

    margin: 0 auto;
}

.imgBox__zoom:before
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;

    content: ''; 
    transition: background-color .2s;
}

.imgBox__zoom:hover:before
{
    background-color: rgba(255, 255, 255, .3);
}

.imgBox__zoom:after
{
    position: absolute;
    right: 0;
    bottom: 0;

    display: block;

    width: 18px;
    height: 18px;

    content: ''; 

    background-image: url('../img/zoom.svg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

@media (max-width: 640px)
{
    .imgBox
    {
        margin-top: 40px;
    }
    .imgBox + .imgBox
    {
        margin-top: 50px;
    }
}

/*========================================

  .anybox-image PROFILE

========================================*/
.anybox__imageWrap.anybox__profile
{
    top: 20px;

    max-width: 1030px;

    background-color: #000;
    box-shadow: 0 0 10px #000;
}
.anybox__imageWrap.anybox__profile .anybox__imageInner
{
    display: inline-block;

    width: 47.57%;
}
@media (max-width: 640px)
{
    .anybox__imageWrap.anybox__profile .anybox__imageInner
    {
        width: 100%;
    }
}
.anybox__imageWrap.anybox__profile .anybox__imageInner__right
{
    display: inline-block;

    width: 52.14%; 
    padding-top: 5.44%;
    padding-bottom: 5.44%;

    vertical-align: top;
}
@media (max-width: 640px)
{
    .anybox__imageWrap.anybox__profile .anybox__imageInner__right
    {
        width: 100%;
        padding: 0 9.12% 5.44%;
    }
}
.anybox__imageWrap.anybox__profile .anybox__imageItem
{
    width: 80%; 
    padding-top: 11.43%;
    padding-bottom: 11.43%;
}
@media (max-width: 640px)
{
    .anybox__imageWrap.anybox__profile .anybox__imageItem
    {
        padding-top: 6.12%;
        padding-bottom: 6.12%;
    }
}
.anybox__imageWrap.anybox__profile .anybox__imageWorkName
{
    font-family: 'ヒラギノ角ゴ ProN W3', 'HiraKakuProN-W3', '���C���I', '�q���L?�m�p�R? Pro W3', 'Hiragino Kaku Gothic Pro', 'MS P�R?�V�b�N', sans-serif;
    font-size: 1.125rem;
    font-weight: lighter; 
    line-height: 1.5;
}
.anybox__imageWrap.anybox__profile .anybox__imageWorker
{
    font-family: 'ヒラギノ角ゴ ProN W3', 'HiraKakuProN-W3', '���C���I', '�q���L?�m�p�R? Pro W3', 'Hiragino Kaku Gothic Pro', 'MS P�R?�V�b�N', sans-serif;
    font-size: 2.25rem;
    font-weight: lighter; 
    line-height: 1.5;

    margin-top: 1.49%;
}
.anybox__imageWrap.anybox__profile .anybox__imageCaption
{
    font-size: 1.125rem;
    line-height: 2;

    margin-top: 5.59%;
    padding-right: 8.38%;

    text-align: left;
    letter-spacing: .04em;
}
@media (max-width: 640px)
{
    .anybox__imageWrap.anybox__profile .anybox__imageCaption
    {
        line-height: 1.5; 

        padding-right: 0;
    }
}

h2::selection,
h3::selection,
h4::selection,
h5::selection,
li::selection,
p::selection,
span::selection,
strong::selection
{
    background: #ccc;
}

p strong::selection
{
    color: #c04309;
}

/*========================================

 レスポンシブ

========================================*/

.pctext{display:inline;}
.sptext{display:none}

@media (max-width: 640px){
.pctext{display:none}
.sptext{display:block}
#section02 .section02_ttl .pctext{display:none}
.spmgt{margin-top:18% !important}
.spmgt3{margin-top:3% !important}
.spmgt7{margin-top:7% !important}
.spmgt20{margin-top:20% !important}
.spmgt30{margin-top:30% !important}
}