@charset "utf-8";
body {
    font-feature-settings: "palt" 1;
    min-width: 100%;
}

.pc_disp {
    display: block;
}

.sp_disp {
    display: none;
}

.sp-close {
    display: none;
}

.sp-borad {
    display: none;
}

.opacity {
    opacity: 0 !important;
}

.opa-img {
    opacity: 0;
}

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

.color {
    color: #00cdae;
}

img {
    width: 100%;
    vertical-align: bottom;
    line-height: 1.0em;
}

div#checkbox_2 img {
    width: auto;
}

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

基本設定

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

.white-out{
    width: 100%;
    height: 100vh;
    background: #fff;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 1000000;
}

.wrapper{
    overflow: hidden;
}

/* menu */

.menu{
    width: 100%;
    background: #fff;
}

.m-wrap{
    width: 100%;
    max-width: 750px;
    margin: auto;
    position: relative;
}

.mw-head-btn{
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 15;
    transition: all 0.3s;
    pointer-events: none;
}


.cv-btn01{
    width: 51%;
    height: 100%;
    position: absolute;
    right: 2.5%;
    top: 0;
    z-index: 30;
    transition: all 0.3s;
}

.cv-btn01:hover{
    background: rgba(255,255,255,0.5);
}


/* FV */

.c-01{
    background: url(../img/back/tsubaki_lp_slice_back_05.jpg) no-repeat;
    background-position: top center;
}

.c01-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


/* CONTENT 02 */

.c-02{
    background: url(../img/back/tsubaki_lp_slice_back_07.jpg) no-repeat;
    background-position: top center;
}

