@charset "utf-8";

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


==============================*/
html {
    width: 100%;
    height: 100%;
    font-size: 62.5%;
}
body {
    color: #000000;
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    font-family: 'Noto Sans JP', sヒラギノ角ゴ ProN, Hiragino Kaku Gothic ProN, メイリオ, Meiryo, sans-serif;
    font-size: 1.5rem;
    line-height: 1.8;
    /*  viewport
    ------------------------------*/
    -webkit-text-size-adjust: 100%;
}
a {
    color: #000000;
    text-decoration: none;
}
img {
    display: block;
    width: 100%;
}
a img {
    border:none;
    outline:none;
}
* { 
    box-sizing: border-box;
    word-wrap:break-word;
}

a.nolink {
	pointer-events: none;
	opacity: .5;
}

@media screen and (min-width: 641px){
    .spOnly {
        display: none !important
    }
}
@media screen and (max-width: 640px){
    .pcOnly {
        display: none !important
    }
}
/*==============================
        content
==============================*/
.wrap {
    width: 100%;
    margin: 0 auto;
    overflow:hidden;
}
.contents {
    width: 100%;
    max-width: 750px;
    margin:0 auto;
    padding:0;
}
.contents .img {
    margin:0;
    padding:0;
    position: relative;
}

.contents .contents_inner {
    background-color: #f4edd3;
    display: grid;
    /* grid-template-columns: repeat(2,1fr); */
    grid-template-columns: 1fr;
    padding: min(2vw,15px) 5% min(4vw,30px);
}
.contents .contents_inner .inner_box {
    position: relative;
}
.contents .contents_inner .finger {
    position: absolute;
    width: 17%;
    top:23%;
    left: 36%;
}
.contents .contents_inner .box2 .finger {
    left: auto;
    right: 33%;
}
.contents .contents_inner .box1 img:nth-child(2) {
    width: 80%;
    justify-self: end;
    margin-right: 5%;
}
.contents .contents_inner .box2 img:nth-child(2) {
    width: 80%;
    justify-self: start;
    margin-left: 5%;
}

.contents .about {
    background-color: #f9f4cc;
    padding:0 5% min(4vw,30px);
}
.contents .about table {
    border-collapse: collapse;
    width: 100%;
    font-size: min(2.4vw,18px);
    /*margin:min(4vw,30px) 0 0;*/
    border-top:1px solid #2a1b14;
}
.contents .about table tr {
    border-bottom:1px solid #2a1b14;
}
.contents .about table th,
.contents .about table td {
    color: #2a1b14;
    line-height: 1.5;
    padding:.66em;
    font-weight: 500;
    text-align: left;
}
.contents .about table th {
    background-color: #faee98;
    width: 6em;
}

.fancybox-button.fancybox-button--zoom {
    display: none!important;
}
.fancybox-button.fancybox-button--close {
    background-color: #FFFFFF!important;
}
.fancybox-button.fancybox-button--close svg {
    color:#000000;
}
/*==============================
        header
==============================*/

.header {
    width: 100%;
    max-width: 750px;
    margin:0 auto;
    padding:0;
}

.footer {
    width: 100%;
    max-width: 750px;
    margin:0 auto;
    background-color: #f9f4cc;
    padding-bottom: min(2vw,15px);
}
.footer ul {
    width: 90%;
    margin:0 auto;
    display: flex;
    justify-content: center;
    font-size: min(3vw,16px);
    column-gap: 1em;
    margin-bottom: .5em;
}
.footer ul a {
    color: #2a1b14;
}
.footer .copyright {
    width: 90%;
    margin:0 auto;
    text-align: center;
    font-size: min(3vw,16px);
}

/* =================================================================
        section
================================================================= */


.manga {
    display: none;
}
.manga a {
    cursor: pointer;
}
.manga > div,.slider {
    max-width: 800px;
}
.mangaopen1 {
    cursor: pointer;
}
.slick-slide {
    padding:0 min(6vw,45px);
}
.slick-arrow {
    width: min(6vw,45px);
    height: min(6vw,45px);
    background: url(../images/arrow_left.png) no-repeat center center/contain!important;
    z-index: 2;
    top: 50%;
    transform: translate(0,0);
    transition:.3s;
}
.slick-arrow.slick-disabled {
    opacity: 0;
}
.slick-arrow::before {
    content:none;
}
.slick-next {
    background: url(../images/arrow_right.png) no-repeat center center/contain!important;
    right:0;
}
.slick-prev {
    left: 0;
}
.slide.last {
    position: relative;
}
.slide.last .btn {
    padding:0 10%;
    position: absolute;
    left: 0;
    top:55%;
}
.fancybox__container {
    --fancybox-bg: rgba(0,0,0,.66);
}
.fancybox__content {
    padding:1em 0;
}
.btn {
    width:100%;
    padding:0 5%;
}

.btn .enter img {
    animation-name: btnaction1;
    animation-iteration-count: infinite;
    animation-timing-function:cubic-bezier(0.215, 0.610, 0.355, 1);
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
	transform-origin: center center;
}

.img .btn {
    position: absolute;
    left: 0;
    bottom:min(4vw,30px);
}

@keyframes btnaction1 {
    0% {
        transform: scale(1, 1);
    }
    50% {
        transform: scale(1.05, 1.05);
    }
    100% {
        transform: scale(1, 1);
    } 
}

@media (hover:hover) {
    .btn .enter {
        transition-duration: .3s;
    }
    .btn .enter:hover {
        filter: brightness(1.2)
    }
    .footer ul a:hover {
        text-decoration: underline;
    }
    .mangaopen1 {
        transition-duration: .3s;
    }
    .mangaopen1:hover {
        transform: scale(1.05);
    }
}


@media screen and (max-width: 1024px){
}

@media screen and (max-width: 640px){
}