@charset "UTF-8";

/* ---------------------------------------
	max-width: 960px
--------------------------------------- */

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

    #takibiclub .c-contents{
        margin-bottom: 60px;
    }
    #takibiclub .c-contents .c-contents__nav{
        height: 72px;
        line-height: 72px;
        margin-bottom: 60px;
    }
    #takibiclub .c-contents .c-contents__nav ul li{
        margin: 0 4px;
    }
    #takibiclub .c-contents .c-contents__nav ul li a{
        font-size: 11px;
        letter-spacing: 0;
    }

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

        #takibiclub | SCHEDULE

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

    #takibiclub .c-timetable{
        max-width: 1280px;
        padding: 0 50px;
        margin: 80px auto;
    }
    #takibiclub .c-timetable__inner{
        padding: 48px;
        text-align: center;
        border: 12px solid #7c7d55;
    }
    #takibiclub .c-timetable h2{
        text-align: center;
        font-size: 44px;
        font-family: "TrendHMSans-Five-webfont", 'Montserrat', sans-serif;
        margin-bottom: 32px;
    }
    #takibiclub .c-timetable table{
        width: 100%;
    }
    #takibiclub .c-timetable table th{
        font-family: "TrendHMSans-Five-webfont", 'Montserrat', sans-serif;
        text-align: left;
        padding: 28px 12px;
        font-size: 0.9em;
        line-height: 1.5;
        border-top: 1px solid #7c7d55;
    }
    #takibiclub .c-timetable table td{
        text-align: left;
        padding: 28px 12px;
        font-size: 0.9em;
        font-weight: bold;
        line-height: 1.5;
        letter-spacing: 0.1em;
        border-top: 1px solid #7c7d55;
    }


}/* max-width: 1024px */