.c02-wrap00{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c02-w0{
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.c02-wrap01{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c02-wrap02{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


.c02-wrap03{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


/* cv btn */

.cv-btn02{
    width: 86.6%;
    height: 60.5%;
    opacity: 0.5;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 10;
    overflow: hidden;
    transition: all 0.3s;
}

.cv-btn02:hover{
    background: rgba(255,255,255,0.5);
}

.cv-btn02:before {
    content: '';
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: shine 3s ease-in-out infinite;;
    position: absolute;
    top: -180px;
    left: 0;
    opacity: 0;
    transform: rotate(45deg);
    pointer-events: none;
}



@keyframes shine {
    0% 
    transform: scale(0) rotate(45deg)
    opacity: 0;

    80% 
    transform: scale(0) rotate(45deg)
    opacity: 0.5

    81% 
    transform: scale(4) rotate(45deg)
    opacity: 1

    100% 
    transform: scale(50) rotate(45deg)
    opacity: 0
}

@keyframes shine {
    0% {
        transform: scale(0) rotate(45deg);
        opacity: 0;
    }
    80% {
        transform: scale(0) rotate(45deg);
        opacity: 0.5;
    }
    81% {
        transform: scale(4) rotate(45deg);
        opacity: 1;
    }
    100% {
        transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}


/* CONTENT 03 */

.c03-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.cv-btn03{
    width: 65.3%;
    height: 22.5%;
    position: absolute;
    right: 6.6%;
    top: 58.5%;
    opacity: 0.5;
    overflow: hidden;
    transition: all 0.3s;
}

.cv-btn03:hover{
    background: rgba(255,255,255,0.5);
}


.cv-btn03:before {
    content: '';
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: shine 3s ease-in-out infinite;;
    position: absolute;
    top: -180px;
    left: 0;
    opacity: 0;
    transform: rotate(45deg);
    pointer-events: none;
}

/* CONTENT 04 */

.c-04{
    background: url(../img/back/tsubaki_lp_slice_back_12.jpg) no-repeat;
    background-position: top center;
}

.c04-wrap01{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c04-wrap02{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c04-w1{
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

/* CONTENT 05 */

.c-05{
    background: url(../img/back/tsubaki_lp_slice_back_14.jpg) no-repeat;
    background-position: top center;
}

.c05-wrap01{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c05-w1{
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
}

.c05-wrap02{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c05-wrap03{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 06 */

.c-06{
    background: url(../img/back/tsubaki_lp_slice_back_15.jpg) no-repeat;
    background-position: top center;
}

.c06-wrap01{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c06-wrap02{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c06-wrap03{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c06-wrap04{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c06-wrap05{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c06-w1{
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
}

/* CONTENT 07 */

.c-07{
    background: url(../img/back/tsubaki_lp_slice_back_18.jpg) no-repeat;
    background-position: top center;
}


.c07-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 08 */

.c-08{
    background: url(../img/back/tsubaki_lp_slice_back_20.jpg) no-repeat;
    background-position: top center;
}

.c08-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 09 */


.c-09{
    background: url(../img/back/tsubaki_lp_slice_back_22.jpg) no-repeat;
    background-position: top center;
}

.c09-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 10 */

.c-10{
    background: url(../img/back/tsubaki_lp_slice_back_24.jpg) no-repeat;
    background-position: top center;
}

.c10-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.c10-w1{
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
}

/* CONTENT 11 */

.c-11{
    background: url(../img/back/tsubaki_lp_slice_back_27.jpg) no-repeat;
    background-position: top center;
}

.c11-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


/* CONTENT 12 */

.c-12{
    background: url(../img/back/tsubaki_lp_slice_back_04.jpg) no-repeat;
    background-position: top center;
}

.c12-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


/* CONTENT 13 */

.c-13{
    background: url(../img/back/tsubaki_lp_slice_back_08.jpg) no-repeat;
    background-position: top center;
}

.c13-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 14 */

.c-14{
    background: url(../img/back/tsubaki_lp_slice_back_13.jpg) no-repeat;
    background-position: top center;
}

.c14-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 15 */

.c-15{
    background: url(../img/back/tsubaki_lp_slice_back_16.jpg) no-repeat;
    background-position: top center;
}

.c15-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 16 */

.c-16{
    background: url(../img/back/tsubaki_lp_slice_back_17.jpg) no-repeat;
    background-position: top center;
}

.c16-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


/* CONTENT 17 */

.c-17{
    background: url(../img/back/tsubaki_lp_slice_back_19.jpg) no-repeat;
    background-position: top center;
}

.c17-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 18 */

.c-18{
    background: url(../img/back/tsubaki_lp_slice_back_21.jpg) no-repeat;
    background-position: top center;
}

.c18-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

/* CONTENT 19 */

.c-19{
    background: url(../img/back/tsubaki_lp_slice_back_23.jpg) no-repeat;
    background-position: top center;
}

.c19-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


/* CONTENT 20 */

.c-20{
    background: url(../img/back/tsubaki_lp_slice_back_25.jpg) no-repeat;
    background-position: top center;
}

.c20-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}

.cv-btn04{
    width: 65.3%;
    height: 17.8%;
    position: absolute;
    right: 6.6%;
    top: 56%;
    opacity: 0.5;
    overflow: hidden;
    transition: all 0.3s;
}

.cv-btn04:hover{
    background: rgba(255,255,255,0.5);
}


.cv-btn04:before {
    content: '';
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: shine 3s ease-in-out infinite;;
    position: absolute;
    top: -180px;
    left: 0;
    opacity: 0;
    transform: rotate(45deg);
    pointer-events: none;
}


/* CONTENT 21 */

.c-21{
    background: url(../img/back/tsubaki_lp_slice_back_26.jpg) no-repeat;
    background-position: top center;
}

.c21-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


/* CONTENT 22 */

.c-22{
    background: url(../img/back/tsubaki_lp_slice_back_28.jpg) no-repeat;
    background-position: top center;
}

.c22-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
}


/* CONTENT 23 */

.c-23{
    background: #3f2920;
    box-sizing: border-box;
    padding: 100px 50px;
}

.c23-wrap{
    width: 100%;
    max-width: 750px;
    position: relative;
    margin: auto;
    text-align: center;
    color: #fff;
    font-size: 13px;
    letter-spacing: 1px;
}


/* temple atag css */

.atag{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 50;
}


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


スマホのメディアクエリ

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

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


    .pc_disp {
        display: none;
    }
    .sp_disp {
        display: block;
    }


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

    ここからスマホのCSS

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

    
    
}

/* 768px以上 */