/* ---------------------------------------
	max-width: 768px
--------------------------------------- */

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

    /*
        Other
    ******************************/

    .break__sp{
        display: block;
    }
    .break__pc{
        display: none;
    }

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

        #takibiclub | Header

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

    /*
        #takibiclub | Content Nav
    ****************************************/

    #takibiclub .c-nav{
        display: none;
    }

    /*
        #takibiclub | Overlay Nav
    ****************************************/

    .openNav{
        display: block;
    }

    /*
        #takibiclub | Content Header
    ****************************************/
    #takibiclub .c-header{
    }
    #takibiclub .c-header .c-logo{
        margin: 70px 0 30px;
    }

    #takibiclub .c-header .c-logo a{
        width: 240px;
        height: 71px;
        margin:30px auto;
    }

    /*
        #takibiclub | Hero
    ****************************************/
    #takibiclub .c-header .c-hero{
        margin-top: -30px;
    }
    #takibiclub .c-header .c-hero__logo{
        position: absolute;
        display: block;
        width: 440px;
        height: 130px;
        margin-top: -65px;
        margin-left: -220px;
    }

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

        #takibiclub | Body

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

    #takibiclub #main {
        font-size: 16px;/*Base = 18px*/
    }
    #takibiclub .c-title h1{
        font-size: 32px;
        margin: 40px 0;
    }
    #takibiclub .c-title h2{
        font-size: 24px;
        margin: 40px 0 30px;
    }
    #takibiclub .c-title h3{
        font-size: 18px;
        padding: 4.8vw 0 0;
    }
    #takibiclub .c-head{
        margin-bottom: 20px;
        padding: 0 4.8vw;
    }
    #takibiclub .c-head h2{
        font-size: 18px;
        line-height: 1.35;
    }
    #takibiclub .c-head h2.head__en{
        font-size: 20px;
        letter-spacing: 0em;
    }
    #takibiclub .c-head h3{
        font-size: 18px;
        margin-bottom: 30px;
        padding: 0 4.8vw;
    }
    #takibiclub .c-txtbox{
        max-width: 1280px;
        margin: 0 auto 30px;
        padding: 0 4.8vw;
    }
    #takibiclub .c-txtbox p{
        font-size: 15px;
        line-height: 1.7;
    }

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

        #takibiclub | About

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

    #takibiclub .c-about .c-about__concept{
        width: 100%;
        height: auto;
        padding-top: 60px;
        padding-bottom: 60px;
    }
    #takibiclub .c-about .c-about__concept h2{
        font-size: 21px;
        margin-bottom: 30px;
    }
    #takibiclub .c-about .c-about__concept p{
        font-size: 14px;
        line-height: 2.4;
        padding: 0 4.8vw;
        text-align: left;
        
    }
    #takibiclub .c-about .c-about__outine{
        max-width: 1280px;
        margin: 60px auto;
        padding: 0 4.8vw;
    }
    #takibiclub .c-about .c-about__outine table{
        width: 100%;
        border-top: 1px solid #554c35;
    }
    #takibiclub .c-about .c-about__outine th{
        width: 30%;
        font-size: 14px;
        padding: 20px 10px;
        line-height: 1.6;
    }
    #takibiclub .c-about .c-about__outine td{
        width: 70%;
        font-size: 14px;
        line-height: 1.6;
        padding: 20px 10px;
    }
    #takibiclub .c-about .c-about__caution{
        margin: 60px auto;
        padding: 0 4.8vw;
    }
    #takibiclub .c-about .c-about__caution .caution__qa .qa__item{
        margin-bottom: 30px;
    }
    #takibiclub .c-about .c-about__caution .caution__qa .qa__head{
        padding: 18px 8px;
        margin-bottom: 30px;
        font-size: 15px;
        letter-spacing: 0.1em;
        line-height: 1.5;
    }
    #takibiclub .c-about .c-about__caution .caution__qa .qa__item{
        padding-bottom: 30px;
    }
    #takibiclub .c-about .c-about__caution .caution__qa .qa__item dl dt{
        margin-bottom: 30px;
        font-size: 15px;
        padding-left: 40px;
        font-weight: bold;
    }
    #takibiclub .c-about .c-about__caution .caution__qa .qa__item dl dd{
        font-size: 15px;
        padding-left: 40px;
    }

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

        #takibiclub | Event Information

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

    #takibiclub .c-info{
        width: 100%;
        height: auto;
        min-height: auto;
        padding-top: 10px;
        padding-bottom: 30px;
        margin-bottom: 60px;
    }
    #takibiclub .c-info .c-title h2.title__info{
        font-size:18px;
        color:#e8bb8f;
        margin-bottom: 20px;
    }
    #takibiclub .c-info .c-info__date{
        margin-bottom: 20px;
    }
    #takibiclub .c-info .c-info__date h3{
        font-size: 18px;
        color: #999966;
        margin-bottom: 10px;
    }
    #takibiclub .c-info .c-info__date h4{
        font-size: 28px;
        font-family: "TrendHMSans-Five-webfont", 'Montserrat', sans-serif;
        margin-bottom: 10px;
    }
    #takibiclub .c-info .c-info__date h4 span{
        font-size: 14px;
        font-family: "TrendHMSans-Five-webfont", 'Montserrat', sans-serif;
    }
    #takibiclub .c-info .c-info__date p{
        font-size: 14px;
        font-weight: bold;
    }
    #takibiclub .c-info .c-info__place h3{
        font-size: 18px;
        color: #999966;
        margin-bottom: 5px;
    }
    #takibiclub .c-info .c-info__place p{
        font-size: 16px;
        font-weight: bold;
    }


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

        #takibiclub | Ticket

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

    #takibiclub .c-ticket{
        margin-bottom: 60px;
        padding: 0 4.8vw;
    }
    #takibiclub .c-ticket .c-ticket__items{
        margin-bottom: 6.4vw;
    }

    #takibiclub .c-ticket .item__entrance{
        width: 100%;
        background: #7c7d55;
        margin-right: 0;
        padding: 40px 10px;
        margin-bottom: 4.8vw;
    }
    #takibiclub .c-ticket .item__campsite{
        width: 100%;
        padding: 40px 10px 0px;
    }
    #takibiclub .c-ticket .item__entrance h3,
    #takibiclub .c-ticket .item__campsite h3{
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        margin-bottom: 10px;
    }
    #takibiclub .c-ticket .item__entrance h4,
    #takibiclub .c-ticket .item__campsite h4{
        font-size: 16px;
    }
    #takibiclub .c-ticket .item__entrance h4 span,
    #takibiclub .c-ticket .item__campsite h4 span{
        font-size: 12px;
    }
    #takibiclub .c-ticket .item__entrance p,
    #takibiclub .c-ticket .item__campsite p{
        font-size: 14px;
    }
    #takibiclub .c-ticket .item__entrance p{
        padding: 0 10px;
    }
    #takibiclub .c-ticket .item__entrance p.item__price,
    #takibiclub .c-ticket .item__campsite p.item__price{
        font-size: 28px;
    }
    #takibiclub .c-ticket .item__entrance p.item__price span,
    #takibiclub .c-ticket .item__campsite p.item__price span{
        font-size: 14px;
    }
    #takibiclub .c-ticket .item__entrance ul{
        margin: 0 0 10px;
    }
    #takibiclub .c-ticket .item__entrance ul li{
        float: none;
        width: 100%;
        text-align: center;
        padding: 25px 0 10px;
    }
    #takibiclub .c-ticket .item__entrance ul li:first-child{
        border-right: none;
        border-bottom: 1px solid #fff;
    }
    #takibiclub .c-ticket .item__campsite ul{
        margin: 12px 0;
    }

    #takibiclub .c-ticket .c-ticket__btn a{
        height: 60px;
        line-height: 60px;
        font-size: 15px;
        letter-spacing: 0.1em;
        text-indent: 28px;
    }
    #takibiclub .c-ticket .c-ticket__btn a:hover,
    #takibiclub .c-ticket .c-ticket__btn a:focus{
        background-color: #ff7930;
    }
    #takibiclub .c-ticket .c-ticket__btn a::before{
        content: "";
        position: absolute;
        display: block;
        width: 50px;
        height: 28px;
        background-image: url(../images/ico_ticket.png);
        background-repeat: no-repeat;
        background-size: 100%;
        top: 50%;
        left: 15px;
        margin-top: -14px;
    }
    #takibiclub .c-ticket .ticket-present{
        display:table;
        padding: 30px 3%;
        margin-bottom: 20px;
    }
    #takibiclub .c-ticket .ticket-present .ticket-present__txt{
        width: 66.666%;
    }
    #takibiclub .c-ticket .ticket-present .ticket-present__txt p{
        line-height: 1.2;
    }
    #takibiclub .c-ticket .ticket-present .ticket-present__txt span{
        font-size: 21px;
    }
    #takibiclub .c-ticket .ticket-present .ticket-present__img{
        width: 33.333%;
    }


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

        #takibiclub | Contents

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

    #takibiclub .c-contents{
        margin-bottom: 60px;
    }
    #takibiclub .c-contents .c-contents__nav{
        height: auto;
        line-height: 1.5;
        margin-bottom: 40px;
        padding:  4.8vw 8%;
    }
    #takibiclub .c-contents .c-contents__nav ul li{
        margin: 0 4px;
        display: block;
        width:  47%;
        float: left;
        text-align: left;
    }
    #takibiclub .c-contents .c-contents__nav ul li a{
        font-size: 11px;
        letter-spacing: 0;
        padding: 2.4vw 0;
        display: block;
    }


    /* MAIN CONTNTS */

    #takibiclub .c-contents .c-maincontents{
        position: relative;
        width: 100%;
        height: auto;
        margin: 40px auto;
    }
    #takibiclub .c-contents .c-maincontents .c-maincontents__inner{
        padding: 64px 7.2vw;
    }
    #takibiclub .c-contents .c-maincontents .c-maincontents__title  h3{
        font-size: 18px;
        font-family: "TrendHMSans-Five-webfont", 'Montserrat', sans-serif;;
        margin-bottom: 30px;

    }
    #takibiclub .c-contents .c-maincontents .c-maincontents__head{
        margin-bottom: 20px;
    }
    #takibiclub .c-contents .c-maincontents .c-maincontents__head h3{
        font-size: 28px;
        letter-spacing: 0.15em;
    }
    #takibiclub .c-contents .c-maincontents .c-maincontents__img{
        width: 50%;
    }
    #takibiclub .c-contents .c-maincontents .c-maincontents__img img{
        display: block;
        width: 100%;
        height: auto;
    }
    #takibiclub .c-contents .c-maincontents .c-maincontents__txt h4{
        font-size: 18px;
        margin-bottom: 20px;
    }
    #takibiclub .c-contents .c-maincontents .c-maincontents__txt p{
        font-size: 14px;
        letter-spacing: 0.1em;
        line-height: 2;
    }

    /* CONTENTS LIST */

    #takibiclub .c-contents .c-contents__list{
        display:-webkit-box;
        display:-moz-box;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-lines:multiple;
        -moz-box-lines:multiple;
        -webkit-flex-wrap:wrap;
        -moz-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        margin-bottom: 40px;
        padding: 2.4vw 4.8vw;
        position: relative;
        z-index: 100;
    }
    #takibiclub .c-contents .c-contents__list .c-contents__item{
        width:49.8%;
    }
    #takibiclub .c-contents .c-contents__list .c-contents__item .item__thumb{
        margin-bottom: 2.0vw;
        border: 6px solid #3f3d33;
    }
    #takibiclub .c-contents .c-contents__list .c-contents__item .item__title{
        font-size: 12px;
    }

    /*
        #takibiclub__popup | contents iframe
    ****************************************/

    #takibiclub__popup{
        background-color: #a29674;
        font-size: 16px;/*Base = 16px*/
    }
    #takibiclub__popup #main {
        width: 100%;
        position: relative;
        background-color: #a29674;
    }
    .popup-title{
        margin: 30px 0 20px;
    }
    .popup-title h1{
        text-align: center;
        font-size: 18px;
        letter-spacing: 0.1em;
        padding: 0 4.8vw;
        line-height: 1.35;
    }
    .popup-title p{
        position: relative;
        text-align: center;
        font-size: 12px;
        color: #cabfa1;
        padding-bottom: 5px;
        margin-bottom: 20px;
        font-family: "TrendHMSans-Five-webfont", 'Montserrat', sans-serif;
    }
    .popup-title p::after{
        content: "";
        position: absolute;
        width: 60px;
        height: 1px;
        background-color: #cabfa1;
        bottom:0;
        left: 50%;
        margin-left: -30px;
    }
    .popup-content{
        margin: 20px 0 0;
        display:-webkit-box;
        display:-moz-box;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-lines:multiple;
        -moz-box-lines:multiple;
        -webkit-flex-wrap:wrap;
        -moz-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        padding: 0;
    }
    .popup-content .popup-imgbox{
        width: 100%;
        padding: 0 30px;
        padding: 0 4.8vw;
    }
    .popup-content .popup-imgbox img{
        width: 100%;
        height: auto;
    }
    .popup-content .popup-txtbox{
        width: 100%;
        padding: 0 4.8vw;
    }
    .popup-content .popup-txtbox h2{
        font-size: 12px;
        font-family: "TrendHMSans-Five-webfont", 'Montserrat', sans-serif;
        margin-bottom: 12px;
    }
    .popup-content .popup-txtbox h3{
        font-size: 16px;
        margin-bottom: 8px;
        letter-spacing: 0.1em;
    }
    .popup-content .popup-txtbox p{
        font-size: 14px;
        line-height: 2;
        margin-bottom: 50px;
        letter-spacing: 0.1em;
    }
    .popup-content .popup-txtbox__btn{
        width: 100%;
        margin-bottom: 60px;
    }

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

        #takibiclub | SCHEDULE

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

    #takibiclub .c-comingsoon{
        max-width: 1280px;
        padding: 0 4.8vw;
        margin: 60px auto;
    }
    #takibiclub .c-comingsoon h2{
        padding: 96px 20px;
        text-align: center;
        font-size: 44px;;
    }
    #takibiclub .c-timetable{
        padding: 0 4.8vw;
        margin: 60px auto;
    }
    #takibiclub .c-timetable__inner{
        padding: 6.4vw 3.6vw;
        text-align: center;
        border: 8px solid #7c7d55;
    }
    #takibiclub .c-timetable h2{
        text-align: center;
        font-size: 24px;
        font-family: "TrendHMSans-Five-webfont", 'Montserrat', sans-serif;
        margin-bottom: 3.6vw;
    }
    #takibiclub .c-timetable table,
    #takibiclub .c-timetable table tbody,
    #takibiclub .c-timetable table tbody tr{
        width: 100%;
        display: block;
    }
    #takibiclub .c-timetable table th{
        display: block;
        width: 100%;
        margin-right: 0;
        text-align: left;
        padding: 3.6vw 2.4vw 0;
        font-size: 0.8em;
        line-height: 1.5;
        border-top: 1px solid #7c7d55;
    }
    #takibiclub .c-timetable table td{
        display: block;
        width: 100%;
        text-align: left;
        padding: 0 2.4vw 3.6vw;
        font-size: 0.9em;
        font-weight: bold;
        line-height: 1.5;
        letter-spacing: 0.1em;
        border-top: none;
    }

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

        #takibiclub | ACCESS

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

    #takibiclub .c-access {
        position: relative;
        z-index: 100;
    }
    #takibiclub .c-access .c-access__inner{
        background-color: #7c7d55;
        padding: 30px 4.8vw 20px;
    }
    #takibiclub .c-access .c-access__inner h3{
        font-size: 14px;
        letter-spacing: 0.1em;
        text-align: center;
        margin: 0 0 10px;
    }
    #takibiclub .c-access__bus{
        width: 100%;
        padding: 0 4.8vw;
        margin: 30px auto;
    }
    #takibiclub .c-access__inner:before,
    #takibiclub .c-access__inner:after{
        content: "";
        display: table;
    }
    #takibiclub .c-access__inner:after{
        clear: both;
    }
    #takibiclub .c-access table.bus-time-table {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
        margin: 10px 0;
        border: 1px solid #bebebe;
    }
    #takibiclub .c-access .c-access__way{
        width: 100%;
        float: none;
        margin: 0;
    }
    #takibiclub .c-access table.bus-time-table caption {
        margin: 15px 0 10px;
        font-size: 12px;
        line-height: 1.5;
    }
    #takibiclub .c-access table.bus-time-table caption span {
        margin: 0 2.5em;
        padding: 0 1em;
    }
    #takibiclub .c-access .c-access__caps p{
        font-size: 12px;
        line-height: 1.5;
    }
    #takibiclub .c-access__btn{
        width: 280px;
    }
    #takibiclub .c-access__btn a{
        display: block;
        width: 100%;
        height: 50px;
        line-height: 50px;
        border-radius: 50px;
        font-size: 14px;
    }

    /*
        GOOGLE MAP CUSTMOMIZE
    ******************************/

    #takibiclub .c-access .c-access__map{
        max-width: 100%;
        margin: 0 auto 60px;
        padding: 0 0;
    }
    #takibiclub .c-access #map-custmomize {
        width: 100%;
        height: 250px;
        margin: 30px 0;
    }

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

        #takibiclub | TAKIBI HOW TO

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

    #takibiclub .c-howto .howto-title{
        text-align: center;
        margin-bottom: 30px;
    }
    #takibiclub .c-howto .howto-title h1{
        font-size: 48px;
    }
    #takibiclub .c-howto .howto-title p{
        font-size: 16px;
        font-weight: bold;
        position: relative;
        letter-spacing: 0.1em;
        margin-bottom: 10px;
    }
    #takibiclub .c-howto .howto-title p::before{
        width: 2px;
        height: 24px;
        margin-top: -12px;
        margin-left: -108px;
    }
    #takibiclub .c-howto .howto-title p::after{
        width: 2px;
        height: 24px;
        background: #fff;
        margin-top: -12px;
        margin-left: 108px;
    }

    #takibiclub .c-howto .howto-lead p{
        text-align: left;
        font-size: 14px;
        line-height: 2;
        padding: 0 7.2vw;
    }
    #takibiclub .c-howto .howto-download{
        max-width: 80%;
        margin: 40px auto;
        padding: 0 4.8vw;
    }
    #takibiclub .c-howto .howto-download ul li{
        width:100%;
        margin: 0;
        float: none;
    }
    #takibiclub .c-howto .howto-download .howto-download__btn{
        display: block;
        margin: 20px 0;
    }
    #takibiclub .c-howto .howto-download ul li:last-child{
        display: none;
    }
    #takibiclub .c-howto .howto-app{
        margin: 40px auto;
        padding: 0 4.8vw;
    }
    #takibiclub .c-howto .howto-app ul li{
        width:30%;
        margin: 0 1.66666%;
    }

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

        #takibiclub | HERO Official Infomation

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

    #takibiclub .official-info{
        margin: 60px auto;
        padding: 0 4.8vw;

    }
    #takibiclub .official-info__inner{
        border-top: 1px solid #7c7d55;
        border-bottom: 1px solid #7c7d55;
        padding: 7.2vw 0;
    }
    #takibiclub .official-info h2{
        margin-bottom: 3.6vw;
        font-size:  18px;
        line-height: 1.35;
    }
    #takibiclub .official-info a.hero{
        display: inline-block;
        width:60px;
        font-size: 32px;
    }
    #takibiclub .official-info i.fa{
        font-size: 32px;
    }


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

        #takibiclub | Footer

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

    #takibiclub .c-footer{
        min-height: 800px;
        background-image: url(../images/c-footer_bg_sp.jpg);
        margin-top: -300px;
    }

    /*
        #takibiclub | Footer Nav
    ****************************************/
    #takibiclub .f-nav{
        padding-top: 340px;
    }
    #takibiclub .f-nav .f-logo a{
        width: 73px;
        height: 104px;
        margin:0 auto 30px;
    }
    #takibiclub .f-nav__list{
        width: 100%;
        margin: 0;
        padding: 0 4.8vw;
        text-align: center;
    }
    #takibiclub .f-nav__item{
        display: block;
        margin-right: 0;
        margin-bottom: 20px;
    }
    #takibiclub .f-nav__item a,
    #takibiclub .f-nav__item span{
        font-size: 16px;
        line-height: 1;
    }

    /*
        #takibiclub | Credit
    ****************************************/

    #takibiclub .f-credit{
        width: 280px;
        margin: 40px auto 0;
    }
    #takibiclub .f-credit .f-credit__list .f-credit__item{
        float: left;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 100%;
        text-indent: -9999px;
        height: 40px;
        margin: 0 10px;
    }
    #takibiclub .f-credit .f-credit__list .f-credit__item.item__takibiclub{
        width:120px;
    }
    #takibiclub .f-credit .f-credit__list .f-credit__item.item__columbia{
        width:120px;
    }

}/* max-width: 768px */

/* ---------------------------------------
	max-width: 640px
--------------------------------------- */

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

/* ---------------------------------------
	max-width: 480px
--------------------------------------- */

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

    /*
        #takibiclub | Hero
    ****************************************/
    #takibiclub .c-header .c-hero{
        margin-top: -30px;
    }
    #takibiclub .c-header .c-hero__logo{
        position: absolute;
        display: block;
        width: 320px;
        height: 94px;
        margin-top: -47px;
        margin-left: -160px;
    }


}/* max-width: 480px */

/* ---------------------------------------
	max-width: 320px
--------------------------------------- */

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

    /*
        #takibiclub | Hero
    ****************************************/

    #takibiclub .c-header .c-hero__logo{
        position: absolute;
        display: block;
        width: 280px;
        height: 83px;
        margin-top: -35px;
        margin-left: -140px;
    }


}/* max-width: 320px */